/* ============================================================================
   HitchAI — Opportunities module (browse grid + pipeline boards).
   Tokens come from ../explorer/hitch-tokens.css; only module-local additions
   are declared here. Ported from mockups/opportunities.html and made real.
   ========================================================================== */
:root { --blue: #6fb0e8; --field: #0c0e11; }
/* (the dimmer --ink-dim/--ink-faint contrast pilot was promoted into the
   shared hitch-tokens.css on 2026-07-13 — no opps-local override needed) */
/* appearance.js toggles body.light and overrides the shared tokens; the
   module-local ones flip here so form fields and chips stay readable */
body.light { --field: #fffdf8; --blue: #2b6cb0; }
body.light .topbar { background: linear-gradient(90deg, #fffdf8, #f5f2ea); }
body.light thead th { background: #efeadd; }

* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { background: var(--bg); color: var(--ink); font-family: var(--sans); font-weight: 300; min-height: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; background: none; border: none; }
::selection { background: rgba(232, 161, 60, .3); }
.grain { position: fixed; inset: 0; z-index: 1; pointer-events: none; opacity: .04;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="240" height="240"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency=".9" numOctaves="2"/></filter><rect width="240" height="240" filter="url(%23n)"/></svg>'); }
.app { position: relative; z-index: 2; display: flex; flex-direction: column; min-height: 100vh; }

/* ---------- topbar (explorer shell) ---------- */
.topbar { display: flex; align-items: center; gap: 14px; padding: 12px 20px; border-bottom: 1px solid var(--line-soft); background: linear-gradient(90deg, #0c0d10, #0a0b0d); position: sticky; top: 0; z-index: 30; }
.brand { font-family: var(--serif); font-size: 1.45rem; letter-spacing: .01em; white-space: nowrap; }
.brand b { color: var(--accent); font-style: italic; font-weight: 400; }
.modnav { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.viewnav__btn { font-family: var(--mono); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 4px 11px; white-space: nowrap; transition: color .2s, border-color .2s, background .2s; }
.viewnav__btn:hover { color: var(--ink); border-color: var(--ink-dim); }
.viewnav__btn.on { background: var(--accent); border-color: var(--accent); color: #1a1206; }
.topbar__spacer { flex: 1; }
.fresh-pill { display: inline-flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: .6rem; letter-spacing: .08em; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 4px 11px; white-space: nowrap; }
.fresh-pill .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); animation: pulse 2s infinite; }
.fresh-pill .samplechip { font-size: .52rem; letter-spacing: .12em; color: var(--blue); border: 1px dashed rgba(111, 176, 232, .5); border-radius: 4px; padding: 1px 5px; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

/* account chip (mounted by store.js) */
.acctbar { display: flex; align-items: center; gap: .5rem; margin-left: .3rem; }
.acctbar__chip { display: inline-flex; align-items: center; gap: .45rem; font-size: .78rem; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: .35rem .8rem; background: none; cursor: pointer; white-space: nowrap; }
.acctbar__chip:hover { color: var(--ink); border-color: var(--ink-dim); }
.acctbar__plan { font-family: var(--mono); font-size: .56rem; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); border: 1px solid rgba(232, 161, 60, .5); border-radius: 5px; padding: .05rem .35rem; }
@media (max-width: 1180px) { .acctbar { display: none; } }

/* ---------- workspace ---------- */
.workspace { display: grid; grid-template-columns: 284px 1fr; flex: 1; min-height: 0; }
.rail { border-right: 1px solid var(--line-soft); background: var(--bg-soft); padding: 16px 14px 40px; overflow-y: auto; max-height: calc(100vh - 57px); position: sticky; top: 57px; }
.rail h3 { font-family: var(--mono); font-size: .6rem; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); font-weight: 500; margin: 20px 0 9px; }
.rail h3:first-child { margin-top: 2px; }
.rail h3 small { color: var(--ink-faint); letter-spacing: .06em; text-transform: none; float: right; font-weight: 400; }

/* rail pipeline cards (both views) */
.plcard { border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; margin-bottom: 7px; cursor: pointer; transition: border-color .2s; position: relative; }
.plcard:hover { border-color: var(--ink-dim); }
.plcard.on { border-color: rgba(232, 161, 60, .55); background: rgba(232, 161, 60, .07); }
.plcard b { display: block; font-size: .82rem; font-weight: 500; color: var(--ink); padding-right: 26px; }
.plcard small { color: var(--ink-faint); font-size: .68rem; line-height: 1.45; display: block; margin-top: 2px; }
.bdanger { margin-left: 0; }
.bdanger:hover { color: var(--warn) !important; border-color: rgba(224, 123, 123, .5); }
.newpl { width: 100%; border: 1px dashed var(--line); border-radius: 10px; padding: 7px; color: var(--ink-faint); font-size: .72rem; font-family: var(--mono); letter-spacing: .06em; transition: .2s; }
.newpl:hover { border-color: var(--accent); color: var(--accent); }
.plsync { font-family: var(--mono); font-size: .58rem; color: var(--ink-faint); letter-spacing: .05em; line-height: 1.6; margin-top: 8px; }
.plsync a { color: var(--ink-dim); border-bottom: 1px dotted var(--ink-faint); }
.plsync a:hover { color: var(--accent); }

/* the lens block (rail top): reuses the .tgrow toggles; the edit line matches .plsync */
.lensedit { font-family: var(--mono); font-size: .58rem; color: var(--ink-faint); letter-spacing: .05em; line-height: 1.6; margin: 6px 0 2px; }
.lensedit a { color: var(--ink-dim); border-bottom: 1px dotted var(--ink-faint); }
.lensedit a:hover { color: var(--accent); }

/* filters */
.fgroup { margin-bottom: 13px; }
.fgroup label { display: block; font-family: var(--mono); font-size: .56rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 6px; }
.tgrow { display: flex; flex-wrap: wrap; gap: 4px; }
.tg { background: transparent; border: 1px solid var(--line); color: var(--ink-dim); border-radius: 7px; padding: 3px 8px; font-family: var(--mono); font-size: .64rem; transition: .15s; white-space: nowrap; }
.tg:hover { color: var(--ink); border-color: var(--ink-dim); }
.tg.on { background: var(--accent); border-color: var(--accent); color: #1a1206; }
.tg small { opacity: .65; margin-left: 3px; }
select.fsel { width: 100%; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 6px 9px; font-size: .78rem; font-family: var(--sans); font-weight: 300; }
select.fsel:focus { outline: none; border-color: var(--accent); }

/* ---------- rail: quick toggles + top group ---------- */
.qtoggles { display: flex; gap: 6px; margin: 4px 0 14px; }
.qtog { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 5px; background: var(--field); border: 1px solid var(--line); color: var(--ink-dim); border-radius: 9px; padding: 7px 8px; font-size: .72rem; font-weight: 400; transition: .15s; white-space: nowrap; }
.qtog:hover { color: var(--ink); border-color: var(--ink-dim); }
.qtog.on { background: rgba(232, 161, 60, .13); border-color: var(--accent); color: var(--accent-soft); }
.qtog small { font-family: var(--mono); font-size: .62rem; opacity: .7; }

/* ---------- rail: filters header + reset ---------- */
.railhead { display: flex; align-items: baseline; justify-content: space-between; margin: 20px 0 10px; }
.railhead h3 { margin: 0; }
.railreset { font-family: var(--mono); font-size: .58rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-faint); border-bottom: 1px dotted var(--ink-faint); transition: .15s; }
.railreset:hover { color: var(--accent); border-color: var(--accent); }

/* ---------- reusable multi-select filter picker ---------- */
.fpick { position: relative; margin-bottom: 11px; }
.fpick > label { display: block; font-family: var(--mono); font-size: .56rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 5px; }
.fpbtn { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 9px; padding: 8px 11px; font-size: .78rem; font-weight: 300; transition: .15s; text-align: left; }
.fpbtn:hover { border-color: var(--ink-dim); }
.fpbtn.has { border-color: var(--accent); background: rgba(232, 161, 60, .07); }
.fpick.open .fpbtn { border-color: var(--accent); }
.fpsum { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fpsum b { font-family: var(--mono); font-size: .64rem; color: var(--accent-soft); font-weight: 500; }
.fpcar { flex: 0 0 auto; color: var(--ink-faint); font-size: .7rem; transition: transform .15s; }
.fpick.open .fpcar { transform: rotate(180deg); color: var(--accent); }
.fppop { position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + 5px); background: var(--panel); border: 1px solid var(--line); border-radius: 11px; box-shadow: 0 16px 40px rgba(0,0,0,.42); padding: 8px; }
.fpsearch { width: 100%; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px; font-size: .76rem; font-weight: 300; margin-bottom: 7px; }
.fpsearch:focus { outline: none; border-color: var(--accent); }
.fplist { max-height: 264px; overflow-y: auto; display: flex; flex-direction: column; gap: 1px; }
.fpopt { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 7px; cursor: pointer; transition: background .12s; }
.fpopt:hover { background: rgba(127, 127, 127, .1); }
.fpopt.on { background: rgba(232, 161, 60, .12); }
.fpchk { flex: 0 0 14px; width: 14px; text-align: center; color: var(--accent); font-size: .72rem; }
.fpol { flex: 1; font-size: .77rem; color: var(--ink-dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fpopt.on .fpol { color: var(--ink); }
.fpol em { color: var(--ink-faint); font-style: normal; font-size: .72rem; }
.fpn { flex: 0 0 auto; font-family: var(--mono); font-size: .62rem; color: var(--ink-faint); }
.fpempty { padding: 8px 10px; font-size: .74rem; color: var(--ink-faint); font-style: italic; }
.fpclear { display: block; width: 100%; margin-top: 6px; padding: 5px; border-top: 1px solid var(--line-soft); font-family: var(--mono); font-size: .62rem; letter-spacing: .06em; color: var(--ink-faint); transition: .15s; }
.fpclear:hover { color: var(--accent); }

/* ---------- agency canonical tree (inside the agency popover) ---------- */
.agtree { max-height: 300px; overflow-y: auto; margin-top: 2px; }
.agnode { display: flex; align-items: center; gap: 2px; padding: 4px 6px; border-radius: 7px; cursor: pointer; line-height: 1.4; transition: background .12s; }
.agnode:hover { background: rgba(127, 127, 127, .1); }
.agnode.sel { background: rgba(232, 161, 60, .12); }
.agtog { flex: 0 0 15px; width: 15px; text-align: center; color: var(--ink-faint); font-size: .66rem; user-select: none; }
.agtog-none { visibility: hidden; }
.agchk { flex: 0 0 12px; width: 12px; text-align: center; color: var(--accent); font-size: .7rem; }
.agpick { flex: 1; font-size: .77rem; color: var(--ink-dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agnode.sel .agpick { color: var(--ink); }
.agacr { color: var(--ink-faint); font-size: .68rem; }
.agcrumb { color: var(--ink-faint); font-size: .68rem; font-style: italic; opacity: .8; }
.agn { flex: 0 0 auto; font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); }
.agempty { padding: 8px 10px; font-size: .74rem; color: var(--ink-faint); font-style: italic; }

/* ---------- save search + toast ---------- */
.savesearch { width: 100%; margin-top: 16px; border: 1px dashed var(--line); border-radius: 10px; padding: 9px; color: var(--ink-dim); font-size: .74rem; font-family: var(--mono); letter-spacing: .05em; transition: .2s; }
.savesearch:hover { border-color: var(--accent); color: var(--accent); background: rgba(232, 161, 60, .05); }
.opps-toast { position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 9999; background: var(--panel); border: 1px solid var(--accent); color: var(--ink); font-size: .82rem; padding: 11px 18px; border-radius: 11px; box-shadow: 0 14px 40px rgba(0,0,0,.4); opacity: 1; transition: opacity .4s, transform .4s; }
.opps-toast.out { opacity: 0; transform: translateX(-50%) translateY(8px); }

/* ---------- main ---------- */
.main { padding: 22px 26px 70px; min-width: 0; max-width: 1440px; }
.headrow { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.headrow h1 { font-family: var(--serif); font-weight: 400; font-size: 2.15rem; letter-spacing: .005em; }
.headrow h1 em { color: var(--accent); font-style: italic; }
.headrow .lead { color: var(--ink-dim); font-size: .86rem; margin-top: 4px; max-width: 56ch; }
.fresh { font-family: var(--mono); font-size: .62rem; color: var(--ink-faint); letter-spacing: .05em; text-align: right; line-height: 1.8; }
.fresh b { color: var(--ink-dim); font-weight: 500; }

/* what's-new strip */
.wnew { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 18px 0 0; border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: 10px; background: var(--panel); padding: 10px 14px; }
.wnew .pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); animation: pulse 2s infinite; flex: none; }
.wnew .cap { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.wnchip { font-size: .74rem; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 3px 11px; transition: .15s; }
.wnchip b { color: var(--ink); font-weight: 500; }
.wnchip:hover { border-color: var(--accent); color: var(--ink); }

/* KPI band */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 9px; margin: 14px 0 0; }
.kpi { border: 1px solid var(--line); border-radius: 10px; background: var(--panel); padding: 11px 13px; }
.kpi .l { font-family: var(--mono); font-size: .55rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); }
.kpi .v { font-family: var(--serif); font-size: 1.7rem; margin-top: 3px; font-variant-numeric: tabular-nums; }
.kpi .d { font-size: .68rem; color: var(--ink-faint); margin-top: 1px; }
.kpi.hot .v { color: var(--accent); }
.kpi.ctx { opacity: .75; }

/* triage row */
.triage { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin: 16px 0 0; }
.triage .cap { font-family: var(--mono); font-size: .56rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-faint); margin-right: 2px; }
.vchip { display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 3px 11px; transition: .15s; }
.vchip:hover { border-color: var(--ink-dim); color: var(--ink); }
.vchip.on { border-color: var(--accent); color: var(--ink); background: rgba(232, 161, 60, .1); }
.vdot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.vdot.relevant { background: var(--good); }
.vdot.review { background: var(--accent); }
.vdot.noise { background: var(--ink-faint); }
.kwai { display: inline-flex; align-items: center; gap: 3px; font-family: var(--mono); font-size: .5rem; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); border: 1px solid rgba(232, 161, 60, .4); border-radius: 4px; padding: 1px 4px; margin-left: 4px; vertical-align: 1px; }

/* table */
.tablewrap { margin-top: 12px; border: 1px solid var(--line); border-radius: 11px; overflow: hidden; background: var(--panel); }
.tabletools { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap; }
/* the search box only — not the checkboxes nested in the column chooser */
.tabletools > input { flex: 1; min-width: 180px; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 6px 11px; font-size: .8rem; font-weight: 300; }
.tabletools > input:focus { outline: none; border-color: var(--accent); }
.tabletools > input::placeholder { color: var(--ink-faint); }
.tabletools .count { font-family: var(--mono); font-size: .62rem; color: var(--ink-faint); letter-spacing: .05em; white-space: nowrap; }
/* column chooser: a small popover anchored to the "Columns" button */
.colpick { position: relative; }
.colbtn { background: var(--field); color: var(--ink-dim); border: 1px solid var(--line); border-radius: 8px; padding: 5px 10px; font-size: .68rem; font-family: var(--mono); letter-spacing: .04em; cursor: pointer; white-space: nowrap; }
.colbtn:hover { border-color: var(--accent); color: var(--ink); }
.colmenu { display: none; position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 7px; min-width: 168px; box-shadow: 0 12px 34px rgba(0,0,0,.4); }
.colmenu.open { display: block; }
.colopt { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 6px; font-size: .74rem; color: var(--ink-dim); cursor: pointer; white-space: nowrap; }
.colopt:hover { background: rgba(232, 161, 60, .08); color: var(--ink); }
.colopt input { flex: none; width: 13px; height: 13px; margin: 0; accent-color: var(--accent); cursor: pointer; }
.tscroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
thead th { position: sticky; top: 0; background: #0e1115; z-index: 2; font-family: var(--mono); font-size: .56rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-dim); font-weight: 500; text-align: left; padding: 8px 11px; border-bottom: 1px solid var(--line); white-space: nowrap; }
thead th.sorth { cursor: pointer; user-select: none; transition: color .12s; }
thead th.sorth:hover { color: var(--ink); }
thead th.sorth.on { color: var(--accent); }
thead th.sorth .caret { display: inline-block; margin-left: 4px; font-size: .7rem; letter-spacing: 0; }
tbody td { padding: 8px 11px; border-bottom: 1px solid var(--line-soft); font-size: .78rem; vertical-align: top; }
tbody tr { cursor: pointer; transition: background .12s; }
tbody tr:hover { background: rgba(232, 161, 60, .07); }
tbody tr.sel { background: rgba(232, 161, 60, .12); }
td.posted { font-family: var(--mono); font-size: .66rem; color: var(--ink-faint); white-space: nowrap; }
.typechip { font-family: var(--mono); font-size: .56rem; letter-spacing: .06em; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 5px; padding: 2px 6px; white-space: nowrap; }
.typechip.award { color: var(--good); border-color: rgba(107, 191, 89, .35); }
.typechip.recompete { color: var(--blue); border-color: rgba(111, 176, 232, .35); }
.typechip.ota { color: #b592e0; border-color: rgba(155, 130, 224, .40); }
/* PIEE-only: open on DoD's PIEE and not synopsized on SAM.gov — the
   scarcest inventory in the grid, so it reads as a find, not a warning */
.typechip.piee { color: var(--warn, #d9a441); border-color: rgba(217, 164, 65, .38); }
.srcchip { font-family: var(--mono); font-size: .5rem; letter-spacing: .06em; color: var(--warn, #d9a441);
  border: 1px solid rgba(217, 164, 65, .3); border-radius: 4px; padding: 1px 4px; margin-left: 6px; white-space: nowrap; }
/* GAO protest signals: a pending protest reads hot (the award is in flux);
   a sustained one reads as a win (the decision did not stand); history is dim */
.typechip.protest { color: var(--warn); border-color: rgba(224, 123, 123, .45); }
.protflag { white-space: nowrap; }
.protflag.on { color: var(--warn); }
.protflag.win { color: var(--good); }
.protsum { font-size: .8rem; color: var(--ink-dim); margin-bottom: 6px; }
.protrow { display: flex; align-items: baseline; gap: 8px; padding: 6px 0; border-top: 1px solid var(--line); font-size: .78rem; }
.protrow .pp { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }
.protrow .pchip { font-family: var(--mono); font-size: .55rem; letter-spacing: .05em; border: 1px solid var(--line); border-radius: 5px; padding: 1px 6px; color: var(--ink-dim); white-space: nowrap; }
.protrow .pchip.pending { color: var(--warn); border-color: rgba(224, 123, 123, .45); }
.protrow .pchip.sustained, .protrow .pchip.granted { color: var(--good); border-color: rgba(107, 191, 89, .35); }
.protrow .pm { color: var(--ink-faint); font-size: .68rem; white-space: nowrap; }
.protfoot { margin-top: 8px; font-size: .65rem; color: var(--ink-faint); line-height: 1.5; }
td.title { min-width: 300px; max-width: 520px; }
td.title .t { color: var(--ink); font-weight: 400; line-height: 1.4; }
td.title .t mark { background: rgba(232, 161, 60, .16); color: var(--accent-soft); border-radius: 3px; padding: 0 2px; }
td.title .sub { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); margin-top: 2px; }
.sollink { color: var(--accent-soft); text-decoration: none; }
.sollink:hover { text-decoration: underline; color: var(--accent); }
td.agency { color: var(--ink-dim); font-size: .72rem; max-width: 170px; }
td.agency small { display: block; color: var(--ink-faint); font-size: .62rem; }
td.sa { font-family: var(--mono); font-size: .62rem; color: var(--ink-dim); white-space: nowrap; }
.ddl { font-family: var(--mono); font-size: .64rem; white-space: nowrap; border-radius: 6px; padding: 2px 7px; border: 1px solid var(--line); color: var(--ink-dim); }
.ddl.warn { color: var(--accent); border-color: rgba(232, 161, 60, .45); }
.ddl.hot { color: var(--warn); border-color: rgba(224, 123, 123, .45); }
.ddl.done { color: var(--ink-faint); border-style: dashed; }
/* an ESTIMATE is never styled like an actual date: dashed border, tilde text */
.ddl.est { color: var(--accent-soft); border-style: dashed; border-color: rgba(232, 161, 60, .4); font-style: italic; }
td.val { font-family: var(--mono); font-size: .68rem; white-space: nowrap; }
.vcell { color: var(--ink); }
.vcell.dim { color: var(--ink-faint); }
.vcell.yours { color: var(--blue); border-bottom: 1px dotted rgba(111, 176, 232, .5); }
td.leadcell { text-align: center; }
td.actcell { max-width: 160px; overflow: hidden; }
.actchip { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; font-family: var(--mono); font-size: .58rem; letter-spacing: .04em; border-radius: 6px; padding: 2px 7px; white-space: nowrap; border: 1px solid var(--line); color: var(--ink-dim); }
.actchip.now { color: var(--good); border-color: rgba(107, 191, 89, .45); background: rgba(107, 191, 89, .07); }
.actchip.digest { color: var(--accent-soft); border-color: rgba(232, 161, 60, .35); }
.actchip.intel { color: var(--ink-faint); border-style: dashed; }
.actchip.gated { color: var(--ink-faint); border-style: dashed; text-decoration: line-through; }
/* position band — "how you stand", a small tag ahead of the action chip */
.postag { display: inline-block; vertical-align: middle; margin-right: 5px; font-family: var(--mono); font-size: .54rem; letter-spacing: .05em; text-transform: uppercase; border-radius: 6px; padding: 2px 6px; white-space: nowrap; border: 1px solid var(--line); color: var(--ink-dim); cursor: default; }
.postag.favorite, .postag.defend { color: var(--good); border-color: rgba(107, 191, 89, .45); background: rgba(107, 191, 89, .07); }
.postag.contender { color: var(--accent-soft); border-color: rgba(232, 161, 60, .35); }
.postag.sub { color: var(--accent-soft); border-color: rgba(232, 161, 60, .3); border-style: dashed; }
.postag.longshot { color: var(--ink-faint); border-style: dashed; }
.postag.locked { color: var(--ink-faint); border-style: dashed; text-decoration: line-through; }
.leadstar { font-size: .85rem; color: var(--ink-faint); width: 28px; height: 28px; border-radius: 50%; transition: .15s; }
.leadstar:hover { color: var(--accent); background: rgba(232, 161, 60, .1); }
.leadstar.on { color: var(--accent); }
.amend { font-family: var(--mono); font-size: .52rem; letter-spacing: .08em; color: var(--blue); border: 1px solid rgba(111, 176, 232, .4); border-radius: 4px; padding: 1px 5px; margin-left: 6px; vertical-align: 2px; }
/* add-to-pipeline, from the grid — sits beside the watch star */
td.pipecell { text-align: center; }
.pipeadd { font-size: .8rem; color: var(--ink-faint); width: 28px; height: 28px; border-radius: 50%; transition: .15s; }
.pipeadd:hover { color: var(--accent); background: rgba(232, 161, 60, .1); }
.pipeadd.on { color: var(--accent); }
.pipemenu { display: none; position: fixed; z-index: 60; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 7px; min-width: 208px; max-width: 300px; box-shadow: 0 12px 34px rgba(0,0,0,.4); }
.pipemenu.open { display: block; }
.pipemsg { font-family: var(--mono); font-size: .54rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-faint); padding: 4px 8px 7px; }
.pipeopt { display: flex; align-items: center; gap: 8px; width: 100%; padding: 6px 8px; border-radius: 6px; font-size: .76rem; color: var(--ink-dim); text-align: left; transition: .15s; }
.pipeopt:hover { background: rgba(232, 161, 60, .08); color: var(--ink); }
.pipeopt .pk { flex: none; width: 13px; color: var(--ink-faint); font-size: .7rem; }
.pipeopt.on .pk { color: var(--accent); }
.pipeopt .pn { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pipeopt .pstage { flex: none; font-family: var(--mono); font-size: .52rem; letter-spacing: .06em; color: var(--accent); }
.pipeopt.newpl { border-top: 1px solid var(--line-soft); margin-top: 4px; padding-top: 8px; border-radius: 0 0 6px 6px; }
.pipenew { display: flex; gap: 6px; padding: 6px 4px 2px; border-top: 1px solid var(--line-soft); margin-top: 4px; }
.pipenew input { flex: 1; min-width: 0; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 5px 9px; font-size: .74rem; font-weight: 300; }
.pipenew input:focus { outline: none; border-color: var(--accent); }
.stagechip { font-family: var(--mono); font-size: .52rem; letter-spacing: .08em; color: var(--accent); border: 1px solid rgba(232, 161, 60, .4); border-radius: 4px; padding: 1px 6px; margin-left: 6px; vertical-align: 2px; white-space: nowrap; }
.srcline { font-size: .68rem; color: var(--ink-faint); margin-top: 10px; line-height: 1.6; }
.srcline a { color: var(--ink-dim); border-bottom: 1px dotted var(--ink-faint); }
.srcline a:hover { color: var(--accent); }
.empty { padding: 34px; text-align: center; color: var(--ink-faint); font-size: .8rem; }

/* ---------- slide-over detail ---------- */
.scrim { position: fixed; inset: 0; background: rgba(5, 6, 8, .55); z-index: 40; opacity: 0; pointer-events: none; transition: opacity .3s; }
body.open .scrim { opacity: 1; pointer-events: auto; }
.sheet { position: fixed; top: 0; right: 0; height: 100%; width: 500px; max-width: 96vw; background: var(--bg-soft); border-left: 1px solid var(--line); z-index: 41; transform: translateX(103%); transition: transform .3s var(--ease); display: flex; flex-direction: column; }
body.open .sheet { transform: translateX(0); }
.sheet__head { padding: 16px 20px 14px; border-bottom: 1px solid var(--line-soft); position: relative; }
.sheet__meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 9px; }
.sheet__title { font-family: var(--serif); font-size: 1.25rem; line-height: 1.3; font-weight: 400; }
.sheet__sol { font-family: var(--mono); font-size: .64rem; color: var(--ink-faint); margin-top: 6px; letter-spacing: .04em; }
.sheet__close { position: absolute; top: 12px; right: 14px; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); color: var(--ink-dim); font-size: .85rem; transition: .2s; }
.sheet__close:hover { color: var(--ink); border-color: var(--ink-dim); }
.sheet__body { flex: 1; overflow-y: auto; padding: 16px 20px 20px; }
.sheet__body h4 { font-family: var(--mono); font-size: .56rem; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); font-weight: 500; margin: 18px 0 8px; }
.sheet__body h4:first-child { margin-top: 0; }
.ddlbar { display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 9px; padding: 9px 12px; background: var(--panel); }
.ddlbar .big { font-family: var(--serif); font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.ddlbar .big.hot { color: var(--warn); }
.ddlbar .big.warn { color: var(--accent); }
.ddlbar .big.est { color: var(--accent-soft); font-style: italic; font-size: 1.1rem; }
.ddlbar small { color: var(--ink-faint); font-size: .68rem; line-height: 1.45; }
.aiblock { border: 1px solid rgba(232, 161, 60, .3); border-radius: 9px; padding: 10px 12px; background: rgba(232, 161, 60, .05); }
.aiblock .verdictrow { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
.aiblock .verdictrow b { font-size: .8rem; font-weight: 500; text-transform: capitalize; }
.aiblock p { font-size: .76rem; color: var(--ink-dim); line-height: 1.55; }
.metagrid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line-soft); border: 1px solid var(--line-soft); border-radius: 9px; overflow: hidden; }
.metagrid div { background: var(--panel); padding: 8px 11px; }
.metagrid .k { font-family: var(--mono); font-size: .52rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-faint); display: block; margin-bottom: 2px; }
.metagrid .val { font-size: .76rem; color: var(--ink); font-weight: 300; word-break: break-word; }
.metagrid .span2 { grid-column: 1 / -1; }
.pend { border: 1px dashed var(--line); border-radius: 9px; padding: 11px 13px; color: var(--ink-faint); font-size: .74rem; line-height: 1.55; }
.descblock { font-size: .78rem; color: var(--ink-dim); line-height: 1.6; white-space: pre-wrap; }
.pend a { color: var(--ink-dim); border-bottom: 1px dotted var(--ink-faint); }
.pend a:hover { color: var(--accent); }
.crow { display: flex; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--line-soft); padding: 7px 2px; font-size: .75rem; }
.crow:last-child { border-bottom: none; }
.crow .nm { color: var(--ink); }
.crow .em { font-family: var(--mono); font-size: .64rem; color: var(--ink-faint); text-align: right; word-break: break-all; }
.vrow { display: flex; align-items: baseline; gap: 9px; padding: 6px 2px; border-bottom: 1px solid var(--line-soft); font-size: .72rem; }
.vrow:last-child { border-bottom: none; }
.vrow .vtag { font-family: var(--mono); font-size: .56rem; color: var(--accent); border: 1px solid rgba(232, 161, 60, .35); border-radius: 4px; padding: 1px 6px; flex: none; }
.vrow .when { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); flex: none; }
.vrow .chg { color: var(--ink-dim); }
.awardbox { border: 1px solid rgba(107, 191, 89, .3); border-radius: 9px; padding: 11px 13px; background: rgba(107, 191, 89, .05); margin-bottom: 6px; }
.awardbox:last-of-type { margin-bottom: 0; }
.incbox { border: 1px solid rgba(111, 176, 232, .35); border-radius: 9px; padding: 10px 13px; background: rgba(111, 176, 232, .05); margin-bottom: 6px; }
.incbox .to { font-size: .82rem; color: var(--ink); font-weight: 400; }
.incbox small { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); display: block; margin-top: 4px; }
.awardbox .amt { font-family: var(--serif); font-size: 1.5rem; color: var(--good); }
.awardbox .to { font-size: .8rem; color: var(--ink); margin-top: 2px; }
.awardbox small { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); display: block; margin-top: 5px; }
.xlink { display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 9px; padding: 8px 11px; margin-bottom: 6px; transition: .15s; cursor: pointer; }
.xlink:hover { border-color: var(--accent); }
.xlink .mod { font-family: var(--mono); font-size: .52rem; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); border: 1px solid rgba(232, 161, 60, .35); border-radius: 4px; padding: 2px 6px; flex: none; }
.xlink .what { font-size: .74rem; color: var(--ink-dim); line-height: 1.4; }
.xlink .arrow { margin-left: auto; color: var(--ink-faint); font-size: .8rem; }
.sheet__foot { display: flex; gap: 8px; padding: 13px 20px; border-top: 1px solid var(--line-soft); background: var(--bg-soft); }
.btn { display: inline-flex; align-items: center; gap: .45rem; background: var(--accent); border: 1px solid var(--accent); color: #1a1206; border-radius: 100px; padding: 7px 16px; font-weight: 500; font-size: .8rem; transition: .25s; }
.btn:hover { background: var(--accent-soft); }
.btn.ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.btn.ghost:hover { border-color: var(--ink-dim); background: transparent; }

/* actionability (sheet block + profile card) */
.actblock { border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; background: var(--panel); }
.actblock.now { border-color: rgba(107, 191, 89, .45); background: rgba(107, 191, 89, .05); }
.actblock.gated { border-style: dashed; }
.actblock .actline { display: flex; align-items: baseline; gap: 10px; }
.actblock .actline b { font-size: .84rem; font-weight: 500; }
.actblock.now .actline b { color: var(--good); }
.actblock .actscore { margin-left: auto; font-family: var(--serif); font-size: 1.15rem; color: var(--ink-dim); font-variant-numeric: tabular-nums; }
.actblock p { font-size: .74rem; color: var(--ink-faint); margin-top: 4px; }
.factors { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.factor { font-size: .68rem; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 2px 9px; cursor: default; }
.factor b { color: var(--ink); font-weight: 500; }
.factor.pos { border-color: rgba(107, 191, 89, .3); }
.factor.pos b { color: var(--good); }
.actcard.now { border-color: rgba(107, 191, 89, .45); background: rgba(107, 191, 89, .04); }
.actcard.gated, .actcard.none { border-style: dashed; }
.actcard .actverdict { font-family: var(--serif); font-size: 1.35rem; font-weight: 400; }
.actcard.now .actverdict { color: var(--good); }
.actcard.gated .actverdict, .actcard.none .actverdict { color: var(--ink-faint); }
.actcard .actends { font-family: var(--mono); font-size: .62rem; color: var(--ink-faint); margin-top: 4px; letter-spacing: .03em; }
/* position line on the detail action card — band label + the "why" */
.actpos { margin-top: 6px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.actpos .posband { font-family: var(--mono); font-size: .58rem; letter-spacing: .05em; text-transform: uppercase; border-radius: 6px; padding: 2px 8px; border: 1px solid var(--line); color: var(--ink-dim); }
.actpos.favorite .posband, .actpos.defend .posband { color: var(--good); border-color: rgba(107, 191, 89, .45); background: rgba(107, 191, 89, .07); }
.actpos.contender .posband, .actpos.sub .posband { color: var(--accent-soft); border-color: rgba(232, 161, 60, .35); }
.actpos.longshot .posband, .actpos.locked .posband { color: var(--ink-faint); border-style: dashed; }
.actpos .poswhy { font-size: .72rem; color: var(--ink-faint); }

/* pipeline section inside the slide-over + profile page */
.plsect { border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; background: var(--panel); }
.plsect.bare { border: none; background: none; padding: 0; }
.plsect .plrow { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.plsect select { flex: 1; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 5px 8px; font-size: .74rem; font-family: var(--sans); font-weight: 300; }
.plsect select:focus { outline: none; border-color: var(--accent); }
.stagerow { display: flex; flex-wrap: wrap; gap: 5px; }
.stage { font-family: var(--mono); font-size: .6rem; letter-spacing: .08em; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 3px 10px; transition: .15s; white-space: nowrap; }
.stage:hover { color: var(--ink); border-color: var(--ink-dim); }
.stage.on { background: var(--accent); border-color: var(--accent); color: #1a1206; }
.plsect .plmeta { font-family: var(--mono); font-size: .58rem; color: var(--ink-faint); letter-spacing: .05em; margin-top: 8px; line-height: 1.6; }
.plsect .plremove { color: var(--ink-faint); font-size: .66rem; border-bottom: 1px dotted var(--ink-faint); margin-left: 8px; }
.plsect .plremove:hover { color: var(--warn); }

/* ---------- pipeline board (kanban) ---------- */
/* board + manage own the full width: the app rail hides */
body.boardmode .workspace { grid-template-columns: 1fr; }
body.boardmode .rail { display: none; }

/* the pipeline selector tabs (top of the board) */
.pltabs { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-bottom: 14px; }
.pltab { font-size: .78rem; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 5px 14px; transition: .15s; display: inline-flex; align-items: center; gap: 7px; }
.pltab small { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); }
.pltab:hover { color: var(--ink); border-color: var(--ink-dim); }
.pltab.on { background: var(--accent); border-color: var(--accent); color: #1a1206; }
.pltab.on small { color: rgba(26, 18, 6, .7); }
.pltab.ghost { border-style: dashed; color: var(--ink-faint); }
.pltab.ghost:hover { color: var(--accent); border-color: var(--accent); }
.pltab-form { margin-top: 0; max-width: 260px; }
.boardsub { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); letter-spacing: .05em; margin-bottom: 10px; }
.boardsub b { color: var(--accent-soft); }
.scopeclear { color: var(--ink-faint); font-size: .66rem; width: 18px; height: 18px; border-radius: 50%; }
.scopeclear:hover { color: var(--warn); }

/* metrics + signals band under the board */
.pmetrics { margin-top: 18px; border-top: 1px solid var(--line-soft); padding-top: 14px; }
.pmcap { font-family: var(--mono); font-size: .58rem; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px; }
.sigs { margin-top: 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--panel); overflow: hidden; }
.sigrow { display: flex; align-items: baseline; gap: 10px; padding: 8px 13px; border-bottom: 1px solid var(--line-soft); font-size: .76rem; cursor: pointer; transition: background .12s; }
.sigrow:last-child { border-bottom: none; }
.sigrow:hover { background: rgba(232, 161, 60, .07); }
.sdot { width: 8px; height: 8px; border-radius: 50%; flex: none; align-self: center; }
.sdot.hot { background: var(--warn); box-shadow: 0 0 0 3px rgba(224, 123, 123, .15); }
.sdot.warn { background: var(--accent); }
.sdot.info { background: var(--ink-faint); }
.stext { color: var(--ink); font-weight: 400; white-space: nowrap; }
.stitle { color: var(--ink-faint); font-size: .68rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* manage page */
.mcard { max-width: 760px; margin-bottom: 14px; }
.stgedit { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 2px; }
.stgchip { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--line); border-radius: 8px; padding: 3px 6px; }
.stgname { font-family: var(--mono); font-size: .64rem; color: var(--ink); padding: 0 4px; }
.stgname small { color: var(--ink-faint); }
.stgmv, .stgx { color: var(--ink-faint); font-size: .68rem; width: 18px; height: 18px; border-radius: 5px; transition: .15s; display: inline-flex; align-items: center; justify-content: center; }
.stgmv:hover, .stgx:hover { color: var(--ink); background: rgba(244, 241, 234, .07); }
.stgx.danger:hover { color: var(--warn); }
.mcard .bconfirm { margin-top: 10px; }
.mcard .m-del { margin-left: 0; margin-top: 10px; display: inline-block; }

.boardhead { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.boardhead h1 { font-family: var(--serif); font-weight: 400; font-size: 2.15rem; }
.boardhead h1 em { color: var(--accent); font-style: italic; }
.boardhead .bcount { font-family: var(--mono); font-size: .62rem; color: var(--ink-faint); letter-spacing: .05em; }
.boardhead .brename { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); border-bottom: 1px dotted var(--ink-faint); margin-left: auto; }
.boardhead .brename:hover { color: var(--accent); }
.brename-input { font-family: var(--serif); font-size: 1.6rem; background: var(--field); color: var(--ink); border: 1px solid var(--accent); border-radius: 10px; padding: 4px 12px; min-width: 0; flex: 1; max-width: 440px; }
.brename-input:focus { outline: none; }
.bconfirm { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; border: 1px solid rgba(224, 123, 123, .45); border-radius: 10px; background: rgba(224, 123, 123, .06); padding: 10px 14px; font-size: .78rem; color: var(--ink-dim); }
.bconfirm b { color: var(--ink); }
.bconfirm input { background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px; font-size: .78rem; min-width: 180px; }
.bconfirm input:focus { outline: none; border-color: var(--warn); }
.bconfirm .bdel-go { background: var(--warn); border-color: var(--warn); color: #2a0e0e; }
.bconfirm .bdel-go:disabled { opacity: .4; cursor: not-allowed; }
.bd-npform { max-width: 320px; margin: 0 auto 12px; }
.board { display: flex; gap: 10px; margin-top: 4px; overflow-x: auto; align-items: flex-start; padding-bottom: 16px; }
.col { flex: 1 1 240px; min-width: 220px; background: var(--bg-soft); border: 1px solid var(--line-soft); border-radius: 12px; padding: 9px; min-height: 120px; transition: border-color .15s, background .15s; }
.col.dragover { border-color: var(--accent); background: rgba(232, 161, 60, .05); }
.col.sel { border-color: rgba(232, 161, 60, .5); }
.col__head { display: flex; align-items: center; gap: 7px; padding: 2px 4px 8px; cursor: pointer; }
.col__head:hover .col__name { color: var(--ink); }
.col__name { font-family: var(--mono); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-dim); font-weight: 500; }
.col__sum { font-family: var(--mono); font-size: .58rem; color: var(--accent-soft); margin-left: auto; }
.col__n { font-family: var(--mono); font-size: .58rem; color: var(--ink-faint); margin-left: auto; }
.col__sum + .col__n { margin-left: 6px; }
.col.won .col__name { color: var(--good); }
.col.lost .col__name { color: var(--warn); }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 9px 10px; margin-bottom: 7px; cursor: grab; transition: border-color .15s; }
.card:hover { border-color: var(--ink-dim); }
.card.dragging { opacity: .4; }
.card .ct { font-size: .74rem; color: var(--ink); line-height: 1.35; font-weight: 400; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card .cm { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 6px; font-family: var(--mono); font-size: .58rem; color: var(--ink-faint); }
.card .cm .ddl { font-size: .56rem; padding: 1px 6px; }
.card .cacts { display: flex; align-items: center; gap: 4px; margin-top: 7px; }
.card .cbtn { font-size: .68rem; color: var(--ink-faint); width: 24px; height: 24px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; transition: .15s; }
.card .cbtn:hover { color: var(--ink); background: rgba(244, 241, 234, .06); }
.card .cbtn.danger:hover { color: var(--warn); }
.card .cstage { margin-left: auto; background: var(--field); color: var(--ink-dim); border: 1px solid var(--line); border-radius: 6px; font-family: var(--mono); font-size: .58rem; padding: 2px 5px; max-width: 110px; }
.card .cnotes { width: 100%; margin-top: 7px; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 7px; padding: 6px 8px; font-size: .7rem; font-family: var(--sans); font-weight: 300; line-height: 1.45; resize: vertical; min-height: 52px; }
.card .cnotes:focus { outline: none; border-color: var(--accent); }
.card .notepeek { margin-top: 6px; font-size: .66rem; color: var(--ink-dim); line-height: 1.45; border-left: 2px solid var(--line); padding-left: 7px; white-space: pre-wrap; }
/* ---- capture: the compact line on a kanban card (migration 0031) ---- */
.card .ccap { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--line-soft); font-family: var(--mono); font-size: .55rem; color: var(--ink-faint); }
.card .ccap .cgate { text-transform: uppercase; letter-spacing: .08em; border: 1px solid var(--line); border-radius: 5px; padding: 1px 5px; color: var(--ink-dim); }
.card .ccap .cgate.pursue { color: var(--good); border-color: rgba(107, 191, 89, .45); }
.card .ccap .cgate.teammate { color: var(--accent); border-color: rgba(232, 161, 60, .45); }
.card .ccap .cgate.no_bid { color: var(--warn); border-color: rgba(217, 140, 95, .45); }
.card .ccap .cgate.rec { border-style: dashed; }
.card .ccap .cpw { color: var(--ink-dim); }
.card .ccap .cpw.prov { opacity: .75; }
.card .ccap .cq { color: var(--accent); }
.card .ccap .cst { color: var(--warn); }

.col .colempty { border: 1px dashed var(--line-soft); border-radius: 9px; padding: 14px 8px; text-align: center; font-size: .64rem; color: var(--ink-faint); font-family: var(--mono); letter-spacing: .05em; }
.showmore { width: 100%; border: 1px dashed var(--line); border-radius: 9px; padding: 6px; color: var(--ink-faint); font-size: .64rem; font-family: var(--mono); letter-spacing: .05em; transition: .15s; }
.showmore:hover { color: var(--accent); border-color: var(--accent); }
.boardsub { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.btools { margin-left: auto; display: inline-flex; gap: 6px; align-items: center; }
.btools .pltab.tgl { border-radius: 8px; padding: 4px 11px; font-size: .7rem; }
.boardempty { margin-top: 26px; border: 1px dashed var(--line); border-radius: 14px; padding: 46px 20px; text-align: center; color: var(--ink-dim); }
.boardempty h2 { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; margin-bottom: 8px; }
.boardempty p { font-size: .8rem; color: var(--ink-faint); max-width: 52ch; margin: 0 auto 16px; line-height: 1.6; }

/* ---------- opportunity profile (full page, ?opp=<key>) ---------- */
body.detailmode .workspace { grid-template-columns: 1fr; }
body.detailmode .rail { display: none; }
.backbtn { font-family: var(--mono); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 4px 12px; transition: .2s; margin-bottom: 18px; display: inline-flex; }
.backbtn:hover { color: var(--ink); border-color: var(--ink-dim); }
.hero { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; flex-wrap: wrap; padding-bottom: 18px; border-bottom: 1px solid var(--line-soft); }
.hero__meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.hero h1 { font-family: var(--serif); font-weight: 400; font-size: 2.35rem; line-height: 1.16; letter-spacing: .005em; max-width: 30ch; }
.hero__ids { font-family: var(--mono); font-size: .68rem; color: var(--ink-faint); margin-top: 10px; letter-spacing: .03em; line-height: 1.7; }
.hero__actions { display: flex; gap: 8px; align-items: flex-start; flex-wrap: wrap; }
.hero__main { flex: 1 1 300px; min-width: 0; }
.hero__ids b { color: var(--ink-dim); font-weight: 500; }
/* pipeline picker in the header — wraps to its own full-width row under the
   title/actions, set off by a hairline */
.hero__pipe { flex: 1 1 100%; display: flex; align-items: flex-start; gap: 12px; margin-top: 4px; padding-top: 14px; border-top: 1px solid var(--line-soft); }
.hero__pipe-label { flex: none; font-family: var(--mono); font-size: .58rem; letter-spacing: .13em; text-transform: uppercase; color: var(--accent); padding-top: 6px; }
.hero__pipe .plsect { flex: 1; min-width: 0; }
.hero__pipe .plsect .plrow { margin-bottom: 8px; }
.hero__pipe .plsect select { max-width: 280px; }
.hero__pipe .plsect .plmeta { margin-top: 6px; }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 9px; margin: 18px 0 22px; }
.fact { border: 1px solid var(--line); border-radius: 10px; background: var(--panel); padding: 11px 13px; }
.fact .l { font-family: var(--mono); font-size: .54rem; letter-spacing: .13em; text-transform: uppercase; color: var(--ink-faint); }
.fact .v { font-size: .92rem; color: var(--ink); margin-top: 4px; font-weight: 400; line-height: 1.35; }
.fact .v small { color: var(--ink-dim); font-size: .72rem; font-weight: 300; }
.fact.deadline { border-color: rgba(232, 161, 60, .4); background: rgba(232, 161, 60, .06); }
.fact.deadline .v { font-family: var(--serif); font-size: 1.5rem; color: var(--accent); font-variant-numeric: tabular-nums; }
.fact.est { border-style: dashed; }
.fact.est .v { color: var(--accent-soft); font-style: italic; }
/* ---- Key facts, the "situation console" (redesign; app.js keyFactsCard) ---- */
.kfcard .kf-read { font-family: var(--serif); font-size: 1.32rem; font-weight: 400; line-height: 1.5; letter-spacing: .005em; color: var(--ink); margin: 2px 0 16px; }
.kfcard .kf-read .rd-pos.favorite, .kfcard .kf-read .rd-pos.defend { color: var(--good); }
.kfcard .kf-read .rd-pos.contender { color: var(--accent-soft); }
.kfcard .kf-read .rd-pos.longshot, .kfcard .kf-read .rd-pos.sub { color: var(--ink-dim); }
.kfcard .kf-read .rd-pos.locked { display: none; }
.kf-situ { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.kf-tile { position: relative; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--field); padding: 12px 14px; }
.kf-tile.hot { border-color: rgba(232, 161, 60, .4); background: rgba(232, 161, 60, .05); }
.kf-tile .kf-tl { font-family: var(--mono); font-size: .53rem; letter-spacing: .15em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 8px; }
.kf-tile .kf-tv { font-family: var(--serif); font-size: 1.7rem; font-weight: 400; line-height: 1.05; color: var(--ink); font-variant-numeric: tabular-nums; }
.kf-tile.hot .kf-tv { color: var(--accent); }
.kf-tile .kf-tv.sm { font-size: 1.15rem; }
.kf-tile .kf-tv.dim { color: var(--ink-faint); }
.kf-tile .kf-tv .postag { font-size: .82rem; letter-spacing: .02em; padding: 3px 10px; margin-right: 0; vertical-align: 2px; }
.kf-tile .kf-ts { font-size: .72rem; color: var(--ink-dim); margin-top: 7px; line-height: 1.4; }
.kf-tile .kf-good { color: var(--good); }
.kf-tile:hover .ovbtn { opacity: .85; }
.kf-brief { display: flex; flex-direction: column; border-top: 1px solid var(--line-soft); }
.kf-row { display: flex; gap: 14px; align-items: baseline; padding: 10px 2px; border-bottom: 1px solid var(--line-soft); }
.kf-row:last-child { border-bottom: none; }
.kf-row:hover .ovbtn { opacity: .85; }
.kf-row .kf-k { font-family: var(--mono); font-size: .54rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); width: 78px; flex: none; padding-top: 3px; }
.kf-row .kf-v { font-size: .92rem; color: var(--ink); line-height: 1.5; }
.kf-row .kf-v b { font-weight: 500; }
.kf-sub { color: var(--ink-dim); font-size: .82rem; }
.kf-good { color: var(--good); }
.kf-pin { font-family: var(--mono); font-size: .54rem; letter-spacing: .08em; color: var(--ink-faint); border: 1px solid var(--line); border-radius: 5px; padding: 1px 6px; text-transform: uppercase; margin-left: 2px; }
.kf-codes { margin-top: 13px; font-family: var(--mono); font-size: .64rem; letter-spacing: .03em; color: var(--ink-faint); display: flex; flex-wrap: wrap; gap: 5px 14px; }
.kf-codes span b { color: var(--ink-dim); font-weight: 400; }
@media (max-width: 640px) { .kf-situ { grid-template-columns: 1fr; } .kfcard .kf-read { font-size: 1.18rem; } }
.cols { display: grid; grid-template-columns: 1fr 360px; gap: 20px; align-items: start; }
.stack { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.dcard { border: 1px solid var(--line); border-radius: 12px; background: var(--panel); padding: 16px 18px; }
.dcard > h2 { font-family: var(--mono); font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); font-weight: 500; margin: 0 0 12px; display: flex; align-items: center; gap: 9px; }
.dcard > h2 .kw { color: var(--ink-faint); letter-spacing: .06em; font-weight: 400; margin-left: auto; text-transform: none; }
.descbody { font-size: .84rem; color: var(--ink); line-height: 1.65; white-space: pre-wrap; }
.docrow { display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line-soft); padding: 8px 2px; font-size: .78rem; }
.docrow:last-child { border-bottom: none; }
.docrow .dn { color: var(--ink); }
.docrow .dm { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); margin-left: auto; white-space: nowrap; }
.docrow a { border-bottom: 1px dotted var(--ink-faint); }
.docrow a:hover { color: var(--accent); }
.docrow .fext { flex: none; font-family: var(--mono); font-size: .52rem; letter-spacing: .06em; color: var(--accent-soft); border: 1px solid rgba(232, 161, 60, .3); border-radius: 4px; padding: 2px 5px; min-width: 34px; text-align: center; }

