* { box-sizing: border-box; }
  /* ── design tokens ported from macro.html (deep command-center canvas + mono numerals) ── */
  body {
    --num: var(--font-mono, ui-monospace, "SF Mono", SFMono-Regular, "Cascadia Mono", "JetBrains Mono", "Roboto Mono", Menlo, Consolas, monospace);
    --bg:#0a0c11; --panel:#14171e; --panel2:#1b1f28;
    --hair: color-mix(in srgb, var(--line) 74%, transparent);
    --ink-1: var(--text);
    --ink-2: color-mix(in srgb, var(--text) 64%, transparent);
    --ink-3: var(--muted);
    --ms: inset 0 1px 0 0 color-mix(in srgb, var(--text) 8%, transparent), 0 1px 1px rgba(0,0,0,.28), 0 14px 30px -18px rgba(0,0,0,.55);
    background: var(--bg); color: var(--text);
    font: 14px/1.55 var(--font-ui, Inter, -apple-system, "Segoe UI", Roboto, Helvetica, sans-serif);
    margin: 0; padding: 20px;
  }
  html[data-theme="light"] body { --bg:#e8ebf1; --panel:#ffffff; --panel2:#eef1f6; --ms: 0 1px 3px rgba(20,30,50,.07), 0 18px 40px -26px rgba(20,30,50,.20); }
  @media (min-width: 1100px) { body { padding: 26px max(40px, calc((100vw - 1500px) / 2)); } }
  /* NO zh body-font override here — macro.html has none either. theme.css's --font-ui
     already chains PingFang SC / Hiragino / YaHei after Inter, so ZH gets native CJK
     glyphs while latin text and numerals stay on Inter (the house face). Overriding to
     a CJK-first stack is what made ZH numerals render in a different face than EN. */
  a { text-decoration: none; color: var(--ink-link, var(--link)); }
  h1 { font-size: 21px; margin: 0 0 2px; } h3 { font-size: 13px; margin: 0 0 8px; }
  /* section title: macro.html --fs-h2 (17px) + its 3px regime rail */
  h2 { display:flex; align-items:center; gap:10px; font-size: 17px; margin: 0; color: var(--ink-1); font-weight: 700; letter-spacing: -.01em; text-transform: none; line-height: 1.3; }
  h2::before { content:""; flex:none; align-self:center; width:3px; height:17px; border-radius:2px; background:linear-gradient(180deg, var(--link), color-mix(in srgb,var(--link) 30%,transparent)); }
  html[data-lang="zh"] h2 { letter-spacing: 0; }
  /* ── numeral face policy (macro.html parity) ───────────────────────────────
     The terminal mono is for FIGURES ONLY — never for words. macro.html applies
     var(--num) to `.num` and to `td:not(:first-child):not(.l)` (i.e. the numeric
     columns) and explicitly re-inherits prose inside tooltips, so its label and
     sentence slots stay on Inter. This page used to hand the mono face to slots
     that carry sentences ("growth down, inflation up", "held back — breaking
     down", "2/7 ex-US markets ahead"), which is what made it read as a different
     product from macro.html. Figures below; everything with a word in it inherits
     --font-ui. */
  .num,.lb-vals .big,.rcard .rv,.rb .v,.dc-num,.sc-val,.inv-num,.ur-num,.tb-metrics .tm-v,
  table.cmp td:not(.l):not(.eco),table.sb td:not(.l) { font-family: var(--num); font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1; letter-spacing: -.01em; }
  /* prose slots that sit next to figures — keep them on the house face */
  .wc-vital .vv,.lb-vals small,.help .tip,.caveat { font-family: var(--font-ui); letter-spacing: normal;
    font-variant-numeric: tabular-nums; }
  .panel { position:relative; background: var(--panel); border: 1px solid var(--hair, var(--line)); border-radius: 14px; padding: 18px 20px; margin-bottom: 16px; box-shadow: var(--ms); }
  .muted { color: var(--muted); } .small { font-size: 12px; } .stale { color: var(--muted); font-size: 10px; }
  .row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
  .pos { color: var(--ink-up, var(--up)); } .neg { color: var(--ink-down, var(--down)); }
  .chip { display:inline-block; padding:2px 8px; border-radius:8px; font-size:11px; font-weight:700; background:var(--panel2); border:1px solid var(--line); }
  .chip.warn { background:color-mix(in srgb,var(--down) 14%,transparent); color:var(--ink-down, var(--down)); border-color:color-mix(in srgb,var(--down) 36%,transparent); }
  .chip.caut { background:color-mix(in srgb,#d4a017 16%,transparent); color:var(--ink-warn, var(--warn)); border-color:color-mix(in srgb,#d4a017 38%,transparent); }
  .chip.ok { background:color-mix(in srgb,var(--up) 14%,transparent); color:var(--ink-up, var(--up)); border-color:color-mix(in srgb,var(--up) 34%,transparent); }
  /* quad chip */
  .quad { display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:9px; font-weight:800; font-size:12px; color:#fff; }
  /* zh 红涨绿跌: q1/q3 use token vars so theme.css's html[data-lang="zh"] swap picks them up
     automatically (no per-page mirror needed). q2/q4 (amber/blue) are direction-neutral. */
  .q-Q1 { background:var(--q1,#2e9e4f); } .q-Q2 { background:#d4a017; } .q-Q3 { background:var(--q3,#d04545); } .q-Q4 { background:#3f78d8; }
  .qdot { width:9px;height:9px;border-radius:50%;display:inline-block; }
  .qd-Q1{background:var(--q1,#2e9e4f)}.qd-Q2{background:#d4a017}.qd-Q3{background:var(--q3,#d04545)}.qd-Q4{background:#3f78d8}
  /* comparison grid */
  .gridwrap { overflow-x:auto; }
  table.cmp { border-collapse:collapse; width:100%; font-size:12.5px; min-width:1080px; }
  table.cmp th, table.cmp td { padding:7px 9px; border-bottom:1px solid var(--line); text-align:right; white-space:nowrap; }
  table.cmp th { color:var(--muted); font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:.03em; position:sticky; top:0; background:var(--panel); }
  table.cmp td.l, table.cmp th.l { text-align:left; }
  table.cmp td.eco { position:sticky; left:0; background:var(--panel); font-weight:700; z-index:2; }
  table.cmp th.eco { position:sticky; left:0; z-index:3; }
  table.cmp tr:hover td { background:var(--panel2); }
  table.cmp td.eco:hover, table.cmp tr:hover td.eco { background:var(--panel2); }
  .grp { border-left:2px solid var(--line); }
  .flg { font-size:16px; margin-right:5px; }
  /* gauge bar */
  .gbar { display:inline-block; width:64px; height:7px; border-radius:5px; background:var(--panel2); border:1px solid var(--line); overflow:hidden; vertical-align:middle; margin-right:6px; }
  .gfill { display:block; height:100%; }
  .g-low{background:var(--up)}.g-watch{background:#d4a017}.g-elevated{background:var(--down)}.g-na{background:var(--muted)}
  /* heatmap scatter */
  .scatter { position:relative; height:300px; border:1px solid var(--line); border-radius:10px; margin-top:8px; background:
     linear-gradient(to right, color-mix(in srgb,#3f78d8 7%,transparent), transparent 50%, color-mix(in srgb,#d4a017 7%,transparent)),
     linear-gradient(to top, color-mix(in srgb,#3f78d8 6%,transparent), transparent 50%, color-mix(in srgb,var(--q1,#2e9e4f) 6%,transparent)); }
  .scatter .axx, .scatter .axy { position:absolute; background:var(--line); }
  .scatter .axx { left:0; right:0; top:50%; height:1px; } .scatter .axy { top:0; bottom:0; left:50%; width:1px; }
  .scatter .ql { position:absolute; font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; }
  .scatter .pt { position:absolute; transform:translate(-50%,-50%); text-align:center; }
  .scatter .pt .e { font-size:22px; line-height:1; } .scatter .pt .n { font-size:9px; color:var(--muted); }
  /* rank bars */
  .ranks { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; }
  .rb { font-size:12px; padding:3px 0; display:flex; align-items:center; gap:7px; }
  .rb .bar { flex:1; height:8px; border-radius:5px; background:var(--panel2); overflow:hidden; }
  .rb .bf { display:block; height:100%; background:var(--link); }
  .rb .v { width:58px; text-align:right; font-variant-numeric:tabular-nums; }
  /* stock + sector cards */
  .cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:11px; }
  .card { background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:11px 13px; }
  .card .hd { display:flex; align-items:center; gap:7px; } .card .hd .tk { font-weight:800; }
  .lad { display:inline-block; padding:2px 8px; border-radius:9px; font-weight:700; font-size:11px;
         background:color-mix(in srgb, var(--c, var(--muted)) 16%, var(--panel)); color:color-mix(in srgb, var(--c, var(--muted)) 82%, var(--text)); }
  .lad.up { --c:var(--up); } .lad.down { --c:var(--down); } .lad.flat { --c:var(--muted); }
  /* volatility black hole chip + forward-cone honesty note on each standout card (China-parity) */
  .nb-vf { display:flex; flex-wrap:wrap; gap:4px; margin-top:5px; }
  .nb-vchip { font-size:8.5px; font-weight:800; padding:0 5px; border-radius:6px; border:1px solid var(--line);
              color:var(--muted); white-space:nowrap; }
  .vf-coil { color:var(--ink-link, var(--link)); border-color:color-mix(in srgb,var(--link) 38%,var(--line));
             background:color-mix(in srgb,var(--link) 10%,var(--panel)); }
  .vf-up { color:var(--ink-up, var(--up)); border-color:color-mix(in srgb,var(--up) 45%,var(--line)); }
  .vf-down { color:var(--ink-down, var(--down)); border-color:color-mix(in srgb,var(--down) 40%,var(--line)); }
  .vf-exp { color:var(--ink-warn, var(--warn)); border-color:color-mix(in srgb,var(--warn) 35%,var(--line)); }
  .nb-note { font-size:8.5px; line-height:1.3; margin-top:4px; padding:2px 5px; border-radius:6px;
             color:var(--muted); background:color-mix(in srgb,var(--text) 4%,var(--panel)); }
  .nb-note-anticipation { color:var(--ink-link, var(--link)); background:color-mix(in srgb,var(--link) 8%,var(--panel)); }
  table.sb { border-collapse:collapse; width:100%; font-size:12.5px; }
  table.sb th, table.sb td { padding:5px 9px; border-bottom:1px solid var(--line); text-align:right; }
  table.sb td.l, table.sb th.l { text-align:left; } table.sb th { color:var(--muted); font-weight:600; }
  .help { display:inline-flex; align-items:center; justify-content:center; width:15px; height:15px; border-radius:50%; border:1px solid var(--muted); color:var(--muted); font-size:10px; font-weight:600; cursor:help; position:relative; vertical-align:middle; margin-left:4px; }
  .help .tip { display:none; position:absolute; bottom:150%; left:50%; transform:translateX(-50%); width:280px; background:var(--panel); border:1px solid var(--line); padding:10px 12px; border-radius:9px; z-index:60; font-size:12px; line-height:1.5; color:var(--text); text-align:left; font-weight:400; text-transform:none; letter-spacing:normal; box-shadow:var(--popover-shadow); pointer-events:auto; cursor:auto; max-height:min(60vh,420px); overflow-y:auto; overscroll-behavior:contain; }
  /* invisible hover pad across the icon→tip gap — keeps :hover alive mid-travel (on .help, not .tip: the tip is a scroll container and clips its pseudos) */
  .help:hover::before { content:''; position:absolute; bottom:100%; left:-30px; right:-30px; height:10px; }
  .help:hover .tip { display:block; }
  .caveat { font-size:11.5px; color:var(--muted); font-style:italic; }
  .more-btn { display:inline-block; margin-top:10px; padding:5px 14px; border-radius:9px; background:var(--panel2); border:1px solid var(--line); color:var(--ink-link, var(--link)); font-weight:600; font-size:12px; cursor:pointer; }
  .hidden { display:none; }

  /* ==================== World Command hero + aurora (macro.html house) ==================== */
  :root { --acc1:#3a86ff; --acc2:#22d97a; --acc3:#6366f1;
    --acc-grad:linear-gradient(120deg, color-mix(in srgb,var(--link) 60%,transparent), color-mix(in srgb,var(--acc2) 42%,transparent)); }
  /* premium panels are frosted glass floating over the aurora (not rainbow borders) */
  .panel.accent { background: color-mix(in srgb, var(--panel) 78%, transparent);
    -webkit-backdrop-filter: blur(22px) saturate(150%); backdrop-filter: blur(22px) saturate(150%);
    border: 1px solid color-mix(in srgb, var(--text) 12%, transparent);
    box-shadow: 0 1px 0 color-mix(in srgb,#fff 8%,transparent) inset, 0 16px 40px -30px rgba(3,7,18,.34); }

  /* aurora backdrop — four soft blobs, state-tinted, compositor-safe (fixed, opacity-only) */
  .intl-aurora { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
  .intl-aurora b { position:absolute; border-radius:50%; filter:blur(90px); opacity:0; transition:opacity 1.1s ease, background 1.2s ease; }
  .intl-aurora .a1 { width:900px; height:700px; top:-220px; left:-160px; background:radial-gradient(ellipse,color-mix(in srgb,var(--acc2) 22%,transparent),transparent 70%); }
  .intl-aurora .a2 { width:720px; height:620px; bottom:-160px; right:-120px; background:radial-gradient(ellipse,color-mix(in srgb,var(--acc3) 20%,transparent),transparent 70%); }
  .intl-aurora .a3 { width:540px; height:460px; top:34%; left:44%; background:radial-gradient(ellipse,color-mix(in srgb,var(--acc1) 14%,transparent),transparent 70%); }
  body.aur-on .intl-aurora .a1 { opacity:.9; } body.aur-on .intl-aurora .a2 { opacity:.75; } body.aur-on .intl-aurora .a3 { opacity:.6; }
  /* state tint of the primary blob */
  body.aur-warn .intl-aurora .a1 { background:radial-gradient(ellipse,color-mix(in srgb,var(--warn) 20%,transparent),transparent 70%); }
  body.aur-risk .intl-aurora .a1 { background:radial-gradient(ellipse,color-mix(in srgb,var(--down) 20%,transparent),transparent 70%); }
  .intl-flow { position:relative; z-index:1; }
  /* nav must stack ABOVE the content flow or its dropdowns clip behind the hero
     (same idiom as canada/flow_desk); the dd-menu's z-index:90 is nav-scoped */
  nav.site-nav { position:relative; z-index:2; }
  @media (prefers-reduced-motion: reduce) { .intl-aurora b { transition:none; } }

  /* ── the hero card ── */
  .wc { position:relative; margin:0 0 20px; padding:0; overflow:hidden; border-radius:18px;
    background: color-mix(in srgb, var(--panel) 72%, transparent);
    -webkit-backdrop-filter: blur(24px) saturate(155%); backdrop-filter: blur(24px) saturate(155%);
    border: 1px solid color-mix(in srgb, var(--text) 13%, transparent);
    box-shadow: 0 1px 0 color-mix(in srgb,#fff 9%,transparent) inset, 0 12px 30px -22px rgba(3,7,18,.32); }
  .wc-top { display:grid; grid-template-columns: minmax(0,4.3fr) minmax(0,5.7fr); gap:0; }
  @media (max-width:820px){ .wc-top { grid-template-columns:1fr; } }
  .wc-left { padding:22px 24px; border-right:1px solid color-mix(in srgb,var(--text) 9%,transparent); display:flex; flex-direction:column; gap:12px; }
  @media (max-width:820px){ .wc-left { border-right:none; border-bottom:1px solid color-mix(in srgb,var(--text) 9%,transparent); } }
  .wc-right { padding:22px 24px; display:flex; flex-direction:column; gap:14px; min-width:0; }
  .wc-eyebrow { display:flex; align-items:center; gap:9px; flex-wrap:wrap; font:700 10.5px/1 var(--font-ui,Inter,sans-serif);
    letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); }
  .wc-eyebrow .dot { width:6px; height:6px; border-radius:50%; background:var(--up); box-shadow:0 0 8px var(--up); }
  html[data-lang="zh"] .wc-eyebrow { letter-spacing:.06em; }

  /* gauge cluster */
  .wc-gauge-wrap { display:flex; align-items:center; gap:16px; }
  .wc-gauge { position:relative; width:170px; height:104px; flex:none; }
  .wc-gauge svg { width:100%; height:100%; display:block; overflow:visible; }
  .wc-gauge-track { stroke: color-mix(in srgb, var(--text) 9%, transparent); }
  .wc-gauge-fill { stroke: var(--gc, var(--up)); stroke-linecap:round; filter: drop-shadow(0 0 6px color-mix(in srgb,var(--gc,var(--up)) 55%,transparent)); }
  @media (prefers-reduced-motion: no-preference) { .wc-gauge-fill { animation: gaugeSweep 1.15s cubic-bezier(.22,.9,.26,1) .2s both; } }
  @keyframes gaugeSweep { from { stroke-dashoffset: var(--circ); } }
  /* hero score: macro.html's big-board treatment — house face, 800, tight tracking */
  .wc-gnum { fill: var(--gc, var(--up)); font-family: var(--font-ui); font-size:36px; font-weight:800; letter-spacing:-.03em; font-variant-numeric: tabular-nums; filter: drop-shadow(0 0 8px color-mix(in srgb,var(--gc,var(--up)) 45%,transparent)); }
  .wc-gnum-sub { fill: var(--ink-3); font-family: var(--font-ui); font-size:12px; font-weight:700; }
  .wc-gauge-cap { font:700 9.5px/1.3 var(--font-ui,Inter,sans-serif); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); margin-top:5px; }
  .wc-gside { display:flex; flex-direction:column; justify-content:center; gap:3px; min-width:0; }
  .wc-verdict { font:800 22px/1.08 var(--font-ui,Inter,sans-serif); letter-spacing:-.02em; }
  .wc-verdict.v-up { color:var(--ink-up, var(--up)); } .wc-verdict.v-warn { color:var(--ink-warn, var(--warn)); } .wc-verdict.v-down { color:var(--ink-down, var(--down)); }
  .wc-substance { font-size:12.5px; color:var(--ink-2); line-height:1.4; }

  /* the read (thesis) + stance */
  .wc-kick { font:700 10.5px/1 var(--font-ui,Inter,sans-serif); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); }
  html[data-lang="zh"] .wc-kick { letter-spacing:.06em; }
  .wc-read { font-size:14.5px; line-height:1.55; color:var(--text); margin:0; }
  .wc-read b { font-weight:700; }

  /* US-vs-World tug meter — the signature */
  .tug { margin-top:2px; }
  .tug-head { display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:9px; }
  .tug-head .th-lbl { font:700 10px/1 var(--font-ui,Inter,sans-serif); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); }
  .tug-head .th-count { font:700 12px/1 var(--font-ui); font-variant-numeric:tabular-nums; color:var(--ink-2); }
  .tug-beam { position:relative; height:34px; border-radius:10px; background:var(--panel2);
    border:1px solid var(--hair); overflow:hidden;
    background-image:linear-gradient(90deg, color-mix(in srgb,var(--info) 16%,transparent), transparent 42%, transparent 58%, color-mix(in srgb,var(--up) 16%,transparent)); }
  .tug-mid { position:absolute; top:4px; bottom:4px; left:50%; width:1px; background:color-mix(in srgb,var(--text) 22%,transparent); }
  .tug-fill { position:absolute; top:0; bottom:0; border-radius:9px; opacity:.5; }
  .tug-fill.tf-world { right:50%; background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--up) 40%,transparent)); }
  .tug-fill.tf-us { left:50%; background:linear-gradient(270deg,transparent,color-mix(in srgb,var(--info) 40%,transparent)); }
  .tug-marker { position:absolute; top:50%; left:var(--pos,50%); transform:translate(-50%,-50%);
    width:20px; height:20px; border-radius:50%; background:var(--text); border:3px solid var(--panel);
    box-shadow:0 2px 8px rgba(0,0,0,.5), 0 0 0 1px color-mix(in srgb,var(--text) 30%,transparent); z-index:2; }
  @media (prefers-reduced-motion: no-preference) { .tug-marker { animation: tugSlide 1s cubic-bezier(.22,.9,.26,1) .3s both; } }
  @keyframes tugSlide { from { left:50%; } }
  .tug-ends { display:flex; justify-content:space-between; margin-top:7px; font-size:11.5px; }
  .tug-ends .te-us { color:var(--ink-info, var(--info)); font-weight:700; } .tug-ends .te-wo { color:var(--ink-up, var(--up)); font-weight:700; }
  .tug-ends .te-us .flg, .tug-ends .te-wo .flg { font-size:14px; }

  /* hero vitals strip */
  .wc-vitals { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid color-mix(in srgb,var(--text) 9%,transparent); }
  @media (max-width:760px){ .wc-vitals { grid-template-columns:1fr 1fr; } }
  .wc-vital { padding:12px 16px; border-right:1px solid color-mix(in srgb,var(--text) 7%,transparent); min-width:0; }
  .wc-vital:last-child { border-right:none; }
  @media (max-width:760px){ .wc-vital:nth-child(2n){border-right:none;} .wc-vital:nth-child(-n+2){border-bottom:1px solid color-mix(in srgb,var(--text) 7%,transparent);} }
  .wc-vital .vk { font:700 9.5px/1.2 var(--font-ui,Inter,sans-serif); letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); }
  .wc-vital .vv { font-size:16px; font-weight:800; color:var(--ink-1); margin:4px 0 1px; line-height:1.15; }
  /* a vital whose value is a phrase, not a figure — one size down so it sits on one or
     two lines beside the numeric vitals (was three inline style="font-size:13px" patches) */
  .wc-vital .vv.word { font-size:13px; line-height:1.25; }
  .wc-vital .vv.up { color:var(--ink-up, var(--up)); } .wc-vital .vv.down { color:var(--ink-down, var(--down)); } .wc-vital .vv.warn { color:var(--ink-warn, var(--warn)); }
  .wc-vital .vs { font-size:11px; color:var(--ink-3); line-height:1.35; }

  /* ── act dividers (plain-word section framing) ── */
  .act-h { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin:30px 2px 14px; }
  .act-h:first-of-type { margin-top:24px; }
  .act-h .aq { font-size:20px; font-weight:800; letter-spacing:-.02em; color:var(--text); }
  html[data-lang="zh"] .act-h .aq { letter-spacing:0; }
  .act-h .as { font-size:12.5px; color:var(--ink-3); }
  .act-h::before { content:""; align-self:center; width:22px; height:3px; border-radius:2px; background:linear-gradient(90deg,var(--link),transparent); }
  /* reference foldables (deep-tier data, collapsed by default) */
  details.ref-fold { margin:0 0 16px; border:1px solid var(--hair); border-radius:14px; background:color-mix(in srgb,var(--panel) 55%,transparent); }
  details.ref-fold > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:12px; padding:15px 18px; border-radius:14px; }
  details.ref-fold > summary::-webkit-details-marker { display:none; }
  details.ref-fold > summary:hover { background:color-mix(in srgb,var(--text) 4%,transparent); }
  details.ref-fold .rf-t { font-size:14px; font-weight:700; color:var(--text); }
  details.ref-fold .rf-s { font-size:12px; color:var(--ink-3); flex:1; min-width:0; }
  details.ref-fold .rf-caret { margin-left:auto; color:var(--ink-3); font-size:12px; transition:transform .22s ease; }
  details.ref-fold[open] .rf-caret { transform:rotate(180deg); }
  details.ref-fold[open] > summary { border-bottom:1px solid var(--hair); border-radius:14px 14px 0 0; }
  details.ref-fold > .panel { border:none; box-shadow:none; background:transparent; margin:6px 6px 10px; }

  /* verdict / stance band (reusable, macro.html idiom) */
  .stance { margin:12px 0 2px; padding:11px 13px; border-radius:10px; border:1px solid var(--hair); border-left:3px solid var(--muted); background:var(--panel2); }
  .stance-run { border-left-color:var(--up); background:color-mix(in srgb,var(--up) 7%,var(--panel2)); }
  .stance-v { font-size:14px; font-weight:800; letter-spacing:.01em; }

  /* scroll reveal for the flow panels */
  @media (prefers-reduced-motion: no-preference) {
    .intl-flow .reveal { opacity:0; transform:translateY(14px); }
    .intl-flow .reveal.in { opacity:1; transform:none; transition:opacity .5s ease, transform .5s cubic-bezier(.2,.7,.3,1); }
  }

  /* section heads — macro.html structured header with hairline */
  .sec-h { display:flex; align-items:center; gap:11px; flex-wrap:wrap; margin:0 0 15px; padding-bottom:12px; border-bottom:1px solid var(--hair); }
  .sec-h h2 { margin:0; } .sec-h .sub { font-size:12px; color:var(--muted); }
  .panel > h2:first-child { margin:0 0 15px; padding-bottom:12px; border-bottom:1px solid var(--hair); }
  /* segmented control */
  .seg { display:inline-flex; gap:3px; background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:3px; }
  .seg button { background:none; border:0; color:var(--muted); font:inherit; font-size:12px; font-weight:700; padding:5px 12px;
    border-radius:7px; cursor:pointer; transition:color .15s, background .15s; }
  /* white label on the fill, so the fill takes the SOLID grade — dark --link is a
     pale text-on-graphite blue (#7aa7e0) and white on it measures 2.49:1. */
  .seg button.on { background:var(--fill-link, var(--link)); color:#fff; }
  .seg button:hover:not(.on) { color:var(--text); }

  /* ===== USD performance leaderboard ===== */
  .lb { display:flex; flex-direction:column; gap:3px; margin-top:12px; }
  /* Column geometry. Before: 168px of name (which wrapped "United Kingdom", "South Korea"
     and "STOXX Europe 600" onto three lines and pushed every row to ~90px tall) against a
     bare 1fr bar column (which at desktop width parked the bars in ~800px of track with a
     ~500px gulf beside them). Now the name column is wide enough that nothing wraps, the
     bar track is a FIXED width so the zero axis lands at the same x on every row — the
     whole point of a diverging bar chart — and the row's remaining slack goes to the
     sparkline, the one cell that actually gets better with width. */
  .lb-row { display:grid; grid-template-columns:272px minmax(150px,1fr) 344px 196px; align-items:center; gap:16px;
    padding:8px 8px; border-radius:10px; transition:background .15s; }
  .lb-row:hover { background:var(--panel2); }
  .lb-row .eco { display:flex; align-items:center; gap:8px; font-weight:700; min-width:0; }
  .lb-row .eco > span { min-width:0; }
  .lb-row .eco .flg { font-size:17px; flex:none; } .lb-row .eco small { color:var(--muted); font-weight:500; font-size:11px; display:block; }
  .lb-row .eco .ts-chip { flex:none; }
  /* the sparkline svg is viewBox 200×40 / preserveAspectRatio:none / width:100%, so it
     fills whatever cell it is given — which is why the flexible column is this one */
  .lb-spark { display:flex; align-items:center; min-width:0; }
  .lb-row .nch { display:block; opacity:.9; }
  .lb-bar { position:relative; height:24px; }
  .lb-bar .axis { position:absolute; top:0; bottom:0; left:50%; width:1px; background:var(--line); }
  .lb-seg { position:absolute; top:4px; height:16px; }
  .lb-seg.equity { background:color-mix(in srgb,var(--info) 55%,transparent); border-radius:3px; }
  .lb-seg.fx-pos { background:color-mix(in srgb,var(--up) 80%,transparent); border-radius:3px; }
  .lb-seg.fx-neg { background:color-mix(in srgb,var(--down) 80%,transparent); border-radius:3px; }
  .lb-usd { position:absolute; top:-1px; width:3px; height:26px; background:var(--text); border-radius:2px; }
  .lb-vals { text-align:right; font-variant-numeric:tabular-nums; font-size:12px; line-height:1.3; }
  .lb-vals .big { font-size:16px; font-weight:800; } .lb-vals small { color:var(--muted); display:block; font-size:10.5px; }
  .lb-legend { display:flex; gap:16px; flex-wrap:wrap; font-size:11.5px; color:var(--muted); margin-top:11px; align-items:center; }
  .lb-legend i { display:inline-block; width:11px; height:11px; border-radius:3px; vertical-align:middle; margin-right:5px; }
  @media (max-width:1180px){ .lb-row { grid-template-columns:236px minmax(110px,1fr) minmax(200px,340px) 168px; gap:12px; } }
  @media (max-width:760px){ .lb-row { grid-template-columns:108px 1fr 92px; gap:9px; } .lb-spark { display:none; } }

  /* ===== RRG rotation scatter ===== */
  .rrg { position:relative; height:340px; border:1px solid var(--line); border-radius:12px; margin-top:10px; overflow:hidden;
    background:
      linear-gradient(to right, color-mix(in srgb,var(--down) 6%,transparent), transparent 50%, color-mix(in srgb,var(--up) 6%,transparent)),
      linear-gradient(to top, color-mix(in srgb,var(--down) 5%,transparent), transparent 50%, color-mix(in srgb,var(--up) 5%,transparent)); }
  .rrg .ax { position:absolute; background:var(--line); }
  .rrg .ax.h { left:0; right:0; top:50%; height:1px; } .rrg .ax.v { top:0; bottom:0; left:50%; width:1px; }
  .rrg .ql { position:absolute; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; opacity:.8; }
  .rrg .ql.lead { right:10px; top:8px; color:var(--ink-up, var(--up)); } .rrg .ql.impr { left:10px; top:8px; color:var(--ink-info, var(--info)); }
  .rrg .ql.weak { right:10px; bottom:8px; color:var(--ink-warn, var(--warn)); } .rrg .ql.lag { left:10px; bottom:8px; color:var(--ink-down, var(--down)); }
  .rrg .axl { position:absolute; font-size:9.5px; color:var(--muted); }
  .rrg .pt { position:absolute; transform:translate(-50%,-50%); text-align:center; z-index:2; }
  .rrg .pt .dot { width:13px; height:13px; border-radius:50%; margin:0 auto; box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 22%,transparent); background:var(--c); }
  .rrg .pt .e { font-size:19px; line-height:1; } .rrg .pt .n { font-size:9px; color:var(--muted); margin-top:1px; }
  .rrg .pt.q-lead { --c:var(--up); } .rrg .pt.q-impr { --c:var(--info); } .rrg .pt.q-weak { --c:var(--warn); } .rrg .pt.q-lag { --c:var(--down); }
  .tilt { display:inline-flex; align-items:center; gap:8px; padding:6px 13px; border-radius:10px; font-weight:700; font-size:13px;
    background:color-mix(in srgb,var(--c,var(--muted)) 14%,var(--panel2)); color:color-mix(in srgb,var(--c,var(--muted)) 84%,var(--text));
    border:1px solid color-mix(in srgb,var(--c,var(--muted)) 32%,transparent); }
  .tilt.ex_us { --c:var(--up); } .tilt.us { --c:var(--info); } .tilt.mixed { --c:var(--warn); }

  /* ===== rates desk ===== */
  .rdesk { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin-top:12px; }
  .rcard { background:var(--panel2); border:1px solid var(--line); border-radius:13px; padding:13px 15px; }
  .rcard .rh { display:flex; align-items:center; gap:8px; margin-bottom:8px; } .rcard .rh .flg { font-size:18px; }
  .rcard .rh b { font-size:14px; } .rcard .rh .shape { margin-left:auto; font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:7px;
    background:color-mix(in srgb,var(--c,var(--muted)) 16%,var(--panel)); color:color-mix(in srgb,var(--c,var(--muted)) 82%,var(--text)); }
  .rcard .shape.inverted { --c:var(--down); } .rcard .shape.flat { --c:var(--warn); } .rcard .shape.normal { --c:var(--up); } .rcard .shape.steep { --c:var(--info); }
  .rcard .rgrid { display:grid; grid-template-columns:1fr 1fr; gap:6px 12px; font-size:12px; }
  .rcard .rk { color:var(--muted); } .rcard .rv { text-align:right; font-weight:700; font-variant-numeric:tabular-nums; }
  /* curve slope mini-viz: 3m dot -> 10y dot */
  .curve { position:relative; height:30px; margin:9px 0 4px; }
  .curve .ln { position:absolute; top:50%; height:2px; background:color-mix(in srgb,var(--c,var(--link)) 60%,transparent); }
  .curve .d { position:absolute; top:50%; transform:translate(-50%,-50%); width:8px; height:8px; border-radius:50%; background:var(--c,var(--link)); }
  .curve .lab { position:absolute; font-size:9px; color:var(--muted); top:calc(50% + 7px); transform:translateX(-50%); white-space:nowrap; }
  .anchor-card { background:linear-gradient(var(--panel2),var(--panel2)) padding-box, var(--acc-grad) border-box; border:1.5px solid transparent; }

  /* ===== correlation heatmap ===== */
  .heatwrap { overflow-x:auto; margin-top:12px; }
  table.heat { border-collapse:separate; border-spacing:3px; font-size:12px; }
  table.heat th { color:var(--muted); font-weight:600; font-size:11px; padding:3px 5px; white-space:nowrap; }
  table.heat td { width:46px; height:38px; text-align:center; border-radius:7px; font-weight:700; font-variant-numeric:tabular-nums;
    color:#fff; }
  table.heat td.diag { opacity:.45; }
  table.heat th.l { text-align:right; }

  /* ===== index spark cell ===== */
  .gridwrap .nch { display:block; width:74px; height:24px; }
  /* NOTE: the second `.panel.accent` that used to live here painted a 1.5px blue→green
     gradient border. Being later in the sheet it silently beat the frosted-glass rule
     above (line ~151) whose own comment says "not rainbow borders" — so the two flagship
     panels shipped with an outline no other surface on the site has, and macro.html has
     none. Removed: .panel.accent is now the frosted-glass treatment it was written to be. */
  .twocol { display:grid; grid-template-columns:1fr 1fr; gap:14px; } @media (max-width:860px){ .twocol { grid-template-columns:1fr; } }

  /* ===== turn board (ITR) ===== */
  /* Tiles STRETCH to their row (they used to be align-items:start, so one long tile —
     whichever market happened to carry a breadth line and a backdrop paragraph — set the
     row band and every other tile in that row left a void under it; on a 7-across grid
     that was ~180px of dead canvas per row). Now each tile is a flex column, the pullback
     strip is pinned to the floor with margin-top:auto, and the row reads as one block. */
  .tb-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(212px,1fr)); align-items:stretch; gap:10px; margin-top:12px; }
  .tb-tile { display:flex; flex-direction:column; background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:12px 14px; position:relative; }
  .tb-tile.tb-hot { border-color:color-mix(in srgb,var(--down) 50%,var(--line)); background:color-mix(in srgb,var(--down) 5%,var(--panel2)); }
  .tb-tile.tb-warm { border-color:color-mix(in srgb,#d4a017 40%,var(--line)); background:color-mix(in srgb,#d4a017 4%,var(--panel2)); }
  .tb-tile.tb-cool { border-color:var(--line); }
  .tb-hd { display:flex; align-items:center; gap:7px; margin-bottom:7px; }
  .tb-hd .flg { font-size:18px; line-height:1; }
  .tb-hd .tb-name { font-size:12.5px; font-weight:700; line-height:1.2; }
  .tb-hd .tb-name small { display:block; font-size:10.5px; font-weight:500; color:var(--muted); }
  .tb-state { display:inline-block; padding:2px 8px; border-radius:8px; font-size:11px; font-weight:700; white-space:nowrap; margin-bottom:5px; }
  .tb-state.ts-crash { background:color-mix(in srgb,var(--down) 20%,transparent); color:var(--ink-down, var(--down)); border:1px solid color-mix(in srgb,var(--down) 40%,transparent); }
  .tb-state.ts-breaking { background:color-mix(in srgb,var(--down) 14%,transparent); color:var(--ink-down, var(--down)); border:1px solid color-mix(in srgb,var(--down) 35%,transparent); }
  .tb-state.ts-topping { background:color-mix(in srgb,#d4a017 18%,transparent); color:var(--ink-warn, var(--warn)); border:1px solid color-mix(in srgb,#d4a017 40%,transparent); }
  .tb-state.ts-parabolic { background:color-mix(in srgb,#d4a017 14%,transparent); color:var(--ink-warn, var(--warn)); border:1px solid color-mix(in srgb,#d4a017 35%,transparent); }
  .tb-state.ts-extended { background:color-mix(in srgb,#d4a017 10%,transparent); color:var(--ink-warn, var(--warn)); border:1px solid color-mix(in srgb,#d4a017 28%,transparent); }
  .tb-state.ts-uptrend { background:color-mix(in srgb,var(--up) 14%,transparent); color:var(--ink-up, var(--up)); border:1px solid color-mix(in srgb,var(--up) 34%,transparent); }
  .tb-state.ts-recovery { background:color-mix(in srgb,var(--up) 10%,transparent); color:var(--ink-up, var(--up)); border:1px solid color-mix(in srgb,var(--up) 28%,transparent); }
  .tb-state.ts-recovery-confirmed { background:color-mix(in srgb,var(--up) 12%,transparent); color:var(--ink-up, var(--up)); border:1px solid color-mix(in srgb,var(--up) 32%,transparent); }
  .tb-state.ts-repair-attempt { background:color-mix(in srgb,#d4a017 10%,transparent); color:var(--ink-warn, var(--warn)); border:1px solid color-mix(in srgb,#d4a017 30%,transparent); }
  .tb-state.ts-rollover-risk { background:color-mix(in srgb,var(--down) 11%,transparent); color:var(--ink-down, var(--down)); border:1px solid color-mix(in srgb,var(--down) 30%,transparent); }
  .tb-state.ts-failed-rebound { background:color-mix(in srgb,var(--down) 18%,transparent); color:var(--ink-down, var(--down)); border:1px solid color-mix(in srgb,var(--down) 40%,transparent); }
  .tb-state.ts-basing { background:color-mix(in srgb,var(--info) 10%,transparent); color:var(--ink-info, var(--info)); border:1px solid color-mix(in srgb,var(--info) 28%,transparent); }
  .tb-state.ts-downtrend { background:color-mix(in srgb,var(--down) 10%,transparent); color:var(--ink-down, var(--down)); border:1px solid color-mix(in srgb,var(--down) 28%,transparent); }
  .tb-state.ts-calm { background:var(--panel2); color:var(--muted); border:1px solid var(--line); }
  .tb-stance { font-size:11.5px; color:var(--text); line-height:1.35; margin-bottom:6px; font-weight:500; }
  .tb-metrics { display:flex; gap:10px; flex-wrap:wrap; font-size:11px; color:var(--muted); }
  .tb-metrics .tm-v { font-weight:700; }
  .tb-metrics .tm-v.pos { color:var(--ink-up, var(--up)); }
  .tb-metrics .tm-v.neg { color:var(--ink-down, var(--down)); }
  /* Events strip. One event is ~6 words, so a full-width row was ~90% empty and six of
     them stacked into a tall, hollow panel. Two columns on desktop: same content, half
     the height, and the panel now reads as a block instead of a ladder. */
  .te-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:0 32px; margin-top:10px; }
  .te-row { display:flex; align-items:baseline; gap:8px; font-size:12px; padding:7px 0; border-bottom:1px solid var(--line); }
  .te-row:last-child { border-bottom:none; }
  /* in the 2-up layout the second-to-last row shares the final band — drop its rule too */
  @media (min-width:760px) { .te-strip > .te-row:nth-last-child(2):nth-child(odd) { border-bottom:none; } }
  .te-date { font-size:10.5px; color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap; flex-shrink:0; }
  .te-flag { font-size:14px; flex-shrink:0; }
  .te-txt { color:var(--text); flex:1; }
  /* compact state chip for table columns */
  .ts-chip { display:inline-block; padding:1px 6px; border-radius:6px; font-size:10px; font-weight:700; white-space:nowrap; border:1px solid transparent; }
  .ts-chip.ts-crash { background:color-mix(in srgb,var(--down) 18%,transparent); color:var(--ink-down, var(--down)); border-color:color-mix(in srgb,var(--down) 35%,transparent); }
  .ts-chip.ts-breaking { background:color-mix(in srgb,var(--down) 12%,transparent); color:var(--ink-down, var(--down)); border-color:color-mix(in srgb,var(--down) 30%,transparent); }
  .ts-chip.ts-topping { background:color-mix(in srgb,#d4a017 14%,transparent); color:var(--ink-warn, var(--warn)); border-color:color-mix(in srgb,#d4a017 35%,transparent); }
  .ts-chip.ts-parabolic { background:color-mix(in srgb,#d4a017 10%,transparent); color:var(--ink-warn, var(--warn)); border-color:color-mix(in srgb,#d4a017 28%,transparent); }
  .ts-chip.ts-extended { background:color-mix(in srgb,#d4a017 8%,transparent); color:var(--ink-warn, var(--warn)); border-color:color-mix(in srgb,#d4a017 24%,transparent); }
  .ts-chip.ts-uptrend { background:color-mix(in srgb,var(--up) 12%,transparent); color:var(--ink-up, var(--up)); border-color:color-mix(in srgb,var(--up) 28%,transparent); }
  .ts-chip.ts-recovery { background:color-mix(in srgb,var(--up) 8%,transparent); color:var(--ink-up, var(--up)); border-color:color-mix(in srgb,var(--up) 24%,transparent); }
  .ts-chip.ts-basing { background:color-mix(in srgb,var(--info) 8%,transparent); color:var(--ink-info, var(--info)); border-color:color-mix(in srgb,var(--info) 24%,transparent); }
  .ts-chip.ts-downtrend { background:color-mix(in srgb,var(--down) 8%,transparent); color:var(--ink-down, var(--down)); border-color:color-mix(in srgb,var(--down) 24%,transparent); }
  .ts-chip.ts-calm { background:var(--panel2); color:var(--muted); }
  /* pullback-risk radar strip inside turn tiles (#2684 risk_radar_intl.v1, display-only) */
  .tb-rd { margin-top:auto; padding-top:8px; border-top:1px dashed var(--line); }
  .tb-rd-hd { display:flex; align-items:center; gap:6px; }
  .tb-rd-lb { font-size:10.5px; font-weight:600; color:var(--muted); letter-spacing:.02em; }
  .tb-rd-chip { display:inline-block; padding:1px 7px; border-radius:7px; font-size:10px; font-weight:700; white-space:nowrap; border:1px solid transparent; margin-left:auto; }
  .tb-rd-chip.rd-calm { background:var(--panel2); color:var(--muted); border-color:var(--line); }
  .tb-rd-chip.rd-watch { background:color-mix(in srgb,#d4a017 8%,transparent); color:var(--ink-warn, var(--warn)); border-color:color-mix(in srgb,#d4a017 22%,transparent); }
  .tb-rd-chip.rd-caution { background:color-mix(in srgb,#d4a017 14%,transparent); color:var(--ink-warn, var(--warn)); border-color:color-mix(in srgb,#d4a017 35%,transparent); }
  .tb-rd-chip.rd-elevated { background:color-mix(in srgb,var(--down) 12%,transparent); color:var(--ink-down, var(--down)); border-color:color-mix(in srgb,var(--down) 30%,transparent); }
  .tb-rd-chip.rd-risk-off { background:color-mix(in srgb,var(--down) 18%,transparent); color:var(--ink-down, var(--down)); border-color:color-mix(in srgb,var(--down) 40%,transparent); }
  .tb-rd-line { font-size:11px; color:var(--text); line-height:1.35; margin-top:5px; }
  .tb-rd-foot { margin:12px 2px 0; line-height:1.5; }
  /* turn-tile rich-lens popover: "stretch" gauge (cloned by theme.js into .lens-pop,
     so it inherits the engine's --lens-* token chain — light mode + vector-safe) */
  .tbl-gauge { margin:9px 16px 2px; }
  .tbl-gauge-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px;
    font:700 8.5px/1.3 var(--font-ui,Inter,sans-serif); letter-spacing:.1em; text-transform:uppercase;
    color:color-mix(in srgb,var(--lens-mut,var(--muted,#8b93a1)) 82%,transparent); }
  .tbl-gauge-top b { font:800 12.5px/1 var(--font-ui,Inter,sans-serif); letter-spacing:0;
    color:var(--lens-text,var(--text,#e8ecf2)); font-variant-numeric:tabular-nums; }
  .tbl-gauge-top b i { font-style:normal; font-size:8px; font-weight:700; margin-left:1px;
    color:var(--lens-mut,var(--muted,#8b93a1)); }
  .tbl-gauge-track { position:relative; height:8px; margin-top:5px; border-radius:5px; overflow:hidden;
    background:color-mix(in srgb,var(--lens-mut,var(--muted,#8b93a1)) 22%,transparent); }
  .tbl-gauge-track::after { content:""; position:absolute; top:0; bottom:0; left:90%; width:1px;
    background:color-mix(in srgb,var(--lens-mut,var(--muted,#8b93a1)) 55%,transparent); }
  .tbl-gauge-fill { position:absolute; inset:0 auto 0 0; width:var(--w,50%); border-radius:5px;
    background:linear-gradient(90deg,color-mix(in srgb,var(--lens-accent,#d4a017) 42%,transparent),var(--lens-accent,#d4a017)); }
  @media (prefers-reduced-motion:no-preference) {
    .lens-pop.open .tbl-gauge-fill { transform:scaleX(0); transform-origin:0 50%;
      animation:tblGrow .62s cubic-bezier(.22,.9,.26,1.02) .12s both; }
  }
  @keyframes tblGrow { to { transform:scaleX(1); } }