@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("fonts/space-grotesk-300-700-latin.87c506d88b9f.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("fonts/manrope-300-800-latin.938c6e8019b6.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/jetbrains-mono-400-latin.b636a65da4f0.woff2") format("woff2");
}

:root {
  color-scheme: dark;
  --canvas: #0b1016;
  --panel: #111823;
  --panel-2: #172030;
  --line: #1f2a38;
  --line-strong: #2f3d50;
  --ink: #e9eef5;
  --muted: #98a6b8;
  --faint: #64728a;
  --signal: #ffb547;
  --signal-ink: #1a1206;
  --focus: #ffd58a;
  --button: #f3f6fa;
  --button-text: #0b1016;
  --amber: #f5a524;
  --amber-soft: rgba(245, 165, 36, .16);
  --green: #34d399;
  --green-soft: rgba(52, 211, 153, .16);
  --slate: #8b9cf5;
  --slate-soft: rgba(139, 156, 245, .16);
  --neutral: #94a3b8;
  --neutral-soft: rgba(148, 163, 184, .16);
  --danger: #ff7b7b;
  --radius: 12px;
  --display: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
  --body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

* { box-sizing: border-box; }
html { font-family: var(--body); font-size: 15px; color: var(--ink); background: var(--canvas); -webkit-font-smoothing: antialiased; }
body { margin: 0; min-height: 100vh; background: radial-gradient(1200px 600px at 70% -10%, rgba(255, 181, 71, .07), transparent 60%), var(--canvas); }
body.with-nav { display: grid; grid-template-columns: 240px minmax(0, 1fr); }
a { color: var(--ink); text-underline-offset: .18em; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.skip-link { position: absolute; left: -999px; top: 0; background: var(--panel); padding: .75rem; z-index: 5; }
.skip-link:focus { left: .5rem; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.mono { font-family: var(--mono); font-size: .78rem; letter-spacing: .01em; }
.swatch { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--c, var(--neutral)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c, var(--neutral)) 22%, transparent); margin-right: .5rem; vertical-align: middle; flex: none; }

/* Motion: hidden-then-rise only when JS is running, and never for reduced motion. */
html.js .rise { opacity: 0; transform: translateY(12px); transition: opacity .55s var(--ease), transform .55s var(--ease); transition-delay: calc(var(--i, 0) * 75ms); }
html.js body.is-live .rise { opacity: 1; transform: none; }
html.js .grow { width: 0; transition: width 1s var(--ease); transition-delay: calc(260ms + var(--i, 0) * 60ms); }
html.js body.is-live .grow { width: var(--w); }

/* Sidebar */
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; gap: .4rem; padding: 1.1rem .8rem; background: var(--panel); border-right: 1px solid var(--line); }
.brand { display: grid; gap: .1rem; padding: .3rem .6rem 1rem; }
.brand-name { font-family: var(--display); font-weight: 600; font-size: 1.2rem; letter-spacing: -.015em; line-height: 1.1; color: var(--ink); }
.brand-sub { font-family: var(--mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); }
.ws-switch { margin: 0 0 .6rem; border: 0; position: relative; }
.ws-switch summary { display: grid; gap: .15rem; min-height: 0; padding: .4rem .6rem; border-radius: 8px; font-size: inherit; color: inherit; }
.ws-switch summary::before { display: none; }
.ws-switch summary:hover { background: var(--panel-2); }
.ws-switch .brand-sub::after { content: " \25BE"; color: var(--signal); }
.ws-switch ul { list-style: none; margin: .3rem 0 0; padding: .3rem; display: grid; gap: .1rem; background: var(--panel-2); border: 1px solid var(--line-strong); border-radius: 8px; }
.ws-switch li a { display: block; padding: .45rem .6rem; border-radius: 6px; color: var(--muted); font-weight: 500; text-decoration: none; }
.ws-switch li a:hover { background: var(--panel); color: var(--ink); }
.ws-switch li a[aria-current="true"] { background: rgba(255, 181, 71, .12); color: var(--signal); font-weight: 600; }
.ws-switch .ws-add { color: var(--signal); font-size: .88rem; }
.side-search { padding: 0 0 .7rem; }
.side-search input { width: 100%; min-height: 38px; font-size: .9rem; background: var(--canvas); border-color: var(--line); }
.side-search input:focus { border-color: var(--line-strong); }
.nav { display: grid; gap: .15rem; }
.nav a { display: flex; align-items: center; min-height: 40px; padding: 0 .65rem; border-radius: 8px; color: var(--muted); font-weight: 600; text-decoration: none; transition: background .15s, color .15s; }
.nav a:hover { background: var(--panel-2); color: var(--ink); }
.nav a[aria-current="page"] { background: var(--panel-2); color: var(--ink); box-shadow: inset 3px 0 0 var(--signal); }
.sidebar-foot { margin-top: auto; padding-top: .9rem; border-top: 1px solid var(--line); display: grid; gap: .6rem; }
.who { margin: 0; padding: 0 .3rem; font-size: .8rem; color: var(--muted); overflow-wrap: anywhere; }
.who strong { display: block; color: var(--ink); font-weight: 600; font-size: .86rem; }
.logout-form { margin: 0; }
.logout-form button { width: 100%; min-height: 38px; background: transparent; color: var(--muted); border-color: var(--line); font-weight: 500; }
.logout-form button:hover { color: var(--ink); border-color: var(--line-strong); }

