/* Layout: analyst workbench. Slim top bar with section tabs, one content column (max 1240px), summary before detail. */
:root {
  --bg: #F5F1E7; --surface: #FFFDF8; --surface-2: #EDECE3;
  --ink: #142B23; --ink-2: #344B40; --muted: #53645C; --line: #C9D0C6;
  --control-border: #7D8C80; --accent: #113C2B; --accent-ink: #FFFFFF; --accent-soft: #E6EEE5;
  --brass: #D0AE5A; --forest: #113C2B;
  --good: #166145; --good-soft: #E8F3EC; --warn: #77510D; --warn-soft: #FBF0D8;
  --bad: #A12F35; --bad-soft: #FAEAEB; --info: #245C85; --info-soft: #EAF2FA;
  --neutral: #53645C; --neutral-soft: #EDECE3; --hl: #FBF0D8;
  /* Distinct data colors, independent of brand and semantic status. Labels remain visible. */
  --series-1: #0072B2; --series-2: #B55D14; --series-3: #00806C;
  --series-4: #A84938; --series-5: #8B5B99; --series-6: #527D9C;
  --bar: var(--series-1); --bar-2: var(--series-2);
  --f-display: var(--f-body);
  --f-body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --r: 8px; --r-control: 6px;
  --space-1: 4px; --space-2: 8px; --space-3: 12px;
  --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px;
  --text-xs: 12px; --text-sm: 14px; --text-base: 16px;
  --text-lg: 20px; --text-xl: 24px; --text-title: 32px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --bg: #101C17; --surface: #192B22; --surface-2: #243C30;
  --ink: #F5F1E7; --ink-2: #C7D3CA; --muted: #A7BAAC; --line: #425C4D;
  --control-border: #6C8874; --accent: #9FC9B2; --accent-ink: #142B23; --accent-soft: #243F30;
  --brass: #D0AE5A; --forest: #113C2B;
  --good: #8BDBAF; --good-soft: #193B2A; --warn: #F0CE83; --warn-soft: #3D3019;
  --bad: #FFB3B8; --bad-soft: #45292E; --info: #A4CCE9; --info-soft: #213847;
  --neutral: #A7BAAC; --neutral-soft: #243C30; --hl: #3D3019;
  --series-1: #69B8E5; --series-2: #F2B46F; --series-3: #69C5B0;
  --series-4: #E79382; --series-5: #C8A0D6; --series-6: #A1C4DC;
  --bar: var(--series-1); --bar-2: var(--series-2);
  color-scheme: dark; } }
:root[data-theme="dark"] {
  --bg: #101C17; --surface: #192B22; --surface-2: #243C30;
  --ink: #F5F1E7; --ink-2: #C7D3CA; --muted: #A7BAAC; --line: #425C4D;
  --control-border: #6C8874; --accent: #9FC9B2; --accent-ink: #142B23; --accent-soft: #243F30;
  --brass: #D0AE5A; --forest: #113C2B;
  --good: #8BDBAF; --good-soft: #193B2A; --warn: #F0CE83; --warn-soft: #3D3019;
  --bad: #FFB3B8; --bad-soft: #45292E; --info: #A4CCE9; --info-soft: #213847;
  --neutral: #A7BAAC; --neutral-soft: #243C30; --hl: #3D3019;
  --series-1: #69B8E5; --series-2: #F2B46F; --series-3: #69C5B0;
  --series-4: #E79382; --series-5: #C8A0D6; --series-6: #A1C4DC;
  --bar: var(--series-1); --bar-2: var(--series-2);
  color-scheme: dark; }

* { box-sizing: border-box; }
body { background: var(--bg); color: var(--ink); font: 16px/1.5 var(--f-body); }
a { color: var(--accent); }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.num, .mono { font-family: var(--f-mono); font-variant-numeric: tabular-nums; }
.num { font-size: 0.95em; }
h1, h2, h3 { font-family: var(--f-display); text-wrap: balance; margin: 0; letter-spacing: 0; }
h1 { font-size: var(--text-xl); line-height: 1.15; font-weight: 600; }
h2 { font-size: var(--text-base); font-weight: 600; }
h3 { font-size: var(--text-sm); font-weight: 600; }
.eyebrow { font-size: var(--text-sm); text-transform: uppercase; letter-spacing: 0; color: var(--muted); font-weight: 500; }
.muted { color: var(--muted); }
.small { font-size: var(--text-sm); }

/* top bar */
.topbar { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: var(--surface); border-bottom: 1px solid var(--line); }
.topbar-in { max-width: 1240px; margin: 0 auto; padding: var(--space-2) var(--space-4) 0; display: flex; flex-direction: column; gap: var(--space-1); }
.brandrow { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; justify-content: space-between; }
.brand { display: flex; align-items: center; gap: var(--space-2); }
.brand-logo { width: 32px; height: 32px; flex: none; border-radius: var(--r-control); }
.brand b { font-family: var(--f-display); font-size: var(--text-base); font-weight: 600; }
.mode.live { background: var(--good-soft); color: var(--good); border-color: transparent; }
.mode { font-size: var(--text-xs); color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); border-radius: 99px; padding: 0 var(--space-2); }
.tabs { display: flex; gap: 0; overflow-x: auto; scrollbar-width: none; margin: 0 -4px; }
.tabs button { border: 0; background: none; padding: var(--space-2) var(--space-3) var(--space-2); cursor: pointer; color: var(--ink-2); border-bottom: 2px solid transparent; white-space: nowrap; font-weight: 500; }
.tabs button[aria-current="page"] { color: var(--ink); border-bottom-color: var(--accent); }
.tabs button:hover { color: var(--ink); }
.logbtn { border: 1px solid var(--line); background: var(--surface); border-radius: 99px; padding: var(--space-1) var(--space-2); cursor: pointer; font-size: var(--text-sm); }
.logbtn .n { font-family: var(--f-mono); }

main { max-width: 1240px; margin: 0 auto; padding-inline: var(--space-4); padding-block: var(--space-4) var(--space-7); display: flex; flex-direction: column; gap: var(--space-4); }
.pagehead { display: flex; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; align-items: flex-end; }
.pagehead p { text-wrap: pretty; margin: var(--space-1) 0 0; color: var(--ink-2); max-width: 72ch; }