/* document intelligence (AI extraction) — capture-oriented IA (design panel 2026-07-17):
   hero read → summary → competition → deal shape → capability fit → framed notes.
   Reuses the Solicitation Review vocabulary (.revgates/.revtiles/.revlist/.tagrow). */
.intelcard { border-color: rgba(232, 161, 60, .28); }
.intelkick { font-family: var(--mono); font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 5px; }
.intelhead { font-size: 1.02rem; color: var(--ink); line-height: 1.35; font-weight: 500; margin-bottom: 11px; }
.intelsum { font-size: .84rem; color: var(--ink); line-height: 1.62; }
/* grounding provenance: doc-grounded read vs the labeled description-only fallback */
.intelground { font-family: var(--mono); font-size: .54rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 10px; }
.intelground--docs { color: var(--accent-soft); }
/* archived-history mode (opt-in server search over the FY2015+ cold tier) */
.colbtn.qhist.on { color: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: rgba(232, 161, 60, .08); }
.histrow > td { padding: 13px 12px; border-bottom: 1px solid var(--line); }
.histtop { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.histhead { font-size: .95rem; color: var(--ink); font-weight: 500; line-height: 1.35; }
.histkick { display: inline-block; font-family: var(--mono); font-size: .56rem; text-transform: uppercase; letter-spacing: .1em; color: var(--accent-soft); border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); border-radius: 4px; padding: 1px 5px; margin-right: 7px; vertical-align: 1px; }
.histdate { font-family: var(--mono); font-size: .72rem; color: var(--ink-faint); white-space: nowrap; }
.histmeta { font-family: var(--mono); font-size: .72rem; letter-spacing: .03em; color: var(--ink-faint); margin-top: 4px; }
.histfact { margin-top: 7px; font-size: .82rem; color: var(--ink); line-height: 1.55; }
.histfact__g { font-family: var(--mono); font-size: .52rem; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-faint); border: 1px solid var(--line); border-radius: 3px; padding: 0 4px; margin-right: 6px; }
.histfact__g.docs { color: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }
/* threat verdict: the wired/sole-source competition read is red, NOT gold — gold is
   reserved site-wide for "this is ours to win" (market matches) */
