:root {
  --navy: #15324a;
  --ink: #2e465a;
  --muted: #607386;
  --line: #dce5ec;
  --surface: #ffffff;
  --canvas: #f6f9fb;
  --key: #087f7a;
  --soft: #e4f5f2;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { min-width: 320px; margin: 0; color: var(--ink); background: var(--canvas); }
button { font: inherit; }
button:focus-visible, a:focus-visible { outline: 3px solid color-mix(in srgb, var(--key) 28%, transparent); outline-offset: 3px; }
[hidden] { display: none !important; }

body[data-workspace="overview"] { --key: #087f7a; --soft: #e4f5f2; }
body[data-workspace="case"] { --key: #2878e8; --soft: #e9f1ff; }
body[data-workspace="decision"] { --key: #6257e8; --soft: #efedff; }
body[data-workspace="evidence"] { --key: #008fa5; --soft: #e5f7fa; }
body[data-workspace="review"] { --key: #8a58d8; --soft: #f2ebfc; }
body[data-workspace="operations"] { --key: #53657a; --soft: #edf1f5; }

.review-header {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
  min-height: 68px;
  padding: 11px clamp(16px, 3vw, 44px);
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}
.review-brand { display: flex; align-items: center; gap: 11px; color: inherit; text-decoration: none; }
.review-brand > span:last-child { display: grid; gap: 1px; }
.review-brand strong { color: var(--navy); font-size: .92rem; }
.review-brand small { color: var(--muted); font-size: .68rem; }
.brand-mark { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: #087f7a; font-size: .72rem; font-weight: 800; }
.review-label { margin: 0; color: #52677a; font-size: .7rem; font-weight: 760; letter-spacing: .035em; text-align: center; }
.review-actions { display: flex; gap: 8px; }

.button { min-height: 38px; padding: 8px 13px; border: 1px solid transparent; border-radius: 9px; font-size: .77rem; font-weight: 750; cursor: pointer; transition: transform 140ms ease, background 160ms ease; }
.button.primary { color: #fff; background: var(--key); }
.button.secondary { color: var(--navy); border-color: #cbd8e2; background: var(--surface); }
.button:active:not(:disabled) { transform: translateY(1px); }
.button:disabled { color: #758493; border-color: #d9e1e7; background: #eef2f5; cursor: not-allowed; }

.workspace-nav {
  position: sticky;
  z-index: 3;
  top: 0;
  display: flex;
  gap: 6px;
  padding: 8px clamp(12px, 3vw, 44px);
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, .98);
}
.nav-item { min-width: max-content; display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border: 0; border-radius: 9px; color: #53677a; background: transparent; font-size: .78rem; font-weight: 740; cursor: pointer; }
.nav-item span { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 7px; background: #eef2f5; font-size: .62rem; }
.nav-item:hover { color: var(--navy); background: #f1f5f7; }
.nav-item.active { color: var(--key); background: var(--soft); }
.nav-item.active span { color: #fff; background: var(--key); }

main { width: min(1280px, 100%); margin: 0 auto; padding: clamp(18px, 3vw, 38px); }
.review-boundary { display: flex; align-items: baseline; gap: 12px; margin-bottom: 22px; padding: 11px 14px; border-radius: 10px; color: #315f5c; background: #e8f5f3; font-size: .76rem; }
.review-boundary strong { min-width: max-content; }

.workspace { min-width: 0; animation: workspace-enter 200ms var(--ease-out); }
.workspace-heading { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr); gap: 28px; align-items: end; margin-bottom: 26px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.workspace-heading h1 { margin: 5px 0 3px; color: var(--navy); font-size: 2rem; letter-spacing: -.035em; text-wrap: balance; }
.workspace-heading p { max-width: 68ch; margin: 0; line-height: 1.55; }
.workspace-heading > p { color: var(--muted); font-size: .82rem; }
.case-class { display: inline-flex; padding: 5px 8px; border-radius: 999px; color: #584071; background: #f0eafb; font-size: .67rem; font-weight: 750; }

.decision-strip { display: grid; grid-template-columns: repeat(4, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.decision-strip > div { min-width: 0; padding: 17px 18px; }
.decision-strip > div + div { border-left: 1px solid var(--line); }
.decision-strip small, .decision-strip strong, .decision-strip span { display: block; }
.decision-strip small { color: var(--muted); font-size: .68rem; }
.decision-strip strong { margin: 6px 0; color: var(--navy); font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.decision-strip span { color: var(--muted); font-size: .7rem; line-height: 1.45; }
.decision-strip.is-fresh { box-shadow: 0 0 0 3px color-mix(in srgb, var(--key) 18%, transparent); }

.overview-grid, .fact-layout, .decision-columns { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(260px, .7fr); gap: 28px; margin-top: 28px; }
article { min-width: 0; }
article h2 { margin: 0 0 15px; color: var(--navy); font-size: 1.08rem; }
.attention-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.attention-list li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 2px; border-bottom: 1px solid var(--line); }
.attention-list strong { color: #6b7785; font-size: .74rem; }
.next-action, .boundary-panel { padding: 22px; border-radius: 12px; background: var(--soft); }
.next-action > span { color: var(--key); font-size: .72rem; font-weight: 750; }
.next-action h2 { margin-top: 11px; }
.next-action p { margin-bottom: 0; font-size: .8rem; line-height: 1.5; }

.fact-list, .operations-list { margin: 0; }
.fact-list > div, .operations-list > div { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(0, 1fr); gap: 18px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.fact-list dt, .operations-list dt { color: var(--muted); font-size: .74rem; }
.fact-list dd, .operations-list dd { margin: 0; color: var(--navy); font-size: .82rem; font-weight: 700; overflow-wrap: anywhere; }
.boundary-panel .fact-list > div { border-color: color-mix(in srgb, var(--key) 16%, transparent); }

.classification { padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.classification ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin: 0 0 18px; padding: 0; list-style: none; }
.classification li { position: relative; padding: 14px 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.classification li:not(:last-child)::after { content: "→"; position: absolute; top: 50%; left: calc(100% + 9px); color: var(--key); transform: translateY(-50%); }
.classification small, .classification strong { display: block; }
.classification small { color: var(--muted); }
.classification strong { margin-top: 4px; color: var(--navy); font-size: 1.15rem; }
.classification p { margin: 0; color: #52667a; }
.decision-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
table { width: 100%; min-width: 720px; border-collapse: collapse; }
th, td { padding: 13px 15px; border-bottom: 1px solid var(--line); text-align: left; font-size: .78rem; }
th { color: #52667a; background: #f2f6f8; font-size: .7rem; }
tbody tr:last-child td { border-bottom: 0; }
tbody td > strong, tbody td > small { display: block; }
tbody td > small { margin-top: 4px; color: var(--muted); font-size: .67rem; }
.status { display: inline-flex; padding: 5px 7px; border-radius: 7px; color: #73551a; background: #fff4d7; font-size: .68rem; font-weight: 750; }
.unavailable { margin: 13px 0 0; color: var(--muted); font-size: .75rem; }

.review-summary { display: grid; grid-template-columns: repeat(4, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.review-summary article { padding: 16px; }
.review-summary article + article { border-left: 1px solid var(--line); }
.review-summary small, .review-summary strong, .review-summary span { display: block; }
.review-summary small { color: var(--muted); font-size: .68rem; }
.review-summary strong { margin: 6px 0; color: var(--navy); font-size: 1rem; }
.review-summary span { color: var(--muted); font-size: .68rem; }
.disabled-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 20px; }
.disabled-actions span { color: var(--muted); font-size: .75rem; }
.operations-list { max-width: 760px; border-top: 1px solid var(--line); }

.preview-toast { position: fixed; right: 18px; bottom: 18px; max-width: min(360px, calc(100vw - 36px)); padding: 12px 14px; border-radius: 10px; color: #315f5c; background: #e4f5f2; box-shadow: 0 6px 8px rgba(18, 54, 70, .12); font-size: .78rem; }

@keyframes workspace-enter { from { opacity: .72; transform: translateY(5px); } }

@media (max-width: 900px) {
  .review-header { grid-template-columns: auto 1fr; }
  .review-label { text-align: right; }
  .review-actions { grid-column: 1 / -1; }
  .workspace-heading { grid-template-columns: 1fr; gap: 9px; }
  .decision-strip { grid-template-columns: repeat(2, 1fr); }
  .decision-strip > div:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .decision-strip > div:nth-child(4) { border-top: 1px solid var(--line); }
  .review-summary { grid-template-columns: repeat(2, 1fr); }
  .review-summary article:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .review-summary article:nth-child(4) { border-top: 1px solid var(--line); }
}

@media (max-width: 640px) {
  .review-header { grid-template-columns: 1fr; gap: 9px; padding: 11px 14px; }
  .review-label { text-align: left; }
  .review-actions { grid-column: 1; }
  .review-actions .button { flex: 1; }
  .workspace-nav { padding-inline: 10px; }
  .nav-item span { display: none; }
  main { padding: 16px; }
  .review-boundary { align-items: flex-start; flex-direction: column; gap: 4px; }
  .workspace-heading h1 { font-size: 1.75rem; }
  .decision-strip, .review-summary { grid-template-columns: 1fr; }
  .decision-strip > div + div, .review-summary article + article { border-left: 0; border-top: 1px solid var(--line); }
  .overview-grid, .fact-layout, .decision-columns { grid-template-columns: 1fr; gap: 20px; }
  .classification ol { grid-template-columns: 1fr; gap: 12px; }
  .classification li:not(:last-child)::after { content: "↓"; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
  .fact-list > div, .operations-list > div { grid-template-columns: 1fr; gap: 4px; }
  .attention-list li { align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