.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: var(--space-4); min-width: 0; }
.panel > h2, .panel > .ph { margin-bottom: var(--space-3); }
.ph { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-2); flex-wrap: wrap; }
.grid { display: grid; gap: var(--space-4); }
.g2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); }
.g3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }

/* KPI strip */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: 0; background: var(--line); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.kpi { background: var(--surface); padding: var(--space-3) var(--space-3); display: flex; flex-direction: column; gap: 0; min-width: 0; }
.kpi .v { font-family: var(--f-mono); font-variant-numeric: tabular-nums; font-size: var(--text-lg); font-weight: 500; line-height: 1.2; }
.kpi .l { font-size: var(--text-sm); color: var(--ink-2); }
.kpi .s { font-size: var(--text-xs); color: var(--muted); }
.kpi.alert .v { color: var(--bad); }
.kpi.warnk .v { color: var(--warn); }

/* badges */
.b { display: inline-flex; align-items: center; gap: var(--space-1); font-size: var(--text-xs); line-height: 1; padding: var(--space-1) var(--space-2); border-radius: 4px; white-space: nowrap; font-weight: 500; border: 1px solid transparent; }
.b i { font-style: normal; font-size: var(--text-xs); }
.b-open { background: var(--accent-soft); color: var(--accent); }
.b-ttw { background: var(--warn-soft); color: var(--warn); }
.b-closed, .b-none { background: var(--surface-2); color: var(--ink-2); border-color: var(--line); }
.b-high { background: var(--good-soft); color: var(--good); }
.b-medium { background: var(--warn-soft); color: var(--warn); }
.b-low { background: var(--bad-soft); color: var(--bad); }
.b-unv { background: var(--warn-soft); color: var(--warn); cursor: help; }
.b-conf { background: var(--bad-soft); color: var(--bad); cursor: help; }
.b-ok { background: var(--good-soft); color: var(--good); }
.b-plain { background: var(--surface-2); color: var(--ink-2); border-color: var(--line); }
.b-strong { background: var(--good-soft); color: var(--good); }
.b-prom { background: var(--accent-soft); color: var(--accent); }
.b-watch { background: var(--warn-soft); color: var(--warn); }
.b-below { background: var(--bad-soft); color: var(--bad); }
.badges { display: flex; flex-wrap: wrap; gap: var(--space-1); align-items: center; }
.na { color: var(--muted); font-style: italic; }

/* tables */
.tw { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
table { border-collapse: collapse; width: 100%; font-size: var(--text-sm); }
th, td { text-align: left; padding: var(--space-2) var(--space-2); border-bottom: 1px solid var(--line); vertical-align: top; }
th { font-size: var(--text-sm); text-transform: uppercase; letter-spacing: 0; color: var(--muted); font-weight: 500; background: var(--surface-2); white-space: nowrap; position: sticky; top: 0; }
th.r, td.r { text-align: right; }
tr:last-child td { border-bottom: 0; }
tbody tr.click { cursor: pointer; }
tbody tr.click:hover td { background: var(--surface-2); }
tr.alert td { background: var(--hl); }
td .sub { display: block; color: var(--muted); font-size: var(--text-sm); }
.cname { font-weight: 600; color: var(--ink); }
.sortbtn { border: 0; background: none; padding: 0; cursor: pointer; font: inherit; color: inherit; text-transform: inherit; letter-spacing: 0; }

/* controls */
.controls { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.controls .search { flex: 1 1 260px; min-width: 0; }
input[type=search], input[type=text], input[type=date], input[type=number], select, textarea { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-control); padding: var(--space-2) var(--space-2); min-width: 0; }
select { padding-right: var(--space-5); }
textarea { width: 100%; resize: vertical; min-height: 60px; }
.chk { display: inline-flex; gap: var(--space-1); align-items: center; font-size: var(--text-sm); color: var(--ink-2); white-space: nowrap; }
.btn { border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-control); padding: var(--space-1) var(--space-3); cursor: pointer; font-weight: 500; }
.btn:hover { border-color: var(--muted); }
.btn.primary { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.btn.danger { color: var(--bad); }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r-control); overflow: hidden; }
.seg button { border: 0; background: var(--surface); padding: var(--space-1) var(--space-3); cursor: pointer; border-right: 1px solid var(--line); font-weight: 500; }
.seg button:last-child { border-right: 0; }
.seg button[aria-pressed="true"] { background: var(--accent); color: var(--accent-ink); }
.filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: var(--space-2); }
.filters label { display: flex; flex-direction: column; gap: var(--space-1); font-size: var(--text-sm); text-transform: uppercase; letter-spacing: 0; color: var(--muted); min-width: 0; }
.filters select, .filters input { text-transform: none; letter-spacing: 0; font-size: var(--text-sm); color: var(--ink); width: 100%; }

/* cards */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); gap: var(--space-3); }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: var(--space-3); display: flex; flex-direction: column; gap: var(--space-2); cursor: pointer; text-align: left; min-width: 0; }
.card:hover { border-color: var(--muted); }
.card.alert { box-shadow: inset 3px 0 0 var(--bad); }
.card .top { display: flex; justify-content: space-between; gap: var(--space-2); }
.card dl { display: grid; grid-template-columns: auto 1fr; gap: var(--space-1) var(--space-3); margin: 0; font-size: var(--text-sm); }
.card dt { color: var(--muted); }
.card dd { margin: 0; text-align: right; min-width: 0; }