.revgate.warn { border-color: rgba(217, 140, 95, .4); background: rgba(217, 140, 95, .06); }
.revgate.warn .gk, .revgate.warn .gv { color: var(--warn, #d98c5f); }
/* capability pill that hits your active market — the single gold accent */
.tag.hit { color: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: rgba(232, 161, 60, .07); }
/* signpost to the authoritative compliance record on the sibling card */
.intelsign { font-size: .74rem; color: var(--ink-faint); line-height: 1.5; margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--line-soft); }
.intelsign b { color: var(--ink-dim); font-weight: 500; }
.factgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; margin-top: 13px; }
.factchip { border: 1px solid var(--line); border-radius: 9px; background: var(--bg-soft); padding: 8px 10px; }
.factchip .fk { display: block; font-family: var(--mono); font-size: .52rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-faint); }
.factchip .fv { display: block; font-size: .82rem; color: var(--ink); margin-top: 3px; font-weight: 400; line-height: 1.35; }
.factchip .fv .ssauth { color: var(--ink-faint); font-size: .74rem; }
.tagrow { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.tagrow-l { font-family: var(--mono); font-size: .54rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-faint); margin-right: 2px; }
.tag { font-size: .72rem; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 2px 10px; }
.keypoints { margin: 13px 0 0; padding-left: 18px; }
.keypoints li { font-size: .8rem; color: var(--ink); line-height: 1.55; margin-bottom: 5px; }
.keypoints li::marker { color: var(--accent-soft); }