/* Page shell */
.shell { width: 100%; max-width: 1320px; padding: 1.8rem 2.2rem 3.5rem; }
.solo .shell { min-height: 100vh; max-width: none; display: grid; place-items: center; padding: 1.5rem; }
.page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1.5rem; margin-bottom: 1.4rem; }
.page-head h1, .board-head h1 { font-family: var(--display); font-size: 2.3rem; font-weight: 600; letter-spacing: -.03em; line-height: 1.02; margin: .15rem 0 .45rem; }
.page-head p, .lede { margin: 0; color: var(--muted); max-width: 62ch; line-height: 1.5; }
.eyebrow { font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); margin: 0; }
h2, h3 { line-height: 1.25; letter-spacing: 0; }
p { line-height: 1.5; margin: .35rem 0; }
.muted { color: var(--muted); }
.message { border: 1px solid var(--line); border-left: 3px solid var(--signal); background: var(--panel); padding: .7rem .9rem; border-radius: 8px; margin-bottom: .9rem; }
code { font-family: var(--mono); font-size: .82em; background: var(--panel-2); padding: .1em .35em; border-radius: 4px; }

/* Board head and counters */
.board-head { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr); gap: 1.5rem; align-items: end; margin-bottom: 1.2rem; }
.counters { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; }
.counters li { display: grid; gap: .25rem; align-content: start; padding: .9rem 1rem; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); min-width: 0; }
.counters b { font-family: var(--display); font-size: 2.1rem; font-weight: 600; letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; }
.counters .sub { font-size: .8rem; color: var(--muted); line-height: 1.35; }
.spark { width: 96px; height: 28px; overflow: visible; }
.spark polyline { fill: none; stroke: var(--c, var(--signal)); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Panels and grids */
.grid-a { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1rem; align-items: stretch; }
.grid-b { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1rem; align-items: start; }
.board { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1rem; align-items: start; }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.15rem 1.3rem; margin-bottom: 1rem; min-width: 0; }
.panel.narrow { max-width: 560px; }
.panel > h1 { font-family: var(--display); font-size: 1.5rem; font-weight: 600; letter-spacing: -.02em; margin: 0 0 .5rem; }
.panel > h2, .section-head h2 { font-family: var(--display); font-size: 1.15rem; font-weight: 600; letter-spacing: -.015em; margin: 0 0 .25rem; }
.panel > h2 { margin-bottom: .75rem; }
.section-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: .9rem; }
.section-head p { margin: 0; color: var(--muted); font-size: .88rem; }
.text-link { color: var(--signal); font-weight: 600; font-size: .9rem; white-space: nowrap; text-decoration: none; }
.text-link:hover { text-decoration: underline; }
.empty { color: var(--muted); font-size: .92rem; margin: .2rem 0; }