/* bar lists (charts) */
.bars { display: flex; flex-direction: column; gap: var(--space-2); }
.bar-row { display: grid; grid-template-columns: minmax(90px, 34%) 1fr auto; gap: var(--space-2); align-items: center; font-size: var(--text-sm); }
.bar-row .lab { color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-row .val { font-family: var(--f-mono); font-variant-numeric: tabular-nums; color: var(--ink); text-align: right; min-width: 3.5em; }
.track { position: relative; height: 12px; }
.track .grid-line { position: absolute; top: -3px; bottom: -3px; width: 1px; background: var(--line); }
.fill { position: absolute; left: 0; top: 1px; height: 10px; background: var(--bar); border-radius: 0 4px 4px 0; min-width: 2px; }
.fill.alt { background: var(--bar-2); }
.tick { position: absolute; top: -3px; height: 18px; width: 2px; background: var(--ink); border-radius: 1px; }
.bar-row:hover .fill { filter: brightness(1.12); }
.bar-row[data-tip] { cursor: default; }
.bar-row.link { cursor: pointer; }
.axis { display: grid; grid-template-columns: minmax(90px, 34%) 1fr auto; gap: var(--space-2); font-size: var(--text-sm); color: var(--muted); }
.axis .ticks { position: relative; height: 14px; }
.axis .ticks span { position: absolute; transform: translateX(-50%); white-space: nowrap; font-family: var(--f-mono); }
.axis .ticks span:first-child { transform: none; }
.axis .ticks span:last-child { transform: translateX(-100%); }
.legend { display: flex; gap: var(--space-3); flex-wrap: wrap; font-size: var(--text-sm); color: var(--ink-2); margin-top: var(--space-2); }
.legend span { display: inline-flex; gap: var(--space-1); align-items: center; }
.sw { width: 12px; height: 10px; border-radius: 2px; background: var(--bar); display: inline-block; }
.sw.alt { background: var(--bar-2); }
.sw.tk { width: 2px; height: 14px; background: var(--ink); }
.note { font-size: var(--text-sm); color: var(--muted); margin-top: var(--space-2); }

/* meters */
.meter { height: 8px; border-radius: 4px; background: var(--surface-2); border: 1px solid var(--line); overflow: hidden; position: relative; }
.meter > span { position: absolute; inset: 0 auto 0 0; background: var(--bar); border-radius: 0 3px 3px 0; }
.meter.over > span { background: var(--good); }
.meter.low > span { background: var(--warn); }

/* profile */
.crumb { display: flex; gap: var(--space-2); align-items: center; flex-wrap: wrap; font-size: var(--text-sm); }
.crumb button { border: 0; background: none; color: var(--accent); cursor: pointer; padding: 0; }
.phead { display: flex; flex-direction: column; gap: var(--space-2); }
.phead .meta { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); color: var(--ink-2); font-size: var(--text-sm); }
.secnav { display: flex; gap: var(--space-1); overflow-x: auto; position: sticky; top: calc(env(safe-area-inset-top, 0px) + 82px); z-index: 10; background: var(--bg); padding-block: var(--space-1); border-bottom: 1px solid var(--line); scrollbar-width: none; }
.secnav a { text-decoration: none; color: var(--ink-2); font-size: var(--text-sm); padding: var(--space-1) var(--space-2); border-radius: 99px; white-space: nowrap; }
.secnav a:hover { background: var(--surface-2); color: var(--ink); }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: var(--space-3) var(--space-4); }
.fact { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.fact .k { font-size: var(--text-sm); text-transform: uppercase; letter-spacing: 0; color: var(--muted); }
.fact .v { font-size: var(--text-sm); overflow-wrap: anywhere; }
.fact .v.big { font-family: var(--f-mono); font-size: var(--text-lg); font-weight: 500; }
.fact .src { font-size: var(--text-xs); color: var(--muted); }
.fact .src a { color: var(--muted); }
.prose { max-width: 75ch; margin: 0; color: var(--ink); overflow-wrap: anywhere; }
.split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: var(--space-4); }
.compare { border: 1px solid var(--line); border-radius: var(--r); padding: var(--space-3); display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.compare.hist { border-top: 3px solid var(--good); }
.compare.claim { border-top: 3px solid var(--warn); }
.claimgrp { display: flex; flex-direction: column; gap: var(--space-1); }
.claim { display: grid; grid-template-columns: 1fr auto; gap: var(--space-1) var(--space-3); padding: var(--space-2) 0; border-top: 1px solid var(--line); font-size: var(--text-sm); }
.claim:first-of-type { border-top: 0; }
.claim .cv { overflow-wrap: anywhere; }
.claim .cm { grid-column: 1 / -1; font-size: var(--text-sm); color: var(--muted); display: flex; gap: var(--space-1) var(--space-3); flex-wrap: wrap; }
details.raw summary { cursor: pointer; font-weight: 600; font-family: var(--f-display); font-size: var(--text-sm); }
details.raw dl { display: grid; grid-template-columns: minmax(140px, max-content) 1fr; gap: var(--space-1) var(--space-4); margin: var(--space-3) 0 0; font-size: var(--text-sm); }
details.raw dt { font-family: var(--f-mono); color: var(--muted); font-size: var(--text-sm); }
details.raw dd { margin: 0; overflow-wrap: anywhere; }
.issues { margin: 0; padding-left: var(--space-4); display: flex; flex-direction: column; gap: var(--space-1); }
.prog { display: flex; flex-direction: column; gap: var(--space-2); }
.prog .row { display: grid; grid-template-columns: 110px 1fr auto; gap: var(--space-2); align-items: center; font-size: var(--text-sm); }

/* scorecard */
.crit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--space-4); padding: var(--space-3) 0; border-top: 1px solid var(--line); }
.crit:first-child { border-top: 0; padding-top: 0; }
@media (max-width: 720px) { .crit { grid-template-columns: 1fr; } }
.rubric { display: grid; grid-template-columns: auto 1fr; gap: var(--space-1) var(--space-2); font-size: var(--text-sm); color: var(--ink-2); margin-top: var(--space-1); }
.rubric b { font-family: var(--f-mono); font-weight: 500; color: var(--muted); }
.scorebtns { display: flex; flex-wrap: wrap; gap: var(--space-1); }
.scorebtns button { min-width: 36px; padding: var(--space-1) var(--space-2); border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-control); cursor: pointer; font-family: var(--f-mono); }
.scorebtns button[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.scorebtns button.clr { font-family: var(--f-body); font-size: var(--text-sm); color: var(--muted); }
.warnline { color: var(--bad); font-size: var(--text-sm); margin-top: var(--space-1); }
.result { display: flex; flex-direction: column; gap: var(--space-3); }
.bigscore { font-family: var(--f-mono); font-size: var(--text-title); line-height: 1; font-weight: 500; }
.scorelayout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: var(--space-4); align-items: start; }
@media (max-width: 900px) { .scorelayout { grid-template-columns: 1fr; } }
.sticky { position: sticky; top: 140px; }
@media (max-width: 900px) { .sticky { position: static; } }

