*{box-sizing:border-box}
:root{color-scheme:dark}
html[data-theme="light"]{color-scheme:light}
body.imd-page{
  --imd-bg:#0a0c11;--imd-panel:rgba(16,22,30,.62);--imd-panel-strong:rgba(13,18,26,.94);
  --imd-border:rgba(255,255,255,.12);--imd-hair:color-mix(in srgb,var(--line) 74%,transparent);
  --imd-shadow:0 8px 32px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.055);
  --imd-radius:18px;--imd-num:var(--font-mono,ui-monospace,"SF Mono",Menlo,monospace);
  margin:0;padding:20px;color:var(--text);background:var(--imd-bg);
  font:14px/1.55 var(--font-ui,Inter,-apple-system,"Segoe UI",sans-serif);
  min-height:100vh;
}
html[data-theme="light"] body.imd-page{
  --imd-bg:#f5f7fb;--imd-panel:rgba(255,255,255,.84);--imd-panel-strong:rgba(255,255,255,.98);
  --imd-border:rgba(14,23,38,.09);--imd-shadow:0 8px 30px rgba(18,35,62,.09),inset 0 1px 0 #fff;
}
html[data-lang="zh"] body.imd-page{font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif}
body.imd-page a{color:var(--ink-link, var(--link));text-decoration:none}
body.imd-page button{font:inherit}
.imd-aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.imd-aurora::before,.imd-aurora::after,.imd-aurora b{content:"";position:absolute;border-radius:50%;filter:blur(100px)}
.imd-aurora::before{width:820px;height:560px;left:6%;top:-260px;background:radial-gradient(ellipse,color-mix(in srgb,var(--link) 15%,transparent),transparent 70%)}
.imd-aurora::after{width:680px;height:560px;right:-160px;bottom:-220px;background:radial-gradient(ellipse,color-mix(in srgb,var(--up) 11%,transparent),transparent 70%)}
.imd-aurora b{width:560px;height:460px;left:45%;top:34%;background:radial-gradient(ellipse,rgba(99,102,241,.08),transparent 70%)}
html[data-theme="light"] .imd-aurora{opacity:.42}
nav.site-nav{position:relative;z-index:20}
.imd-shell{position:relative;z-index:1;max-width:1480px;margin:18px auto 80px}
.imd-card{
  position:relative;background:var(--imd-panel);border:1px solid var(--imd-border);
  border-radius:var(--imd-radius);box-shadow:var(--imd-shadow);backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);padding:20px;min-width:0;
}
.imd-eyebrow{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.imd-dot{width:7px;height:7px;border-radius:50%;background:var(--up);box-shadow:0 0 14px color-mix(in srgb,var(--up) 65%,transparent)}
.imd-hero{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:16px;margin-bottom:16px}
.imd-hero-main{overflow:hidden;padding:26px}
.imd-hero-main::after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;right:-120px;top:-170px;background:radial-gradient(circle,color-mix(in srgb,var(--link) 14%,transparent),transparent 68%);pointer-events:none}
.imd-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-top:12px}
.imd-title{margin:0;font-size:clamp(27px,4vw,48px);line-height:1.03;letter-spacing:-.045em}
.imd-title .flag{font-size:.75em;margin-right:8px}
.imd-scope{color:var(--muted);font-size:12px;margin:10px 0 0;max-width:720px}
.imd-asof{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:16px;font-size:11px;color:var(--muted)}
.imd-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid var(--imd-border);background:color-mix(in srgb,var(--text) 4%,transparent);font-size:10px;font-weight:750}
.imd-chip.constructive,.imd-chip.clear{color:var(--ink-up, var(--up));border-color:color-mix(in srgb,var(--up) 35%,var(--imd-border));background:color-mix(in srgb,var(--up) 9%,transparent)}
.imd-chip.stale,.imd-chip.today,.imd-chip.balanced,.imd-chip.caution{color:var(--ink-warn, var(--warn));border-color:color-mix(in srgb,var(--warn) 38%,var(--imd-border));background:color-mix(in srgb,var(--warn) 9%,transparent)}
.imd-chip.defensive,.imd-chip.risk{color:var(--ink-down, var(--down));border-color:color-mix(in srgb,var(--down) 36%,var(--imd-border));background:color-mix(in srgb,var(--down) 8%,transparent)}
.imd-chip.released{color:var(--muted)}
/* Data-health states (fresh / stale / missing) say how CURRENT a datum is, never which way a market
   moved, so they sit on the language-invariant status plane (--ok/--warn/--act) and never on --up/--down:
   the "Confirmed <date>" chip must read the same in EN and ZH (theme.css swaps --up/--down under zh). */