/* Groups table */
.table-wrap { overflow-x: auto; }
.groups { width: 100%; border-collapse: collapse; font-size: .92rem; }
.groups th, .groups td { padding: .6rem .8rem .6rem 0; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.groups thead th { border-top: 0; font-family: var(--mono); font-size: .68rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.groups tbody th { font-weight: 600; }
.groups tbody th a { text-decoration: none; }
.groups tbody th a:hover { color: var(--signal); }
.groups .coverage { display: block; font-size: .8rem; font-weight: 400; color: var(--muted); }
.groups .num { text-align: right; }
.groups .chip { margin-left: 0; }
.fine-print { margin: .6rem 0 0; font-size: .86rem; }

/* Complaints */
.complaint-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .2rem; }
.complaint-list li { padding: .75rem 0; border-top: 1px solid var(--line); }
.complaint-list li:first-child { border-top: 0; padding-top: 0; }
.complaint-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .8rem; align-items: center; }
.complaint-name { display: flex; align-items: center; font-weight: 700; text-decoration: none; color: var(--ink); min-width: 0; }
.complaint-name:hover { color: var(--c); }
.complaint-count { color: var(--muted); white-space: nowrap; }
.complaint-row .spark { width: 72px; height: 22px; }
.bar { display: block; height: 6px; margin: .55rem 0 .5rem; border-radius: 3px; background: var(--panel-2); overflow: hidden; }
.bar i { display: block; height: 100%; min-width: 3px; border-radius: 3px; background: var(--c); }
.complaint-foot { display: flex; justify-content: space-between; align-items: flex-start; gap: .8rem; }
.complaint-foot q { font-family: var(--display); font-size: .98rem; line-height: 1.35; color: var(--muted); quotes: "\201C" "\201D"; }
.readiness { flex: none; font-family: var(--mono); font-size: .74rem; padding: .25rem .55rem; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--muted); text-decoration: none; white-space: nowrap; }
.readiness.ok { border-color: transparent; background: var(--green-soft); color: var(--green); }
.readiness.none { border-style: dashed; color: var(--faint); }
.readiness:hover { color: var(--ink); border-color: var(--ink); }
.complaint-count b { color: var(--ink); font-family: var(--display); font-size: 1.05rem; }
.complaint-list .answered .complaint-count { color: var(--green); }
.complaint-list .answered .bar i { background: var(--line-strong); }
.last-response { margin: .5rem 0 0; color: var(--faint); }
.respond { border-top: 0; margin: 0; }
.respond summary { min-height: 32px; color: var(--signal); }
.respond-form { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem .9rem; padding: .3rem 0 .4rem; }
.respond-form .wide, .respond-form .form-row { grid-column: 1 / -1; }
.counters .lead { border-color: color-mix(in srgb, var(--signal) 45%, var(--line)); }
.counters .lead b { color: var(--signal); }

/* Kanban */
.columns { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; }
.column { background: var(--canvas); border: 1px solid var(--line); border-radius: 10px; padding: .6rem; display: grid; gap: .5rem; align-content: start; min-width: 0; }
.column header { display: flex; justify-content: space-between; align-items: center; padding: .15rem .25rem; }
.column header .mono { color: var(--faint); }
.column ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.card { display: grid; gap: .35rem; padding: .7rem .75rem; background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--c, var(--neutral)); border-radius: 8px; text-decoration: none; color: var(--ink); transition: transform .18s var(--ease), border-color .18s, background .18s; }
.card:hover { transform: translateY(-2px); border-color: var(--line-strong); background: var(--panel-2); }
.card .qid { color: var(--faint); }
.card-title { font-weight: 600; line-height: 1.35; font-size: .9rem; }
.card-meta { display: flex; align-items: center; font-size: .76rem; color: var(--muted); overflow-wrap: anywhere; }
.column ul { max-height: 34rem; overflow-y: auto; padding: 2px; scrollbar-width: thin; }
.column.drop-target { border-color: var(--signal); background: color-mix(in srgb, var(--signal) 6%, var(--canvas)); }
.column li[draggable] { cursor: grab; }
.column li.dragging { opacity: .4; }
.kanban-tools { display: flex; align-items: center; gap: 1rem; flex: none; }

/* Question pop-up */
.question-panel { width: min(760px, calc(100vw - 2rem)); max-height: calc(100vh - 4rem); padding: 1.4rem 1.6rem; background: var(--panel); color: var(--ink); border: 1px solid var(--line-strong); border-radius: 14px; }
.question-panel::backdrop { background: rgba(5, 8, 12, .7); }
.panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding-left: .9rem; border-left: 3px solid var(--c, var(--neutral)); }
.panel-head h2 { font-family: var(--display); font-size: 1.35rem; font-weight: 600; letter-spacing: -.015em; line-height: 1.25; margin: .2rem 0 0; }
.ghost { min-height: 32px; padding: .25rem .7rem; font-size: .82rem; font-weight: 500; background: transparent; color: var(--muted); border-color: var(--line-strong); }
.panel-block { margin-top: 1.1rem; padding-top: .9rem; border-top: 1px solid var(--line); }
.panel-block h3 { font-family: var(--mono); font-size: .7rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); margin: 0 0 .5rem; }
.panel-block p { color: var(--muted); }
.panel-foot { margin: .8rem 0 0; }

/* Collapsible panel */
.fold { border-top: 1px solid var(--line); margin: 0 0 1rem; }
.fold > summary { min-height: 0; gap: .8rem; color: var(--ink); }
.fold > summary h2 { font-family: var(--display); font-size: 1.15rem; font-weight: 600; letter-spacing: -.015em; margin: 0; }
.fold-sub { font-size: .88rem; font-weight: 400; color: var(--muted); }
.fold[open] > summary { margin-bottom: .8rem; }
.column .empty { padding: .4rem .25rem; font-size: .84rem; }