/* CLIN/SLIN line items inside the intelligence card (opps-clin-extraction §6a) */
.clinbox { margin-top: 15px; border-top: 1px solid var(--line-soft); padding-top: 13px; }
.clinhead { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.clinhead .clh-t { font-family: var(--mono); font-size: .54rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); }
.clinhead .clh-c { font-family: var(--mono); font-size: .62rem; color: var(--ink-dim); margin-left: auto; }
.clinhead .clh-hit { color: var(--accent); }
.clinlist { border: 1px solid var(--line-soft); border-radius: 9px; overflow: hidden; max-height: 300px; overflow-y: auto; }
.clinrow { display: flex; align-items: baseline; gap: 10px; padding: 6px 11px; border-bottom: 1px solid var(--line-soft); }
.clinrow:last-child { border-bottom: none; }
.clinrow .cln { font-family: var(--mono); font-size: .68rem; color: var(--ink); flex: none; width: 4.4rem; }
.clinrow.slin .cln { padding-left: 1.3rem; color: var(--ink-dim); position: relative; }
.clinrow.slin .cln::before { content: "└"; position: absolute; left: .45rem; color: var(--ink-faint); }
.clinrow .clt { font-size: .78rem; color: var(--ink-dim); line-height: 1.35; }
.clinrow .clo { margin-left: auto; font-family: var(--mono); font-size: .5rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-faint); flex: none; }
.clinrow .clo.option { color: var(--accent-soft); }
.clinrow.hit { background: rgba(232, 161, 60, .09); }
.clinrow.hit .clt, .clinrow.hit .cln { color: var(--accent-soft); }
.clhitflag { font-family: var(--mono); font-size: .5rem; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); border: 1px solid rgba(232, 161, 60, .4); border-radius: 4px; padding: .04rem .3rem; margin-left: .4rem; white-space: nowrap; }

/* Compliance Snapshot — the solicitation-review card (design §11b Option 1;
   mockups/opps-compliance-snapshot.html). Restrained: ink chips, gold only on
   genuine warnings (unparsed pricing workbook, mandatory events). */
/* per-row classification tag on the Documents card (WD · rev, Pricing · not
   parsed, SF30, DD254...) — the file classifications live WITH the file list */
.docrow .dmtag { font-family: var(--mono); font-size: .52rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-faint); border: 1px solid var(--line-soft); border-radius: 5px; padding: .1rem .4rem; white-space: nowrap; flex: none; }
.docrow .dmtag.warn { color: var(--warn, #d98c5f); border-color: rgba(217, 140, 95, .35); }
.revgates { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.revgate { display: inline-flex; flex-direction: column; gap: 2px; border: 1px solid var(--line); border-radius: 10px; padding: .45rem .7rem; min-width: 7.5rem; }
.revgate .gk { font-family: var(--mono); font-size: .5rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-faint); }
.revgate .gv { font-size: .8rem; color: var(--ink); }
.revgate .gs { font-family: var(--mono); font-size: .52rem; color: var(--ink-faint); }
.revtiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; margin-bottom: 14px; }
.revtile { border: 1px solid var(--line-soft); border-radius: 9px; padding: .5rem .65rem; }
.revtile .tk { font-family: var(--mono); font-size: .5rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 3px; }
.revtile .tv { font-size: .8rem; color: var(--ink); line-height: 1.35; }
.revtile .ts { font-family: var(--mono); font-size: .56rem; color: var(--ink-faint); margin-top: 3px; }
.reveval { border-left: 2px solid var(--line); padding: 2px 0 2px 12px; margin-bottom: 13px; }
.reveval .ee { font-family: var(--mono); font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink); border: 1px solid var(--line); border-radius: 6px; padding: .12rem .45rem; }
.reveval .eq { font-size: .82rem; line-height: 1.5; color: var(--ink-dim); font-style: italic; margin-top: 7px; }
.revlist { margin-bottom: 11px; }
.revlist .rl-t, .revline .rl-t { font-family: var(--mono); font-size: .52rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-faint); display: block; margin-bottom: 4px; }
.revlist ul { margin: 0; padding-left: 17px; }
.revlist li { font-size: .78rem; color: var(--ink-dim); line-height: 1.5; margin-bottom: 3px; }
.revlist li::marker { color: var(--ink-faint); }
.revline { font-size: .78rem; color: var(--ink-dim); margin-bottom: 11px; }
.revnf { font-family: var(--mono); font-size: .58rem; color: var(--ink-faint); border-top: 1px solid var(--line-soft); padding-top: 9px; line-height: 1.5; }