.imd-chip.fresh{color:var(--ink-ok, var(--ok));border-color:color-mix(in srgb,var(--ok) 35%,var(--imd-border));background:color-mix(in srgb,var(--ok) 9%,transparent)}
.imd-chip.missing{color:var(--ink-act, var(--act));border-color:color-mix(in srgb,var(--act) 36%,var(--imd-border));background:color-mix(in srgb,var(--act) 8%,transparent)}
.imd-score-wrap{display:grid;grid-template-columns:164px minmax(0,1fr);gap:20px;align-items:center;margin-top:24px}
.imd-gauge{
  width:154px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
  background:conic-gradient(var(--gauge) calc(var(--score)*1%),color-mix(in srgb,var(--text) 9%,transparent) 0);
  position:relative;filter:drop-shadow(0 0 25px color-mix(in srgb,var(--gauge) 18%,transparent));
}
.imd-gauge::before{content:"";position:absolute;inset:11px;border-radius:50%;background:var(--imd-panel-strong);border:1px solid var(--imd-border)}
.imd-gauge-value{position:relative;text-align:center;font:800 48px/.9 var(--imd-num);color:var(--gauge);letter-spacing:-.06em}
.imd-gauge-value small{display:block;margin-top:9px;font:700 9px/1 var(--font-ui,Inter,sans-serif);color:var(--muted);letter-spacing:.08em;text-transform:uppercase}
.imd-score-constructive{--gauge:var(--up)}.imd-score-balanced{--gauge:var(--warn)}.imd-score-defensive{--gauge:var(--down)}
.imd-verdict{font-size:21px;font-weight:800;letter-spacing:-.02em}
.imd-action{margin-top:7px;color:var(--text);font-size:13px;max-width:560px}
.imd-method{color:var(--muted);font-size:10.5px;margin:9px 0 0}
.imd-transition{display:grid;gap:8px}
.imd-transition h2,.imd-section-head h2{font-size:16px;line-height:1.25;margin:0;letter-spacing:-.015em}
.imd-transition h2::before,.imd-section-head h2::before{content:"";display:inline-block;width:3px;height:16px;border-radius:2px;background:linear-gradient(var(--link),color-mix(in srgb,var(--link) 28%,transparent));margin-right:9px;vertical-align:-2px}
.imd-transition-list{display:grid;gap:8px;margin-top:8px}
.imd-condition{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--imd-hair);border-radius:12px;background:color-mix(in srgb,var(--text) 3%,transparent);font-size:11.5px}
.imd-condition b{display:grid;place-items:center;flex:0 0 22px;height:22px;border-radius:7px;color:var(--ink-link, var(--link));background:color-mix(in srgb,var(--link) 12%,transparent);font:750 10px var(--imd-num)}
/* auto-fit, not repeat(5): the pullback tile stands down when the Risk Radar card below
   owns that number, and the remaining tiles still span the row evenly. */