/* Feed */
.feed, .activity, .sources, .members, .queue { list-style: none; margin: 0; padding: 0; }
.feed li, .activity li, .sources li, .members li, .queue li { padding: .7rem 0; border-top: 1px solid var(--line); }
.feed li:first-child, .activity li:first-child, .sources li:first-child, .members li:first-child, .queue li:first-child { border-top: 0; padding-top: 0; }
.feed li { display: grid; grid-template-columns: 6.6rem minmax(0, 1fr); gap: .8rem; }
.feed .when { color: var(--faint); padding-top: .2rem; line-height: 1.5; }
.feed-title { font-weight: 700; text-decoration: none; }
.feed-title:hover { color: var(--signal); }
.chip { display: inline-block; margin-left: .5rem; font-family: var(--mono); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; padding: .15rem .45rem; border-radius: 4px; background: rgba(255, 181, 71, .14); color: var(--signal); vertical-align: middle; }
.chip.context { background: var(--neutral-soft); color: var(--neutral); }
.chip.new { background: var(--green-soft); color: var(--green); }
.responses li { grid-template-columns: 6.2rem minmax(0, 1fr); }
.responses .when { color: var(--faint); padding-top: .2rem; }
.feed-excerpt { margin: .25rem 0 .3rem; color: var(--muted); font-size: .9rem; line-height: 1.45; }
.dots .swatch { margin-right: .35rem; }
.activity li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .8rem; font-size: .92rem; }
.activity time { color: var(--faint); padding-top: .15rem; white-space: nowrap; }
.sources li { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.sources a { font-weight: 600; text-decoration: none; }
.sources a:hover { color: var(--signal); }
.sources .coverage { margin: .1rem 0 0; font-size: .82rem; color: var(--muted); }
.sources .count { font-family: var(--mono); font-size: .78rem; color: var(--muted); text-align: right; white-space: nowrap; }
.sources .count b { display: block; font-family: var(--display); font-size: 1.25rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.1; color: var(--ink); }

/* Status pills and tags */
.status { display: inline-flex; align-items: center; gap: .4rem; font-size: .76rem; font-weight: 700; white-space: nowrap; border-radius: 999px; padding: .22rem .65rem .22rem .55rem; background: var(--neutral-soft); color: var(--neutral); }
.status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.status[data-status="needs_evidence"], .status[data-status="expired"] { background: var(--amber-soft); color: var(--amber); }
.status[data-status="ready_internal"], .status[data-status="open"] { background: var(--green-soft); color: var(--green); }
.status[data-status="parked"] { background: var(--slate-soft); color: var(--slate); }
.tags { display: flex; flex-wrap: wrap; gap: .35rem; justify-content: flex-end; }
.tag { font-size: .76rem; font-weight: 600; white-space: nowrap; border: 1px solid var(--line-strong); border-radius: 999px; padding: .18rem .6rem; color: var(--muted); background: var(--panel-2); }

/* Toolbar and controls */
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: 1rem; }
.toolbar > label { display: block; flex: 0 1 190px; }
.toolbar > label.grow { flex: 1 1 260px; }
.toolbar input, .toolbar select { width: 100%; }
.scope-tabs { display: inline-flex; gap: 2px; padding: 3px; margin-bottom: .9rem; background: var(--panel); border: 1px solid var(--line); border-radius: 999px; }
.scope-tabs a { padding: .38rem .95rem; border-radius: 999px; font-size: .9rem; font-weight: 600; color: var(--muted); text-decoration: none; transition: background .15s, color .15s; }
.scope-tabs a:hover { color: var(--ink); }
.scope-tabs a[aria-current="page"] { background: var(--panel-2); color: var(--signal); }
.filter-note { margin: 0 0 .9rem; font-size: .9rem; color: var(--muted); }
input, select, textarea, button { font: inherit; font-size: .93rem; min-height: 40px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--panel-2); color: var(--ink); padding: .5rem .7rem; max-width: 100%; }
input::placeholder, textarea::placeholder { color: var(--faint); }
textarea { resize: vertical; min-height: 78px; line-height: 1.45; }
button { background: var(--button); color: var(--button-text); border-color: var(--button); font-weight: 700; padding: .5rem 1.05rem; cursor: pointer; transition: transform .15s var(--ease), filter .15s; }
button:hover { filter: brightness(1.08); transform: translateY(-1px); }
label { display: grid; gap: .3rem; font-size: .8rem; font-weight: 700; color: var(--muted); }
label input, label select, label textarea { font-weight: 400; color: var(--ink); }
.stack-form { display: grid; gap: .85rem; }
.form-row { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.form-error { color: var(--danger); font-size: .9rem; }
.inline-form { display: inline; }
.inline-form button { min-height: 32px; padding: .25rem .7rem; font-size: .82rem; background: transparent; color: var(--muted); border-color: var(--line-strong); font-weight: 500; }
.inline-form button:hover { color: var(--danger); border-color: var(--danger); filter: none; transform: none; }
.monitor-actions { display: flex; flex-wrap: wrap; gap: .35rem; }
.monitor-actions .inline-form button:hover { color: var(--signal); border-color: var(--signal); }
.status[data-status="warmup"] { background: var(--amber-soft); color: var(--amber); }
.status[data-status="ready"], .status[data-status="active"] { background: var(--green-soft); color: var(--green); }
.status[data-status="paused"] { background: var(--slate-soft); color: var(--slate); }

/* Item cards (questions, evidence) */
.item { padding: 1.25rem 1.4rem; transition: border-color .18s; }
.item:hover { border-color: var(--line-strong); }
.item-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.item-head h2 { font-family: var(--display); font-size: 1.22rem; font-weight: 600; letter-spacing: -.015em; line-height: 1.25; margin: .2rem 0 .3rem; overflow-wrap: anywhere; }
.meta-line { margin: 0; font-size: .86rem; color: var(--muted); }
.meta-line a { color: var(--signal); font-weight: 600; text-decoration: none; }
.meta-line a:hover { text-decoration: underline; }
.review-summary { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: .8rem 0 .2rem; font-size: .86rem; color: var(--muted); }
.note-preview { font-style: italic; }
.question-summary { max-width: 72ch; margin: .6rem 0 .2rem; }
.retained { display: grid; gap: .6rem; margin-top: .9rem; }
.retained section { background: var(--canvas); border: 1px solid var(--line); border-left: 3px solid var(--c, var(--line-strong)); border-radius: 8px; padding: .8rem 1rem; }
.retained h3 { font-family: var(--mono); font-size: .68rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); margin: 0 0 .4rem; }
.retained p { margin: 0; line-height: 1.55; overflow-wrap: anywhere; }
.field-list { display: grid; grid-template-columns: minmax(100px, 150px) 1fr; gap: .5rem .9rem; margin: .5rem 0 .9rem; font-size: .92rem; }
.field-list dt { color: var(--muted); }
.field-list dd { margin: 0; overflow-wrap: anywhere; line-height: 1.5; }
pre { font-family: var(--mono); font-size: .78rem; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; background: var(--canvas); border: 1px solid var(--line); border-radius: 8px; padding: .8rem .9rem; margin: .4rem 0 .9rem; }

