/* Bird Dog design system v1 (dec-0146 / wi-0192).
   The single stylesheet for every user-facing surface. Source of truth is
   docs/design/design-system.md; this file is the §2 tokens verbatim plus the
   §3 component styles the mockups (docs/design/mockups/) demonstrate.
   Budget: <=12KB gzipped. Light mode only in v1 (§5, deliberate non-goal).
   JS is progressive enhancement only; every rule here works without it. */

/* ---- §2 tokens ------------------------------------------------------------ */
:root {
  --ink:#1b1b1b; --ink-2:#565c65; --ink-3:#757575;
  --brand:#005ea2; --brand-dark:#1a4480;
  --surface:#fff; --surface-alt:#f0f6fb; --border:#dfe1e2; --focus:#2491ff;
  /* winnability tier palette — reserved status colors, never reused for charts */
  --t-open:#2e8540; --t-open-bg:#e7f4e4; --t-open-tx:#205c31;
  --t-shot:#005ea2; --t-shot-bg:#e1effa; --t-shot-tx:#074f83;
  --t-long:#9a5a00; --t-long-bg:#faf0dc; --t-long-tx:#7a4c00;
  --t-gate:#49515e; --t-gate-bg:#eef0f3; --t-gate-tx:#3d444d;
  /* destructive actions (account deletion, revoke) — civic red, not a chart hue */
  --danger:#b50909; --danger-bg:#f8dfe2; --danger-tx:#8b0a03;
}

/* ---- base ----------------------------------------------------------------- */
*,*::before,*::after { box-sizing: border-box; }
body { margin:0; font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
       color: var(--ink); background: var(--surface); font-size:14.5px; line-height:1.45; }
a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--brand-dark); text-decoration: underline; }
h1,h2,h3,h4,p,ul { margin:0; }
img { max-width:100%; }

/* §5 accessibility: visible focus everywhere; motion only on request */
:focus-visible { outline:2px solid var(--focus); outline-offset:2px; border-radius:2px; }
@media (prefers-reduced-motion: reduce) { * { transition:none !important; } }

/* ---- §3.6 nav ------------------------------------------------------------- */
.nav { display:flex; justify-content:space-between; align-items:center;
       padding:13px 20px; border-bottom:1px solid var(--border); }
.logo { font-weight:700; font-size:18px; color:var(--brand); letter-spacing:-.2px; }
.navlinks { font-size:13px; color:var(--ink-2); display:flex; gap:18px; align-items:center; }
.navlinks a { color: var(--ink-2); }
.navlinks a.active { color: var(--brand); font-weight:600; }
/* mobile: links collapse into a no-JS <details> sheet */
.navmenu { position:relative; }
.navmenu > summary { list-style:none; cursor:pointer; font-size:13px; color:var(--ink-2);
       padding:6px 10px; min-height:44px; display:inline-flex; align-items:center; }
.navmenu > summary::-webkit-details-marker { display:none; }
.navmenu[open] > summary { color:var(--brand); }
.navmenu .sheet { position:absolute; right:0; top:100%; background:var(--surface);
       border:1px solid var(--border); border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,.08);
       padding:8px 4px; min-width:180px; z-index:20; display:flex; flex-direction:column; }
.navmenu .sheet a { padding:10px 16px; min-height:44px; display:flex; align-items:center; }
@media (min-width:700px){ .navmenu { display:none; } }
@media (max-width:699px){ .navlinks.wide { display:none; } }

/* ---- layout --------------------------------------------------------------- */
.wrap { max-width: 1024px; margin: 0 auto; padding: 0 20px; }
main.split { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:36px; padding-top:24px; }
@media (max-width:899px){ main.split{ grid-template-columns:1fr; } .rail{ order:2; } }