/* kanban */
.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: var(--space-3); overflow-x: auto; padding-bottom: var(--space-2); }
.col { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r); padding: var(--space-2); display: flex; flex-direction: column; gap: var(--space-2); min-height: 160px; }
.col.drop { outline: 2px dashed var(--accent); outline-offset: -4px; }
.col h3 { display: flex; justify-content: space-between; align-items: baseline; }
.col h3 .n { font-family: var(--f-mono); color: var(--muted); font-size: var(--text-sm); }
.kcard { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-control); padding: var(--space-2); display: flex; flex-direction: column; gap: var(--space-2); font-size: var(--text-sm); }
.kcard[draggable="true"] { cursor: grab; }
.kcard .t { display: flex; justify-content: space-between; gap: var(--space-1); align-items: baseline; }
.kcard .t button { border: 0; background: none; padding: 0; font-weight: 600; cursor: pointer; text-align: left; color: var(--ink); font-size: var(--text-sm); }
.dots { display: flex; gap: var(--space-1); }
.dot { width: 14px; height: 6px; border-radius: 2px; background: var(--line); }
.dot.Done { background: var(--good); }
.dot.In { background: var(--bar); }
.dot.Blocked { background: var(--bad); }
.dot.NA { background: transparent; border: 1px dashed var(--line); }
.kcard select { font-size: var(--text-sm); padding: var(--space-1) var(--space-1); }
.empty { color: var(--muted); font-size: var(--text-sm); text-align: center; padding: var(--space-4) var(--space-1); border: 1px dashed var(--line); border-radius: var(--r-control); }
.ddgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: var(--space-2) var(--space-4); }
.ddgrid label, .fieldgrid label { display: flex; flex-direction: column; gap: var(--space-1); font-size: var(--text-sm); color: var(--muted); }
.fieldgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: var(--space-2) var(--space-4); }
.ddgrid select, .fieldgrid select, .fieldgrid input { color: var(--ink); font-size: var(--text-sm); width: 100%; }

#tip { position: fixed; z-index: 100; pointer-events: none; background: var(--ink); color: var(--bg); font-size: var(--text-sm); padding: var(--space-2) var(--space-2); border-radius: var(--r-control); max-width: 300px; line-height: 1.4; box-shadow: 0 4px 14px rgb(0 0 0 / 0.18); }
.toast { position: fixed; left: 50%; bottom: calc(env(safe-area-inset-bottom, 0px) + 18px); transform: translateX(-50%); background: var(--ink); color: var(--bg); padding: var(--space-2) var(--space-3); border-radius: 6px; font-size: var(--text-sm); z-index: 120; }
.confirm { display: flex; gap: var(--space-2); align-items: center; flex-wrap: wrap; background: var(--bad-soft); border-radius: var(--r-control); padding: var(--space-2) var(--space-2); font-size: var(--text-sm); }
@media (prefers-reduced-motion: no-preference) { .fill, .meter > span { transition: width .18s ease; } }
@media (max-width: 560px) { .topbar { position: static; } .brand { flex-wrap: wrap; gap: var(--space-1) var(--space-2); } .brand b { font-size: var(--text-base); } .mode { white-space: nowrap; } .secnav { position: static; } h1 { font-size: var(--text-lg); } .kpi .v { font-size: var(--text-lg); } .bar-row, .axis { grid-template-columns: 96px 1fr auto; } }

.scout-search { display:grid; grid-template-columns:minmax(160px,1fr) minmax(150px,240px) auto; align-items:end; gap: var(--space-4); }
.scout-search label {display:flex;flex-direction:column;gap: var(--space-1);font-weight:500;}
.scout-search input,.scout-search select {width:100%;padding: var(--space-2);border:1px solid var(--line);border-radius:6px;background:var(--surface);}
.scout-grid {display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap: var(--space-4);}
.scout-card {display:flex;flex-direction:column;gap: var(--space-2);margin: 0;}
.scout-card p {margin: 0;}.scout-card .row {margin-top: auto;flex-wrap:wrap;gap: var(--space-2);}
.scout-pagination {display:flex;justify-content:center;align-items:center;gap: var(--space-4);padding: var(--space-5);}
.link {border:0;padding: 0;background:none;color:var(--accent);font:inherit;text-align:left;cursor:pointer;}
.pagehead {display:flex;justify-content:space-between;gap: var(--space-4);align-items:start;margin-bottom: 0;}
.pagehead p {color:var(--ink-2);}.fieldgrid textarea {min-height:100px;resize:vertical;}
.btn:disabled {opacity:.55;cursor:not-allowed;}
@media(max-width:650px){.scout-search{grid-template-columns:1fr}.pagehead{flex-direction:column}.scout-card .row{align-items:start}}

.market-facts{margin: var(--space-2) 0}.market-facts dt{color:var(--muted);font-size: var(--text-sm)}.market-facts dd{margin: var(--space-1) 0 var(--space-3)}.news-list article,.funding-round{padding: var(--space-4) 0;border-top:1px solid var(--line)}.funding-round p{overflow-wrap:anywhere}.kpi .v{overflow-wrap:anywhere}

#disc-filters{grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr))}#disc-filters label{display:flex;flex-direction:column;gap: var(--space-1)}#disc-filters input,#disc-filters select{width:100%;box-sizing:border-box;padding: var(--space-2);border:1px solid var(--line);border-radius:6px;background:var(--surface);font:inherit}