/* Disclosure rows */
details { margin: .5rem 0 0; border-top: 1px solid var(--line); }
summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: .55rem; min-height: 42px; font-size: .88rem; font-weight: 700; color: var(--muted); }
summary::-webkit-details-marker { display: none; }
summary::before { content: ""; width: .42rem; height: .42rem; margin: 0 .25rem 0 .15rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg) translateY(1px); transition: transform .15s ease; }
details[open] > summary::before { transform: rotate(45deg) translateY(-1px); }
summary:hover { color: var(--ink); }
.review-details { margin-top: .9rem; }
.comment-thread { display: grid; gap: .6rem; margin: .3rem 0 .9rem; }
.comment { background: var(--canvas); border-radius: 8px; padding: .7rem .9rem; font-size: .92rem; }
.comment header { font-size: .8rem; color: var(--muted); margin-bottom: .3rem; }
.comment header b { color: var(--ink); font-weight: 700; }
.comment p { margin: 0; line-height: 1.5; overflow-wrap: anywhere; }
.review-form { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem .9rem; padding-bottom: .3rem; }
.review-form .wide, .review-form .form-row { grid-column: 1 / -1; }
.save-state { font-size: .88rem; color: var(--muted); }
.save-state.error { color: var(--danger); }
.save-state.ok { color: var(--green); }

/* Search */
.search-form { display: flex; gap: .6rem; max-width: 760px; margin-bottom: 1.2rem; }
.search-form label { flex: 1 1 auto; }
.search-form input { width: 100%; min-height: 48px; font-size: 1.05rem; padding-left: .9rem; }
.search-form button { min-height: 48px; }
.count-pill { font-family: var(--mono); font-size: .78rem; font-weight: 500; color: var(--faint); margin-left: .4rem; }
.results { list-style: none; margin: 0; padding: 0; }
.results li { display: grid; gap: .35rem; padding: .85rem 0; border-top: 1px solid var(--line); }
.results li:first-child { border-top: 0; padding-top: 0; }
.result-title { font-weight: 700; text-decoration: none; }
.result-title:hover { color: var(--signal); }
.result-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; font-size: .84rem; color: var(--muted); }
.snippet { margin: 0; line-height: 1.5; overflow-wrap: anywhere; }
mark { background: rgba(255, 181, 71, .28); color: inherit; padding: 0 .12em; border-radius: 3px; }