/* ---- headings / hero text ------------------------------------------------- */
h1 { font-size:26px; line-height:1.23; font-weight:700; letter-spacing:-.3px; }
@media (min-width:900px){ h1{ font-size:32px; } }
h2 { font-size:20px; line-height:1.3; font-weight:700; }
.sub { color:var(--ink-2); margin-top:8px; max-width:56ch; }
.crumb { font-size:12.5px; color:var(--ink-3); margin-bottom:10px; }
.eyebrow { font-size:11.5px; font-weight:700; letter-spacing:.4px; color:var(--ink-2);
           text-transform:uppercase; }

/* ---- §3.3 "what do you do?" hero (front door, Phase 3) -------------------- */
.ask { margin-top:18px; position:relative; max-width:560px; }
.ask input { width:100%; font-size:16px; padding:13px 44px 13px 16px; border:2px solid var(--brand);
             border-radius:8px; color:var(--ink); font-family:inherit; }
.ask input::placeholder { color:var(--ink-3); }
.ask .go { position:absolute; right:6px; top:6px; height:39px; background:var(--brand); color:#fff;
           border:none; border-radius:6px; padding:0 16px; font-weight:700; font-size:14px; cursor:pointer; }
.ask .hint { font-size:12.5px; color:var(--ink-3); margin-top:6px; }

/* ---- §3.2 stat tiles ------------------------------------------------------ */
.stats { display:flex; gap:10px; margin:20px 0 4px; }
.stat { flex:1; background:var(--surface-alt); border-radius:8px; padding:10px 14px; }
.stat b { display:block; font-size:20px; font-weight:700; font-variant-numeric:tabular-nums; }
.stat span { font-size:11.5px; color:var(--ink-2); }

/* ---- §3.7 filter pills (allowlisted params, removable) -------------------- */
.filters { display:flex; gap:8px; flex-wrap:wrap; margin:16px 0 4px; font-size:13px; }
.pill { border:1px solid var(--border); border-radius:999px; padding:5px 14px; color:var(--ink-2);
        background:#fff; display:inline-block; }
.pill.on { border-color:var(--brand); color:var(--brand); font-weight:600; }
.pill.x::after { content:" \2715"; font-size:11px; }

/* ---- §3.7 feed filter bar (allowlisted GET params, dec-0097) ------------- */
.feedbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:16px 0 6px; }
.feedbar label { display:flex; flex-direction:column; gap:2px; font-size:11px; color:var(--ink-3);
       text-transform:uppercase; letter-spacing:.03em; font-weight:700; }
.feedbar input[type=search] { flex:1 1 220px; font-size:16px; padding:8px 12px; }
.feedbar select { font-size:13.5px; padding:8px 10px; }
.feedbar .clear { align-self:flex-end; font-size:13px; padding:8px 4px; }
.feedcount { font-size:12.5px; color:var(--ink-3); margin:6px 0 4px; }
/* wi-0189 internal-linking strip (crawlable category links) */
.feed-cat-nav { display:flex; flex-wrap:wrap; gap:6px 8px; margin:14px 0 4px; align-items:baseline; font-size:13px; }
.feed-cat-nav .feed-cat-label { color:var(--ink-3); font-weight:700; text-transform:uppercase;
       letter-spacing:.03em; font-size:11px; }
.feed-cat-nav a { display:inline-block; padding:3px 11px; border-radius:999px; border:1px solid var(--border);
       background:var(--surface-alt); color:var(--ink-2); }