.founder{display:flex;gap: var(--space-5);align-items:center}.founder h2{margin: 0}.founder .eyebrow{margin: 0 0 var(--space-2)}.founder p{margin: 0 0 var(--space-2)}
.founder-photo{width:120px;height:120px;border-radius:50%;flex:none;object-fit:cover}
.founder-initials{display:flex;align-items:center;justify-content:center;background:var(--accent-soft);color:var(--accent);font-size: var(--text-title);font-weight:600;letter-spacing: 0}
@media(max-width:560px){.founder{flex-direction:column;text-align:center}}
/* Hall of contributors: framed portraits with museum plaques */
.hall{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap: var(--space-6) var(--space-5);padding: var(--space-6) var(--space-5);border-radius:var(--r);background:var(--surface);border:1px solid var(--line)}
.exhibit{margin: 0;display:flex;flex-direction:column;align-items:center;gap: var(--space-4)}
.frame{width:100%;max-width:200px;padding: var(--space-2);background:var(--surface-2);border-radius:3px;box-shadow:0 10px 24px rgba(0,0,0,.28),inset 0 0 0 1px rgba(255,255,255,.25)}
.portrait{position:relative;aspect-ratio:4/5;background:#f4efe3;border:12px solid #f4efe3;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);display:flex;align-items:center;justify-content:center;overflow:hidden}
.portrait span{font-family:var(--f-display);font-size: var(--text-title);font-weight:600;color:#8a6526;letter-spacing: 0}
.portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.plaque{width:100%;max-width:220px;text-align:center;padding: var(--space-2) var(--space-3);border-radius:3px;background:var(--surface-2);color:#3b2f14;border:1px solid #b89a55;box-shadow:0 2px 6px rgba(0,0,0,.18);display:flex;flex-direction:column;gap: var(--space-1);overflow-wrap:anywhere}
.plaque strong{font-family:var(--f-display);font-size: var(--text-base);letter-spacing: 0}
.plaque-role{font-size: var(--text-xs);text-transform:uppercase;letter-spacing: 0;color:#6b5525}
.plaque-text{font-size: var(--text-xs);line-height:1.4;font-style:italic}
.plaque a{font-size: var(--text-xs);color:#5a3f0e;font-weight:600}
.exhibit-empty .frame{background:none;box-shadow:none;border:2px dashed var(--line);padding: var(--space-2)}
.exhibit-empty .portrait{background:var(--surface);border-color:var(--surface);box-shadow:none}
.exhibit-empty .portrait span{color:var(--muted);font-size: var(--text-title)}
@media(max-width:560px){.hall{padding: var(--space-5) var(--space-3);gap: var(--space-6) var(--space-4);grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.portrait span{font-size: var(--text-title)}}
.fieldgrid .wide{grid-column:1/-1}
.join-hall{margin-top: var(--space-5)}.join-hall h2{margin: 0 0 var(--space-1)}.join-hall>p{margin: 0 0 var(--space-3);color:var(--ink-2)}
.plaque button.link{font-size: var(--text-xs);color:#5a3f0e;font-weight:600;text-align:center}
/* Map view */
.map-filters{display:grid;grid-template-columns:minmax(180px,2fr) repeat(2,minmax(150px,1fr)) auto;gap: var(--space-2) var(--space-4);align-items:end;margin-bottom: var(--space-3)}
.map-filters label{display:flex;flex-direction:column;gap: var(--space-1);font-size: var(--text-sm);color:var(--muted)}
.map-filters input,.map-filters select{width:100%;font-size: var(--text-sm);color:var(--ink)}
/* .vs-map prefixes outrank leaflet.css, which loads after this file */
.vs-map{height:min(68vh,620px);min-height:360px;border:1px solid var(--line);border-radius:var(--r);z-index:0}
.vs-map.leaflet-container{background:var(--surface-2);font:inherit}
.vs-map .leaflet-tile-pane{filter:grayscale(1) brightness(1.03) contrast(.9)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .vs-map .leaflet-tile-pane{filter:grayscale(1) invert(1) brightness(.85) contrast(.9)}}
:root[data-theme="dark"] .vs-map .leaflet-tile-pane{filter:grayscale(1) invert(1) brightness(.85) contrast(.9)}
.vs-map .vs-pin{background:var(--accent);border:2px solid var(--surface);border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.35)}
.vs-map .vs-cluster{display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--accent);color:var(--accent-ink);font:600 13px var(--f-body);border:3px solid color-mix(in srgb,var(--accent) 35%,transparent);background-clip:padding-box}
.vs-map .leaflet-popup-content-wrapper,.vs-map .leaflet-popup-tip{background:var(--surface);color:var(--ink)}
.vs-map .leaflet-popup-content{margin: var(--space-3) var(--space-3)}
.map-card{display:flex;flex-direction:column;gap: var(--space-1);font:14px var(--f-body);min-width:190px}
.map-card strong{font-family:var(--f-display);font-size: var(--text-base)}.map-card>span{color:var(--muted)}
.map-card dl{display:grid;grid-template-columns:auto 1fr;gap: 0 var(--space-2);margin: var(--space-1) 0 var(--space-2)}.map-card dt{color:var(--muted)}.map-card dd{margin: 0}
.vs-map .leaflet-control-attribution{background:color-mix(in srgb,var(--surface) 85%,transparent);color:var(--muted)}
.vs-map .leaflet-control-attribution a{color:var(--accent)}
@media(max-width:650px){.map-filters{grid-template-columns:1fr 1fr}.map-filters label:first-child{grid-column:1/-1}.vs-map{height:60vh}}

/* Shared UI system: research, workspace, and project pages. */
body { font-size: var(--text-sm); line-height: 1.6; }
h1 { font-family: var(--f-body); font-size: var(--text-title); line-height: 1.2; letter-spacing: 0; }
h2 { font-family: var(--f-body); font-size: var(--text-base); line-height: 1.35; letter-spacing: 0; }
h3 { font-family: var(--f-body); line-height: 1.4; }
p { margin-block: 0 var(--space-3); }
.eyebrow { font-size: var(--text-xs); font-weight: 600; letter-spacing: 0; }
.pagehead .eyebrow { display: block; margin-bottom: var(--space-2); }
.pagehead p { margin-top: var(--space-2); max-width: 66ch; font-size: var(--text-sm); }
main { gap: var(--space-5); padding: var(--space-6) var(--space-5) var(--space-7); min-width: 0; }
main > * { min-width: 0; max-width: 100%; }
.panel { padding: var(--space-5); }
.panel > :last-child { margin-bottom: 0; }
.grid, .split, .cards, .scout-grid { gap: var(--space-4); }
.pagehead + .note, main > .note { margin-block: 0; }
.note { font-size: var(--text-xs); line-height: 1.6; }
.small { font-size: var(--text-xs); }
.skip-link { position: fixed; left: 16px; top: -100px; z-index: 200; padding: var(--space-3) var(--space-4); background: var(--surface); border: 2px solid var(--accent); border-radius: var(--r); }
.skip-link:focus { top: 12px; }
:focus-visible { outline-width: 3px; outline-offset: 3px; }
#app:focus { outline: none; }

/* Navigation: plain labels, consistent active marker, no decorative icon noise. */
.topbar-in { gap: var(--space-4); padding: var(--space-5) var(--space-4); }
.brandrow { gap: var(--space-4); }
.brand { flex-wrap: wrap; }
.brand b { font-family: var(--f-body); font-size: var(--text-base); letter-spacing: 0; }
.brand .mode { flex-basis: 100%; border: 0; border-radius: 0; padding: 0; background: none; font-size: var(--text-xs); }
.tabs { flex-direction: column; overflow: visible; gap: var(--space-5); margin: 0; }
.nav-group { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.nav-label { line-height: 1.5; padding: 0 var(--space-3) var(--space-1); color: var(--muted); font-size: var(--text-xs); font-weight: 600; letter-spacing: 0; text-transform: uppercase; }
.tabs button { white-space: normal; overflow-wrap: anywhere; text-align: left; min-height: 40px; padding: var(--space-2) var(--space-3); border: 1px solid transparent; border-radius: var(--r-control); font-size: var(--text-sm); }
.tabs button:hover { background: var(--surface-2); }
.tabs button[aria-current='page'] { background: var(--accent-soft); color: var(--accent); border-color: transparent; box-shadow: inset 3px 0 var(--accent); font-weight: 600; }
.logbtn { font-size: var(--text-xs); border-radius: 6px; padding: var(--space-2) var(--space-3); min-height: 40px; }
.nav-toggle { display: none; }
@media (min-width: 1000px) {
  body { padding-left: 224px; }
  .topbar { position: fixed; inset: 0 auto 0 0; width: 224px; overflow-y: auto; border-bottom: 0; border-right: 1px solid var(--line); }
  .brandrow { flex-direction: column; align-items: stretch; }
  .logbtn { text-align: left; }
  main { max-width: 1320px; padding: var(--space-6) var(--space-6) var(--space-7); }
  .secnav { top: 0; }
  .sticky { top: 24px; }
}

/* Controls and filters share sizing on every page, including URL inputs. */
.btn, .seg button, .scorebtns button, .nav-toggle { min-height: 40px; border-radius: var(--r-control); padding: var(--space-2) var(--space-3); font-size: var(--text-sm); line-height: 1.4; }
a.btn { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.btn.primary:hover { filter: brightness(.94); }
button:disabled { cursor: not-allowed; opacity: .55; }
input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea,
.scout-search input, .scout-search select, #disc-filters input, #disc-filters select {
  min-height: 42px; padding: var(--space-2) var(--space-3); border: 1px solid var(--line); border-radius: var(--r-control);
  background: var(--surface); color: var(--ink); font: inherit; font-size: var(--text-sm); max-width: 100%;
}
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.fieldgrid, .filters, #disc-filters, .scout-search, .map-filters { gap: var(--space-4); align-items: end; }
.fieldgrid label, .filters label, #disc-filters label, .scout-search label, .map-filters label { gap: var(--space-1); font-size: var(--text-xs); font-weight: 500; color: var(--ink-2); text-transform: none; letter-spacing: 0; }
.controls { gap: var(--space-2); }
.controls > label { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); font-size: var(--text-xs); }
.scout-search, .map-filters { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: var(--space-4); margin: 0; }
.fieldgrid .controls { margin-top: var(--space-2); }
#company-form > .controls { margin-top: var(--space-4); }
.seg button { border-radius: 0; }
.scorebtns button { min-width: 40px; }

/* Numbers and evidence: consistent alignment, restrained labels. */
.kpi { padding: var(--space-4); gap: var(--space-1); }
.kpi .v { font-size: var(--text-title); line-height: 1.3; letter-spacing: 0; }
.kpi .v.small { font-size: var(--text-sm); letter-spacing: 0; }
.kpi .l { font-size: var(--text-xs); font-weight: 500; }
.kpi .s { font-size: var(--text-xs); }
.b { line-height: 1.35; font-size: var(--text-xs); padding: var(--space-1) var(--space-2); white-space: normal; }
.badges { gap: var(--space-1); }
th { font-size: var(--text-xs); letter-spacing: 0; color: var(--ink-2); }
th, td { padding: var(--space-3) var(--space-3); }
td.r, th.r { font-variant-numeric: tabular-nums; }
.tw { max-width: 100%; overscroll-behavior-x: contain; }
.tw table { min-width: 600px; }
.scout-card, .card { padding: var(--space-4); gap: var(--space-3); overflow-wrap: anywhere; }
.scout-card h2 { font-size: var(--text-base); }
.scout-card > .controls, .scout-card > .row { display: flex; margin-top: auto; align-items: center; }
.market-facts { display: grid; grid-template-columns: 1fr; gap: var(--space-1); margin: var(--space-1) 0 var(--space-3); }
.market-facts dt { font-size: var(--text-xs); }
.market-facts dd { font-size: var(--text-sm); font-variant-numeric: tabular-nums; margin: 0 0 var(--space-2); }
.news-list { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 0 var(--space-4); }
.news-list article { padding: var(--space-4) 0; }
.news-list article:first-child { border-top: 0; }
.news-list article > a { font-weight: 500; text-decoration: none; }
.news-list article > a:hover { text-decoration: underline; }
.news-list article p { margin: var(--space-1) 0 0; }
.funding-round { margin-top: var(--space-3); padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
.funding-round p { margin: var(--space-2) 0; }
.funding-round summary { cursor: pointer; color: var(--accent); font-size: var(--text-xs); padding-block: var(--space-2); }
[role=alert].panel { border-left: 3px solid var(--bad); background: var(--bad-soft); }
[role=status].panel { color: var(--ink-2); }
.empty { padding: var(--space-6) var(--space-5); line-height: 1.7; background: var(--surface); }
.kanban { grid-auto-columns: minmax(250px, 1fr); scroll-snap-type: x proximity; }
.col { scroll-snap-align: start; padding: var(--space-4); gap: var(--space-4); }
.kcard { padding: var(--space-3); gap: var(--space-2); }
.prose { max-width: 80ch; }
.founder { align-items: flex-start; }
.founder-photo { width: 88px; height: 88px; }

/* Keep contributor portraits and plaques, with the same surfaces as the app. */
.hall { padding: var(--space-5); gap: var(--space-5); background: var(--surface); grid-template-columns: repeat(auto-fill,minmax(min(100%,200px),1fr)); }
.frame { padding: var(--space-1); border: 1px solid var(--brass); border-radius: 8px; background: var(--surface-2); box-shadow: none; }
.portrait { border: 6px solid var(--surface); border-radius: 4px; background: var(--surface-2); box-shadow: none; }
.portrait span { color: var(--muted); }
.plaque { background: none; border: 0; box-shadow: none; color: var(--ink); padding: 0; gap: var(--space-1); }
.plaque-role, .plaque-text { color: var(--ink-2); }
.plaque-text { font-style: normal; }
.plaque a, .plaque button.link { color: var(--accent); }
.join-hall { margin-top: 0; }

@media (max-width: 999px) {
  .topbar { position: static; }
  .topbar-in { padding: var(--space-4) var(--space-4); gap: var(--space-3); }
  .brand .mode { display: none; }
  .brand { flex-wrap: nowrap; }
  .nav-toggle { display: block; text-align: left; background: var(--surface-2); border: 1px solid var(--line); cursor: pointer; font-weight: 500; }
  .nav-toggle::after { content: '+'; float: right; }
  .nav-toggle[aria-expanded=true]::after { content: '−'; }
  .tabs { display: none; }
  .tabs.is-open { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-3); }
  .tabs button { white-space: normal; }
  .secnav { position: static; }
}
@media (max-width: 600px) {
  main { padding: var(--space-5) var(--space-4) var(--space-7); gap: var(--space-4); }
  .topbar-in { padding: var(--space-3) var(--space-4); }
  .brand b { font-size: var(--text-base); }
  .brand-logo { width: 28px; height: 28px; }
  .tabs.is-open { grid-template-columns: 1fr; gap: var(--space-4); }
  .nav-group { display: grid; grid-template-columns: 1fr 1fr; }
  .nav-label { grid-column: 1 / -1; }
  .tabs button, .btn, .logbtn, .scorebtns button, .seg button { min-height: 44px; }
  input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea { font-size: var(--text-base); min-height: 44px; }
  .pagehead { gap: var(--space-4); }
  .pagehead > .controls { width: 100%; }
  .panel, .scout-card, .card { padding: var(--space-4); }
  .kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .kpi { padding: var(--space-4); }
  .kpi .v { font-size: var(--text-lg); }
  .scout-search, .map-filters { grid-template-columns: 1fr; padding: var(--space-4); }
  .map-filters label:first-child { grid-column: auto; }
  .founder { text-align: left; flex-direction: column; gap: var(--space-4); }
  .hall { padding: var(--space-4); }
  .scout-pagination { gap: var(--space-3); padding: var(--space-4) 0; }
  .b { max-width: 100%; }
  details.raw dl { grid-template-columns: 1fr; }
  .toast { width: max-content; max-width: calc(100vw - 32px); }
  #tip { max-width: calc(100vw - 32px); }
}
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
label.btn:focus-within { outline: 3px solid var(--accent); outline-offset: 3px; }

/* About: the existing logo and founder content within the shared research system. */
.about { display: flex; flex-direction: column; gap: var(--space-6); padding: var(--space-5); border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); color: var(--ink); min-width: 0; }
.about-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; gap: var(--space-5); padding-bottom: var(--space-5); border-bottom: 1px solid var(--line); }
@media (max-width: 760px) { .about-hero { grid-template-columns: 1fr; } .about .about-hero-art { order: 0; width: min(320px, 90%); } }
.about-hero-art { --pad: 0px; position: relative; order: 2; padding: var(--pad); border-radius: var(--r); justify-self: center; width: min(420px, 100%); animation: about-rise .9s cubic-bezier(.2, .7, .2, 1) both, about-float 7s ease-in-out .9s infinite; }
.about-hero-art::before { content: ""; position: absolute; z-index: 0; left: 42%; top: 22%; width: 34%; aspect-ratio: 1; border-radius: 50%; background: var(--brass, #c9a548); filter: blur(28px); opacity: .35; animation: about-sun 4s ease-in-out infinite; }
.about-hero-logo { position: relative; display: block; width: 100%; height: auto; filter: drop-shadow(0 14px 30px rgba(18, 67, 43, .16)); }
/* A light sweep across the logo every few seconds, clipped to the logo's own shape. */
.about-hero-art::after { content: ""; position: absolute; inset: var(--pad); pointer-events: none; background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, .7) 50%, transparent 58%) no-repeat; background-size: 250% 100%;
  -webkit-mask: url(images/logo-hero.webp) center / contain no-repeat; mask: url(images/logo-hero.webp) center / contain no-repeat; animation: about-shine 5.5s ease-in-out 1.4s infinite; }
.about-hero-copy { order: 1; animation: about-rise .8s cubic-bezier(.2, .7, .2, 1) .2s both; }
/* Dark theme: the logo sits on its own light card, as in the sidebar mark, so the dark green stays visible. */
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .about-hero-art { --pad: 20px; background: #FDFBF7; } }
:root[data-theme="dark"] .about-hero-art { --pad: 20px; background: #FDFBF7; }
@keyframes about-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes about-float { 50% { transform: translateY(-8px); } }
@keyframes about-sun { 50% { opacity: .55; transform: scale(1.15); } }
@keyframes about-shine { 0% { background-position: 130% 0; } 35%, 100% { background-position: -30% 0; } }
@media (prefers-reduced-motion: reduce) { .about-hero-art, .about-hero-art::before, .about-hero-art::after, .about-hero-copy { animation: none !important; } }
.about-kicker { margin: 0 0 var(--space-2); font-size: var(--text-xs); font-weight: 600; color: var(--muted); }
.about h1 { font-size: var(--text-title); line-height: 1.2; }
.hero-v, .hero-s { color: var(--ink); }
.about-tag { max-width: 60ch; margin: var(--space-4) 0 var(--space-5); font-size: var(--text-lg); color: var(--ink-2); }
.about-cta { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.about-h2 { font-size: var(--text-xl); margin-bottom: var(--space-4); }
.about-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,220px),1fr)); gap: var(--space-4); }
.about-grid-2 { grid-template-columns: repeat(auto-fit,minmax(min(100%,280px),1fr)); }
.about-card { min-width: 0; padding: var(--space-5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); overflow-wrap: anywhere; }
.about-card h3 { font-size: var(--text-base); margin: 0 0 var(--space-2); }
.about-card p { color: var(--ink-2); margin: 0 0 var(--space-3); }
.about-card p:last-child { margin-bottom: 0; }
.about-icon { width: 40px; height: 40px; padding: var(--space-2); margin-bottom: var(--space-3); border-radius: var(--r-control); fill: var(--accent); background: var(--accent-soft); }
.about-small, .about-note { font-size: var(--text-sm); color: var(--muted); }
.about-person { display: flex; flex-direction: column; align-items: flex-start; }
.about-person .founder-photo { width: 88px; height: 88px; margin-bottom: var(--space-4); border: 2px solid var(--brass); }
.about-person .founder-initials { background: var(--accent-soft); color: var(--accent); }
.about-role { font-size: var(--text-xs); font-weight: 600; color: var(--muted); }
.about-person p:last-child { margin-top: auto; padding-top: var(--space-2); }
.about-note { margin: 0; }
@media(max-width:600px) { .about, .about-card { padding: var(--space-4); } }

/* Competitive analysis */
.ca-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.ca-sec { display: flex; flex-direction: column; gap: var(--space-3); }
.ca-sec h2 { font-size: var(--text-lg); }
.ca-sec h3 { font-size: var(--text-base); margin-top: var(--space-2); }
.ca-sec label { display: flex; flex-direction: column; gap: var(--space-1); font-size: var(--text-sm); font-weight: 500; color: var(--ink-2); }
.ca-sec input:not([type=checkbox]), .ca-sec select, .ca-sec textarea { font: inherit; font-weight: 400; color: var(--ink); background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: var(--space-2) var(--space-2); min-width: 0; width: 100%; box-sizing: border-box; }
.ca-sec textarea { resize: vertical; }
.ca-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: var(--space-3); }
.ca-comp { border: 1px solid var(--line); border-radius: var(--r); padding: var(--space-3); display: flex; flex-direction: column; gap: var(--space-2); align-items: stretch; }
.ca-comp > .btn { align-self: flex-start; }
.ca-sec > .btn { align-self: flex-start; }
.ca-forces { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: var(--space-3); }
.ca-forces label select { margin-bottom: var(--space-1); }
.ca-table td, .ca-factors td { min-width: 140px; vertical-align: top; }
.ca-factors td:nth-child(2), .ca-factors td:nth-child(6) { min-width: 0; text-align: center; }
.ca-factors td:nth-child(3) { min-width: 100px; }
.ca-factors td:nth-child(4) { min-width: 240px; }
.ca-scores { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: var(--space-3); }
.ca-score { border: 1px solid var(--line); border-radius: var(--r); padding: var(--space-4); background: var(--surface-2, var(--bg)); }
.ca-num { font-family: var(--f-mono); font-variant-numeric: tabular-nums; font-size: var(--text-title); font-weight: 600; margin: var(--space-1) 0 var(--space-2); line-height: 1; }
.ca-num small { font-size: var(--text-base); color: var(--muted); }
.ca-num span { font-size: var(--text-lg); color: var(--muted); }
.ca-cov { height: 8px; border-radius: 4px; background: var(--line); overflow: hidden; }
.ca-cov span { display: block; height: 100%; background: var(--accent); }
.ca-score .note { margin: var(--space-2) 0 0; }
.ca-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: var(--space-4); }
.ca-list h2 { font-size: var(--text-base); }
.ca-factors select { min-width: 104px; }