/* Team */
.members li { display: flex; align-items: center; gap: .8rem; }
.avatar { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 181, 71, .16); color: var(--signal); font-family: var(--display); font-weight: 700; font-size: .9rem; text-transform: uppercase; }
.member-name { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; font-weight: 600; }

/* Sign in */
.auth-panel { width: min(430px, 100%); background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 1.9rem 1.9rem 1.7rem; }
.auth-panel .brand { padding: 0 0 1.2rem; }
.auth-panel h1 { font-family: var(--display); font-size: 1.6rem; font-weight: 600; letter-spacing: -.02em; margin: 0 0 1rem; }
.auth-panel p { color: var(--muted); margin: -.5rem 0 1rem; }
.auth-panel button { width: 100%; min-height: 44px; }

/* Newport dashboard */
.board-head.stacked { grid-template-columns: 1fr; align-items: start; gap: 1.2rem; }
.answer { max-width: 46ch; margin: .1rem 0 0; font-family: var(--display); font-size: 1.5rem; font-weight: 500; line-height: 1.28; letter-spacing: -.015em; color: var(--muted); text-wrap: balance; }
.answer a { color: var(--c); font-weight: 600; text-decoration: none; }
.answer a:hover { text-decoration: underline; }
.tally { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-block: 1px solid var(--line); }
.tally li { display: grid; gap: .3rem; align-content: start; padding: .9rem 1rem; border-left: 1px solid var(--line); }
.tally li:first-child { border-left: 0; padding-left: 0; }
.tally b { font-family: var(--display); font-size: 2rem; font-weight: 600; letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; }
.tally .lead b { color: var(--signal); }
.tally span { font-size: .84rem; line-height: 1.35; color: var(--muted); }
.tally-note { margin: .65rem 0 0; max-width: 90ch; font-size: .86rem; color: var(--muted); }