.imd-trust{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:16px}
.imd-trust-item{padding:13px 15px}
.imd-trust-label{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:800}
.imd-trust-value{margin-top:5px;font:750 15px var(--imd-num);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imd-trust-value.word{font-family:inherit}
.imd-section{margin-top:25px}
.imd-section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:0 2px 11px}
.imd-section-head p{margin:0;color:var(--muted);font-size:11px;text-align:right}
.imd-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
button.imd-face{color:inherit;text-align:left;cursor:pointer;width:100%;transition:transform .18s,border-color .18s,background .18s}
button.imd-face:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--link) 32%,var(--imd-border));background:color-mix(in srgb,var(--link) 5%,var(--imd-panel))}
button.imd-face:focus-visible,.imd-close:focus-visible{outline:2px solid var(--link);outline-offset:3px}
.imd-face-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.imd-face-icon{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--imd-border);border-radius:11px;background:color-mix(in srgb,var(--link) 10%,transparent);font-size:17px}
.imd-open{font-size:9px;color:var(--muted);letter-spacing:.07em;text-transform:uppercase}
.imd-face h3{margin:13px 0 4px;font-size:14px}
.imd-face p{margin:0;color:var(--muted);font-size:11px;min-height:34px}
.imd-face-kpi{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-top:15px;padding-top:12px;border-top:1px solid var(--imd-hair)}
.imd-face-kpi strong{font:800 25px/1 var(--imd-num);letter-spacing:-.045em}
.imd-face-kpi span{color:var(--muted);font-size:9px;text-align:right}
.imd-kpi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
.imd-mini{border-top:1px solid var(--imd-hair);padding-top:9px;min-width:0}
.imd-mini span{display:block;color:var(--muted);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imd-mini strong{display:block;margin-top:3px;font:750 14px var(--imd-num)}
.imd-chart-card{padding:24px}
.imd-chart-wrap{height:210px;margin-top:13px;position:relative;border:1px solid var(--imd-hair);border-radius:14px;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--link) 6%,transparent),transparent)}
.imd-chart-wrap::before,.imd-chart-wrap::after{content:"";position:absolute;left:0;right:0;border-top:1px dashed var(--imd-hair)}
.imd-chart-wrap::before{top:36%}.imd-chart-wrap::after{top:62%}
.imd-chart{position:absolute;inset:16px;width:calc(100% - 32px);height:calc(100% - 32px);overflow:visible}
.imd-chart polygon{fill:url(#scoreFill)}
.imd-chart polyline{fill:none;stroke:var(--link);stroke-width:2.4;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--link) 50%,transparent))}
.imd-chart-meta{display:flex;justify-content:space-between;color:var(--muted);font:10px var(--imd-num);margin-top:9px}
.imd-lenses{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.imd-lens{padding:16px}
.imd-lens h3{font-size:12px;margin:0 0 6px}
.imd-lens p{font-size:10.5px;color:var(--muted);margin:0;min-height:48px}
.imd-lens-v{font:750 14px var(--imd-num);margin-top:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imd-lens-src{font-size:9px;color:var(--muted);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imd-calendar{display:grid;gap:8px}
.imd-event{display:grid;grid-template-columns:105px 1fr auto;gap:14px;align-items:center;padding:13px 15px}
.imd-event-date{font:750 12px var(--imd-num)}
.imd-event h3{margin:0;font-size:12px}.imd-event p{margin:3px 0 0;color:var(--muted);font-size:10px}
.imd-health{overflow:auto;padding:0}
.imd-table{width:100%;border-collapse:collapse;min-width:760px;font-size:11px}
.imd-table th,.imd-table td{padding:12px 14px;border-bottom:1px solid var(--imd-hair);text-align:left;vertical-align:top}
.imd-table th{color:var(--muted);font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.imd-table tr:last-child td{border-bottom:0}
.imd-table .source-role{max-width:340px;color:var(--muted)}
.imd-caveat{margin-top:12px;padding:13px 15px;border-radius:13px;border:1px solid color-mix(in srgb,var(--warn) 32%,var(--imd-border));background:color-mix(in srgb,var(--warn) 7%,transparent);font-size:11px}
.imd-next{display:flex;flex-wrap:wrap;gap:8px}
.imd-next a{display:inline-flex;padding:8px 13px;border:1px solid var(--imd-border);border-radius:999px;color:var(--text);font-size:11px;background:var(--imd-panel)}
.imd-next a.active{color:var(--ink-link, var(--link));border-color:color-mix(in srgb,var(--link) 40%,var(--imd-border))}
.imd-next a:hover{background:color-mix(in srgb,var(--link) 8%,var(--imd-panel))}
.imd-footer{display:flex;justify-content:space-between;gap:18px;margin-top:22px;padding:16px 4px;color:var(--muted);font-size:10px}
.imd-dlg{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:18px}
.imd-dlg.open{display:flex}
.imd-backdrop{position:absolute;inset:0;background:rgba(3,7,13,.68);backdrop-filter:blur(8px)}
.imd-panel{position:relative;width:min(900px,94vw);max-height:88vh;overflow:auto;background:var(--imd-panel-strong);border:1px solid var(--imd-border);border-radius:22px;box-shadow:0 32px 100px rgba(0,0,0,.65);opacity:0;transform:translateY(12px) scale(.975);transition:opacity .22s,transform .28s}
.imd-dlg.in .imd-panel{opacity:1;transform:none}
.imd-dlg-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--imd-hair);background:var(--imd-panel-strong);backdrop-filter:blur(20px)}
.imd-dlg-head h2{margin:0;font-size:15px}
.imd-close{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--imd-border);background:color-mix(in srgb,var(--text) 5%,transparent);color:var(--text);cursor:pointer}
.imd-dlg-body{padding:20px}
.imd-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.imd-receipt{border:1px solid var(--imd-hair);border-radius:13px;padding:13px}
.imd-receipt h3{font-size:11px;margin:0 0 7px}.imd-receipt p{font-size:10.5px;color:var(--muted);margin:0}
.imd-breakdown{display:grid;gap:7px}
.imd-part{display:grid;grid-template-columns:90px 1fr 56px;align-items:center;gap:10px;font-size:10px}
.imd-bar{height:7px;border-radius:5px;background:color-mix(in srgb,var(--text) 7%,transparent);overflow:hidden}
.imd-bar i{display:block;height:100%;background:var(--link);transform-origin:left}
body.imd-lock{overflow:hidden}
/* help "?" tip — the pre-upgrade fallback for the shared card's help() icons. theme.js
   promotes canonical icons to the site popover (.help-upgraded hides .tip); these rules
   keep the tooltip body hidden until then, and hover-usable with JS off. */
.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;top:140%;left:50%;transform:translateX(-50%);width:280px;background:var(--panel);border:1px solid var(--line);padding:9px 11px;border-radius:8px;z-index:60;font-size:12px;line-height:1.45;color:var(--text);font-weight:400;text-transform:none;letter-spacing:normal;box-shadow:var(--popover-shadow);max-height:min(60vh,420px);overflow-y:auto;overscroll-behavior:contain}
.help:hover::before{content:'';position:absolute;top:100%;left:-30px;right:-30px;height:10px}
.help:hover .tip{display:block}
/* Risk Radar section — the shared .rrx card wears this page's glass-card skin by remapping
   --panel, so the card's own tokens (loud wash, chips, meters) all follow one swap instead
   of a fork. Left accent + every internal rule stay exactly as the shared partial ships. */