/* ============================================================================
   RICH AI SURFACES — the two AI-driven cards (Capture Intelligence + Solicitation
   Review) get the Intel site's visual language (explorer/intel.html): per-category
   colored rails, radial washes, hover-lift, serif signal numbers. System signal:
   the Capture card glows WARM gold (opportunity / win) and the Review card glows
   COOL cyan (compliance / risk). The six-hue palette drives category color via --cc.
   ========================================================================== */
.intelcard, .revcard {
  --ease: cubic-bezier(.22, 1, .36, 1);
  --c-cyber: #4fb8d8; --c-clear: #b98ce8; --c-risk: #f0705a;
  --c-bond: #e8a13c; --c-source: #5ec98c; --c-ip: #6fb0e8; --c-slate: #9aa7b8; --c-elig: #e8a13c;
  position: relative; overflow: hidden;
}
/* card identity glow — warm for Capture, cool for Review */
.intelcard {
  border-color: rgba(232, 161, 60, .3);
  background:
    radial-gradient(90% 190px at 16% -10%, rgba(232, 161, 60, .13), transparent 68%),
    linear-gradient(180deg, color-mix(in srgb, var(--accent) 4%, var(--panel)), var(--panel));
}
.revcard {
  border-color: rgba(79, 184, 216, .26);
  background:
    radial-gradient(90% 190px at 16% -10%, rgba(79, 184, 216, .12), transparent 68%),
    linear-gradient(180deg, color-mix(in srgb, var(--c-cyber, #4fb8d8) 4%, var(--panel)), var(--panel));
}
.revcard > h2 { color: var(--c-cyber, #4fb8d8); }
.revcard > h2 .kwai, .intelcard > h2 .kwai { text-shadow: 0 0 14px currentColor; }

/* hero read (Capture): serif headline + a summary that feels like the centerpiece */
.intelkick { color: var(--accent-soft); }
.intelhead { font-family: var(--serif); font-weight: 400; font-size: 1.42rem; line-height: 1.2; letter-spacing: -.01em; margin-bottom: 13px; }
.intelcard .intelsum {
  font-size: .9rem; line-height: 1.68; color: var(--ink);
  border-left: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  padding: 2px 0 2px 15px;
  background: linear-gradient(90deg, rgba(232, 161, 60, .05), transparent 70%);
  border-radius: 0 8px 8px 0;
}

/* the --cc category rail: a colored left bar + tinted well + colored label, applied
   to gates (both cards) and the routed key-point lists */
.revgate { position: relative; overflow: hidden; padding-left: calc(.7rem + 5px); transition: transform .16s var(--ease), border-color .16s, box-shadow .16s; }
.revgate::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--cc, var(--ink-faint)); }
.revgate[class*="rail-"] { border-color: color-mix(in srgb, var(--cc) 30%, var(--line)); background: color-mix(in srgb, var(--cc) 8%, transparent); }
.revgate[class*="rail-"] .gk { color: var(--cc); }
.revgate:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -20px rgba(0, 0, 0, .85); }
.revgate.warn .gv { color: var(--c-risk); font-weight: 500; }
.rail-cyber { --cc: var(--c-cyber); } .rail-clear { --cc: var(--c-clear); } .rail-risk { --cc: var(--c-risk); }
.rail-bond { --cc: var(--c-bond); } .rail-source { --cc: var(--c-source); } .rail-ip { --cc: var(--c-ip); }
.rail-slate { --cc: var(--c-slate); } .rail-elig { --cc: var(--c-elig); }

/* deal-shape / logistics tiles — hover-lift, a colored top hairline, serif money */
.revtile { position: relative; overflow: hidden; transition: transform .16s var(--ease), border-color .16s, box-shadow .16s; }
.revtile::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 55%, transparent), transparent 75%); opacity: .5; }
.revtile:hover { transform: translateY(-2px); border-color: var(--ink-dim); box-shadow: 0 14px 30px -22px rgba(0, 0, 0, .8); }
.revtile.tile-money .tv { font-family: var(--serif); font-size: 1.5rem; color: var(--accent); line-height: 1.1; }
.revtile.tile-money::after { background: linear-gradient(90deg, var(--accent), transparent 75%); opacity: .8; }
.revtile.tile-date::after { background: linear-gradient(90deg, var(--c-cyber), transparent 75%); }
.revtile.tile-warn { border-color: rgba(240, 112, 90, .4); }
.revtile.tile-warn::after { background: linear-gradient(90deg, var(--c-risk), transparent 75%); opacity: .85; }
.revtile.tile-warn .tv { color: var(--c-risk); }

/* capability pills (Capture) — cool cyan by default, gold + glow on a market match */
.intelcard .tagrow-l { color: var(--c-cyber); }
.intelcard .tag { border-color: color-mix(in srgb, var(--c-cyber) 28%, var(--line)); color: color-mix(in srgb, var(--c-cyber) 45%, var(--ink)); transition: .14s; }
.intelcard .tag.hit { color: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); background: rgba(232, 161, 60, .1); box-shadow: 0 0 16px -4px rgba(232, 161, 60, .5); }

/* routed key-point notes (Capture) — clear the tags above; each bucket a colored rail */
.intelnotes { margin-top: 18px; }
.intelnotes .revlist[class*="rail-"] { border-left: 2px solid var(--cc); padding-left: 13px; }
.intelnotes .revlist[class*="rail-"] .rl-t { color: var(--cc); }

/* evaluation quote (Review) — a serif hero moment with a gold rail + wash */
.reveval { border-left: 2px solid var(--accent); background: linear-gradient(90deg, rgba(232, 161, 60, .06), transparent 70%); border-radius: 0 10px 10px 0; padding: 11px 0 11px 14px; }
.reveval .eq { font-family: var(--serif); font-size: 1.06rem; font-style: italic; line-height: 1.5; color: var(--ink-dim); }
.reveval .ee { color: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }

/* document-map chips (Review) — a small colored dot per type, warm-warn for unparsed */
.revdm .dmchip { transition: border-color .14s, color .14s; }
.revdm .dmchip .t { color: var(--c-slate); }

/* legibility — the faint sub-labels (--ink-faint) sit on the cards' tinted glow,
   which drops their contrast below readable; raise them to --ink-dim and give the
   Review card's plain list eyebrows a cool tint (matches the card identity) */
.revcard .revlist .rl-t, .revcard .revline .rl-t { color: color-mix(in srgb, var(--c-cyber) 34%, var(--ink-dim)); }
.revcard .revnf { color: var(--ink-dim); font-size: .62rem; letter-spacing: .02em; }
.intelcard .intelsign { color: var(--ink-dim); }
.intelcard .revgate .gs, .revcard .revgate .gs,
.intelcard .revtile .ts, .revcard .revtile .ts { color: var(--ink-dim); }
/* substantive list content (pass/fail rules, required-at-offer, scope notes) at
   full ink — this is what a reviewer actually reads */
.revcard .revlist li, .revcard .revline { color: var(--ink); }
.intelcard .revlist li { color: var(--ink-dim); }

/* row-level hidden line-item match badge in the browse table */
.hiddenmatch { margin-top: 5px; font-size: .72rem; color: var(--ink-dim); line-height: 1.4; }
.hiddenmatch .hm-k { font-family: var(--mono); font-size: .5rem; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); border: 1px solid rgba(232, 161, 60, .35); border-radius: 100px; padding: .06rem .4rem; margin-right: .45rem; white-space: nowrap; }
.hiddenmatch b { color: var(--ink); font-weight: 500; }
.lineage { position: relative; margin-left: 6px; padding-left: 20px; }
.lineage::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 1px; background: var(--line); }
.lnode { position: relative; padding: 0 0 16px; }
.lnode:last-child { padding-bottom: 0; }
.lnode::before { content: ""; position: absolute; left: -20px; top: 3px; width: 9px; height: 9px; border-radius: 50%; background: var(--bg); border: 1.5px solid var(--ink-faint); }
.lnode.done::before { border-color: var(--ink-dim); background: var(--ink-faint); }
.lnode.current::before { border-color: var(--accent); background: var(--accent); box-shadow: 0 0 0 3px rgba(232, 161, 60, .18); }
.lnode.future::before { border-style: dashed; }
.lnode .lt { font-size: .82rem; color: var(--ink); font-weight: 400; }
.lnode.current .lt { color: var(--accent-soft); }
.lnode.future .lt { color: var(--ink-faint); font-style: italic; }
.lnode .lm { font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); margin-top: 2px; letter-spacing: .03em; }
.lnode .lm b { color: var(--ink-dim); font-weight: 500; }
.lnode .lm a { border-bottom: 1px dotted var(--ink-faint); }
.lnode .lm a:hover { color: var(--accent); }
.kvrow { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--line-soft); font-size: .76rem; }
.kvrow:last-child { border-bottom: none; }
.kvrow .k { color: var(--ink-faint); font-family: var(--mono); font-size: .6rem; letter-spacing: .05em; text-transform: uppercase; padding-top: 2px; }
.kvrow .v { color: var(--ink); text-align: right; font-weight: 300; line-height: 1.4; word-break: break-word; }
.kvrow .v small { display: block; color: var(--ink-faint); font-size: .66rem; }