/* Evidence grid: one column per retained post, one row per topic. */
.matrix-wrap { overflow-x: auto; padding: 4px 4px 2px; margin: -4px -4px 0; }
.matrix { --label: minmax(9rem, 13rem); --count: 2.4rem; --gap: 3px; min-width: min-content; }
.matrix-rows { position: relative; display: grid; gap: 7px; border-radius: 6px; }
.matrix-rows:focus-visible { outline: 2px solid var(--focus); outline-offset: 6px; }
.matrix-row, .matrix-axis { display: grid; grid-template-columns: var(--label) repeat(var(--n), minmax(4px, 1fr)) var(--count); column-gap: var(--gap); align-items: center; }
.matrix-head { display: contents; }
.matrix-head > :first-child { grid-column: 1; grid-row: 1; padding-right: .9rem; font-size: .9rem; font-weight: 600; line-height: 1.2; color: var(--ink); text-decoration: none; }
.matrix-head a:hover { color: var(--c); }
.matrix-count { grid-column: -2 / -1; grid-row: 1; text-align: right; font-family: var(--display); font-size: 1rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.cell { display: block; height: 18px; border-radius: 2px; background: color-mix(in srgb, var(--ink) 7%, transparent); }
.cell.on { background: var(--c); }
.unassessed { padding-top: 7px; border-top: 1px dashed var(--line-strong); }
.unassessed .matrix-head > :first-child { font-weight: 500; color: var(--muted); }
.unassessed .cell.on { background: repeating-linear-gradient(135deg, var(--neutral) 0 2px, transparent 2px 4px); box-shadow: inset 0 0 0 1px var(--neutral); }
.matrix-cursor { position: absolute; top: -4px; bottom: -4px; border-radius: 3px; box-shadow: 0 0 0 1.5px var(--signal); pointer-events: none; transition: left .12s var(--ease); }
.matrix-axis { margin-top: .6rem; align-items: start; }
/* A day bracket too narrow for its date hides the label rather than showing a clipped, misleading date. */
.day { container-type: inline-size; min-width: 0; overflow: hidden; padding: .3rem 0 0 .3rem; border-top: 1px solid var(--line-strong); border-left: 1px solid var(--line-strong); font-family: var(--mono); font-size: .68rem; line-height: 1.4; color: var(--muted); white-space: nowrap; }
@container (max-width: 2.5rem) { .day > span { visibility: hidden; } }
.matrix-ends { display: grid; grid-template-columns: var(--label) minmax(0, 1fr) var(--count); column-gap: var(--gap); margin: .25rem 0 0; color: var(--faint); font-size: .68rem; }
.matrix-ends > span { grid-column: 2; display: flex; justify-content: space-between; gap: 1rem; }
html.js .matrix-row { cursor: pointer; transition: opacity .15s var(--ease); }
.matrix-row.is-dim { opacity: .4; }
.matrix-row.is-active .matrix-head > :first-child { color: var(--c, var(--ink)); }
.matrix-rows.is-pinned .matrix-row.is-active { outline: 1px solid var(--signal); outline-offset: 3px; border-radius: 3px; }
.matrix-detail { display: none; margin: .9rem 0 0; border: 1px solid var(--line); border-radius: 8px; background: var(--canvas); }
html.js .matrix-detail { display: block; }
.matrix-detail.is-pinned { border-color: color-mix(in srgb, var(--signal) 45%, var(--line)); }
.detail-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.2rem; padding: .5rem .9rem; }
.detail-status { margin: 0; font-size: .9rem; color: var(--muted); }
.detail-status b { color: var(--ink); }
.detail-unpin { min-height: 32px; padding: .2rem .8rem; font-size: .82rem; flex: none; }
.detail-list { position: relative; list-style: none; margin: 0; padding: 0; max-height: 22rem; overflow: auto; border-top: 1px solid var(--line); }
.detail-list:empty { display: none; }
.is-pinned .detail-list { max-height: none; overflow: visible; }
.detail-list > li + li { border-top: 1px solid var(--line); }
.detail-list details { margin: 0; border: 0; }
.detail-list summary { display: grid; grid-template-columns: .8rem 7rem minmax(0, 1fr); align-items: start; gap: .2rem .8rem; min-height: 0; padding: .6rem .9rem; font-size: .9rem; font-weight: 400; }
.detail-list summary::before { margin: .45rem 0 0; }
.detail-main { grid-column: -2; }
.detail-list summary:hover, .detail-list details[open] > summary { background: var(--panel-2); }
.detail-list li.is-current > details > summary { box-shadow: inset 3px 0 0 var(--signal); }
.detail-when { font-size: .72rem; line-height: 1.5; color: var(--faint); }
.detail-main b { color: var(--ink); }
.detail-main q { color: var(--ink); }
.record { display: grid; gap: .9rem; padding: .4rem .9rem 1.1rem calc(.9rem + .8rem + 7rem + 1.6rem); }
.record section { display: grid; gap: .4rem; }
.record h4 { margin: 0; font-family: var(--mono); font-size: .68rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.record-text { margin: 0; max-width: 72ch; white-space: pre-line; line-height: 1.55; color: var(--ink); }
.record mark { padding: 0 .1em; border-radius: 2px; color: var(--ink); background: color-mix(in srgb, var(--c) 26%, transparent); box-shadow: inset 0 -2px 0 var(--c); }
.record-shared { margin: 0; font-size: .82rem; color: var(--muted); }
.record-story { margin: 0; max-width: 72ch; padding: .1rem 0 .1rem .8rem; border-left: 2px solid var(--line-strong); white-space: pre-line; color: var(--muted); }
.record-quotes, .record-comments, .record-limits { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; }
.record-quotes li { font-size: .88rem; }
.record-quotes q { color: var(--muted); }
.record-comments li { max-width: 72ch; padding: .5rem .75rem; border-radius: 6px; background: var(--panel-2); font-size: .88rem; }
.record-comments .mono { margin-left: .5rem; font-size: .7rem; color: var(--faint); }
.record-comments p { margin: .2rem 0 0; white-space: pre-line; }
.record-limits { gap: .15rem; font-size: .78rem; color: var(--faint); }
.record-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem 1rem; margin: 0; font-size: .8rem; }
.record-foot a { color: var(--signal); font-weight: 600; }
html.js .cell.on { opacity: 0; transform: scaleY(.2); transform-origin: bottom; transition: opacity .4s var(--ease), transform .4s var(--ease); transition-delay: calc(250ms + var(--x, 0) * 14ms); }
html.js body.is-live .cell.on { opacity: 1; transform: none; }