.imd-radar .rrx{--panel:var(--imd-panel);margin:0;padding:20px;border-radius:var(--imd-radius);border-color:var(--imd-border);box-shadow:var(--imd-shadow);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-left:4px solid var(--rc)}
  /* ============================================================================
     RISK RADAR CARD (.rrx) — the one shared, redesigned alert used on the US Macro
     + US-Stocks pages AND the China / HK / Canada Market-State boards (the macros
     live in _risk_radar_card.html.j2). GLOBAL theme vars only + an inline --rc state
     accent, so it renders the same in the page-macro, page-stocks and china/hk/canada
     scopes. The escalating odds ramp replaces the old cramped "5d.. 10d.. 21d.." run.
     Included by dashboard.html.j2 (both modes) + _market_state.css.j2 (CN/HK/CA). ==== */
  .rrx { --rc: var(--warn);
         display: grid; gap: 12px; margin: 12px 0 2px; padding: 15px 18px; border-radius: 12px;
         background: var(--panel);
         border: 1px solid var(--line);
         border-left: 4px solid var(--rc); font-size: 12.5px; line-height: 1.4;
         box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 16px 32px -24px rgba(0,0,0,.4); }
  body.page-macro .ms-front > .rrx { margin: 0 0 14px; }
  /* grouping wrappers: inert everywhere by default (the card keeps its single-column
     stack on the China/HK/Canada/stocks placements); the macro front-page overrides
     these to display:flex to build the 2-column banner. */
  .rrx > .rrx-main, .rrx > .rrx-side { display: contents; min-width: 0; }
  /* Perf: loud pulse = pseudo animating ONLY opacity (compositor-run); animating
     box-shadow on the card repainted it every frame (2026-07-21 mobile audit).
     mmGlowBreathe keyframes ship in theme.css (loaded on every placement). */
  .rrx.rrx-loud { background: color-mix(in srgb, var(--rc) 5%, var(--panel));
         position: relative;
         box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rc) 20%, transparent), 0 14px 34px -18px color-mix(in srgb, var(--rc) 70%, transparent); }
  .rrx.rrx-loud::before { content: ""; position: absolute; inset: 0; border-radius: inherit;
         pointer-events: none;
         box-shadow: 0 0 0 5px color-mix(in srgb, var(--rc) 6%, transparent);
         opacity: 0; animation: mmGlowBreathe 2.4s ease-in-out infinite; }
  @media (prefers-reduced-motion: reduce) { .rrx.rrx-loud::before { animation: none; opacity: 0; }
         .rrx.rrx-loud { box-shadow: 0 0 0 1px color-mix(in srgb, var(--rc) 30%, transparent); } }
  /* header */
  .rrx .rrx-hd { display: flex; align-items: flex-start; gap: 10px; }
  .rrx .rrx-ic { font-size: 18px; line-height: 1.1; flex: none; }
  .rrx .rrx-id { min-width: 0; flex: 1; }
  .rrx .rrx-ttl { display: flex; align-items: center; flex-wrap: wrap; gap: 7px;
         font-weight: 700; font-size: 13px; color: var(--text); }
  .rrx .rrx-badge { font-weight: 800; letter-spacing: .03em; color: var(--rc); font-size: 11.5px;
         font-variant-numeric: tabular-nums; padding: 1px 7px; border-radius: 5px;
         background: color-mix(in srgb, var(--rc) 16%, transparent);
         border: 1px solid color-mix(in srgb, var(--rc) 38%, transparent); }
  .rrx .rrx-dom { color: var(--muted); font-size: 11.5px; margin-top: 2px; }
  .rrx .rrx-authority { font-size: 10.5px; line-height: 1.35; margin-top: 3px; font-weight: 600; }
  .rrx .rrx-authority.is-advisory { color: var(--muted); }
  .rrx .rrx-authority.is-binding { color: var(--rc); }
  .rrx .rrx-amp { color: var(--rc); font-weight: 600; font-size: 11px; margin-top: 3px; }
  .rrx .rrx-gross { flex: none; text-align: center; padding: 3px 11px; border-radius: 9px;
         background: color-mix(in srgb, var(--rc) 12%, transparent);
         border: 1px solid color-mix(in srgb, var(--rc) 32%, transparent); }
  .rrx .rrx-gross .gv { display: block; font-weight: 800; font-size: 15px; color: var(--rc);
         font-variant-numeric: tabular-nums; line-height: 1.1; }
  .rrx .rrx-gross .gn { display: block; font-size: 9px; text-transform: uppercase; letter-spacing: .07em;
         color: var(--muted); }
  /* odds hero — flat on the card (the amber wash now lives on .rrx itself, not a nested box) */
  .rrx .rrx-odds { display: flex; gap: 16px; align-items: stretch; flex-wrap: wrap; }
  .rrx .rrx-odds-l { flex: 1 1 150px; display: flex; flex-direction: column; justify-content: center; }
  .rrx .rrx-cap { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em;
         color: var(--muted); }
  .rrx .rrx-cap-sub { font-weight: 600; letter-spacing: .02em; opacity: .8; }
  .rrx .rrx-big { font-weight: 800; font-size: 40px; line-height: .95; color: var(--rc); margin: 4px 0 2px;
         font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
  .rrx .rrx-big .pct { font-size: 22px; margin-left: 1px; }
  .rrx .rrx-big .rrx-hz { font-size: 11px; font-weight: 600; color: var(--muted); margin-left: 7px;
         letter-spacing: 0; }
  .rrx .rrx-vsn { font-size: 11.5px; color: var(--muted); }
  .rrx .rrx-vsn b { color: var(--text); font-variant-numeric: tabular-nums; }
  /* escalating ramp */
  .rrx .rrx-ramp { flex: 1 1 240px; min-width: 0; max-width: 430px; display: flex; align-items: flex-end;
         justify-content: space-between; gap: 12px; position: relative; padding-top: 18px; }
  .rrx .rrx-col { flex: 1 1 0; min-width: 0; max-width: 76px; display: flex; flex-direction: column;
         align-items: center; gap: 5px; }
  .rrx .rrx-v { font-size: 12.5px; font-weight: 800; color: var(--text); font-variant-numeric: tabular-nums; }
  .rrx .rrx-col.is-hd .rrx-v { color: var(--rc); }
  .rrx .rrx-tk { width: 100%; max-width: 54px; height: 64px; position: relative;
         display: flex; align-items: flex-end; justify-content: center; border-bottom: 1px solid var(--line); }
  .rrx .rrx-norm { position: absolute; left: 0; right: 0; bottom: 0; border-radius: 2px 2px 0 0;
         background: repeating-linear-gradient(-45deg, color-mix(in srgb, var(--muted) 32%, transparent) 0 4px, transparent 4px 8px);
         border-top: 1px dashed color-mix(in srgb, var(--muted) 60%, transparent); }
  .rrx .rrx-fill { width: 100%; border-radius: 3px 3px 0 0; position: relative; z-index: 1; min-height: 6px;
         background: linear-gradient(180deg, var(--rc), color-mix(in srgb, var(--rc) 50%, transparent)); }
  .rrx .rrx-hl { font-size: 10.5px; font-weight: 600; color: var(--muted); }
  .rrx .rrx-col.is-hd .rrx-hl { color: var(--text); }
  .rrx .rrx-leg { position: absolute; top: 0; right: 2px; display: flex; align-items: center; gap: 4px;
         font-size: 9.5px; color: var(--muted); }
  .rrx .rrx-leg-n { width: 13px; border-top: 1px dashed color-mix(in srgb, var(--muted) 60%, transparent); }
  /* threat meters */
  .rrx .rrx-threats { display: flex; flex-wrap: wrap; gap: 6px; }
  .rrx .rrx-th { --sb: var(--muted); display: inline-flex; align-items: center; gap: 6px;
         padding: 3px 9px; border-radius: 7px; font-size: 11px;
         background: var(--panel); border: 1px solid var(--line); }
  .rrx .rrx-th.dom { background: color-mix(in srgb, var(--sb) 10%, var(--panel));
         border-color: color-mix(in srgb, var(--sb) 50%, var(--line)); }
  .rrx .rrx-th.dim { opacity: .58; }
  .rrx .rrx-th-n { color: var(--text); font-weight: 600; }
  .rrx .rrx-th.dom .rrx-th-n { color: var(--sb); }
  .rrx .rrx-meter { display: inline-flex; gap: 1.5px; }
  .rrx .rrx-meter i { width: 3px; height: 11px; border-radius: 1px;
         background: color-mix(in srgb, var(--muted) 28%, transparent); }
  .rrx .rrx-meter i.on { background: var(--sb); }
  .rrx .rrx-th-s { color: var(--text); font-weight: 800; font-size: 11.5px; font-variant-numeric: tabular-nums; }
  .rrx .rrx-tag { font-size: 8.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted);
         border: 1px solid var(--line); border-radius: 4px; padding: 0 4px; }
  .rrx .rrx-ev { font-size: 11px; color: var(--muted); }
  .rrx .rrx-ev-k { font-weight: 700; color: var(--text); margin-right: 6px; }
  .rrx .rrx-ev-p { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
  /* action */
  .rrx .rrx-do { font-size: 12px; color: var(--text); padding-top: 9px;
         border-top: 1px solid color-mix(in srgb, var(--rc) 20%, var(--line)); }
  .rrx .rrx-do-k { font-weight: 800; color: var(--rc); text-transform: uppercase; letter-spacing: .06em;
         font-size: 10.5px; margin-right: 8px; }
  /* election-cycle context chip (US radar only; engine/election_cycle.py) */
  /* compressed to <=2 dense lines so the cycle context never balloons the card */
  .rrx .rrx-cyc { font-size: 10.5px; color: var(--muted); padding-top: 7px; margin-top: 2px; line-height: 1.4;
         border-top: 1px solid color-mix(in srgb, var(--rc) 16%, var(--line));
         display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 8px; row-gap: 1px; }
  .rrx .rrx-cyc-k { font-weight: 700; color: var(--text); }
  .rrx .rrx-cyc-tag { color: var(--rc); font-weight: 700; font-size: 9.5px; }
  /* RC-R11 washout counter-read chip — a cyan-tinted variant of the modulator row. */
  .rrx .rrx-cyc.rrx-washout { border-top-color: color-mix(in srgb, var(--cyan, #38bdf8) 22%, var(--line)); }
  .rrx .rrx-cyc.rrx-washout .rrx-cyc-k { color: var(--cyan, #38bdf8); }
  .rrx .rrx-cyc-sub { color: var(--muted); font-size: 10px; margin: 0; }
  .rrx .rrx-cyc-sec { color: var(--text); font-size: 10px; margin: 0; flex-basis: 100%;
         font-variant-numeric: tabular-nums; }
  /* self-audit line (international radars only) */
  .rrx .rrx-audit { font-size: 10.5px; color: var(--muted); }
  .rrx .rrx-audit-k { font-weight: 700; color: var(--text); margin-right: 6px; }
  .rrx .rrx-audit b { color: var(--text); font-variant-numeric: tabular-nums; }
  /* track-record line — one muted glance-tier line surfacing the forward-ledger scorecard */
  .rrx .rrx-trk { font-size: 10.5px; color: var(--muted); display: flex;
         align-items: center; gap: 5px; flex-wrap: wrap; line-height: 1.4; }
  /* de-escalation panel (engine/risk_radar_recovery.py) — "risk peaking / risk-off may be ending".
     Display-only; --rvc = green when receding, blue when merely peaking. Cool palette so it never
     reads like a green "all-clear" buy signal. */
  .rrx .rrx-rec { --rvc: var(--info); display: flex; flex-direction: column; gap: 7px;
         padding: 9px 11px; border-radius: 9px;
         background: color-mix(in srgb, var(--rvc) 7%, var(--panel));
         border: 1px solid color-mix(in srgb, var(--rvc) 30%, var(--line));
         border-left: 3px solid var(--rvc); }
  .rrx .rrx-rec.is-turn { background: color-mix(in srgb, var(--rvc) 13%, var(--panel));
         box-shadow: 0 0 0 1px color-mix(in srgb, var(--rvc) 26%, transparent); }
  .rrx .rrx-rec-hd { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
  .rrx .rrx-rec-ar { color: var(--rvc); font-weight: 800; font-size: 14px; line-height: 1; }
  .rrx .rrx-rec-ttl { font-weight: 700; font-size: 12px; color: var(--text); }
  .rrx .rrx-rec-tag { font-size: 8.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
         color: var(--rvc); background: color-mix(in srgb, var(--rvc) 16%, transparent);
         border: 1px solid color-mix(in srgb, var(--rvc) 42%, transparent); border-radius: 4px; padding: 0 5px; }
  .rrx .rrx-rec-mid { display: flex; align-items: center; gap: 9px; }
  .rrx .rrx-rec-spark { width: 84px; height: 24px; flex: none;
         background: color-mix(in srgb, var(--rvc) 5%, transparent); border-radius: 4px; }
  .rrx .rrx-rec-spark .pk { fill: var(--muted); }
  .rrx .rrx-rec-spark .lx { fill: var(--rvc); }
  .rrx .rrx-rec-sub { font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; min-width: 0; }
  .rrx .rrx-rec-cats { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
  .rrx .rrx-rec-k { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em;
         color: var(--muted); }
  .rrx .rrx-rec-chip { display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px;
         color: var(--text); padding: 2px 7px; border-radius: 6px;
         background: var(--panel); border: 1px solid var(--line); }
  .rrx .rrx-rec-chip.fresh { color: var(--fresh-ok); font-weight: 600;
         border-color: color-mix(in srgb, var(--fresh-ok) 45%, var(--line));
         background: color-mix(in srgb, var(--fresh-ok) 10%, var(--panel)); }
  .rrx .rrx-rec-cats.none { font-size: 10.5px; color: var(--muted); font-style: italic; }
  /* RRX2 WA: drivers line ("what faded / still warm") + muted "no signal" chip */
  .rrx .rrx-rec-drv { font-size: 10px; color: var(--muted); line-height: 1.4; margin-top: -2px; }
  /* RLT-R5: measured-edge salience line — receipt/muted styling, demoted below catalyst chips */
  .rrx .rrx-rec-sal { font-size: 10px; color: var(--muted); font-style: italic; line-height: 1.4;
         padding: 2px 0 0; border-top: 1px solid color-mix(in srgb, var(--muted) 20%, transparent); margin-top: 1px; }
  .rrx .rrx-rec-chip.muted { color: var(--muted); font-style: italic; border-style: dashed; }
  .rrx .rrx-rec-do { font-size: 11px; color: var(--text); line-height: 1.4; }
  .rrx .rrx-rec-do-k { font-weight: 800; color: var(--rvc); text-transform: uppercase; letter-spacing: .06em;
         font-size: 9.5px; margin-right: 6px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx { gap: 10px; padding: 13px 16px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-odds { gap: 14px; align-items: center; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-big { font-size: 34px; margin: 2px 0 1px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-big .pct { font-size: 19px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-vsn { font-size: 11px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-ramp { gap: 10px; padding-top: 12px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-col { gap: 3px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-v { font-size: 11.5px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-tk { height: 44px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-hl { font-size: 10px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-audit,
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-th.dim,
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-rec-mid,
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-rec-do,
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-cyc-sub,
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-cyc-sec { display: none; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-rec { gap: 5px; padding: 7px 10px; }
  body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx .rrx-cyc { padding-top: 5px; line-height: 1.25; }
  body:is(.page-macro, .page-china, .page-canada) { padding-top: 26px; }
  @media (max-width: 760px) {
    .rrx .rrx-odds { flex-direction: column; gap: 14px; }
    .rrx .rrx-odds-l { flex: 0 0 auto; }
    .rrx .rrx-ramp { flex: 0 0 auto; width: 100%; max-width: none; justify-content: space-around; }
  }
  /* phone: collapse to a SIMPLE, STRONG alert — headline + the one number that
     matters + the action. The ramp, the verbose amplification line and the
     non-dominant threat meters are desktop-only detail, not a mobile wall. */
  @media (max-width: 560px) {
    .rrx { padding: 14px 15px; gap: 10px; }
    .rrx .rrx-amp, .rrx .rrx-ramp, .rrx .rrx-ev, .rrx .rrx-cyc, .rrx .rrx-audit { display: none; }
    .rrx .rrx-cgl { display: flex; }
    .rrx .rrx-big { font-size: 34px; }
    .rrx .rrx-threats { gap: 5px; }
    .rrx .rrx-th:not(.dom) { display: none; }
  }
  /* desktop: the consolidated 2-column board (header/odds/ramp | threats/evidence/
     action/cycle) on EVERY market's .ms-front board, not just the US macro one —
     roughly halves the card height vs the single-column stack. The US dashboard
     keeps its own (higher-specificity, identical) copy; this is what reaches the
     China / HK / Canada boards that only load this shared partial.
     `.imd-radar` is the international dashboards' section wrapper (JP/KR/EZ/GB/IN,
     templates/international_macro.html.j2) — a full-page-width placement, so it takes
     the same wide board instead of stranding the ramp beside an empty middle. Inert
     on every page that has no such wrapper. */
  @media (min-width: 1100px) {
    :is(.ms-front, .imd-radar) > .rrx { grid-template-columns: minmax(0,1fr) minmax(0,1fr);
      column-gap: 22px; row-gap: 0; align-items: stretch; }
    :is(.ms-front, .imd-radar) > .rrx > .rrx-main { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
    :is(.ms-front, .imd-radar) > .rrx > .rrx-main .rrx-odds { flex: 1 1 auto; }
    :is(.ms-front, .imd-radar) > .rrx > .rrx-main .rrx-ramp { align-items: stretch; }
    :is(.ms-front, .imd-radar) > .rrx > .rrx-main .rrx-tk { height: auto; flex: 1 1 auto; min-height: 64px; }
    :is(.ms-front, .imd-radar) > .rrx > .rrx-side { display: flex; flex-direction: column; justify-content: center;
      gap: 9px; min-width: 0; padding-left: 22px;
      border-left: 1px solid color-mix(in srgb, var(--rc) 22%, var(--line)); }
    body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx > .rrx-main .rrx-odds { flex: 0 0 auto; }
    body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx > .rrx-main .rrx-ramp { align-items: flex-end; }
    body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx > .rrx-main .rrx-tk { height: 44px; flex: 0 0 44px; min-height: 44px; }
    body:is(.page-macro, .page-china, .page-canada) .ms-front > .rrx > .rrx-side { gap: 7px; padding-left: 20px; }
  }/* after the include: a class-pair selector outranks the card's own phone rule, so the
   mobile padding has to be restated at this specificity to survive. */
@media(max-width:560px){.imd-radar .rrx{padding:16px}}
@media(max-width:1100px){
  body.imd-page{padding:16px}
  .imd-hero{grid-template-columns:1fr}.imd-transition-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .imd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .imd-lenses{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  body.imd-page{padding:12px}.imd-shell{margin-top:12px}
  .imd-title-row{display:block}.imd-score-wrap{grid-template-columns:120px minmax(0,1fr);gap:14px}
  .imd-gauge{width:116px}.imd-gauge-value{font-size:37px}
  .imd-transition-list,.imd-grid,.imd-lenses,.imd-cols{grid-template-columns:1fr}
  .imd-trust{grid-template-columns:repeat(2,minmax(0,1fr))}
  .imd-section-head{display:block}.imd-section-head p{text-align:left;margin-top:5px}
  .imd-event{grid-template-columns:88px 1fr}.imd-event .imd-chip{grid-column:2;justify-self:start}
  .imd-dlg{align-items:flex-end;padding:0}.imd-panel{width:100%;max-width:none;max-height:90vh;border-radius:22px 22px 0 0;transform:translateY(100%)}
  .imd-dlg.in .imd-panel{transform:none}.imd-close{width:42px;height:42px}
  .imd-footer{display:block}.imd-footer span{display:block;margin-top:5px}
}
@media(max-width:430px){
  .imd-hero-main,.imd-card{padding:16px}.imd-title{font-size:30px}
  .imd-score-wrap{grid-template-columns:1fr}.imd-gauge{width:130px}
  .imd-trust{grid-template-columns:1fr}.imd-face-kpi strong{font-size:22px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}