/* workspace cards (team · notes · tiebacks) */
.wsform { display: flex; gap: 6px; margin-top: 10px; align-items: stretch; }
.wsform:first-of-type { margin-top: 0; }
.ovlbl { flex: 0 0 56px; font-family: var(--mono); font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-faint); align-self: center; }
.wsform select { flex: 0 0 auto; max-width: 46%; background: var(--field); color: var(--ink-dim); border: 1px solid var(--line); border-radius: 8px; padding: 5px 7px; font-size: .7rem; font-family: var(--mono); }
.wsform select:focus, .wsform input:focus { outline: none; border-color: var(--accent); }
.wsform input { flex: 1; min-width: 0; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 5px 9px; font-size: .76rem; font-weight: 300; }
.wsform input::placeholder { color: var(--ink-faint); }
.wsadd { flex: 0 0 30px; border: 1px dashed var(--line); border-radius: 8px; color: var(--ink-faint); font-size: .9rem; transition: .15s; }
.wsadd:hover { border-color: var(--accent); color: var(--accent); }
.wsx { color: var(--ink-faint); font-size: .66rem; width: 20px; height: 20px; border-radius: 50%; transition: .15s; vertical-align: 1px; }
.wsx:hover { color: var(--warn); background: rgba(224, 123, 123, .1); }
.linkkind { font-family: var(--mono); font-size: .54rem; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); border: 1px solid rgba(111, 176, 232, .35); border-radius: 4px; padding: 2px 6px; flex: none; }
#wscards { gap: 16px; }
#wscards:empty { display: none; }
#ws-notes { width: 100%; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: .76rem; font-family: var(--sans); font-weight: 300; line-height: 1.55; resize: vertical; min-height: 74px; }
#ws-notes:focus { outline: none; border-color: var(--accent); }
@media (max-width: 1000px) {
  .workspace { grid-template-columns: 1fr; }
  .rail { position: static; max-height: none; border-right: none; border-bottom: 1px solid var(--line-soft); }
  .kpis { grid-template-columns: repeat(2, 1fr); }
  .cols { grid-template-columns: 1fr; }
  .hero h1 { font-size: 1.9rem; }
}
@media (prefers-reduced-motion: reduce) { * { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* ============================================================================
   Opportunity detail redesign (2026-07-13) — ported from
   mockups/opportunity-layout-v4.html. Pipeline stepper · full description +
   See more · surfaced facts with inline Adjust · metrics top↔rail toggle.
   ========================================================================== */

/* ① pipeline stepper (in .hero__pipe, replacing the old select+stagerow) */
.hero__pipe { align-items: center; }
.pipewrap { flex: 1; min-width: 0; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.piperow { display: flex; align-items: center; gap: 7px; flex: none; }
.pipepick { max-width: 220px; background: var(--field); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px; font-size: .82rem; font-family: var(--sans); font-weight: 500; }
.pipepick:focus { outline: none; border-color: var(--accent); }
.piperemove { flex: none; width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--line); color: var(--ink-faint); font-size: .8rem; transition: .18s; }
.piperemove:hover { color: var(--warn); border-color: var(--warn); }
.pipetrack { position: relative; flex: 1; min-width: 260px; display: flex; justify-content: space-between; align-items: flex-start; padding: 6px 2px 2px; }
.piperail { position: absolute; left: 12px; right: 12px; top: 13px; height: 3px; border-radius: 3px; background: var(--line); overflow: hidden; }
.pipetrack.hasright .piperail { right: 128px; }
.pipetrack.hasleft .piperail { left: 128px; }
/* width is always var(--fillw) (correct even if animations don't run); the
   sweep is a transform reveal so a frozen/headless renderer never masks it */
.pipefill { position: absolute; inset: 0 auto 0 0; width: var(--fillw, 0); transform-origin: left center; border-radius: 3px; background: linear-gradient(90deg, var(--accent), var(--accent-soft), var(--accent)); background-size: 200% 100%; animation: pipeshimmer 2.4s linear infinite, pipegrow .75s var(--ease); box-shadow: 0 0 12px rgba(232, 161, 60, .55); }
@keyframes pipeshimmer { 0% { background-position: 0 0; } 100% { background-position: 200% 0; } }
@keyframes pipegrow { from { transform: scaleX(0); } }
.pnode { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 7px; flex: 1; min-width: 0; }
.pnode .pdot { width: 20px; height: 20px; border-radius: 50%; background: var(--bg); border: 2px solid var(--ink-faint); display: flex; align-items: center; justify-content: center; transition: transform .3s var(--ease), border-color .4s var(--ease), background .4s var(--ease), box-shadow .4s var(--ease); }
.pnode .pdot::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: transparent; transition: background .4s var(--ease); }
.pnode .plbl { font-family: var(--mono); font-size: .58rem; letter-spacing: .04em; color: var(--ink-faint); white-space: nowrap; transition: color .4s var(--ease); }
.pnode:hover .pdot { border-color: var(--ink-dim); }
.pnode.done .pdot { border-color: var(--accent); background: rgba(232, 161, 60, .14); }
.pnode.done .pdot::after { background: var(--accent); }
.pnode.done .plbl { color: var(--ink-dim); }
.pnode.cur .pdot { border-color: var(--accent); background: var(--accent); transform: scale(1.25); box-shadow: 0 0 0 5px rgba(232, 161, 60, .18), 0 0 16px rgba(232, 161, 60, .5); animation: pnodepop .5s var(--ease) both; }
@keyframes pnodepop { 0% { transform: scale(.6); box-shadow: 0 0 0 0 rgba(232, 161, 60, .4); } 60% { transform: scale(1.35); } }
.pnode.cur .pdot::after { background: #1a1206; }
.pnode.cur .plbl { color: var(--accent-soft); font-weight: 500; }
.pterm { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 5px; flex: none; width: 100px; padding-left: 16px; border-left: 1px dashed var(--line); margin-left: 6px; }
.pterm .tbtn { font-family: var(--mono); font-size: .58rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); border: 1px solid var(--line); border-radius: 100px; padding: 4px 0; transition: .18s; }
.pterm .tbtn:hover { color: var(--ink); border-color: var(--ink-dim); }
.pterm .tbtn.won.on { background: var(--good); border-color: var(--good); color: #0a1206; font-weight: 500; box-shadow: 0 0 14px rgba(123, 191, 123, .4); }
.pterm .tbtn.lost.on { background: var(--warn); border-color: var(--warn); color: #1a0606; font-weight: 500; box-shadow: 0 0 14px rgba(217, 140, 95, .4); }
/* leading No-Bid chicklet — mirrors Won/Lost but on the left, neutral when chosen */
.pterm.left { padding-left: 0; padding-right: 16px; border-left: none; border-right: 1px dashed var(--line); margin-left: 0; margin-right: 6px; }
.pterm .tbtn.nobid.on { background: var(--ink-dim); border-color: var(--ink-dim); color: var(--bg); font-weight: 500; box-shadow: 0 0 14px rgba(154, 152, 143, .3); }

/* ⑤ facts strip header + inline Adjust override */
#topMetrics { margin: 18px 0 22px; }
.factshead { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.factshead h2 { font-family: var(--mono); font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); font-weight: 500; }
.factsub { font-family: var(--mono); font-size: .58rem; color: var(--ink-faint); letter-spacing: .03em; }
.layoutbtn { margin-left: auto; font-family: var(--mono); font-size: .58rem; letter-spacing: .05em; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 4px 11px; transition: .2s; }
.layoutbtn:hover { color: var(--accent); border-color: rgba(232, 161, 60, .5); }
#topMetrics .facts { margin: 0; }
.fact { position: relative; }
.fact.deadline .v, .mrow.hot .mv:first-child { font-variant-numeric: tabular-nums; }
.fact.yours { border-color: rgba(123, 191, 123, .4); background: rgba(123, 191, 123, .05); }
.fact.yours .v { color: var(--ink); font-style: normal; }
.ovbtn { margin-top: 7px; font-family: var(--mono); font-size: .55rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); border-bottom: 1px dotted var(--ink-faint); opacity: 0; transition: .15s; }
.fact:hover .ovbtn, .mrow:hover .ovbtn { opacity: .85; }
.fact.yours .ovbtn, .mrow.yours .ovbtn { opacity: .8; color: var(--good); border-color: var(--good); }
.ovbtn:hover { color: var(--accent); border-color: var(--accent); }
.ovedit { display: inline-flex; gap: 5px; margin-top: 6px; }
.ovedit input { min-width: 0; width: 120px; background: var(--field); border: 1px solid rgba(232, 161, 60, .5); border-radius: 6px; padding: 5px 8px; font-size: .82rem; color: var(--ink); font-family: var(--sans); }
.ovedit input:focus { outline: none; }
.ovedit button { font-family: var(--mono); font-size: .6rem; color: var(--accent); flex: none; }

/* ③ description clamp + See more */
.descbody.clamped { max-height: 8.6em; overflow: hidden; position: relative; }
.descbody.clamped::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3.2em; background: linear-gradient(180deg, rgba(16, 18, 22, 0), var(--panel)); }
.seemore { display: inline-flex; align-items: center; gap: 6px; margin-top: 11px; font-family: var(--mono); font-size: .62rem; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); border: 1px solid rgba(232, 161, 60, .4); border-radius: 100px; padding: 5px 13px; transition: .2s; }
.seemore:hover { background: rgba(232, 161, 60, .09); }
.seemore .chev { transition: transform .3s var(--ease); }
.seemore.open .chev { transform: rotate(180deg); }

/* ⑥ rail Metrics table (shown when metrics moved off the top) */
.railmetrics { display: none; }
body.opps-metrics-rail #topMetrics { display: none; }
body.opps-metrics-rail .railmetrics { display: block; }
.railmetrics > h2 .minibtn { margin-left: auto; font-family: var(--mono); font-size: .55rem; letter-spacing: .04em; text-transform: none; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 3px 9px; transition: .2s; }
.railmetrics > h2 .minibtn:hover { color: var(--accent); border-color: rgba(232, 161, 60, .5); }
.mrow { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line-soft); }
.mrow:last-child { border-bottom: none; }
.mrow.hot { background: linear-gradient(90deg, rgba(232, 161, 60, .08), transparent); margin: 0 -6px; padding-left: 6px; padding-right: 6px; border-radius: 6px; }
.mk { font-family: var(--mono); font-size: .56rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); display: flex; align-items: center; gap: 5px; padding-top: 2px; flex: none; max-width: 50%; }
.mright { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; text-align: right; min-width: 0; }
.mv { font-size: .82rem; color: var(--ink); line-height: 1.3; }
.mrow.hot .mv:first-child { color: var(--accent); font-weight: 500; }
.mv small { color: var(--ink-faint); font-size: .66rem; }
.mrow .ovbtn { margin-top: 2px; }

/* ===== Lifecycle timeline (BUILD of mockups/opportunity-lifecycle-timeline)
   the derived procurement spine: oldest top → latest bottom ===== */
.tlswitch { margin-left: auto; display: inline-flex; border: 1px solid var(--line); border-radius: 100px; overflow: hidden; }
.tlswitch button { font: inherit; font-family: var(--mono); font-size: .54rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-dim); background: none; border: none; padding: 4px 10px; cursor: pointer; transition: .18s; }
.tlswitch button.on { background: var(--accent); color: #1a1206; }
.tl { position: relative; margin-top: 4px; container-type: inline-size; }
.tnode { position: relative; padding: 0 0 24px 124px; min-height: 22px; }
.tnode:last-child { padding-bottom: 0; }
.tdate { position: absolute; left: 0; top: 0; width: 84px; text-align: right; font-family: var(--mono); font-size: .62rem; letter-spacing: .02em; color: var(--ink-faint); line-height: 1.4; }
.tdate b { display: block; color: var(--ink-dim); font-weight: 500; }
.tdot { position: absolute; left: 94px; top: 1px; width: 18px; height: 18px; border-radius: 50%; background: var(--ink-faint); border: 2px solid var(--ink-dim); z-index: 2; }
.tnode::after { content: ""; position: absolute; left: 102px; top: 5px; bottom: -5px; width: 2px; background: var(--line); z-index: 1; }
.tnode:last-child::after { display: none; }
.tdur { position: absolute; left: 103px; top: -13px; transform: translateX(-50%); background: var(--panel); padding: 1px 5px; font-family: var(--mono); font-size: .5rem; color: var(--ink-faint); white-space: nowrap; z-index: 2; }
.tphase { font-family: var(--mono); font-size: .54rem; letter-spacing: .13em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 3px; }
.ttitle { font-size: .92rem; color: var(--ink); line-height: 1.3; }
.tdesc { font-size: .78rem; color: var(--ink-dim); line-height: 1.5; margin-top: 3px; }
.tchips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.tchip { font-family: var(--mono); font-size: .56rem; letter-spacing: .03em; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 2px 9px; }
.tchip b { color: var(--ink); font-weight: 500; }
.tchip.warn { color: var(--accent); border-color: rgba(232, 161, 60, .4); }
.tchip.warn b { color: var(--accent); }
.tchip.lk { border-style: dashed; cursor: pointer; }
.tchip.lk:hover { color: var(--accent); border-color: rgba(232, 161, 60, .4); }
.tnode.done .tphase { color: var(--ink-faint); }
.tnode.now .tdot { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 5px rgba(232, 161, 60, .16), 0 0 16px rgba(232, 161, 60, .5); animation: tlpulse 2.4s var(--ease) infinite; }
@keyframes tlpulse { 0%, 100% { box-shadow: 0 0 0 5px rgba(232, 161, 60, .16), 0 0 16px rgba(232, 161, 60, .5); } 50% { box-shadow: 0 0 0 8px rgba(232, 161, 60, .06), 0 0 22px rgba(232, 161, 60, .32); } }
.tnode.now .tphase { color: var(--accent); }
.tnode.now .ttitle { color: var(--accent-soft); }
.tnode.upcoming .tdot { background: var(--bg); border-color: var(--accent); }
.tnode.upcoming::after, .tnode.est::after { background: none; border-left: 2px dashed rgba(232, 161, 60, .45); width: 0; }
.tnode.upcoming .tphase { color: var(--accent); }
.tnode.est .tdot { background: var(--bg); border-style: dashed; border-color: var(--accent-soft); }
.tnode.est .ttitle { color: var(--ink-dim); }
.tnode.est .tdate { color: var(--ink-faint); font-style: italic; }
.tnode.lead .tbody { border: 1px solid var(--line); border-left: 2px solid var(--blue); border-radius: 9px; background: var(--panel2); padding: 10px 12px; }
.tnode.lead .tdot { background: var(--blue); border-color: var(--blue); }
.tnode.lead .tphase { color: var(--blue); }
.tbreak { position: relative; padding: 0 0 24px 124px; height: 34px; }
.tbreak::after { content: ""; position: absolute; left: 102px; top: 0; bottom: -5px; width: 2px; background: repeating-linear-gradient(var(--line) 0 3px, transparent 3px 8px); }
.tbreak span { position: absolute; left: 94px; top: 7px; transform: translateX(calc(-50% + 9px)); background: var(--panel); padding: 2px 8px; font-family: var(--mono); font-size: .54rem; letter-spacing: .05em; color: var(--ink-faint); border: 1px solid var(--line); border-radius: 100px; white-space: nowrap; }
.ttoday { position: relative; margin: 2px 0 24px; padding-left: 124px; height: 0; }
.ttoday::before { content: ""; position: absolute; left: 0; right: 0; top: 0; border-top: 1px dashed rgba(232, 161, 60, .5); }
.ttoday > span:last-child { position: absolute; left: 124px; top: -9px; background: var(--panel); padding: 0 10px 0 0; font-family: var(--mono); font-size: .56rem; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.ttoday .tdot { position: absolute; left: 94px; top: -8px; width: 16px; height: 16px; background: var(--accent); border-color: var(--accent); box-shadow: 0 0 10px rgba(232, 161, 60, .6); }
.tlegend { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line-soft); }
.tlegend .lg { display: inline-flex; align-items: center; gap: 6px; font-family: var(--mono); font-size: .54rem; letter-spacing: .03em; color: var(--ink-faint); }
.tlegend .lg i { width: 11px; height: 11px; border-radius: 50%; flex: none; }
.tlegend .l-done { background: var(--ink-faint); border: 2px solid var(--ink-dim); }
.tlegend .l-now { background: var(--accent); box-shadow: 0 0 7px rgba(232, 161, 60, .5); }
.tlegend .l-up { background: var(--bg); border: 2px solid var(--accent); }
.tlegend .l-est { background: var(--bg); border: 2px dashed var(--accent-soft); }
.tlegend .l-inc { background: var(--blue); }
/* Narrow layout keys off the timeline's OWN width (container query), not the
   viewport — the lifecycle renders inside the ~424px slide-over sheet, which
   stays narrow even on a wide desktop, so a viewport media query never fired
   there and the content was crushed into the remaining gutter. */
@container (max-width: 440px) {
  .tnode, .tbreak, .ttoday { padding-left: 100px; }
  .tdate { width: 62px; }
  .tdot, .ttoday .tdot { left: 72px; } .tnode::after, .tbreak::after { left: 80px; } .tdur { left: 81px; }
  .ttoday > span:last-child { left: 100px; } .tbreak span { left: 72px; }
}
/* Very narrow (small phones): drop the left date gutter entirely and let the
   date sit inline above the milestone, so titles get the full width. */
@container (max-width: 340px) {
  .tnode, .tbreak, .ttoday { padding-left: 30px; }
  .tdate { position: static; width: auto; text-align: left; margin-bottom: 4px; }
  .tdate b { display: inline; }
  .tdot, .ttoday .tdot { left: 2px; } .tnode::after, .tbreak::after { left: 10px; } .tdur { left: 11px; }
  .ttoday { padding-left: 30px; } .ttoday > span:last-child { left: 30px; } .tbreak span { left: 2px; transform: none; }
}

/* ===== edit-layout (BUILD of mockups/opportunity-layout-v5) — drag/hide/
   reorder detail cards across Main + Sidebar zones, like the entity pages ===== */
.editbar { display: flex; align-items: center; gap: 8px; margin: 16px 0; }
.editbar .ebsp { flex: 1; }
.savedtag { font-family: var(--mono); font-size: .56rem; letter-spacing: .04em; color: var(--good); opacity: 0; transition: opacity .3s; }
.savedtag.show { opacity: 1; }
.ebtn { display: inline-flex; align-items: center; gap: 6px; font-size: .76rem; color: var(--ink); border: 1px solid var(--line); border-radius: 100px; padding: 5px 13px; transition: .2s; }
.ebtn:hover { border-color: var(--ink-dim); }
.ebtn.primary { background: var(--accent); border-color: var(--accent); color: #1a1206; font-weight: 500; }
.ebtn.primary:hover { background: var(--accent-soft); }
.ebtn.ghost { color: var(--ink-dim); }
.editonly { display: none; }
body.lay-editing .editonly { display: inline-flex; }
.addwrap { position: relative; }
.addmenu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 60; min-width: 210px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 20px 50px rgba(0, 0, 0, .5); padding: 6px; display: none; }
.addmenu.open { display: block; }
.addmenu .ai { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; font-size: .8rem; color: var(--ink); padding: 8px 10px; border-radius: 8px; transition: .15s; }
.addmenu .ai:hover { background: rgba(232, 161, 60, .08); }
.addmenu .ai .k { font-family: var(--mono); font-size: .5rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-faint); margin-left: auto; }
.addmenu .empty { font-size: .74rem; color: var(--ink-faint); padding: 10px; text-align: center; }
body.lay-editing .zone { outline: 1px dashed var(--line); outline-offset: 7px; border-radius: 12px; min-height: 40px; }
.acard { position: relative; }
.acard.lay-hide { display: none; }
.card-tools { display: none; position: absolute; top: 9px; right: 10px; gap: 5px; z-index: 4; }
body.lay-editing .card-tools { display: flex; }
.card-tools button { width: 24px; height: 24px; border-radius: 6px; border: 1px solid var(--line); background: var(--bg-soft); color: var(--ink-dim); font-size: .85rem; display: flex; align-items: center; justify-content: center; transition: .15s; }
.card-tools .g { cursor: grab; }
.card-tools button:hover { color: var(--ink); border-color: var(--ink-dim); }
.card-tools .h:hover { color: var(--warn); border-color: var(--warn); }
body.lay-editing .acard { cursor: grab; }
body.lay-editing .acard:hover { border-color: rgba(232, 161, 60, .4); }
body.lay-editing .acard > h2 { padding-right: 58px; }
.acard.laydragging { opacity: .45; border: 1px dashed var(--accent); }

/* Ask Hitch box (rendered by askhitch.js into #askhitch-slot) — defensive
   guard against horizontal scroll: long raw citation filenames + an inline
   .ah-src with white-space:nowrap forced the log wider than the sidebar card.
   Scoped to the slot with id-specificity so it wins without touching the
   parallel session's askhitch.css. */
#askhitch-slot .ah-log { overflow-x: hidden; }
#askhitch-slot .ah-b, #askhitch-slot .ah-msg { min-width: 0; }
#askhitch-slot .ah-src { white-space: normal; overflow-wrap: anywhere; }
#askhitch-slot .ah-cite { overflow-wrap: anywhere; word-break: break-word; }

/* ==========================================================================
   CAPTURE PLAN - the detail card (migration 0031)
   docs/capture-proposal-plan.md, BUILD SPEC. Tier 0 is deterministic: every
   number here is arithmetic over the notice + your lens. Purple marks the
   human-input surface - what the platform asks instead of inventing.
   ========================================================================== */
.capcard .caphead { display: flex; align-items: flex-start; gap: 13px; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--line-soft); }
.capcard .capgate { flex: none; min-width: 108px; text-align: center; border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; }
.capcard .capgate .cgl { font-family: var(--mono); font-size: .5rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-faint); }
.capcard .capgate .cgv { font-family: var(--serif); font-size: 1.35rem; line-height: 1.1; margin-top: 3px; text-transform: capitalize; color: var(--ink); }
.capcard .capgate.pursue { border-color: rgba(107, 191, 89, .45); background: rgba(107, 191, 89, .05); }
.capcard .capgate.pursue .cgv { color: var(--good); }
.capcard .capgate.teammate, .capcard .capgate.rec { border-color: rgba(232, 161, 60, .4); background: rgba(232, 161, 60, .05); }
.capcard .capgate.teammate .cgv, .capcard .capgate.rec .cgv { color: var(--accent); }
.capcard .capgate.no_bid { border-color: rgba(217, 140, 95, .45); }
.capcard .capgate.no_bid .cgv { color: var(--warn); }
.capcard .capwhy { font-size: .8rem; color: var(--ink-dim); line-height: 1.55; padding-top: 2px; }

/* .revgate.warn .gv resolves --c-risk, which is declared only on .intelcard /
   .revcard — re-declare it here so a FAILED hard gate keeps its warning colour
   inside the capture card instead of inheriting the default ink. */
.capcard { --c-risk: var(--warn); }
.capcard .revgate.warn { border-color: rgba(217, 140, 95, .45); }

.capcard .capsec { margin-top: 15px; }
.capcard .capsh { font-family: var(--mono); font-size: .56rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 9px; }
.capcard .capsh b { color: var(--ink); font-weight: 500; }
.capcard .capprov { color: var(--accent); text-transform: none; letter-spacing: .02em; }
.capcard .capnote { color: var(--ink-faint); text-transform: none; letter-spacing: .02em; }

.capcard .capfacs { display: flex; flex-direction: column; gap: 9px; }
.capcard .capfac { border-left: 2px solid var(--line); padding-left: 10px; }
.capcard .capfac.human { border-left-color: rgba(178, 143, 208, .55); }
.capcard .cfl { display: flex; align-items: baseline; gap: 8px; }
.capcard .cfn { font-size: .78rem; color: var(--ink); }
.capcard .cfk { font-family: var(--mono); font-size: .52rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-faint); }
.capcard .cfv { margin-left: auto; font-family: var(--mono); font-size: .76rem; color: var(--ink); }
.capcard .cfbar { height: 4px; border-radius: 2px; background: var(--line-soft); margin: 5px 0 4px; overflow: hidden; }
.capcard .cfbar span { display: block; height: 100%; background: var(--accent); }
.capcard .capfac.human .cfbar span { background: repeating-linear-gradient(90deg, #b28fd0 0 5px, rgba(178, 143, 208, .3) 5px 10px); }
.capcard .cfb { font-size: .68rem; color: var(--ink-faint); line-height: 1.45; }

.capcard .capq { border: 1px solid var(--line-soft); border-radius: 9px; padding: 9px 11px; margin-bottom: 7px; background: var(--field); }
.capcard .capq.done { border-color: rgba(178, 143, 208, .4); }
.capcard .cqt { font-size: .78rem; color: var(--ink); line-height: 1.45; }
.capcard .cqw { font-size: .64rem; color: var(--ink-faint); line-height: 1.4; margin-top: 3px; }
.capcard .cqo { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 7px; }
.capcard .cqbtn { font-family: var(--mono); font-size: .55rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 3px 9px; transition: .15s; }
.capcard .cqbtn:hover { color: var(--ink); border-color: var(--ink-dim); }
.capcard .cqbtn.on { color: #1a1206; background: #b28fd0; border-color: #b28fd0; }
.capcard .cqbtn:disabled { opacity: .5; }

.capcard .capblk { margin-bottom: 11px; }
.capcard .cbt { font-family: var(--mono); font-size: .56rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-dim); margin-bottom: 4px; }
.capcard .capstale { color: var(--warn); letter-spacing: .02em; text-transform: none; }
.capcard .cbb { font-size: .78rem; color: var(--ink-dim); line-height: 1.6; }
.capcard .cbb p { margin: 0 0 6px; }
.capcard .cbb ul { margin: 0 0 6px; padding-left: 16px; }
.capcard .cbb li { margin-bottom: 3px; }
.capcard .cbb b { color: var(--ink); font-weight: 500; }

.capcard .capacts { display: flex; flex-direction: column; }
.capcard .capact { display: flex; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line-soft); }
.capcard .capact:last-child { border-bottom: none; }
.capcard .cad { flex: none; width: 74px; font-family: var(--mono); font-size: .6rem; color: var(--ink-faint); padding-top: 1px; }
.capcard .cat { font-size: .76rem; color: var(--ink); line-height: 1.45; }
.capcard .caw { display: block; font-size: .66rem; color: var(--ink-faint); margin-top: 2px; line-height: 1.4; }

.capcard .capbtns { display: flex; gap: 6px; flex-wrap: wrap; }
.capcard .capbtn { font-family: var(--mono); font-size: .58rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 8px; padding: 6px 12px; transition: .15s; }
.capcard .capbtn:hover { color: var(--accent); border-color: var(--accent); }
.capcard .capbtn.on { color: #1a1206; background: var(--accent); border-color: var(--accent); }
.capcard .capbtn.pri { color: #1a1206; background: var(--accent); border-color: var(--accent); }
.capcard .capbtn:disabled { opacity: .5; }
.capcard .capdec .capnote { margin-top: 7px; font-family: var(--mono); font-size: .56rem; }

/* tier upgrade block */
.capcard .capupg { border: 1px dashed var(--line); border-radius: 10px; padding: 12px 14px; background: var(--field); }
.capcard .capupg .capnote { display: block; line-height: 1.5; }
.capcard .capbar { height: 3px; border-radius: 2px; background: var(--line-soft); overflow: hidden; margin-top: 9px; }
.capcard .capbar span { display: block; height: 100%; width: 34%; background: var(--accent); animation: capslide 1.1s ease-in-out infinite; }
@keyframes capslide { 0% { transform: translateX(-100%); } 100% { transform: translateX(320%); } }
.capcard .capnotes { margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--line-soft); font-size: .72rem; color: var(--ink-faint); line-height: 1.55; }
.capcard .capnotes div { margin-bottom: 3px; }
.capcard .capfoot { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line-soft); font-family: var(--mono); font-size: .55rem; color: var(--ink-faint); line-height: 1.5; }
@media (max-width: 620px) { .capcard .caphead { flex-direction: column; } }

/* ============================================================================
 * capture v2 — the sourced-brief experience (rebuilt from mockups/capture-plan-v2.html).
 * Scoped under .capv2 (itself inside .dcard.capcard, so existing .capcard .cbb /
 * .capbtn / .capsh / .capbar rules still apply to reused bits). Colours ride the
 * upstream theme tokens (explorer/hitch-tokens.css) so light + dark both work;
 * --purple is the only local accent (the "only you know this" marker).
 * ========================================================================== */
.capv2 { --purple: #b28fd0; margin-top: 4px; }
.capv2 .you { color: var(--purple); } .capv2 .gold { color: var(--accent); }
.capv2 .up { color: var(--good); } .capv2 .down { color: var(--warn); }
.capv2 .mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }

/* vitals */
.capv2 .vitals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line-soft); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin: 4px 0 6px; }
.capv2 .vital { background: var(--field); padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; min-height: 74px; }
.capv2 .vital.pw { background: linear-gradient(160deg, rgba(232, 161, 60, .08), transparent); }
.capv2 .vital.conv { background: linear-gradient(160deg, rgba(107, 191, 89, .10), transparent); }
.capv2 .vital.vred { background: linear-gradient(160deg, rgba(217, 140, 95, .10), transparent); }
.capv2 .vl { font-family: var(--mono); font-size: .54rem; text-transform: uppercase; letter-spacing: .12em; color: var(--ink-faint); }
.capv2 .vv { font-family: var(--serif); font-size: 1.4rem; line-height: 1; color: var(--ink); }
.capv2 .vital.pw .vv { color: var(--accent); } .capv2 .vital.conv .vv { color: var(--good); } .capv2 .vital.vred .vv { color: var(--warn); }
.capv2 .vv.mono { font-family: var(--mono); font-size: 1rem; font-weight: 500; }
.capv2 .vs { font-family: var(--mono); font-size: .6rem; color: var(--ink-dim); line-height: 1.4; }
.capv2 .cvbar { display: flex; gap: 2px; margin-top: 3px; }
.capv2 .cvbar b { height: 5px; border-radius: 2px; background: var(--accent); opacity: .9; cursor: pointer; transition: .2s; }
.capv2 .cvbar b:hover { opacity: 1; box-shadow: 0 0 0 2px rgba(232, 161, 60, .25); }
.capv2 .cvbar b.hum { background: var(--purple); opacity: .55; }

/* sub-tabs + panels */
.capv2 .captabbar { display: flex; gap: 2px; align-items: center; border-bottom: 1px solid var(--line); margin: 12px 0 18px; flex-wrap: wrap; }
.capv2 .captab { font-family: var(--mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .09em; color: var(--ink-dim); padding: 10px 13px; border-bottom: 2px solid transparent; transition: .2s; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.capv2 .captab:hover { color: var(--ink); }
.capv2 .captab.on { color: var(--ink); border-bottom-color: var(--accent); }
.capv2 .captab .cnt { font-size: .6rem; color: var(--ink-faint); }
.capv2 .captab.on .cnt { color: var(--accent); }
.capv2 .cappanel { display: none; }
.capv2 .cappanel.on { display: block; animation: capfade .3s ease; }
@keyframes capfade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* verdict / read prose */
.capv2 .verdict { font-family: var(--serif); font-size: 1.7rem; line-height: 1.1; color: var(--ink); margin-bottom: 10px; }
.capv2 .verdict.sm { font-size: 1.35rem; }
.capv2 .read { font-size: .9rem; line-height: 1.65; color: var(--ink-dim); max-width: 66ch; }
.capv2 .read.sm { font-size: .8rem; margin-bottom: 14px; }
.capv2 .read p { margin: 0 0 7px; } .capv2 .read b { color: var(--ink); font-weight: 500; }

/* call row (overview) */
.capv2 .callrow { display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: start; margin: 4px 0 22px; }
.capv2 .callstamp { border: 1.5px solid var(--line); border-radius: 12px; padding: 15px 17px; text-align: center; min-width: 140px; }
.capv2 .callstamp.conv { border-color: rgba(107, 191, 89, .5); background: radial-gradient(circle at 50% 0%, rgba(107, 191, 89, .1), transparent 70%); }
.capv2 .callstamp.vred { border-color: rgba(217, 140, 95, .5); }
.capv2 .callstamp .cl { font-family: var(--mono); font-size: .53rem; letter-spacing: .2em; color: var(--ink-faint); text-transform: uppercase; }
.capv2 .callstamp .cw { font-family: var(--serif); font-size: 1.9rem; color: var(--ink); line-height: 1; margin: 6px 0 3px; }
.capv2 .callstamp.conv .cw { color: var(--good); } .capv2 .callstamp.vred .cw { color: var(--warn); }
.capv2 .callstamp .cn { font-family: var(--mono); font-size: .68rem; color: var(--ink-dim); }
.capv2 .callstamp .cmicro { font-family: var(--mono); font-size: .53rem; color: var(--ink-faint); margin-top: 8px; letter-spacing: .03em; line-height: 1.7; }

/* section rule */
.capv2 .section { display: flex; align-items: center; gap: 11px; margin: 26px 0 13px; }
.capv2 .section .sk { font-family: var(--mono); font-size: .68rem; color: var(--accent); }
.capv2 .section .sn { font-family: var(--serif); font-size: 1.2rem; color: var(--ink); }
.capv2 .section .rule { flex: 1; height: 1px; background: var(--line-soft); }
.capv2 .section .cnt { font-family: var(--mono); font-size: .58rem; color: var(--ink-faint); text-transform: uppercase; letter-spacing: .09em; }

/* cards + board */
.capv2 .board { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.capv2 .card { background: var(--field); border: 1px solid var(--line); border-radius: 12px; padding: 15px 16px; margin-bottom: 13px; }
.capv2 .card.hl { border-color: rgba(232, 161, 60, .35); box-shadow: 0 0 0 1px rgba(232, 161, 60, .1), 0 8px 40px rgba(232, 161, 60, .04); }
.capv2 .board .card { margin-bottom: 0; }
.capv2 .c-head { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.capv2 .c-head .ic { font-size: .9rem; color: var(--ink-dim); }
.capv2 .c-head h3 { font-size: .88rem; font-weight: 500; color: var(--ink); letter-spacing: .01em; margin: 0; }
.capv2 .c-head .r { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.capv2 .srcbadge { font-family: var(--mono); font-size: .5rem; text-transform: uppercase; letter-spacing: .07em; padding: 2px 7px; border-radius: 100px; color: var(--ink-dim); border: 1px solid var(--line); white-space: nowrap; }
.capv2 .srcbadge.live { color: var(--good); border-color: rgba(107, 191, 89, .4); }
.capv2 .srcbadge.pub { color: var(--accent); border-color: rgba(232, 161, 60, .4); }
.capv2 .srcbadge.hum { color: var(--purple); border-color: rgba(178, 143, 208, .45); }
.capv2 .srcbadge.rd { color: var(--blue); border-color: rgba(111, 176, 232, .4); }
.capv2 .callout { font-size: .76rem; color: var(--ink-dim); margin-top: 11px; line-height: 1.55; }
.capv2 .callout.small { font-size: .68rem; color: var(--ink-faint); }
.capv2 .callout b { color: var(--accent-soft); font-weight: 500; }
.capv2 .sub-h { font-family: var(--mono); font-size: .55rem; text-transform: uppercase; letter-spacing: .12em; color: var(--ink-faint); margin: 14px 0 8px; padding-top: 10px; border-top: 1px solid var(--line-soft); }

/* list rows */
.capv2 .lrow { display: grid; grid-template-columns: auto 1fr auto; gap: 11px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line-soft); }
.capv2 .card > .lrow:first-of-type { border-top: none; }
.capv2 .lic { width: 25px; height: 25px; border-radius: 7px; display: grid; place-items: center; font-size: .78rem; background: rgba(255, 255, 255, .04); color: var(--ink-dim); flex: none; font-family: var(--mono); }
.capv2 .lic.award { background: rgba(107, 191, 89, .1); color: var(--good); }
.capv2 .lic.opp { background: rgba(232, 161, 60, .1); color: var(--accent); }
.capv2 .lic.mark { background: rgba(111, 176, 232, .1); color: var(--blue); }
.capv2 .lic.hum { background: rgba(178, 143, 208, .1); color: var(--purple); }
.capv2 .lic.risk { background: rgba(217, 140, 95, .12); color: var(--warn); }
.capv2 .ltitle { font-size: .8rem; color: var(--ink); line-height: 1.35; }
.capv2 .lmeta { display: flex; gap: 9px; flex-wrap: wrap; font-family: var(--mono); font-size: .61rem; color: var(--ink-faint); margin-top: 3px; }
/* let the middle grid column shrink so a long "why" wraps within it instead of
   overflowing the row on one line (min-width:auto would let it grow to content) */
.capv2 .lrow > div:nth-child(2) { min-width: 0; }
.capv2 .lmeta .lwhy { flex-basis: 100%; min-width: 0; white-space: normal; overflow-wrap: anywhere; line-height: 1.5; }
.capv2 .lmeta .via { color: var(--accent); opacity: .8; }
.capv2 .lright { text-align: right; white-space: nowrap; }
.capv2 .pill-due { font-family: var(--mono); font-size: .58rem; padding: 3px 9px; border-radius: 100px; border: 1px solid var(--line); color: var(--ink-dim); white-space: nowrap; }
.capv2 .pill-due.soon { color: var(--warn); border-color: rgba(217, 140, 95, .4); background: rgba(217, 140, 95, .06); }
.capv2 .pill-due.ok { color: var(--good); border-color: rgba(107, 191, 89, .4); }

/* pwin bars */
.capv2 .bar-row { display: grid; grid-template-columns: 1fr auto; gap: 3px 10px; align-items: center; margin-bottom: 11px; }
.capv2 .bar-row .bl { font-size: .78rem; color: var(--ink); }
.capv2 .bar-val { font-family: var(--mono); font-size: .72rem; color: var(--ink-dim); text-align: right; }
.capv2 .bar-track { grid-column: 1 / -1; height: 6px; background: rgba(255, 255, 255, .05); border-radius: 100px; overflow: hidden; }
.capv2 .bar-fill { height: 100%; border-radius: 100px; background: var(--ink-faint); }
.capv2 .bar-fill.on { background: linear-gradient(90deg, var(--accent), var(--accent-soft)); }
.capv2 .bar-fill.hum { background: repeating-linear-gradient(90deg, var(--purple) 0 6px, rgba(178, 143, 208, .35) 6px 12px); }
.capv2 .bar-basis { grid-column: 1 / -1; font-size: .67rem; color: var(--ink-faint); line-height: 1.45; margin-top: 2px; }
.capv2 .tagd { font-family: var(--mono); font-size: .53rem; color: var(--ink-faint); border: 1px solid var(--line); border-radius: 4px; padding: 1px 5px; margin-left: 5px; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.capv2 .tagd.data { color: var(--blue); border-color: rgba(111, 176, 232, .4); }
.capv2 .tagd.you { color: var(--purple); border-color: rgba(178, 143, 208, .45); }

/* fronts */
.capv2 .fronts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; }
.capv2 .front { background: var(--field); border: 1px solid var(--line); border-radius: 11px; padding: 13px 14px; text-align: left; transition: .2s; display: flex; flex-direction: column; gap: 6px; min-height: 112px; }
.capv2 .front:hover { border-color: var(--accent); transform: translateY(-2px); }
.capv2 .front .fk { font-family: var(--mono); font-size: .54rem; text-transform: uppercase; letter-spacing: .11em; color: var(--accent); }
.capv2 .front .ff { font-family: var(--serif); font-size: 1.2rem; color: var(--ink); line-height: 1; }
.capv2 .front .fd { font-size: .74rem; color: var(--ink-dim); line-height: 1.45; flex: 1; }
.capv2 .front .fgo { font-family: var(--mono); font-size: .6rem; color: var(--accent); }

/* price buckets */
.capv2 .buckets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.capv2 .bkt { background: rgba(255, 255, 255, .03); border: 1px solid var(--line-soft); border-radius: 9px; padding: 11px; text-align: center; }
.capv2 .bkt.pt { border-color: rgba(232, 161, 60, .5); background: rgba(232, 161, 60, .06); }
.capv2 .bkt .bv { font-family: var(--serif); font-size: 1.35rem; color: var(--ink); } .capv2 .bkt.pt .bv { color: var(--accent); }
.capv2 .bkt .bl { font-family: var(--mono); font-size: .53rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-faint); margin-top: 4px; }

/* question queue */
.capv2 .qrow { border: 1px solid var(--line-soft); border-radius: 10px; background: rgba(255, 255, 255, .02); padding: 11px 12px; margin-bottom: 9px; }
.capv2 .qrow.done { border-color: rgba(178, 143, 208, .4); }
.capv2 .qrow .qt { font-size: .79rem; color: var(--ink); line-height: 1.45; }
.capv2 .qrow .qm { font-family: var(--mono); font-size: .57rem; color: var(--ink-faint); margin-top: 3px; }
.capv2 .qrow .opts { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.capv2 .opt { font-family: var(--mono); font-size: .55rem; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-dim); border: 1px solid var(--line); border-radius: 100px; padding: 3px 10px; transition: .15s; }
.capv2 .opt:hover { color: var(--ink); border-color: var(--ink-dim); }
.capv2 .opt.onx { color: #1a1206; background: var(--purple); border-color: var(--purple); }
.capv2 .qrow .eff { font-family: var(--mono); font-size: .57rem; color: var(--purple); margin-top: 6px; }

/* decision + deepen + hints */
.capv2 .capdec .capbtns { margin-top: 2px; }
/* the decision + deepen controls reuse the .cap* button classes, which were
   scoped to the retired .capcard wrapper — restate them for .capv2 so they are
   styled in the live full-page view and the dossier embed (not run-together text). */
.capv2 .capbtns { display: flex; gap: 6px; flex-wrap: wrap; }
.capv2 .capbtn { font-family: var(--mono); font-size: .58rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-dim); background: transparent; border: 1px solid var(--line); border-radius: 8px; padding: 6px 12px; cursor: pointer; transition: .15s; }
.capv2 .capbtn:hover { color: var(--accent); border-color: var(--accent); }
.capv2 .capbtn.on { color: #1a1206; background: var(--accent); border-color: var(--accent); }
.capv2 .capbtn.pri { color: #1a1206; background: var(--accent); border-color: var(--accent); }
.capv2 .capbtn:disabled { opacity: .5; }
.capv2 .capsh { font-family: var(--mono); font-size: .56rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 9px; }
.capv2 .capsh .capnote { color: var(--ink-faint); text-transform: none; letter-spacing: .02em; }
.capv2 .capbar { height: 4px; border-radius: 2px; background: var(--line-soft); overflow: hidden; margin-top: 8px; }
.capv2 .capbar span { display: block; height: 100%; width: 34%; background: var(--accent); animation: capslide 1.1s ease-in-out infinite; }
.capv2 .capnotes { margin-top: 10px; font-size: .72rem; color: var(--ink-faint); line-height: 1.55; }
.capv2 .capupg { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line-soft); }
.capv2 .cap-hint { border: 1px dashed var(--line); border-radius: 10px; padding: 12px 14px; }
.capv2 .cap-link { font-family: var(--mono); font-size: .68rem; color: var(--accent); border-bottom: 1px solid rgba(232, 161, 60, .4); }
.capv2 .cap-link:hover { color: var(--accent-soft); }
.capv2 .foot-note { margin-top: 30px; padding-top: 15px; border-top: 1px solid var(--line-soft); font-size: .68rem; color: var(--ink-faint); line-height: 1.6; }
.capv2 .foot-note b { color: var(--ink-dim); font-weight: 500; }

@media (max-width: 720px) {
  .capv2 .vitals { grid-template-columns: repeat(2, 1fr); }
  .capv2 .board, .capv2 .fronts, .capv2 .callrow { grid-template-columns: 1fr; }
  .capv2 .buckets { grid-template-columns: 1fr; }
}

/* ---- the live capture VIEW (state.view === "capture"): full-page brief off
   the board, plus the masthead and the board entry affordances ------------- */
.capv2.capfull { max-width: 1180px; margin: 0 auto; }
.capv2.capfull .vitals { grid-template-columns: 1.3fr 1.2fr 1fr 1fr 1fr 1.1fr; }
.capmast { max-width: 1180px; margin: 8px auto 4px; }
.capmast__kick { font-family: var(--mono); font-size: .62rem; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); display: flex; align-items: center; gap: 9px; margin-bottom: 8px; }
.capmast__kick .rule { width: 26px; height: 1px; background: var(--accent); opacity: .6; }
.capmast__title { font-family: var(--serif); font-size: 2.3rem; line-height: 1.02; color: var(--ink); margin: 0; max-width: 24ch; }
.capmast__by { margin-top: 9px; color: var(--ink-dim); font-size: .72rem; font-family: var(--mono); letter-spacing: .02em; }
.capmast__chips { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 10px; }
.capmast .dchip { display: inline-flex; align-items: center; font-family: var(--mono); font-size: .64rem; padding: 3px 9px; border-radius: 100px; color: var(--ink); border: 1px solid var(--line); }
.capmast .dchip.term { color: var(--accent-soft); border-color: rgba(232, 161, 60, .35); background: rgba(232, 161, 60, .07); }
.capmast__actions { display: flex; align-items: center; gap: 14px; margin-top: 14px; flex-wrap: wrap; }

/* board card: the capture chip + the ◈ Plan button are entry points */
.ccap { cursor: pointer; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; transition: border-color .15s; }
.ccap:hover { border-color: var(--accent); }
.ccap-go { font-family: var(--mono); font-size: .55rem; letter-spacing: .04em; text-transform: uppercase; color: var(--accent); margin-left: auto; }
.cbtn-cap { color: var(--accent); border-color: rgba(232, 161, 60, .4); font-family: var(--mono); font-size: .62rem; }
.cbtn-cap:hover { background: rgba(232, 161, 60, .1); }

@media (max-width: 900px) {
  .capv2.capfull .vitals { grid-template-columns: repeat(2, 1fr); }
  .capmast__title { font-size: 1.9rem; }
}

/* ---- capture-plan first-load loader (Ask-Hitch family; .ask-loading /
   .ask-loadmsg / .ask-loadsub come from global-search.css) ------------------ */
.cap-loading { min-height: 360px; justify-content: center; }
.cap-orb { width: 60px; height: 60px; border-radius: 50%; margin-bottom: 4px;
  background: radial-gradient(circle at 35% 30%, var(--accent-soft, #f0c98a), var(--accent, #e8a13c) 55%, rgba(232, 161, 60, .12) 100%);
  box-shadow: 0 0 34px rgba(232, 161, 60, .35); animation: capOrb 1.6s ease-in-out infinite; }
@keyframes capOrb { 0%, 100% { transform: scale(.82); opacity: .68; } 50% { transform: scale(1); opacity: 1; } }

/* ---- embed mode (?embed=1): the dossier CAPTURE tab iframes the capture view,
   so strip the site chrome and show only the brief ------------------------- */
body.embed .grain, body.embed .topbar, body.embed .rail { display: none !important; }
/* NO colour override here — the embed FOLLOWS the dossier's theme, which the
   dossier passes (?theme=) and postMessages on toggle, applied as body.light. So
   it matches the dossier in both light and dark. The backdrop comes from the
   base `html, body { background: var(--bg) }` rule, which tracks the theme. */
body.embed .app, body.embed .workspace { display: block; gap: 0; }
body.embed .main { padding: 16px 18px; }
body.embed .capv2.capfull { max-width: none; }

/* The team a board belongs to (Phase C / 0044). Rendered only when the user is
   on more than one team — otherwise it repeats on every tab and says nothing. */
.pltab .plteam{
  display:block; font-style:normal; font-family:var(--mono,monospace);
  font-size:.56rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-faint,#6b675d); margin-top:2px;
}
.pltab.on .plteam{ color:inherit; opacity:.7; }