.quote-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr)); gap: .75rem; }
.quote-grid li { display: grid; gap: .55rem; align-content: start; padding: .85rem 1rem .95rem; background: var(--canvas); border: 1px solid var(--line); border-top: 3px solid var(--c); border-radius: 8px; }
.quote-grid p { margin: 0; font-size: .9rem; }
.quote-topic { display: flex; align-items: center; font-size: .86rem; font-weight: 700; text-decoration: none; }
.quote-topic:hover { color: var(--c); }
.quote-grid q { font-family: var(--display); font-size: 1.04rem; line-height: 1.38; color: var(--ink); quotes: "\201C" "\201D"; }
.record-id { color: var(--faint); overflow-wrap: anywhere; }
.quote-grid .record-id { display: grid; gap: .1rem; font-size: .7rem; }
.status-strip { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1.5rem; margin: 0; }
.status-strip dt { font-size: .76rem; color: var(--faint); }
.status-strip dd { margin: .15rem 0 0; overflow-wrap: anywhere; }
.command code { display: block; padding: .6rem .75rem; white-space: nowrap; overflow-x: auto; }
.feed-excerpt a { color: var(--ink); font-weight: 600; text-decoration: none; }
.feed-excerpt a:hover { color: var(--signal); text-decoration: underline; }
.feed .feed-meta { margin: 0; font-size: .85rem; }
.feed-tags { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .45rem; margin-top: .4rem; }
.feed-tags .chip { margin-left: 0; display: inline-flex; align-items: center; }
.feed-tags .swatch { width: 7px; height: 7px; margin-right: .4rem; }
.scope-group + .scope-group { margin-top: 1.1rem; }
.scope-group h3 { font-family: var(--mono); font-size: .7rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--signal); margin: 0 0 .5rem; }
.scope-group.context h3 { color: var(--neutral); }
.scope-group h3 span { color: var(--faint); }
.scope-group .count b { display: inline; }

@media (max-width: 1100px) {
  .board-head { grid-template-columns: 1fr; }
  .columns { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  body.with-nav { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .6rem .9rem; border-right: 0; border-bottom: 1px solid var(--line); }
  .brand { padding: 0 .5rem 0 0; }
  .brand-sub { display: none; }
  .ws-switch { margin: 0; }
  .ws-switch ul { position: absolute; z-index: 3; min-width: 220px; box-shadow: 0 10px 30px rgba(0, 0, 0, .45); }
  .side-search { padding: 0; flex: 1 1 160px; }
  .nav { display: flex; flex-wrap: wrap; gap: .1rem; }
  .sidebar-foot { margin: 0 0 0 auto; padding: 0; border: 0; }
  .who { display: none; }
  .logout-form button { width: auto; }
  .shell { padding: 1.2rem 1rem 2.5rem; }
  .page-head { flex-direction: column; align-items: flex-start; gap: .8rem; }
  .counters { grid-template-columns: 1fr 1fr; }
  .grid-a, .grid-b, .board, .field-list, .review-form, .respond-form { grid-template-columns: 1fr; }
  .complaint-row { grid-template-columns: minmax(0, 1fr) auto; }
  .complaint-row .spark { display: none; }
  .complaint-foot { flex-direction: column; }
  .item-head, .sources li { flex-direction: column; align-items: flex-start; }
  .tags { justify-content: flex-start; }
  .sources .count { text-align: left; }
  .toolbar > label, .toolbar > label.grow { flex-basis: 100%; }
  .feed li { grid-template-columns: 1fr; gap: .2rem; }
}
@media (max-width: 700px) {
  .answer { font-size: 1.25rem; }
  .tally { grid-template-columns: 1fr 1fr; }
  .tally li:nth-child(odd) { border-left: 0; padding-left: 0; }
  .tally li:nth-child(n+3) { border-top: 1px solid var(--line); }
  .matrix { --gap: 2px; }
  .matrix-row, .matrix-axis { grid-template-columns: repeat(var(--n), minmax(4px, 1fr)); }
  .matrix-ends { grid-template-columns: 1fr; }
  .matrix-ends > span { grid-column: 1; }
  .matrix-rows { gap: 4px; }
  .matrix-head { display: flex; justify-content: space-between; align-items: baseline; gap: .8rem; grid-column: 1 / -1; margin-top: .3rem; }
  .matrix-head > :first-child, .matrix-count { grid-column: auto; grid-row: auto; padding: 0; }
  .cell { height: 14px; }
  .detail-list summary { grid-template-columns: .8rem minmax(0, 1fr); }
  .record { padding-left: calc(.9rem + .8rem + .8rem); }
  .axis-spacer { display: none; }
}
@media (max-width: 560px) {
  .counters, .columns { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html.js .cell.on { opacity: 1; transform: none; transition: none; }
  html.js .rise { opacity: 1; transform: none; transition: none; }
  html.js .grow { width: var(--w); transition: none; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}