.feed-cat-nav a:hover { border-color:var(--brand); text-decoration:none; }
.feed-cat-nav a.is-active { background:var(--brand); color:#fff; border-color:var(--brand); }

/* category-hub teaching intro (dec-0151) — tinted, once per page */
.note { background:var(--surface-alt); border:1px solid transparent; border-radius:8px;
       padding:12px 16px; margin:14px 0 4px; font-size:13.5px; color:var(--ink-2); line-height:1.55; }

/* ---- feed load-more + honest empty state --------------------------------- */
.loadmore { display:block; text-align:center; padding:12px; margin:12px 0 0;
       border:1px solid var(--border); border-radius:8px; background:var(--surface-alt);
       color:var(--ink); font-weight:600; }
.loadmore:hover { text-decoration:none; background:#e6eef6; }
.empty { border:1px solid var(--border); border-radius:8px; padding:32px 20px; text-align:center;
       margin-top:16px; }
.empty h2 { font-size:18px; margin-bottom:8px; }
.empty p { color:var(--ink-2); margin-bottom:12px; }

/* ---- §3.1 the card (atomic unit, all surfaces) ---------------------------- */
.card { border:1px solid var(--border); border-radius:8px; background:var(--surface);
        box-shadow:0 1px 2px rgba(0,0,0,.05); padding:16px; margin-top:12px; }
.kind { font-size:11.5px; font-weight:700; letter-spacing:.4px; margin-bottom:8px; }
.kind.ss { color:#6b3fa0; } .kind.qg { color:var(--brand-dark); }
.toprow { display:flex; justify-content:space-between; align-items:center; gap:12px; }
/* §2 tier chip — never color alone: glyph + label always */
.chip { display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:4px 11px;
        font-size:11.5px; font-weight:700; letter-spacing:.2px; }
.chip.open { background:var(--t-open-bg); color:var(--t-open-tx); }
.chip.shot { background:var(--t-shot-bg); color:var(--t-shot-tx); }
.chip.long { background:var(--t-long-bg); color:var(--t-long-tx); }
.chip.gate { background:var(--t-gate-bg); color:var(--t-gate-tx); }
.due { font-size:12.5px; color:var(--ink-3); font-variant-numeric:tabular-nums; }
.card h3 { font-size:17px; line-height:1.3; font-weight:700; margin:9px 0 5px; }
.card h3 a { color:var(--ink); }
.facts { font-size:13px; color:var(--ink-2); }
.why { margin-top:10px; font-size:13px; background:var(--surface-alt); border-radius:0 6px 6px 0;
       padding:8px 12px; }
.why.open { border-left:3px solid var(--t-open); }
.why.shot { border-left:3px solid var(--t-shot); }
.why.long { border-left:3px solid var(--t-long); }
.why.gate { border-left:3px solid var(--t-gate); }
.reasons { margin-top:8px; font-size:13.5px; color:var(--ink-2); }
.reasons li { margin:3px 0 3px 18px; }

/* ---- §3.7 buttons & controls (one primary per view) ----------------------- */
.cta { display:inline-block; margin-top:12px; background:var(--brand); color:#fff; font-weight:700;
       font-size:13.5px; padding:9px 24px; border-radius:6px; border:none; cursor:pointer;
       min-height:40px; transition:background .12s; }
.cta:hover { background:var(--brand-dark); color:#fff; text-decoration:none; }
.cta.ghost { background:#fff; color:var(--brand); border:1.5px solid var(--brand); }
.cta.ghost:hover { background:var(--surface-alt); color:var(--brand-dark); }
input, select, textarea { font-family:inherit; font-size:16px; border:1px solid var(--border);
       border-radius:6px; padding:9px 12px; color:var(--ink); background:#fff; }

/* ---- §3.5 verdict strip (paid; matches surface) --------------------------- */
.verdict { margin-top:12px; border-top:1px solid var(--border); padding-top:10px; font-size:13px; }
.verdict .eyebrow { margin-bottom:2px; }
.verdict.yes b { color:var(--t-open-tx); } .verdict.no b { color:var(--t-gate-tx); }
.verdict .fine { color:var(--ink-3); font-size:12px; margin-top:3px; }

/* ---- §3.4 context rail ---------------------------------------------------- */
.rail { font-size:13px; }
.railbox { border:1px solid var(--border); border-radius:8px; padding:14px 16px; margin-bottom:14px; }
.railbox h4 { font-size:11.5px; font-weight:700; letter-spacing:.4px; color:var(--ink-2);
              text-transform:uppercase; margin-bottom:8px; }
.railbox ul { list-style:none; padding:0; }
.railbox li { display:flex; justify-content:space-between; padding:4px 0; }
.railbox li span.n { color:var(--ink-3); font-variant-numeric:tabular-nums; }
.railbox.tint { background:var(--surface-alt); border-color:transparent; }
.railbox p { color:var(--ink-2); }
@media (min-width:900px){ .rail .sticky { position:sticky; top:16px; } }

/* ---- notice detail (§4) --------------------------------------------------- */
.dtable { width:100%; border-collapse:collapse; margin-top:14px; font-size:13.5px; }
.dtable td { padding:8px 0; border-bottom:1px solid var(--border); }
.dtable td:first-child { color:var(--ink-3); font-size:11.5px; font-weight:700;
                         letter-spacing:.4px; text-transform:uppercase; width:130px; }
.panel { border:1px solid var(--border); border-radius:8px; padding:14px 16px; margin-top:16px; }
.panel h4 { font-size:13.5px; font-weight:700; margin-bottom:6px; }
.panel ul { margin:4px 0 0 18px; color:var(--ink-2); font-size:13.5px; }

/* ---- §4 matches (authed app surface) — tier groups, cards, dock ---------- */
.tgroup { margin-top:22px; }
.tgroup > .thead { display:flex; align-items:center; gap:8px; font-size:15px; font-weight:700;
       color:var(--ink); margin:0 0 2px; }
.tdot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.tdot.strong { background:var(--t-open); } .tdot.possible { background:var(--t-long); }
.tdot.broad { background:var(--ink-3); }
.thelp { font-size:12.5px; color:var(--ink-2); margin:0 0 6px; }
.tempty { font-size:13px; color:var(--ink-3); font-style:italic; padding:12px 0; }
.broad-details { margin-top:4px; }
.broad-details > summary { cursor:pointer; font-size:13px; color:var(--ink-2); padding:10px 12px;
       list-style:none; border-radius:8px; background:var(--surface-alt); user-select:none; min-height:40px;
       display:flex; align-items:center; }
.broad-details > summary::-webkit-details-marker { display:none; }
.broad-details[open] > summary { margin-bottom:12px; }
/* unlocked card: brand accent + revealed detail blocks */
.card.unlocked { border-color:var(--brand); background:#f7fbfe; }
.card .tag { display:inline-flex; align-items:center; gap:5px; border-radius:999px; padding:3px 10px;
       font-size:11.5px; font-weight:700; background:var(--t-shot-bg); color:var(--t-shot-tx); }
.card .tag.amend { background:var(--t-long-bg); color:var(--t-long-tx); }
.card .whymatch { margin-top:12px; border-top:1px solid var(--border); padding-top:10px; }
.card .whymatch .eyebrow { margin-bottom:6px; }
.vrow { display:flex; align-items:baseline; gap:8px; font-size:13px; margin:3px 0; }
.vrow .vi { font-weight:700; } .vrow .vi.ok { color:var(--t-open-tx); } .vrow .vi.no { color:var(--danger-tx); }
.vrow .vi.warn { color:var(--t-long-tx); } .vrow .vi.flex { color:var(--ink-2); }
.vrow .vd { font-weight:600; color:var(--ink); min-width:82px; } .vrow .vt { color:var(--ink-2); }
.card .sow, .card .poc, .card .nextstep { margin-top:12px; border-top:1px solid var(--border); padding-top:10px;
       font-size:13px; color:var(--ink-2); }
.card .nextstep { background:var(--surface-alt); border:0; border-radius:8px; padding:10px 12px; color:var(--brand-dark); }
.card .watchnote { margin-top:10px; font-size:12px; color:var(--ink-3); }
.card .report { margin-top:10px; }
.card .report > summary { cursor:pointer; font-size:12.5px; color:var(--ink-3); list-style:none; }
.card .report > summary::-webkit-details-marker { display:none; }
.card .report input[type=text] { width:100%; margin:8px 0 6px; font-size:14px; }
.card .report button { font-size:12.5px; padding:6px 14px; }
.reported { margin-top:10px; font-size:12.5px; color:var(--t-open-tx); background:var(--t-open-bg);
       border-radius:6px; padding:8px 12px; }
/* first-unlock-guarantee credit banner (top of page) */
.mbanner { border-radius:8px; padding:12px 16px; margin:16px 0 4px; font-size:13.5px; }
.mbanner.credit { background:var(--t-open-bg); color:var(--t-open-tx); }
.mbanner b { font-weight:700; }
/* match filter bar (allowlisted GET params, dec-0097/0127) */
.match-filter-bar { display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px 10px; margin:16px 0 4px;
       padding:10px 12px; border:1px solid var(--border); border-radius:8px; background:var(--surface-alt); }
.match-filter-field { display:inline-flex; flex-direction:column; gap:3px; flex:0 1 auto; }
.match-filter-field > span { font-size:11px; color:var(--ink-3); font-weight:700; text-transform:uppercase;
       letter-spacing:.03em; }
.match-filter-select { padding:7px 9px; font-size:13.5px; min-height:40px; }
.match-filter-sort { margin-left:auto; }
@media (min-width:481px){ .match-filter-sort { padding-left:14px; border-left:1px solid var(--border); } }
.match-filter-apply, .match-filter-clear { padding:8px 12px; border:1px solid var(--border); border-radius:6px;
       background:#fff; color:var(--ink-2); font-size:13px; font-weight:600; cursor:pointer; align-self:flex-end; }
.match-filter-clear { text-decoration:none; white-space:nowrap; }
.match-filter-clear:hover { background:var(--surface-alt); text-decoration:none; }
@media (max-width:480px){ .match-filter-field { flex:1 1 calc(50% - 10px); min-width:0; }
       .match-filter-select { width:100%; } .match-filter-sort { margin-left:0; }
       .match-filter-clear { margin-left:0; flex:1 1 100%; text-align:center; } }
/* sticky day-pass / subscription dock (§C-6 option B; JS reveal) */
.daypass-dock { position:fixed; left:0; right:0; bottom:0; z-index:200; background:#fff;
       border-top:1px solid var(--border); box-shadow:0 -2px 8px rgba(0,0,0,.08); display:none; }
.daypass-dock.visible { display:block; }
.daypass-dock-inner { max-width:1024px; margin:0 auto; padding:10px 20px; min-height:56px; display:flex;
       align-items:center; justify-content:space-between; gap:12px; }
.daypass-dock-text { font-size:13px; color:var(--ink); } .daypass-dock-text strong { font-weight:700; }
.daypass-dock form { margin:0; display:flex; align-items:center; gap:8px; }
.daypass-dock-btn { padding:10px 18px; background:var(--brand); color:#fff; border:none; border-radius:6px;
       font-size:13px; font-weight:700; cursor:pointer; white-space:nowrap; min-height:44px; }
.daypass-dock-btn:hover { background:var(--brand-dark); }
.daypass-dock-btn-alt { background:#fff; color:var(--brand); border:1.5px solid var(--brand); }
.daypass-dock-close { background:none; border:none; color:var(--ink-3); cursor:pointer; font-size:20px;
       line-height:1; padding:4px 8px; min-width:44px; min-height:44px; }
@media (max-width:640px){ .daypass-dock-inner { flex-wrap:wrap; justify-content:flex-start; gap:8px; padding:12px; }
       .daypass-dock-text { flex:1 1 100%; } }

/* ---- prose (legal / guides / help reading column, §4 + §6) --------------- */
.prose { max-width:720px; margin:24px auto 0; line-height:1.6; }
.prose h1 { margin-bottom:10px; }
.prose h2 { font-size:20px; margin-top:32px; padding-bottom:5px; border-bottom:1px solid var(--border); }
.prose h3 { font-size:16px; font-weight:700; margin-top:22px; }
.prose p { margin:14px 0; }
.prose ul, .prose ol { margin:12px 0 12px 22px; }
.prose li { margin:5px 0; }
.prose blockquote { background:var(--surface-alt); border-left:3px solid var(--brand); margin:16px 0;
       padding:12px 16px; color:var(--ink-2); font-size:13.5px; border-radius:0 6px 6px 0; }
.prose table { border-collapse:collapse; margin:16px 0; font-size:13.5px; }
.prose th, .prose td { padding:8px 12px; border:1px solid var(--border); text-align:left; }
.prose code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.9em;
       background:var(--surface-alt); padding:1px 5px; border-radius:4px; }
.prose a { text-decoration:underline; }

/* ---- §4 account (profile home) ------------------------------------------- */
.account { max-width:720px; }
.account h2 { font-size:16px; border:0; padding:0; margin-top:30px; }
.account > p { margin:12px 0; }
.account form { margin:10px 0; }
.fine { font-size:12px; color:var(--ink-3); margin-top:6px; }
.check { display:flex; align-items:flex-start; gap:8px; margin:12px 0; cursor:pointer; }
.check input { flex:none; width:auto; margin-top:3px; }
.cta.danger { background:var(--danger); }
.cta.danger:hover { background:var(--danger-tx); }
.cta.sm { font-size:12.5px; padding:6px 14px; min-height:34px; margin-top:0; }
.panel.danger { background:var(--danger-bg); border-color:transparent; }
.panel.ok { background:var(--t-open-bg); border-color:transparent; }
.tokrow { display:flex; align-items:center; justify-content:space-between; gap:12px;
          padding:10px 0; border-bottom:1px solid var(--border); }
code.token { display:block; word-break:break-all; background:#fff; border:1px solid var(--border);
             border-radius:6px; padding:10px 12px; margin:8px 0; font-size:13px;
             font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
details.reveal > summary { cursor:pointer; color:var(--danger-tx); min-height:44px;
             display:inline-flex; align-items:center; }

/* ---- "Your unlocks" library (wi-0167 / dec-0129) ------------------------- */
.ulib { max-width:760px; padding-top:24px; }
.urow { margin-bottom:20px; }
.umeta { display:flex; align-items:center; gap:8px; margin-bottom:6px; font-size:12px; color:var(--ink-3); }
.ustat { display:inline-block; padding:3px 10px; border-radius:12px; font-size:11.5px; font-weight:700; }
.ustat.open { background:var(--t-open-bg); color:var(--t-open-tx); }
.ustat.due, .ustat.amend { background:var(--t-long-bg); color:var(--t-long-tx); }
.ustat.closed { background:var(--t-gate-bg); color:var(--t-gate-tx); }
.upage { display:flex; justify-content:space-between; margin-top:20px; font-size:13.5px; }

/* ---- browse-by-type hubs (/categories index, wi-0189/dec-0146) ----------- */
.cats { padding-bottom:8px; }
.cat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
       gap:14px; margin:20px 0 8px; }
.cat-card { display:block; border:1px solid var(--border); border-radius:8px; background:var(--surface);
       box-shadow:0 1px 2px rgba(0,0,0,.05); padding:16px 18px; color:var(--ink);
       transition:border-color .12s, box-shadow .12s; }
.cat-card:hover { border-color:var(--brand); box-shadow:0 2px 8px rgba(0,0,0,.08); text-decoration:none; }
.cat-card .cat-count { font-size:11.5px; font-weight:700; letter-spacing:.4px;
       text-transform:uppercase; color:var(--brand); }
.cat-card h2 { font-size:16px; margin:6px 0 4px; color:var(--ink); }
.cat-card .cat-blurb { font-size:13px; color:var(--ink-2); line-height:1.5; }

/* ---- §4 profile setup (config app; JS = progressive enhancement) --------- */
main.setup { max-width:680px; margin:0 auto; padding:24px 20px 56px; }
.setup h1 { margin-bottom:6px; }
.setup .subtitle { color:var(--ink-2); font-size:14px; margin-bottom:6px; max-width:60ch; }
.setup .scope-cue { color:var(--ink-3); font-size:13px; margin-bottom:22px; }
.setup form { margin:0; }
.setup input[type=text], .setup input[type=number] { width:100%; margin-bottom:8px; }
.setup textarea { width:100%; min-height:76px; resize:vertical; margin-bottom:4px; line-height:1.5; }
.error-box { background:var(--danger-bg); color:var(--danger-tx); border-radius:8px;
       padding:12px 16px; margin-bottom:18px; font-size:13.5px; }
/* section cards */
.setup fieldset { border:1px solid var(--border); border-radius:10px; padding:20px 22px;
       margin:0 0 16px; min-width:0; }
.setup legend { float:left; width:100%; font-weight:700; font-size:15px; color:var(--ink);
       padding:0; margin:0 0 4px; }
.setup fieldset > legend + * { clear:both; }
.section-desc { font-size:12.5px; color:var(--ink-2); line-height:1.55; margin:0 0 14px; clear:both; }
.field-label { font-weight:600; font-size:12.5px; color:var(--ink-2); display:block; margin-bottom:4px; }
.setup .hint { font-size:12.5px; color:var(--ink-3); line-height:1.55; margin:2px 0 8px; }
.field-chip { display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.05em;
       border-radius:999px; padding:2px 9px; vertical-align:middle; margin-left:6px;
       color:var(--ink-3); border:1px solid var(--border); }
.field-chip.required { background:var(--danger-bg); color:var(--danger-tx); border-color:transparent; }
/* checkbox / radio rows */
.check-label { display:flex; align-items:flex-start; gap:10px; margin-bottom:11px;
       font-size:14px; color:var(--ink); cursor:pointer; line-height:1.4; }
.check-label input { width:auto; margin:2px 0 0; flex:none; }
/* NAICS typeahead picker */
.naics-wrap { position:relative; }
.naics-dropdown { position:absolute; z-index:20; background:#fff; border:1px solid var(--border);
       border-radius:6px; max-height:220px; overflow-y:auto; width:100%;
       box-shadow:0 4px 12px rgba(0,0,0,.12); display:none; }
.naics-item { padding:8px 12px; cursor:pointer; font-size:13px; line-height:1.4; }
.naics-item:hover { background:var(--surface-alt); }
.naics-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.naics-tag { background:var(--t-shot-bg); color:var(--t-shot-tx); border-radius:999px;
       padding:4px 6px 4px 12px; font-size:12.5px; display:flex; align-items:center; gap:4px; }
.naics-tag-remove { border:none; background:none; cursor:pointer; color:var(--ink-2);
       font-size:16px; line-height:1; padding:0; min-width:24px; min-height:24px;
       display:flex; align-items:center; justify-content:center; }
.naics-tag-remove:hover { color:var(--danger-tx); }
/* place of performance conditional sections */
.pop-section { display:none; margin-top:12px; padding-top:12px; border-top:1px solid var(--border); }
.pop-section.active { display:block; }
.state-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
       gap:2px 12px; max-height:260px; overflow-y:auto; border:1px solid var(--border);
       border-radius:6px; padding:10px; }
.state-check { display:flex; align-items:center; gap:6px; font-size:13px; padding:3px 0; }
.state-check input { width:auto; margin:0; }
/* live profile-strength meter (fable-findings 05 #4) */
.strength-box { border-radius:8px; padding:10px 14px; margin:16px 0 4px; font-size:13px;
       display:flex; gap:10px; align-items:baseline; flex-wrap:wrap; }
.strength-label { font-weight:700; white-space:nowrap; }
.strength-thin { background:var(--danger-bg); color:var(--danger-tx); }
.strength-good { background:var(--t-long-bg); color:var(--t-long-tx); }
.strength-sharp { background:var(--t-open-bg); color:var(--t-open-tx); }
/* new-user payoff note + UEI / draft callouts */
.new-user-note { background:var(--surface-alt); border-radius:8px; padding:10px 14px;
       font-size:13px; margin:0 0 16px; line-height:1.55; color:var(--ink-2); }
.uei-callout, .draft-callout { border:1px dashed var(--brand); background:var(--surface-alt);
       border-radius:8px; padding:14px 16px; margin-top:14px; }
.uei-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.uei-row input[type=text] { max-width:220px; margin-bottom:0; }
.uei-btn { padding:9px 16px; font-size:13.5px; font-weight:700; cursor:pointer;
       background:var(--brand); color:#fff; border:none; border-radius:6px; min-height:40px; }
.uei-btn:hover:not(:disabled) { background:var(--brand-dark); }
.uei-btn:disabled { opacity:.7; cursor:wait; }
.uei-chip { display:inline-block; background:var(--t-shot-bg); color:var(--t-shot-tx);
       border:1px solid transparent; border-radius:999px; padding:6px 10px; font-size:12.5px;
       margin:6px 6px 0 0; cursor:pointer; }
.uei-chip:hover:not(:disabled) { background:#d3e6f6; }
.uei-chip:disabled { cursor:default; background:var(--t-open-bg); color:var(--t-open-tx); }
.uei-msg { font-size:13px; margin:8px 0 0; color:var(--ink-2); line-height:1.55; }
.uei-error { color:var(--danger-tx); }
/* save row */
.btn-row { display:flex; gap:12px; align-items:center; margin-top:8px; }
.btn-save { flex:1; padding:12px; background:var(--brand); color:#fff; border:none;
       border-radius:6px; font-size:15px; font-weight:700; cursor:pointer; min-height:44px; }
.btn-save:hover { background:var(--brand-dark); }
@media (max-width:480px){ .btn-row { flex-direction:column; align-items:stretch; }
       .btn-save { flex:none; width:100%; } }
/* config app (dec-0105): sections are independently collapsible cards (JS) */
body.config-active .wizard-step { border:1px solid var(--border); border-radius:10px;
       padding:16px 18px; margin-bottom:14px; background:#fff; }
.config-section-head { display:none; width:100%; text-align:left; background:none; border:none;
       padding:2px 0 8px; font-size:15px; font-weight:700; color:var(--ink); cursor:pointer; }
body.config-active .config-section-head { display:block; }
.config-chevron { display:inline-block; transition:transform .15s; margin-right:6px; }
.config-section-head[aria-expanded="true"] .config-chevron { transform:rotate(90deg); }
body.config-active .wizard-step.collapsed > *:not(.config-section-head) { display:none; }
body.config-active .wizard-step.collapsed .config-section-head { padding-bottom:2px; }
/* wi-0157: returning-user left-nav + main-pane, desktop only (JS-synthesized) */
@media (min-width:769px){
  body.config-nav-active main.setup { max-width:900px; }
  body.config-nav-active #profile-form { display:grid; grid-template-columns:190px 1fr;
       column-gap:32px; align-items:start; }
  body.config-nav-active .config-nav { grid-column:1; grid-row:1 / -1; position:sticky; top:24px;
       display:flex; flex-direction:column; gap:2px; }
  body.config-nav-active .config-nav-item { text-align:left; padding:10px 14px; border:none;
       background:none; border-radius:6px; font-size:14px; font-weight:600; color:var(--ink-2);
       cursor:pointer; font-family:inherit; }
  body.config-nav-active .config-nav-item:hover { background:var(--surface-alt); }
  body.config-nav-active .config-nav-item.active { background:var(--surface-alt); color:var(--brand); }
  body.config-nav-active .wizard-step { grid-column:2; }
  body.config-nav-active .wizard-step.nav-hidden { display:none; }
  body.config-nav-active .config-section-head { cursor:default; }
  body.config-nav-active .config-chevron { display:none; }
  body.config-nav-active #save-row { grid-column:2; position:sticky; bottom:0; background:#fff;
       padding-top:12px; margin-top:4px; border-top:1px solid var(--border); }
}

/* ---- §3.6 footer ---------------------------------------------------------- */
.footer { margin:40px auto 24px; max-width:1024px; padding:16px 20px 0; border-top:1px solid var(--border);
          font-size:12.5px; color:var(--ink-3); display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.footer span { color:var(--ink-3); }