@layer organisms {
  body:has(.cases-sheet[open]) {
    overflow: hidden;
  }

  .cases-page {
    --cases-accent-ink: #1d6f6f;
    --cases-accent-border: color-mix(in srgb, var(--cases-accent-ink) 24%, white);
    --cases-accent-surface: color-mix(in srgb, var(--color-brand-primary) 12%, white);
    --cases-accent-surface-strong: color-mix(in srgb, var(--color-brand-primary) 18%, white);
    --cases-focus-color: #8a3b00;
    --upload-dialog-focus-color: var(--cases-focus-color);
    background:
      radial-gradient(circle at top left, rgb(255 255 255 / 0.28), transparent 18rem),
      radial-gradient(circle at bottom right, rgb(255 255 255 / 0.18), transparent 24rem),
      var(--color-brand-gradient-soft),
      var(--color-surface-muted);
  }

  .cases-shell {
    min-height: calc(100dvh - 4.5rem);
  }

  .cases-header-actions {
    justify-content: flex-end;
  }

  .cases-app {
    width: min(100% - 2rem, 95rem);
    margin: 0 auto;
    padding: clamp(var(--space-4), 2vw, var(--space-7));
  }

  .cases-workspace {
    display: grid;
    gap: clamp(var(--space-4), 2vw, var(--space-6));
    min-height: calc(100dvh - 6.5rem);
    background:
      radial-gradient(circle at top right, rgb(255 255 255 / 0.38), transparent 24rem),
      linear-gradient(180deg, rgb(255 255 255 / 0.92), rgb(255 255 255 / 0.84));
  }

  .cases-workspace__header {
    position: sticky;
    top: calc(4rem + var(--space-3));
    z-index: 2;
    display: grid;
    gap: var(--space-4);
    padding-bottom: var(--space-2);
    background:
      linear-gradient(180deg, rgb(255 255 255 / 0.98), rgb(255 255 255 / 0.92)),
      var(--color-surface);
  }

  .cases-workspace__intro {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 1.2fr) minmax(18rem, 0.8fr);
    align-items: start;
  }

  .cases-workspace__eyebrow,
  .cases-pane__eyebrow {
    margin: 0;
    color: var(--cases-accent-ink);
    font-size: var(--font-size-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .cases-workspace__intro h1 {
    margin: var(--space-2) 0 var(--space-3);
    font-size: clamp(2rem, 3vw, 3rem);
    line-height: 1.02;

    code {
      color: var(--cases-accent-ink);
      font-family: var(--font-mono);
      font-size: 0.8em;
    }
  }

  .cases-workspace__copy {
    max-width: 48rem;
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--font-size-lg);
  }

  .cases-workspace__summary {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cases-stat {
    display: grid;
    gap: var(--space-1);
    border: var(--border-width) solid rgb(51 204 204 / 0.18);
    border-radius: 1rem;
    background: rgb(255 255 255 / 0.88);
    box-shadow: var(--shadow-sm);
    padding: var(--space-4);

    span {
      color: var(--color-text-muted);
      font-size: var(--font-size-xs);
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }

    strong {
      font-size: clamp(1.5rem, 2vw, 2rem);
      line-height: 1;
    }
  }

  .cases-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
  }

  .cases-search {
    width: min(100%, 32rem);
  }

  .cases-search__field {
    display: grid;
    min-height: 3rem;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--space-3);
    border: var(--border-width) solid var(--color-border);
    border-radius: var(--radius-pill);
    background: rgb(255 255 255 / 0.92);
    box-shadow: 0 10px 24px rgb(15 23 42 / 0.08);
    color: var(--color-text);
    padding-inline: var(--space-4);

    &:focus-within {
      border-color: var(--cases-focus-color);
      box-shadow:
        0 0 0 3px rgb(255 255 255 / 0.92),
        0 0 0 6px rgb(138 59 0 / 0.2);
    }

    svg {
      width: 1.15rem;
      height: 1.15rem;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    input {
      min-height: auto;
      border: 0;
      background: transparent;
      box-shadow: none;
      color: var(--color-text);
      padding: 0;

      &::placeholder {
        color: var(--color-text-muted);
        opacity: 1;
      }

      &:focus {
        box-shadow: none;
      }
    }
  }

  .cases-toolbar__actions {
    justify-content: flex-end;
  }

  .cases-filters {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  .cases-toolbar__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
  }

  .cases-toolbar__meta,
  .cases-toolbar__legacy {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
  }

  .cases-toolbar__legacy {
    color: var(--color-warning);
    font-weight: 600;
  }

  .cases-workspace__body {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(18rem, 24rem) minmax(0, 1fr);
    min-height: 0;
    align-items: stretch;
  }

  :is(.cases-browser, .cases-detail) {
    display: grid;
    gap: var(--space-4);
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    padding: var(--space-5);
  }

  .cases-pane__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);

    h2 {
      margin: var(--space-1) 0 0;
      font-size: clamp(1.25rem, 1.8vw, 1.7rem);
    }
  }

  .cases-pane__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    min-height: 2rem;
    border-radius: var(--radius-pill);
    background: var(--cases-accent-surface-strong);
    color: var(--cases-accent-ink);
    font-size: var(--font-size-sm);
    font-weight: 700;
    padding-inline: var(--space-3);
  }

  .cases-pane__scroll {
    min-height: 0;
    overflow: auto;
    padding-right: var(--space-2);
  }

  .cases-loading,
  .cases-empty {
    display: grid;
    gap: var(--space-3);
    align-content: start;
    border: var(--border-width) dashed var(--color-border-strong);
    border-radius: 1rem;
    background: rgb(255 255 255 / 0.72);
    color: var(--color-text-muted);
    padding: var(--space-5);

    h3,
    p {
      margin: 0;
    }

    code {
      color: var(--cases-accent-ink);
      font-family: var(--font-mono);
    }
  }

  .cases-accordion {
    display: grid;
    gap: var(--space-3);
  }

  .cases-accordion__item {
    overflow: hidden;
    border: var(--border-width) solid rgb(51 204 204 / 0.16);
    border-radius: 1rem;
    background: var(--color-surface-muted);
    transition:
      border-color var(--transition-fast),
      box-shadow var(--transition-fast),
      transform var(--transition-fast);

    &.is-selected {
      border-color: var(--cases-accent-ink);
      box-shadow: var(--shadow-md);
    }
  }

  .cases-accordion__heading {
    margin: 0;
  }

  .cases-accordion__trigger {
    display: grid;
    width: 100%;
    gap: var(--space-3);
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    border: 0;
    border-radius: 1rem;
    background: transparent;
    color: var(--color-text);
    text-align: left;
    padding: var(--space-4);

    &:focus-visible {
      outline: 2px solid var(--cases-focus-color);
      outline-offset: 3px;
      box-shadow:
        0 0 0 3px rgb(255 255 255 / 0.92),
        0 0 0 6px rgb(138 59 0 / 0.2);
    }
  }

  .cases-accordion__identity,
  .cases-accordion__meta {
    display: grid;
    gap: 0.2rem;
  }

  .cases-accordion__identity {
    strong {
      font-size: var(--font-size-lg);
    }

    span {
      color: var(--color-text-muted);
      font-size: var(--font-size-sm);
    }
  }

  .cases-accordion__meta {
    justify-items: end;
    color: var(--color-text-muted);
    font-size: var(--font-size-xs);
    font-weight: 600;
  }

  .cases-accordion__panel {
    display: grid;
    gap: var(--space-3);
    padding: 0 var(--space-4) var(--space-4);
  }

  .cases-accordion__pills,
  .cases-accordion__tags,
  .cases-detail__hero-pills,
  .cases-detail__action-list,
  .cases-document-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
  }

  .cases-accordion__timestamp,
  .cases-document-card__date {
    color: var(--color-text-muted);
    font-size: var(--font-size-sm);
  }

  .cases-pill,
  .cases-tag {
    display: inline-flex;
    align-items: center;
    min-height: 1.8rem;
    border-radius: var(--radius-pill);
    font-size: var(--font-size-xs);
    font-weight: 700;
    padding-inline: var(--space-3);
  }

  .cases-pill--success {
    border: var(--border-width) solid #9ed4af;
    background: #eaf7ef;
    color: #166534;
  }

  .cases-pill--warning {
    border: var(--border-width) solid #e6be63;
    background: #fff5de;
    color: #92400e;
  }

  .cases-pill--error {
    border: var(--border-width) solid #e3a3a3;
    background: #fdf0f0;
    color: #991b1b;
  }

  .cases-pill--info {
    border: var(--border-width) solid var(--cases-accent-border);
    background: var(--cases-accent-surface);
    color: var(--cases-accent-ink);
  }

  .cases-pill--neutral,
  .cases-tag {
    border: var(--border-width) solid var(--color-border);
    background: rgb(255 255 255 / 0.86);
    color: var(--color-text-muted);
  }

  .cases-detail__content {
    display: grid;
    gap: var(--space-5);
  }

  .cases-detail__hero {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    border: var(--border-width) solid rgb(51 204 204 / 0.18);
    border-radius: 1.25rem;
    background:
      radial-gradient(circle at top right, rgb(255 255 255 / 0.34), transparent 16rem),
      var(--cases-accent-surface);
    padding: var(--space-5);
  }

  .cases-detail__hero-copy {
    h3 {
      margin: var(--space-2) 0 var(--space-2);
      font-size: clamp(1.5rem, 2vw, 2.2rem);
    }

    p {
      margin: 0;
      color: var(--color-text-muted);
    }
  }

  .cases-detail__hero-actions {
    display: grid;
    justify-items: end;
    gap: var(--space-3);
  }

  .cases-detail__sections,
  .cases-document-grid {
    display: grid;
    gap: var(--space-4);
  }

  .cases-detail__sections {
    align-content: start;
  }

  .cases-rda {
    display: grid;
    gap: var(--space-4);
    border: var(--border-width) solid rgb(29 111 111 / 0.14);
    border-radius: 1.25rem;
    background:
      linear-gradient(180deg, rgb(255 255 255 / 0.94), rgb(246 252 252 / 0.96));
    padding: var(--space-5);
  }

  .cases-rda__grid {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cases-rda-card {
    display: grid;
    gap: var(--space-4);
    border: var(--border-width) solid rgb(29 111 111 / 0.14);
    border-radius: 1rem;
    background: color-mix(in srgb, white 90%, var(--color-brand-primary) 10%);
    box-shadow: var(--shadow-sm);
    padding: var(--space-4);

    &.is-active {
      border-color: var(--cases-accent-ink);
      box-shadow:
        0 1rem 2.5rem rgb(15 23 42 / 0.12),
        0 0 0 1px rgb(29 111 111 / 0.14);
    }
  }

  .cases-rda-card__header,
  .cases-rda-card__pills,
  .cases-rda-card__actions,
  .cases-rda-tags,
  .cases-rda-finding__header {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
  }

  .cases-rda-card__header {
    align-items: flex-start;
    justify-content: space-between;

    h3 {
      margin: var(--space-1) 0 0;
      font-size: clamp(1.1rem, 1.6vw, 1.35rem);
    }
  }

  .cases-rda-card__meta,
  .cases-rda-finding__meta {
    display: grid;
    gap: var(--space-2);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;

    div {
      display: grid;
      gap: 0.15rem;
      border: var(--border-width) solid rgb(29 111 111 / 0.1);
      border-radius: 0.85rem;
      background: rgb(255 255 255 / 0.72);
      padding: var(--space-3);
    }

    dt {
      color: var(--color-text-muted);
      font-size: var(--font-size-xs);
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }

    dd {
      margin: 0;
      font-size: var(--font-size-sm);
      overflow-wrap: anywhere;
    }
  }

  .cases-rda-card__summary,
  .cases-rda-summary,
  .cases-rda-findings {
    display: grid;
    gap: var(--space-3);
  }

  .cases-rda-summary {
    p {
      margin: 0;
    }
  }

  .cases-rda-finding,
  .cases-rda-findings__empty {
    display: grid;
    gap: var(--space-3);
    border-radius: 1rem;
    background: rgb(255 255 255 / 0.82);
    padding: var(--space-4);
  }

  .cases-rda-finding {
    border: var(--border-width) solid rgb(29 111 111 / 0.14);

    &--error {
      border-color: rgb(153 27 27 / 0.24);
      background: rgb(253 240 240 / 0.95);
    }

    &--warning {
      border-color: rgb(146 64 14 / 0.18);
      background: rgb(255 245 222 / 0.82);
    }

    p {
      margin: 0;
    }
  }

  .cases-rda-code {
    display: inline-flex;
    align-items: center;
    min-height: 1.8rem;
    border-radius: var(--radius-pill);
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    font-weight: 700;
    padding-inline: var(--space-3);
  }

  .cases-rda-code--error {
    background: #7f1d1d;
    color: #fff7f7;
  }

  .cases-rda-code--warning {
    background: #92400e;
    color: #fff9ef;
  }

  .cases-rda-card__json {
    border: var(--border-width) solid rgb(29 111 111 / 0.12);
    border-radius: 0.95rem;
    background: rgb(10 18 22 / 0.96);
    color: #d6eef0;
    padding: var(--space-3) var(--space-4);

    summary {
      cursor: pointer;
      font-weight: 700;
    }

    pre {
      margin: var(--space-3) 0 0;
      overflow: auto;
      white-space: pre-wrap;
      word-break: break-word;
    }
  }

  .cases-document-viewer__analysis {
    display: grid;
    gap: var(--space-4);
    line-height: 1.65;

    :is(h2, h3, h4) {
      margin: 0;
      color: var(--cases-accent-ink);
    }

    :is(p, ul, ol) {
      margin: 0;
    }
  }

  .cases-document-group {
    display: grid;
    gap: var(--space-3);
  }

  .cases-document-group__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);

    h4 {
      margin: var(--space-1) 0 0;
      font-size: var(--font-size-xl);
    }
  }

  .cases-document-card {
    display: grid;
    gap: var(--space-3);
    border: var(--border-width) solid rgb(51 204 204 / 0.12);
    border-radius: 1rem;
    background: var(--color-surface-muted);
    color: var(--color-text);
    padding: var(--space-4);
    transition:
      border-color var(--transition-fast),
      box-shadow var(--transition-fast);

    &.is-selected {
      border-color: var(--cases-accent-ink);
      background: color-mix(in srgb, white 72%, var(--color-brand-primary) 28%);
      box-shadow: var(--shadow-md);
    }
  }

  .cases-document-card__select {
    display: grid;
    gap: var(--space-3);
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
    text-align: left;
    transition: transform var(--transition-fast);

    &:is(:hover, :focus-visible) {
      transform: translateY(-1px);
    }

    &:focus-visible {
      outline: 2px solid var(--cases-focus-color);
      outline-offset: 3px;
      box-shadow:
        0 0 0 3px rgb(255 255 255 / 0.92),
        0 0 0 6px rgb(138 59 0 / 0.2);
    }
  }

  .cases-document-card:has(.cases-document-card__select:is(:hover, :focus-visible)) {
    border-color: var(--cases-accent-ink);
    box-shadow: var(--shadow-md);
  }

  .cases-document-card__footer {
    display: flex;
    justify-content: flex-end;
  }

  .cases-sheet {
    width: min(84vw, 104rem);
    max-width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0 0 0 auto;
    border: 0;
    background: transparent;
    box-shadow: none;
    color: var(--color-text);
    padding: 0;

    &::backdrop {
      background:
        linear-gradient(180deg, rgb(11 18 24 / 0.16), rgb(11 18 24 / 0.34)),
        radial-gradient(circle at right, rgb(255 255 255 / 0.14), transparent 26rem),
        var(--color-overlay);
      backdrop-filter: blur(8px);
    }
  }

  .cases-sheet__surface {
    display: grid;
    gap: 0;
    height: 100%;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / 0.38);
    border-radius: 1.6rem 0 0 1.6rem;
    background:
      linear-gradient(180deg, rgb(255 255 255 / 0.98), rgb(246 251 252 / 0.97)),
      radial-gradient(circle at top right, rgb(255 255 255 / 0.26), transparent 18rem),
      var(--color-surface);
    box-shadow:
      -2rem 0 4rem rgb(15 23 42 / 0.12),
      -0.6rem 0 2rem rgb(15 23 42 / 0.1),
      0 0 0 1px rgb(29 111 111 / 0.08);
  }

  .cases-sheet__header {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    border-bottom: 1px solid rgb(29 111 111 / 0.12);
    background:
      linear-gradient(180deg, rgb(255 255 255 / 0.98), rgb(250 252 253 / 0.95)),
      var(--color-surface);
    padding: clamp(var(--space-4), 2vw, var(--space-6));
  }

  .cases-sheet__headline {
    display: grid;
    gap: var(--space-2);

    h2,
    p {
      margin: 0;
    }

    h2 {
      font-size: clamp(1.5rem, 2vw, 2rem);
      line-height: 1.05;
    }

    p:last-child {
      color: var(--color-text-muted);
      font-size: var(--font-size-sm);
    }
  }

  .cases-sheet__close {
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 2.85rem;
    min-height: 2.85rem;
    border: 1px solid rgb(29 111 111 / 0.12);
    border-radius: 999px;
    background: rgb(255 255 255 / 0.94);
    color: var(--color-text);
    transition:
      transform var(--transition-fast),
      border-color var(--transition-fast),
      box-shadow var(--transition-fast);

    &:is(:hover, :focus-visible) {
      border-color: var(--cases-accent-ink);
      box-shadow: var(--shadow-sm);
      transform: translateY(-1px);
    }

    svg {
      width: 1rem;
      height: 1rem;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
  }

  .cases-sheet__layout {
    display: grid;
    min-height: 0;
    grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr);
  }

  .cases-sheet__rail,
  .cases-sheet__content {
    min-height: 0;
    overflow: auto;
  }

  .cases-sheet__rail {
    display: grid;
    align-content: start;
    gap: var(--space-4);
    border-right: 1px solid rgb(29 111 111 / 0.1);
    background:
      linear-gradient(180deg, rgb(248 252 252 / 0.98), rgb(242 248 249 / 0.96)),
      var(--color-surface-muted);
    padding: clamp(var(--space-4), 2vw, var(--space-5));
  }

  .cases-sheet__rail-section,
  .cases-sheet__rail-list {
    display: grid;
    gap: var(--space-2);
  }

  .cases-sheet__rail-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
  }

  .cases-sheet__rail-eyebrow {
    margin: 0;
    color: var(--cases-accent-ink);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .cases-sheet__nav-item {
    display: grid;
    gap: var(--space-3);
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
    border: 1px solid transparent;
    border-radius: 1rem;
    background: rgb(255 255 255 / 0.66);
    color: var(--color-text);
    text-align: left;
    padding: var(--space-3);
    transition:
      transform var(--transition-fast),
      border-color var(--transition-fast),
      background var(--transition-fast),
      box-shadow var(--transition-fast);

    &:is(:hover, :focus-visible) {
      border-color: rgb(29 111 111 / 0.18);
      background: rgb(255 255 255 / 0.92);
      box-shadow: var(--shadow-sm);
      transform: translateY(-1px);
    }

    &:focus-visible {
      outline: 2px solid var(--cases-focus-color);
      outline-offset: 3px;
      box-shadow:
        0 0 0 3px rgb(255 255 255 / 0.92),
        0 0 0 6px rgb(138 59 0 / 0.2);
    }

    &.is-active {
      border-color: var(--cases-accent-ink);
      background: color-mix(in srgb, white 74%, var(--color-brand-primary) 26%);
      box-shadow:
        inset 0 0 0 1px rgb(29 111 111 / 0.08),
        0 1rem 2rem rgb(15 23 42 / 0.08);
    }
  }

  .cases-sheet__nav-copy {
    display: grid;
    gap: 0.2rem;

    strong {
      font-size: var(--font-size-sm);
    }

    span {
      color: var(--color-text-muted);
      font-size: var(--font-size-xs);
    }
  }

  .cases-sheet__nav-tag {
    color: var(--color-text-muted);
    font-size: var(--font-size-xs);
    font-weight: 700;
    text-transform: uppercase;
  }

  .cases-sheet__content {
    display: grid;
    align-content: start;
    gap: var(--space-4);
    min-width: 0;
    background:
      linear-gradient(180deg, rgb(255 255 255 / 0.98), rgb(248 251 252 / 0.96)),
      var(--color-surface);
    padding: clamp(var(--space-4), 2vw, var(--space-6));
  }

  .cases-sheet__card,
  .cases-sheet__empty {
    display: grid;
    gap: var(--space-4);
    min-width: 0;
    border: 1px solid rgb(29 111 111 / 0.12);
    border-radius: 1.15rem;
    background: rgb(255 255 255 / 0.92);
    box-shadow: 0 1rem 2.4rem rgb(15 23 42 / 0.06);
    padding: clamp(var(--space-4), 2vw, var(--space-5));
  }

  .cases-sheet__card--hero {
    background:
      radial-gradient(circle at top right, rgb(255 255 255 / 0.36), transparent 14rem),
      color-mix(in srgb, white 84%, var(--color-brand-primary) 16%);
  }

  .cases-sheet__card-head,
  .cases-sheet__pill-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);
  }

  .cases-sheet__card-head h3,
  .cases-sheet__section-head h3,
  .cases-sheet__empty h3 {
    margin: var(--space-1) 0 0;
    font-size: clamp(1.2rem, 1.6vw, 1.55rem);
  }

  .cases-sheet__section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);
  }

  .cases-sheet__toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    align-items: center;
  }

  .cases-sheet__lead,
  .cases-sheet__empty p {
    margin: 0;
    color: var(--color-text-muted);
  }

  .cases-sheet__meta-grid {
    display: grid;
    gap: var(--space-3);
    grid-template-columns: repeat(2, minmax(0, 1fr));

    div {
      display: grid;
      gap: 0.18rem;
      border: 1px solid rgb(29 111 111 / 0.1);
      border-radius: 0.95rem;
      background: rgb(255 255 255 / 0.72);
      padding: var(--space-3);
    }

    span {
      color: var(--color-text-muted);
      font-size: var(--font-size-xs);
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }

    strong {
      font-size: var(--font-size-sm);
      overflow-wrap: anywhere;
    }
  }

  .cases-sheet .ui-table-wrap,
  .cases-sheet .cases-rda-card__json,
  .cases-sheet .cases-document-viewer__analysis,
  .cases-sheet pre {
    min-width: 0;
    max-width: 100%;
  }

  .cases-sheet .ui-table-wrap,
  .cases-sheet .cases-document-viewer__analysis {
    overflow: auto;
  }

  .cases-sheet .ui-table-wrap table {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
  }

  .cases-sheet .ui-table-wrap :is(th, td),
  .cases-sheet .cases-document-viewer__analysis :is(th, td) {
    overflow-wrap: anywhere;
    word-break: normal;
    white-space: normal;
    vertical-align: top;
  }

  .cases-sheet .cases-document-viewer__analysis table {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
  }

  .cases-sheet .cases-rda-card__json pre {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .cases-document-card__meta {
    display: grid;
    gap: 0.2rem;

    strong {
      font-size: var(--font-size-md);
    }

    span {
      color: var(--color-text-muted);
      font-size: var(--font-size-sm);
    }
  }

  .cases-action-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.3rem;
    border: var(--border-width) solid transparent;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 700;
    text-decoration: none;
    padding-inline: var(--space-3);
    transition:
      background var(--transition-fast),
      border-color var(--transition-fast),
      color var(--transition-fast),
      transform var(--transition-fast);

    &:is(:hover, :focus-visible) {
      transform: translateY(-1px);
    }

    &:focus-visible {
      outline: 2px solid var(--cases-focus-color);
      outline-offset: 3px;
      box-shadow:
        0 0 0 3px rgb(255 255 255 / 0.92),
        0 0 0 6px rgb(138 59 0 / 0.2);
    }
  }

  .cases-action-link--primary {
    background: var(--color-brand-primary);
    color: #1f2933;

    &:is(:hover, :focus-visible) {
      background: color-mix(in srgb, var(--color-brand-primary) 88%, white);
      border-color: var(--cases-accent-ink);
      color: #1f2933;
    }
  }

  .cases-action-link--secondary {
    border-color: var(--color-border);
    background: var(--color-surface);
    color: var(--color-text);

    &:is(:hover, :focus-visible) {
      border-color: var(--cases-accent-ink);
      background: var(--cases-accent-surface);
      color: var(--color-text);
    }
  }

  .cases-action-link--ghost {
    color: var(--color-text-muted);

    &:is(:hover, :focus-visible) {
      background: rgb(255 255 255 / 0.92);
      color: var(--color-text);
    }
  }

  .cases-action-link--danger {
    color: #912018;

    &:is(:hover, :focus-visible) {
      background: rgb(180 35 24 / 0.08);
      color: #7a1a14;
    }
  }

  .cases-page .ui-button {
    &:focus-visible {
      outline: 2px solid var(--cases-focus-color);
      outline-offset: 3px;
      box-shadow:
        0 0 0 3px rgb(255 255 255 / 0.92),
        0 0 0 6px rgb(138 59 0 / 0.2);
    }

    &.ui-button--accent {
      background: #c94808;
      border-color: #c94808;
      color: var(--cidti-white);

      &:hover {
        background: #8a3b00;
        border-color: #8a3b00;
        color: var(--cidti-white);
      }
    }

    &.ui-button--ghost.is-active {
      border-color: var(--cases-accent-ink);
      background: var(--cases-accent-surface);
      color: var(--cases-accent-ink);
    }

    &.ui-button--danger {
      border-color: #b42318;
      background: #b42318;
      color: var(--cidti-white);

      &:hover {
        border-color: #912018;
        background: #912018;
        color: var(--cidti-white);
      }
    }
  }

  .cases-confirm-dialog {
    width: min(100% - 2rem, 34rem);
    border: 0;
    border-radius: 1.25rem;
    padding: 0;
    box-shadow: 0 28px 80px rgb(15 23 42 / 0.28);

    &::backdrop {
      background: rgb(15 23 42 / 0.42);
      backdrop-filter: blur(0.25rem);
    }
  }

  .cases-confirm-dialog__surface {
    display: grid;
    gap: var(--space-4);
    padding: clamp(var(--space-4), 2vw, var(--space-5));
    background: linear-gradient(180deg, rgb(255 255 255 / 0.98), rgb(255 255 255 / 0.94));
  }

  .cases-confirm-dialog__header h2,
  .cases-confirm-dialog__body p {
    margin: 0;
  }

  .cases-confirm-dialog__body {
    display: grid;
    gap: var(--space-3);
    color: var(--color-text-muted);
  }

  .cases-confirm-dialog__warning {
    border: var(--border-width) solid color-mix(in srgb, var(--color-warning) 28%, white);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--color-warning) 10%, white);
    color: var(--color-text);
    font-size: var(--font-size-sm);
    padding: var(--space-3);
  }

  .cases-confirm-dialog__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--space-2);
  }

  @media (max-width: 80rem) {
    .cases-filters {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .cases-workspace__body {
      grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr);
    }
  }

  @media (max-width: 64rem) {
    .cases-workspace__header {
      position: static;
    }

    .cases-workspace__intro,
    .cases-workspace__body {
      grid-template-columns: 1fr;
    }

    .cases-workspace,
    :is(.cases-browser, .cases-detail) {
      min-height: auto;
    }

    .cases-pane__scroll {
      max-height: none;
      overflow: visible;
      padding-right: 0;
    }

    .cases-detail__hero {
      grid-template-columns: 1fr;
    }

    .cases-detail__hero-actions {
      justify-items: start;
    }

    .cases-rda__grid {
      grid-template-columns: 1fr;
    }

    .cases-sheet {
      width: min(92vw, 78rem);
    }

    .cases-sheet__layout {
      grid-template-columns: 1fr;
    }

    .cases-sheet__rail {
      border-right: 0;
      border-bottom: 1px solid rgb(29 111 111 / 0.1);
    }
  }

  @media (max-width: 48rem) {
    .cases-app {
      width: min(100% - 1rem, 95rem);
      padding-inline: var(--space-3);
    }

    .cases-toolbar {
      align-items: stretch;
    }

    .cases-search {
      width: 100%;
    }

    .cases-toolbar__actions {
      width: 100%;
      justify-content: stretch;
    }

    .cases-filters,
    .cases-workspace__summary {
      grid-template-columns: 1fr;
    }

    .cases-accordion__trigger {
      grid-template-columns: 1fr;
    }

    .cases-accordion__meta {
      justify-items: start;
    }

    .cases-rda-card__meta,
    .cases-rda-finding__meta,
    .cases-sheet__meta-grid {
      grid-template-columns: 1fr;
    }

    .cases-sheet {
      width: 100%;
      max-width: 100%;
      height: 100dvh;
      max-height: 100dvh;
    }

    .cases-sheet__surface {
      border-radius: 0;
      box-shadow:
        0 1.4rem 3rem rgb(15 23 42 / 0.16),
        0 0 0 1px rgb(29 111 111 / 0.08);
    }

    .cases-sheet__header {
      padding: var(--space-4);
    }

    .cases-sheet__rail,
    .cases-sheet__content {
      padding: var(--space-4);
    }
  }
}