/* Shared component interaction states. No data or navigation handlers are changed. */
.btn, .logbtn, .nav-toggle, .seg, .scorebtns button { border-color: var(--control-border); }
input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea,
.scout-search input, .scout-search select, #disc-filters input, #disc-filters select,
.ca-sec input:not([type=checkbox]), .ca-sec select, .ca-sec textarea {
  border-color: var(--control-border); border-radius: var(--r-control);
}
.ca-comp, .ca-score { border-radius: var(--r); }
.btn:not(:disabled):hover, .logbtn:not(:disabled):hover, .scorebtns button:not(:disabled):hover {
  background: var(--surface-2); border-color: var(--accent); color: var(--ink);
}
.btn.primary:not(:disabled):hover, .scorebtns button[aria-pressed=true]:hover,
.seg button[aria-pressed=true]:hover { background: var(--accent); color: var(--accent-ink); filter: brightness(.94); }
.btn.ghost { background: transparent; border-color: transparent; color: var(--accent); }
.btn.danger { color: var(--bad); border-color: var(--bad); }
.btn.danger:not(:disabled):hover { color: var(--bad); background: var(--bad-soft); }
button:not(:disabled):active, a.btn:active { box-shadow: inset 0 0 0 2px currentColor; }
button:disabled, .btn:disabled { opacity: 1; color: var(--muted); background: var(--surface-2); border-color: var(--line); cursor: not-allowed; }
.seg button:not(:disabled):hover { background: var(--accent-soft); color: var(--accent); }
.tabs button[aria-current=page] { border-radius: var(--r-control); }
.b { border-radius: var(--r-control); }
.empty { background: var(--surface-2); border-radius: var(--r); }
input:user-invalid, textarea:user-invalid { border-color: var(--bad); }
.num, .mono, .kpi .v, .ca-num, .market-facts dd, .r { font-variant-numeric: tabular-nums; }
.vs-map .leaflet-bar a { background: var(--surface); color: var(--ink); border-color: var(--line); }
.vs-map a.leaflet-popup-close-button { color: var(--ink-2); }
.vs-map .leaflet-bar a:hover { background: var(--surface-2); }
@media(prefers-reduced-motion:no-preference) {
  .btn, .tabs button, .logbtn, .seg button, .scorebtns button, input, select, textarea {
    transition: background-color .18s ease, border-color .18s ease, color .18s ease;
  }
}
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }