:root {
    --bg:#fbfbf9; --panel:#f3f3ef; --card:#fff; --ink:#0c0d10; --inkSoft:#43454c;
    --muted:#86888f; --faint:#b6b8bf; --line:#e7e7e2; --lineSoft:#f0f0ec;
    --blue:#2563eb; --blueDeep:#1d4ed8; --blueSoft:#eef3ff; --blueLine:#cfddfb;
    --green:#15a34a; --amber:#d97706; --red:#dc2626;
    --mono:"IBM Plex Mono",ui-monospace,monospace;
    --display:"Space Grotesk",system-ui,sans-serif;
    --sans:"IBM Plex Sans",system-ui,sans-serif;
    --shadow:0 1px 2px rgba(12,13,16,.04), 0 4px 16px rgba(12,13,16,.03);
    --maxw:1200px; --pad:clamp(20px,4vw,48px);
  }
  * { box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
  a { color:inherit; text-decoration:none; }
  h1,h2,h3,h4 { font-family:var(--display); margin:0; letter-spacing:-.02em; }
  .wrap { max-width:var(--maxw); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }
  .mono { font-family:var(--mono); }
  .kicker { font-family:var(--mono); font-size:11px; color:var(--blue); letter-spacing:.14em; text-transform:uppercase; }
  .sub { font-size:clamp(14px,1.4vw,15px); color:var(--inkSoft); line-height:1.55; max-width:62ch; }
  .pill { font-family:var(--mono); font-size:10.5px; font-weight:600; padding:3px 8px; border-radius:6px; white-space:nowrap; display:inline-flex; align-items:center; gap:5px; border:1px solid var(--line); color:var(--inkSoft); background:var(--panel); }
  .pill.blue { color:var(--blueDeep); background:var(--blueSoft); border-color:var(--blueLine); }
  .pill.green { color:var(--green); background:#e9f7ee; border-color:#c2ebd1; }
  .pill.amber { color:var(--amber); background:#fdf2e2; border-color:#f6dcb4; }
  .pill.open { background:transparent; }
  .card { background:var(--card); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); }
  .sec { padding:clamp(40px,6vw,56px) 0; }
  .sec.alt { background:var(--panel); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .sechead { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:26px; flex-wrap:wrap; }
  .sechead h2 { font-size:clamp(24px,3.2vw,31px); font-weight:600; line-height:1.05; margin-top:10px; }
  .chips { display:flex; gap:6px; flex-wrap:wrap; }
  .chip { font-size:12.5px; font-weight:500; padding:7px 13px; border-radius:999px; border:1px solid var(--line); color:var(--inkSoft); background:var(--card); cursor:pointer; }
  .chip.on { background:var(--ink); color:var(--card); border-color:var(--ink); }
  .chip.sm { font-family:var(--mono); font-size:11px; padding:6px 11px; }

  /* nav */
  nav.top { position:sticky; top:0; z-index:40; background:rgba(255,255,255,.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
  nav.top .row { display:flex; align-items:center; justify-content:space-between; height:62px; }
  .brand { display:flex; align-items:center; gap:11px; }
  .logo { width:26px; height:26px; border-radius:7px; background:var(--ink); color:var(--card); display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-weight:700; font-size:13px; }
  .brand b { font-family:var(--display); font-size:15.5px; font-weight:600; }
  .navlinks { display:flex; gap:24px; font-size:13.5px; color:var(--inkSoft); }
  .navlinks a:hover { color:var(--ink); }
  .navlinks a.active { color:var(--ink); font-weight:500; }
  .btn { background:var(--ink); color:var(--card); border:none; border-radius:8px; padding:8px 15px; font-size:13px; font-weight:600; font-family:var(--sans); cursor:pointer; }
  .live { font-family:var(--mono); font-size:11px; color:var(--muted); display:inline-flex; align-items:center; gap:6px; }
  .dot { width:6px; height:6px; border-radius:999px; background:var(--green); }

  /* hero */
  .hero { padding:clamp(40px,6vw,52px) 0 36px; }
  .herogrid { display:grid; grid-template-columns:1.55fr 1fr; gap:48px; align-items:flex-end; margin-bottom:36px; }
  .hero h1 { font-size:clamp(34px,5.4vw,58px); font-weight:600; line-height:1.02; letter-spacing:-.03em; margin-top:16px; }
  .hero h1 .nx { color:var(--blue); }
  .hero p { margin-top:22px; font-size:clamp(15px,1.6vw,16.5px); }
  .week { padding:22px; }
  .week .big { font-family:var(--display); font-size:46px; font-weight:600; line-height:.9; letter-spacing:-.02em; }
  .week .lab { font-family:var(--mono); font-size:10px; color:var(--muted); letter-spacing:.14em; }
  .vbars { display:flex; align-items:flex-end; gap:6px; height:58px; }
  .vbars > div { flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; }
  .vbars .bar { width:100%; border-radius:3px; }
  .vbars .m { font-family:var(--mono); font-size:8.5px; color:var(--muted); }

  /* timeline */
  .tl-scroll { overflow-x:auto; }
  .tl { min-width:880px; border:1px solid var(--line); border-radius:16px; background:var(--card); overflow:hidden; box-shadow:var(--shadow); }
  .tl-row { display:flex; align-items:center; }
  .tl-lab { width:168px; flex-shrink:0; padding-right:12px; }
  .tl-track { position:relative; flex:1; }
  .tl-now { position:absolute; top:0; bottom:0; width:2px; background:var(--ink); z-index:3; }
  .tl-wash { position:absolute; top:0; bottom:0; right:0; background:rgba(37,99,235,.035); z-index:0; }
  .tl-grid { position:absolute; top:0; bottom:0; width:1px; background:var(--lineSoft); }

  /* board */
  .board { overflow:hidden; }
  .brow { display:grid; grid-template-columns:44px 1fr 150px 150px 130px 84px; gap:16px; align-items:center; padding:14px 20px; border-top:1px solid var(--lineSoft); }
  .brow.head { padding:11px 20px; border-top:none; background:var(--bg); font-family:var(--mono); font-size:9.5px; color:var(--muted); letter-spacing:.12em; }
  .brow.top { background:var(--blueSoft); }
  .brank { font-family:var(--mono); font-size:16px; font-weight:700; color:var(--faint); }
  .bname { font-family:var(--display); font-size:16.5px; font-weight:600; white-space:nowrap; letter-spacing:-.01em; }
  .bmeta { font-family:var(--mono); font-size:10.5px; color:var(--muted); }
  .meter { height:4px; background:var(--lineSoft); border-radius:999px; overflow:hidden; }
  .meter > div { height:100%; border-radius:999px; }
  .mkt { display:flex; align-items:center; gap:7px; }
  .mkt .ml { font-family:var(--mono); font-size:9px; color:var(--muted); width:30px; }
  .mkt .mv { font-family:var(--mono); font-size:10px; font-weight:600; color:var(--inkSoft); width:20px; text-align:right; }
  .mkt .mb { flex:1; height:3px; background:var(--lineSoft); border-radius:999px; overflow:hidden; }
  .num { font-family:var(--mono); }
  .watch { font-family:var(--mono); font-size:10.5px; font-weight:600; color:var(--inkSoft); background:var(--card); border:1px solid var(--line); border-radius:7px; padding:6px 11px; cursor:pointer; }

  /* grids */
  .g3 { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
  .g4 { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
  .intelgrid { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:16px; }
  .panel { padding:22px; }
  .panel .ph { font-family:var(--mono); font-size:10px; color:var(--muted); letter-spacing:.12em; margin-bottom:16px; }

  table { width:100%; border-collapse:collapse; }
  .tbl-scroll { overflow-x:auto; }
  th { text-align:left; padding:12px 20px; font-family:var(--mono); font-size:9.5px; color:var(--muted); letter-spacing:.10em; font-weight:600; background:var(--bg); white-space:nowrap; }
  td { padding:14px 20px; font-size:13px; color:var(--inkSoft); border-top:1px solid var(--lineSoft); }
  td.m { font-family:var(--mono); font-size:12.5px; }
  td .dbname { font-family:var(--display); font-size:15px; font-weight:600; color:var(--ink); }
  .cmp td.us, .cmp th.us { background:var(--blueSoft); }
  .cmp th.us { color:var(--blueDeep); }
  .cmp td.us { color:var(--ink); font-weight:600; }

  .cn { padding:18px; }
  .cn .row1 { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
  .cn .code { font-family:var(--display); font-size:15px; font-weight:700; }

  .faqgrid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  .faq { padding:20px 22px; }
  .faq h4 { font-size:15.5px; font-weight:600; margin-bottom:9px; }
  .faq p { font-size:13.5px; color:var(--inkSoft); line-height:1.55; margin:0; }

  footer.ft { border-top:1px solid var(--line); background:var(--card); }
  footer.ft .row { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding:28px 0; }

  @media (max-width:980px){
    .herogrid{ grid-template-columns:1fr; gap:28px; align-items:stretch; }
    .intelgrid{ grid-template-columns:1fr; }
    .g3{ grid-template-columns:1fr; }
    .g4{ grid-template-columns:1fr 1fr; }
    .faqgrid{ grid-template-columns:1fr; }
    .navlinks{ display:none; }
  }
  @media (max-width:560px){
    .g4{ grid-template-columns:1fr; }
    .brow{ grid-template-columns:30px 1fr 88px; }
    .brow .b-mkt, .brow .b-win, .brow .b-act, .brow.head .h-mkt, .brow.head .h-win, .brow.head .h-act { display:none; }
  }

  /* anchored sections clear the sticky nav */
  #timeline, #forecasts, #benchmarks, #models, #codenames, #intel, #compare { scroll-margin-top:78px; }
  /* watch toggle */
  .watch:hover { border-color:var(--muted); }
  .watch.on { background:var(--ink); color:var(--card); border-color:var(--ink); }
  /* empty forecast filter state */
  .bempty { padding:22px 20px; border-top:1px solid var(--lineSoft); font-family:var(--mono); font-size:11px; color:var(--muted); }

  /* ============================================================
     LONG-FORM SUBPAGES — docs, blog, glossary, methodology, legal
     Tokens only (DESIGN.md). Blue is the single accent. No gradients.
     ============================================================ */

  /* subpage header band */
  .subhero { padding:clamp(40px,6vw,64px) 0 clamp(28px,4vw,40px); border-bottom:1px solid var(--line); }
  .subhero .kicker { display:block; margin-bottom:14px; }
  .subhero h1 { font-size:clamp(30px,4.6vw,46px); font-weight:600; line-height:1.04; letter-spacing:-.03em; }
  .subhero .sub { margin-top:18px; font-size:clamp(15px,1.6vw,16.5px); max-width:68ch; }

  /* breadcrumbs */
  .crumbs { font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:.04em; margin-bottom:20px; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
  .crumbs a { color:var(--muted); }
  .crumbs a:hover { color:var(--inkSoft); }
  .crumbs .sep { color:var(--faint); }
  .crumbs [aria-current="page"] { color:var(--inkSoft); }

  /* 2-col doc layout: sticky toc aside + content */
  .doc { display:grid; grid-template-columns:228px 1fr; gap:clamp(28px,5vw,64px); padding:clamp(36px,5vw,56px) 0; align-items:start; }
  .doc > .toc { position:sticky; top:86px; }

  /* in-page nav list */
  .toc { font-size:13px; }
  .toc .toc-lab { font-family:var(--mono); font-size:9.5px; color:var(--muted); letter-spacing:.14em; text-transform:uppercase; margin-bottom:14px; }
  .toc ol, .toc ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
  .toc li { margin:0; }
  .toc a { display:block; padding:6px 12px; border-radius:7px; color:var(--inkSoft); border-left:2px solid transparent; line-height:1.4; }
  .toc a:hover { background:var(--lineSoft); color:var(--ink); }
  .toc a.active { color:var(--blueDeep); border-left-color:var(--blue); background:var(--blueSoft); font-weight:500; }

  /* article typography */
  .prose { color:var(--inkSoft); }
  .prose > * { max-width:70ch; }
  .prose .lead { font-size:clamp(16px,1.8vw,18px); line-height:1.55; color:var(--ink); margin:0 0 8px; }
  .prose h2 { font-family:var(--display); font-size:clamp(21px,2.6vw,26px); font-weight:600; letter-spacing:-.02em; line-height:1.15; color:var(--ink); margin:42px 0 14px; scroll-margin-top:86px; }
  .prose h3 { font-family:var(--display); font-size:clamp(17px,2vw,19px); font-weight:600; letter-spacing:-.01em; color:var(--ink); margin:30px 0 10px; scroll-margin-top:86px; }
  .prose h2:first-child, .prose h3:first-child { margin-top:0; }
  .prose p { font-size:15px; line-height:1.6; margin:0 0 16px; }
  .prose ul, .prose ol { font-size:15px; line-height:1.6; margin:0 0 16px; padding-left:22px; }
  .prose li { margin:0 0 7px; }
  .prose li::marker { color:var(--faint); }
  .prose a { color:var(--blueDeep); text-decoration:none; border-bottom:1px solid var(--blueLine); }
  .prose a:hover { border-bottom-color:var(--blueDeep); }
  .prose strong { color:var(--ink); font-weight:600; }
  .prose blockquote { margin:24px 0; padding:4px 0 4px 20px; border-left:3px solid var(--blueLine); color:var(--inkSoft); font-size:15px; line-height:1.6; }
  .prose blockquote p:last-child { margin-bottom:0; }
  .prose code { font-family:var(--mono); font-size:.88em; background:var(--panel); border:1px solid var(--line); border-radius:5px; padding:1.5px 6px; color:var(--ink); }
  .prose pre { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:18px 20px; overflow-x:auto; margin:0 0 18px; max-width:none; }
  .prose pre code { background:none; border:none; padding:0; font-size:12.5px; line-height:1.6; color:var(--inkSoft); }
  .prose hr { border:none; border-top:1px solid var(--line); margin:36px 0; }
  .prose table { margin:0 0 20px; max-width:none; }
  .prose table th { background:var(--bg); }
  .prose table td { font-size:13.5px; }
  .prose .codename { font-family:var(--mono); font-weight:600; text-transform:uppercase; color:var(--amber); }

  /* highlighted note box */
  .callout { background:var(--blueSoft); border:1px solid var(--blueLine); border-radius:12px; padding:18px 20px; margin:24px 0; font-size:14px; line-height:1.6; color:var(--inkSoft); max-width:70ch; }
  .callout .callout-lab { font-family:var(--mono); font-size:9.5px; color:var(--blueDeep); letter-spacing:.14em; text-transform:uppercase; margin-bottom:8px; display:block; }
  .callout p:last-child { margin-bottom:0; }
  .callout a { color:var(--blueDeep); border-bottom:1px solid var(--blueLine); }

  /* mono date / meta line */
  .postmeta { font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:.04em; display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
  .postmeta .sep { color:var(--faint); }
  .updated { font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:.04em; }
  .updated b { color:var(--inkSoft); font-weight:600; }

  /* blog index grid + cards */
  .bloggrid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .postcard { display:flex; flex-direction:column; padding:22px; transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
  .postcard:hover { border-color:var(--blueLine); box-shadow:0 1px 2px rgba(12,13,16,.04), 0 8px 24px rgba(12,13,16,.05); transform:translateY(-2px); }
  .postcard .pc-tag { font-family:var(--mono); font-size:9.5px; color:var(--blue); letter-spacing:.14em; text-transform:uppercase; margin-bottom:12px; }
  .postcard h3 { font-family:var(--display); font-size:18px; font-weight:600; line-height:1.18; letter-spacing:-.01em; color:var(--ink); margin:0 0 10px; }
  .postcard p { font-size:13.5px; line-height:1.55; color:var(--inkSoft); margin:0 0 16px; }
  .postcard .postmeta { margin-top:auto; }

  /* glossary */
  .gloss { margin:0; }
  .gloss dt { font-family:var(--mono); font-weight:600; font-size:13.5px; color:var(--ink); padding-top:18px; margin-top:18px; border-top:1px solid var(--lineSoft); scroll-margin-top:86px; }
  .gloss dt:first-child { padding-top:0; margin-top:0; border-top:none; }
  .gloss dd { margin:8px 0 0 0; padding-left:20px; font-size:14.5px; line-height:1.6; color:var(--inkSoft); max-width:70ch; }
  .gloss dd a { color:var(--blueDeep); border-bottom:1px solid var(--blueLine); }

  /* related-links row at page end */
  .related { margin-top:clamp(40px,6vw,56px); padding-top:28px; border-top:1px solid var(--line); }
  .related .rel-lab { font-family:var(--mono); font-size:9.5px; color:var(--muted); letter-spacing:.14em; text-transform:uppercase; margin-bottom:16px; }
  .related .rel-row { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
  .related a { display:block; padding:16px 18px; border:1px solid var(--line); border-radius:12px; background:var(--card); transition:border-color .15s ease; }
  .related a:hover { border-color:var(--blueLine); }
  .related a .rel-t { font-family:var(--display); font-size:15px; font-weight:600; color:var(--ink); }
  .related a .rel-d { font-size:12.5px; color:var(--muted); margin-top:4px; line-height:1.45; }

  /* full footer with link groups */
  .ftcols { display:grid; grid-template-columns:1.6fr repeat(3,1fr); gap:clamp(24px,4vw,48px); padding:44px 0 32px; }
  .ftcols .ftbrand .brand { margin-bottom:14px; }
  .ftcols .ftbrand p { font-size:13px; color:var(--muted); line-height:1.55; max-width:34ch; margin:0; }
  .ftgroup h4 { font-family:var(--mono); font-size:9.5px; font-weight:600; color:var(--muted); letter-spacing:.14em; text-transform:uppercase; margin:0 0 14px; }
  .ftgroup ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
  .ftgroup a { font-size:13px; color:var(--inkSoft); }
  .ftgroup a:hover { color:var(--ink); }
  .ftbar { border-top:1px solid var(--line); padding:18px 0; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
  .ftbar .ftnote { font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:.02em; }
  .ftbar .ftnote a { color:var(--blueDeep); }

  @media (max-width:980px){
    .doc { grid-template-columns:1fr; gap:0; }
    .doc > .toc { position:static; top:auto; margin-bottom:28px; padding-bottom:24px; border-bottom:1px solid var(--line); }
    .bloggrid { grid-template-columns:repeat(2,1fr); }
    .related .rel-row { grid-template-columns:1fr 1fr; }
    .ftcols { grid-template-columns:1fr 1fr; }
  }
  @media (max-width:560px){
    .bloggrid { grid-template-columns:1fr; }
    .related .rel-row { grid-template-columns:1fr; }
    .ftcols { grid-template-columns:1fr; gap:28px; }
  }