/* Market Pulse, Market Drivers and the zone chart. Tokens only (app.css); light and dark follow them. */

/* ---------- zone chart card ---------- */
.zc-card { padding: var(--sp-4); min-width: 0; display: grid; gap: var(--sp-3); }
.zc-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); }
.zc-title { display: grid; flex: 1 1 220px; min-width: 0; }
.zc-title h3 { margin: 0; font-size: var(--fs-md); }
.zc-title .faint { font-size: var(--fs-xs); }
.zc-trend { font-size: var(--fs-xs); color: var(--text-2); white-space: nowrap; }
.zc-head > .icon-btn { margin-left: auto; }
.zc-toggles { display: flex; gap: 6px; flex-wrap: wrap; }
.zc-tg { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 0 10px; border-radius: var(--r-pill); border: 1px solid var(--border); background: var(--surface-1); color: var(--text-3); font: 500 var(--fs-xs)/1 var(--font); cursor: pointer; transition: background var(--dur-hover) var(--ease), color var(--dur-hover) var(--ease), border-color var(--dur-hover) var(--ease); }
.zc-tg i { width: 10px; height: 10px; border-radius: 3px; opacity: .35; }
.zc-tg.on { color: var(--text); border-color: var(--border-strong); background: var(--surface-2); }
.zc-tg.on i { opacity: 1; }
.zc-tg:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: 2px; }
.zc-box { position: relative; }
.zc-host { position: absolute; inset: 0; }
.zc-legend { position: absolute; z-index: 2; top: 6px; left: 8px; right: 70px; display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 11.5px; color: var(--text-3); pointer-events: none; }
.zc-legend b { color: var(--text); font-weight: 600; }
.zc-legend .up b { color: var(--up); } .zc-legend .down b { color: var(--down); }
.zc-legend .ema i { display: inline-block; width: 10px; height: 2px; margin-right: 4px; vertical-align: middle; }
.zc-full { position: fixed; inset: 0; z-index: var(--z-dialog); border-radius: 0; margin: 0; overflow: auto; }
body.zc-lock { overflow: hidden; }

/* ---------- Market Pulse ---------- */
.mp { display: grid; gap: var(--sp-5); }
.mp > .page-head { margin-bottom: 0; }
.mp-pick { width: auto; min-width: 200px; max-width: 320px; }
.mp-tools { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: center; }
.mp-hero h2 { font: 600 var(--fs-3xl)/1.15 var(--font-display); letter-spacing: var(--track-display); margin: 0; max-width: 32ch; text-wrap: balance; }
.mp-hero h2 span { color: var(--accent); }
.mp-hero h2 small { font-size: .5em; font-weight: 600; vertical-align: middle; }
.mp-hero p { color: var(--text-2); margin: var(--sp-2) 0 var(--sp-3); max-width: 92ch; font-size: var(--fs-sm); }
.mp-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--sp-3); }
.mp-chips .chip.up, .mp-flags .chip.up { background: var(--up-soft); color: var(--up); }
.mp-chips .chip.down, .mp-flags .chip.down { background: var(--down-soft); color: var(--down); }
.mp-regime { font-weight: 600; }
.mp-hero p b { color: var(--text); font-weight: 600; }
.mp-win { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0 0 var(--sp-3); max-width: 920px; font-size: var(--fs-sm); }
.mp-win.on { padding: 10px 12px; border-radius: var(--r-sm); background: var(--warn-soft); }
.mp-win b { display: inline-flex; align-items: center; gap: 6px; color: var(--warn); margin-right: 4px; }
.mp-win .faint { display: inline-flex; align-items: center; gap: 6px; }
.mp-win.on .faint { flex-basis: 100%; }
.mp-win .chip { background: var(--surface-1); }
.mp-win .chip .tnum { font-weight: 600; margin-right: 3px; }
.mp-scn { max-width: 760px; }
.mp-scn .bar { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: var(--surface-2); }
.mp-scn .bar i { display: block; height: 100%; }
.mp-scn .bar .dn { background: var(--down); } .mp-scn .bar .base { background: var(--accent); } .mp-scn .bar .up { background: var(--up); }
.mp-scn .lab { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); margin-top: var(--sp-2); font-size: var(--fs-xs); color: var(--text-2); }
.mp-scn .lab b { display: block; font-size: var(--fs-lg); }
.mp-scn .lab .dn b { color: var(--down); } .mp-scn .lab .base b { color: var(--accent); } .mp-scn .lab .up b { color: var(--up); }
.mp-scn .lab .base { text-align: center; } .mp-scn .lab .up { text-align: right; }

.mp-primary { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--sp-4); align-items: start; }
.mp-aside { padding: var(--sp-4); display: grid; gap: var(--sp-4); }
.mp-thesis p { margin: var(--sp-3) 0; font-size: var(--fs-md); line-height: 1.5; }
.mp-bounds { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2); }
.mp-bounds div, .mp-lv { border: 1px solid var(--border); border-radius: var(--r-sm); padding: 8px 10px; display: grid; gap: 1px; }
.mp-bounds small, .mp-lv small { color: var(--text-3); font-size: 11px; }
.mp-bounds b, .mp-lv b { font-size: var(--fs-lg); }
.mp-bounds span, .mp-lv span { font-size: 11.5px; color: var(--text-2); }
.mp-lv.r { border-left: 3px solid var(--down); } .mp-lv.s { border-left: 3px solid var(--up); }
.mp-strad { font-size: var(--fs-xs); color: var(--text-2); display: flex; gap: 8px; align-items: center; margin: var(--sp-3) 0 0; }
.mp-strad i { flex: none; width: 16px; border-top: 2px dotted var(--info); }
.mp-levels { display: grid; gap: var(--sp-2); }
.mp-levels .eyebrow, .mp-aside .eyebrow { margin: var(--sp-2) 0 0; }
.mp-setup { border-radius: var(--r-sm); padding: 8px 10px; display: grid; gap: 2px; font-size: var(--fs-xs); color: var(--text-2); }
.mp-setup.up { background: var(--up-soft); } .mp-setup.down { background: var(--down-soft); }
.mp-setup b { font-size: var(--fs-sm); color: var(--text); }
.mp-tl { list-style: none; margin: var(--sp-2) 0 0; padding: 0; display: grid; gap: 10px; }
.mp-tl li { display: grid; gap: 2px; font-size: var(--fs-sm); padding-left: 12px; border-left: 2px solid var(--border-strong); }
.mp-tl li b { font-size: var(--fs-xs); color: var(--text-3); font-weight: 600; }
.mp-tl li.flip { border-left-color: var(--warn); }

.mp-read { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
.mp-rules ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: r; }
.mp-rules li { display: grid; grid-template-columns: 12px 1fr; gap: 10px; align-items: baseline; font-size: var(--fs-sm); line-height: 1.5; }
.mp-ai { background: linear-gradient(180deg, var(--accent-soft), transparent 60%), var(--surface-1); }
.mp-ai .txt { margin: 0; font-size: var(--fs-md); line-height: 1.6; }
.mp-gen { display: inline-flex; align-items: center; gap: 5px; font: 600 11px/1 var(--font); letter-spacing: var(--track-label); text-transform: uppercase; color: var(--accent); background: var(--accent-soft); border-radius: var(--r-pill); padding: 5px 9px; }

.mp-card { padding: var(--sp-4) var(--sp-5); display: grid; gap: var(--sp-2); min-width: 0; align-content: start; }
.mp-card-h { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; justify-content: space-between; margin-bottom: var(--sp-1); }
.mp-card-h h3 { margin: 0; font-size: var(--fs-md); }
.mp-card-h .faint { font-size: var(--fs-xs); }
.mp-below { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
.mp-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); align-items: start; }
.mp-three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); align-items: start; }
.mp-row { display: grid; grid-template-columns: minmax(0, 1fr) 34% 56px; gap: 10px; align-items: center; padding: 6px 0; border-top: 1px solid var(--divider); font-size: var(--fs-sm); }
.mp-row:first-of-type { border-top: 0; }
.mp-row b { font-weight: 600; display: block; }
.mp-row small { display: block; color: var(--text-3); font-size: 11.5px; line-height: 1.35; }
.mp-row > span:last-child { text-align: right; }
.mp-row.weak { opacity: .62; }
.mp-div { position: relative; height: 8px; border-radius: 4px; background: var(--surface-2); display: block; }
.mp-div::after { content: ""; position: absolute; left: 50%; top: -2px; bottom: -2px; width: 1px; background: var(--border-strong); }
.mp-div i { position: absolute; top: 0; bottom: 0; border-radius: 4px; }
.mp-div .p { background: var(--up); } .mp-div .n { background: var(--down); }
.mp-foot { display: grid; gap: 2px; font-size: var(--fs-xs); margin-top: var(--sp-1); }
.mp-note { font-size: var(--fs-xs); margin: var(--sp-1) 0 0; }
.mp-lead { margin: 0 0 var(--sp-2); font-size: var(--fs-sm); font-weight: 600; }
.mp-kv { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 10px; padding: 6px 0; border-top: 1px solid var(--divider); font-size: var(--fs-sm); }
.mp-kv:first-of-type { border-top: 0; }
.mp-kv small { grid-column: 1 / -1; font-size: 11.5px; }
.mp-kvs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-2); }
.mp-kvs div { display: grid; background: var(--surface-2); border-radius: var(--r-sm); padding: 8px 10px; }
.mp-kvs small { font-size: 11px; color: var(--text-3); } .mp-kvs b { font-size: var(--fs-lg); } .mp-kvs .faint { font-size: 11px; }
.mp-ladder { display: grid; gap: 4px; margin-top: var(--sp-2); }
.mp-ladder .r { display: grid; grid-template-columns: 64px 1fr 80px; gap: 8px; align-items: center; font-size: var(--fs-sm); }
.mp-ladder .b { height: 10px; background: var(--surface-2); border-radius: 5px; overflow: hidden; }
.mp-ladder .b i { display: block; height: 100%; }
.mp-ladder .ce .b i { background: var(--down-line); } .mp-ladder .pe .b i { background: var(--up-line); }
.mp-ladder .faint { font-size: 11px; text-align: right; }
.mp-chron { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--sp-2); }
.mp-chron .m { display: grid; gap: 2px; border: 1px solid var(--border); border-radius: var(--r-sm); padding: 8px 10px; font-size: var(--fs-xs); }
.mp-chron b { font-size: var(--fs-sm); } .mp-chron small { color: var(--text-3); }
.mp-chron em { font-style: normal; font-weight: 600; } .mp-chron .pend { color: var(--accent); }
.mp-flags { display: flex; flex-wrap: wrap; gap: 6px; }
.mp-ev { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: var(--fs-sm); }
.mp-ev li { display: grid; grid-template-columns: 52px 1fr; gap: 8px; }
.mp-ev .d { color: var(--text-3); font-size: var(--fs-xs); padding-top: 2px; }

/* ---------- drivers (tabs on Market Pulse, sections on Market Drivers) ---------- */
.md-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--text-3); flex: none; }
.md-dot.up { background: var(--up); } .md-dot.down { background: var(--down); } .md-dot.warn { background: var(--warn); } .md-dot.flat { background: var(--border-strong); }
.md-tone { display: inline-flex; align-items: center; gap: 6px; font: 600 11px/1 var(--font); letter-spacing: var(--track-label); text-transform: uppercase; padding: 5px 9px; border-radius: var(--r-pill); background: var(--neutral-soft); color: var(--text-2); white-space: nowrap; }
.md-tone i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.md-tone.up { background: var(--up-soft); color: var(--up); } .md-tone.down { background: var(--down-soft); color: var(--down); } .md-tone.warn { background: var(--warn-soft); color: var(--warn); }
.md-tabs { padding: 0; overflow: hidden; }
.md-strip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-bottom: 1px solid var(--border); background: var(--surface-sunken); }
.md-strip button { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; align-content: start; gap: 6px; padding: 12px 14px; border-right: 1px solid var(--divider); min-height: 96px; position: relative; transition: background var(--dur-hover) var(--ease); }
.md-strip button:last-child { border-right: 0; }
.md-strip button:hover { background: var(--surface-hover); }
.md-strip button[aria-selected="true"] { background: var(--surface-1); }
.md-strip button[aria-selected="true"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--accent); }
.md-strip button:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: -2px; }
.md-strip .md-tt { display: flex; align-items: center; gap: 7px; min-width: 0; color: var(--text); font-size: var(--fs-sm); }
.md-strip .md-tt .md-dot { margin-left: auto; }
.md-strip .md-tt svg { flex: none; }
.md-strip .md-tt b { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.md-strip .md-sum { font-size: 11.5px; line-height: 1.4; color: var(--text-3); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.md-panel { padding: var(--sp-4) var(--sp-5) var(--sp-5); display: grid; gap: var(--sp-4); }
.md-lead { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); }
.md-lead p { margin: 0; flex: 1 1 320px; font-size: var(--fs-md); font-weight: 600; }
.md-more { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-sm); font-weight: 600; }
.md-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5); align-items: start; }
.md-grid.full { gap: var(--sp-6); }
.md-sec { display: grid; gap: var(--sp-2); min-width: 0; align-content: start; }
.md-h { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.md-h h4 { margin: 0; font-size: var(--fs-sm); font-weight: 700; }
.md-h .faint { font-size: var(--fs-xs); flex: 1 1 auto; }
.md-note { font-size: var(--fs-xs); color: var(--text-3); margin: 0; }
.md-group { display: grid; gap: 4px; margin-top: var(--sp-1); }
.md-board { display: grid; font-size: var(--fs-sm); }
.md-board .r { display: grid; grid-template-columns: minmax(0, 1.4fr) 84px 72px 72px 72px 88px; gap: 8px; align-items: center; padding: 4px 0; border-top: 1px solid var(--divider); }
.md-board .r.h { border-top: 0; font-size: 11px; color: var(--text-3); text-transform: uppercase; letter-spacing: var(--track-label); }
.md-board .n { text-align: right; }
.md-bars { display: grid; }
.md-bars .r { display: grid; grid-template-columns: minmax(0, 1fr) 38% 64px; gap: 10px; align-items: center; padding: 5px 0; border-top: 1px solid var(--divider); font-size: var(--fs-sm); }
.md-bars .r:first-child { border-top: 0; }
.md-bars b { display: block; font-weight: 600; } .md-bars small { display: block; font-size: 11.5px; color: var(--text-3); }
.md-bars .n { text-align: right; }
.md-pill { display: inline-block; font: 600 10.5px/1 var(--font); letter-spacing: var(--track-label); text-transform: uppercase; padding: 4px 7px; border-radius: var(--r-xs); background: var(--neutral-soft); color: var(--text-2); white-space: nowrap; }
.md-pill.up { background: var(--up-soft); color: var(--up); } .md-pill.down { background: var(--down-soft); color: var(--down); }
.md-pill.policy { background: var(--info-soft); color: var(--info); } .md-pill.expiry { background: var(--accent-soft); color: var(--accent); }
.md-pill.holiday { background: var(--warn-soft); color: var(--warn); } .md-pill.data { background: var(--neutral-soft); }
.md-impact { display: grid; }
.md-impact .r { display: grid; grid-template-columns: 92px 1fr; gap: 10px; align-items: start; padding: 6px 0; border-top: 1px solid var(--divider); font-size: var(--fs-sm); }
.md-impact .r:first-child { border-top: 0; }
.md-impact b { display: block; } .md-impact small { display: block; font-size: 11.5px; color: var(--text-3); }
.md-risk { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--sp-2); }
.md-risk div { display: grid; gap: 2px; background: var(--surface-2); border-radius: var(--r-sm); padding: 10px 12px; font-size: var(--fs-xs); }
.md-risk small { color: var(--text-3); } .md-risk b { font-size: var(--fs-lg); }
.md-cal { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.md-cal li { display: grid; grid-template-columns: 56px 1fr; gap: 12px; align-items: center; padding: 10px 0 10px 12px; border-left: 2px solid var(--border-strong); position: relative; }
.md-cal li::before { content: ""; position: absolute; left: -6px; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 50%; background: var(--surface-1); border: 2px solid var(--border-strong); }
.md-cal li.soon { border-left-color: var(--warn); } .md-cal li.soon::before { border-color: var(--warn); background: var(--warn); }
.md-cal .b { font: 700 var(--fs-sm)/1 var(--font-display); letter-spacing: .04em; }
.md-cal small { display: block; color: var(--text-3); font-size: var(--fs-xs); }
.md-mini { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: var(--fs-sm); color: var(--text-2); }
.md-feed, .md-news, .md-odds { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font-size: var(--fs-sm); }
.md-feed li { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; align-items: baseline; }
.md-feed small { grid-column: 2; }
.md-news li { display: grid; grid-template-columns: 10px 1fr; gap: 10px; align-items: baseline; }
.md-news .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--border-strong); display: inline-block; }
.md-news .dot.up { background: var(--up); } .md-news .dot.down { background: var(--down); }
.md-news a, .md-feed a { color: var(--text); text-decoration: none; font-weight: 500; }
.md-news a:hover, .md-feed a:hover { color: var(--accent); text-decoration: underline; }
.md-news small { display: block; font-size: 11.5px; }
.md-odds li { display: grid; grid-template-columns: 1fr 52px 64px; gap: 10px; align-items: baseline; padding-top: 8px; border-top: 1px solid var(--divider); }
.md-odds li:first-child { border-top: 0; padding-top: 0; }
.md-odds b, .md-odds small { text-align: right; }
.md-gauges { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.md-gauges div { display: grid; gap: 4px; font-size: var(--fs-xs); }
.md-gauges small { color: var(--text-3); } .md-gauges b { font-size: var(--fs-lg); }
.md-meter { display: block; height: 8px; border-radius: 4px; background: var(--surface-2); overflow: hidden; }
.md-meter i { display: block; height: 100%; background: var(--warn); border-radius: 4px; }
.md-meter i.hi { background: var(--down); }
.md-meter.sm { height: 6px; width: 90px; align-self: center; }
.md-wide { width: 100%; height: 46px; }
.md-study td small { display: block; font-size: 11px; }
.md-flow { width: 100%; height: auto; display: block; }
.md-flow .z { stroke: var(--border-strong); }
.md-flow .fii { fill: var(--info); } .md-flow .dii { fill: var(--accent); }
.md-flow .ax { fill: var(--chart-axis); font-size: 10.5px; }
.md-key { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-xs); color: var(--text-2); }
.md-key i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.md-key .fii { background: var(--info); } .md-key .dii { background: var(--accent); margin-left: 6px; }
.md-two { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
.md-two > div { display: grid; gap: 2px; align-content: start; }
.md-kv { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 0 10px; align-items: center; padding: 5px 0; border-top: 1px solid var(--divider); font-size: var(--fs-sm); }
.md-kv small { grid-column: 1 / -1; font-size: 11px; }
.md-heat { display: flex; flex-wrap: wrap; gap: 6px; }
.md-heat span { display: inline-flex; gap: 6px; align-items: center; padding: 5px 9px; border-radius: var(--r-xs); font-size: var(--fs-xs); background: var(--neutral-soft); }
.md-heat span.up { background: color-mix(in srgb, var(--up) calc(var(--a) * 28%), transparent); }
.md-heat span.down { background: color-mix(in srgb, var(--down) calc(var(--a) * 28%), transparent); }
.md-agenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.md-agenda li { display: grid; grid-template-columns: 64px 1fr; gap: 12px; padding: 8px 0; border-top: 1px solid var(--divider); font-size: var(--fs-sm); }
.md-agenda li:first-child { border-top: 0; }
.md-agenda .d { display: grid; font-size: var(--fs-xs); color: var(--text-3); }
.md-agenda .d b { color: var(--text); font-size: var(--fs-sm); }
.md-ev { display: block; margin-bottom: 4px; } .md-ev .md-pill { margin-right: 8px; }
.md-fresh { display: flex; align-items: center; gap: 6px; font-size: var(--fs-xs); margin: 0; }

/* Market Drivers page */
.md-brief { padding: var(--sp-2) 0; display: grid; margin-bottom: var(--sp-5); }
.md-brief .r { display: grid; grid-template-columns: 190px 120px minmax(0, 1fr) 20px; gap: var(--sp-3); align-items: center; padding: 12px var(--sp-5); color: var(--text); text-decoration: none; border-top: 1px solid var(--divider); transition: background var(--dur-hover) var(--ease); }
.md-brief .r:first-child { border-top: 0; }
.md-brief .r:hover { background: var(--surface-hover); }
.md-brief .r:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: -2px; }
.md-brief .n { display: inline-flex; align-items: center; gap: 10px; }
.md-brief .t { font-size: var(--fs-sm); color: var(--text-2); }
.md-brief .go { color: var(--text-3); }
.md-nav { position: sticky; top: calc(var(--top-h) + 8px); z-index: var(--z-sticky); display: flex; gap: 6px; overflow-x: auto; padding: 6px; margin-bottom: var(--sp-4); background: var(--surface-glass); backdrop-filter: blur(var(--blur)); border: 1px solid var(--border); border-radius: var(--r-pill); scrollbar-width: none; }
.md-nav a { flex: none; padding: 7px 12px; border-radius: var(--r-pill); font-size: var(--fs-sm); color: var(--text-2); text-decoration: none; font-weight: 500; }
.md-nav a:hover { background: var(--surface-hover); color: var(--text); }
.md-nav a[aria-current="true"] { background: var(--accent-soft); color: var(--accent); }
.md-section { scroll-margin-top: calc(var(--top-h) + 72px); margin-bottom: var(--sp-8); }
.md-section .section-head .md-tone { margin-left: auto; }
.md-what { margin: 0 0 var(--sp-3); font-size: var(--fs-sm); max-width: 100ch; }
.md-full { padding: var(--sp-5); }

/* ---------- P1: price, options, strength, legend ---------- */
.mp-px { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-bottom: 6px; font-size: var(--fs-sm); }
.mp-px b { font-size: var(--fs-lg); font-weight: 650; }
.mp-px .up, .mp-px .down { font-weight: 600; }
.mp-opt { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, .9fr); gap: var(--sp-4); align-items: start; margin-bottom: var(--sp-6); }
.mp-sub { margin: var(--sp-3) 0 2px; }
.mp-lad { display: grid; gap: 3px; font-size: 12px; }
.mp-lad .r { display: grid; grid-template-columns: 50px minmax(0, 1fr) 70px minmax(0, 1fr) 50px; gap: 6px; align-items: center; padding: 1px 4px; border-radius: 4px; border: 1px solid transparent; }
.mp-lad .r.h { font-size: 10.5px; color: var(--text-3); font-weight: 600; padding-bottom: 4px; }
.mp-lad .r.h span:nth-child(2) { text-align: right; }
.mp-lad .r.h span:nth-child(3) { text-align: center; }
.mp-lad .r.atm { border-color: var(--accent); background: var(--surface-2); }
.mp-lad .r.gap { border-bottom: 1px dashed var(--border-strong); border-radius: 0; padding-bottom: 3px; }
.mp-lad .c { color: var(--text-3); text-align: right; }
.mp-lad .r > .c:last-child { text-align: left; }
.mp-lad .c.add { color: var(--text); font-weight: 650; }
.mp-lad .k { text-align: center; font-weight: 600; display: flex; flex-direction: column; align-items: center; line-height: 1.1; }
.mp-lad .k em { font-style: normal; font-size: 9.5px; font-weight: 600; color: var(--accent); text-transform: uppercase; letter-spacing: .04em; }
.mp-lad .b { display: flex; height: 9px; background: var(--surface-2); border-radius: 4px; overflow: hidden; }
.mp-lad .b.pe { justify-content: flex-end; }
.mp-lad .b i { display: block; height: 100%; border-radius: 4px; opacity: .45; }
.mp-lad .b.z i { opacity: 1; }
.mp-lad .b.ce i { background: var(--down); } .mp-lad .b.pe i { background: var(--up); }
.mp-str { display: grid; gap: var(--sp-4); margin-bottom: var(--sp-6); }
.mp-tbl { overflow-x: auto; margin: 0 calc(-1 * var(--sp-2)); }
.mp-tbl .table { font-size: var(--fs-sm); }
.mp-tbl tr.mine td { background: var(--accent-soft, var(--surface-2)); }
.mp-vd { white-space: nowrap; font-weight: 600; }
.mp-vd small { color: var(--text-3); font-weight: 500; }
.mp-secs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--sp-6); }
.mp-sec { display: grid; grid-template-columns: minmax(0, 1fr) 128px 84px 52px 52px; gap: 8px; align-items: center; padding: 5px 6px; border-top: 1px solid var(--divider); font-size: var(--fs-sm); }
.mp-sec.h { border-top: 0; font-size: 10.5px; color: var(--text-3); font-weight: 600; }
.mp-sec > span:nth-child(n+4) { text-align: right; }
.mp-sec .n { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mp-sec.mine { background: var(--accent-soft, var(--surface-2)); border-radius: 4px; }
.mp-q { font-size: 11.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-2); }
.mp-q.up { color: var(--up); } .mp-q.down { color: var(--down); } .mp-q.warn { color: var(--warn); } .mp-q.info { color: var(--info); }
.mp-legend { margin: calc(-1 * var(--sp-2)) 0 var(--sp-5); padding: 10px 14px; }
.mp-legend summary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; cursor: pointer; font-size: var(--fs-sm); list-style: none; }
.mp-legend summary::-webkit-details-marker { display: none; }
.mp-legend summary .faint { font-size: 11.5px; font-family: var(--font-mono, inherit); }
.mp-legend dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px var(--sp-6); margin: var(--sp-3) 0 0; }
.mp-legend dl div { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 10px; font-size: var(--fs-sm); }
.mp-legend dt { font-weight: 650; }
.mp-legend dd { margin: 0; color: var(--text-2); }
.mp-legend .mp-note { margin-top: var(--sp-3); }

/* ---------- confidence × risk matrix ---------- */
.mx { margin-bottom: var(--sp-6); }
.mx-lead { font-size: var(--fs-xs); margin: 0; }
.mx-grid { display: grid; grid-template-columns: 92px repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: var(--sp-2); }
.mx-ch { font-size: var(--fs-xs); font-weight: 650; text-align: center; padding: 2px 0; }
.mx-ch small { display: block; font-weight: 400; color: var(--text-2); }
.mx-rh { font-size: var(--fs-xs); font-weight: 650; display: flex; align-items: center; }
.mx-cell { border: 1px solid var(--border); border-radius: var(--r-sm); padding: 8px; display: grid; gap: 6px; align-content: start; min-height: 96px; background: var(--surface-1); }
.mx-cell.r2 { background: var(--down-soft); border-color: var(--down-line); }
.mx-cell.r1 { background: var(--warn-soft); }
.mx-cell.r0.c2, .mx-cell.r0.c1 { background: var(--up-soft); }
.mx-cell.empty .mx-pb { opacity: .6; }
.mx-at { display: none; font-size: 11px; font-weight: 650; }
.mx-pb { margin: 0; font-size: 11.5px; display: grid; gap: 1px; color: var(--text-2); }
.mx-pb b { color: var(--text); font-weight: 650; margin-right: 4px; }
.mx-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.mx-chip { display: inline-flex; align-items: center; gap: 5px; font: inherit; font-size: 11.5px; line-height: 1.3; padding: 3px 7px; border-radius: var(--r-pill); border: 1px solid var(--border-strong); background: var(--surface); color: var(--text); cursor: pointer; max-width: 100%; text-align: left; }
.mx-chip small { color: var(--text-2); font-variant-numeric: tabular-nums; }
.mx-chip i { flex: none; border-radius: 50%; border: 1.5px solid var(--accent); }
.mx-chip.held i { background: var(--accent); }
.mx-chip.on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.mx-more { font: inherit; font-size: 11.5px; border: 0; background: none; color: var(--accent); cursor: pointer; padding: 3px 4px; }
.mx-detail { border: 1px solid var(--border-strong); border-radius: var(--r-sm); padding: 10px 12px; font-size: var(--fs-sm); display: grid; gap: 4px; }
.mx-detail p { margin: 0; }
.mx-loose summary { cursor: pointer; font-size: var(--fs-sm); font-weight: 650; }
.mx-loose summary .faint { font-weight: 400; font-size: var(--fs-xs); }
.mx-lrow { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 8px; margin-top: 8px; align-items: start; }
.mx-lv { font-size: var(--fs-xs); font-weight: 650; padding-top: 3px; }
.mx-lv.r2 { color: var(--down); } .mx-lv.r1 { color: var(--warn); }
.mx-links { display: flex; flex-wrap: wrap; gap: 4px 16px; }
/* entry vs now (position page) */
.mx-ent { display: grid; gap: var(--sp-3); }
.mx-ent-note { margin: 0; font-size: var(--fs-xs); }
.mx-ent-t th[scope="row"] { font-weight: 600; white-space: nowrap; width: 1%; color: var(--text-2); }
.mx-ent-t td { width: 49.5%; vertical-align: top; }
.mx-ent-t tr.chg td { background: var(--warn-soft); }
.mx-ent-t .chip { margin-left: 4px; }

/* ---------- responsive ---------- */
@media (max-width: 1199px) {
  .mp-primary { grid-template-columns: 1fr; }
  .mp-below { grid-template-columns: 1fr 1fr; } .mp-below > :first-child { grid-column: 1 / -1; }
  .mp-three { grid-template-columns: 1fr 1fr; } .mp-three > :last-child { grid-column: 1 / -1; }
  .mp-opt { grid-template-columns: 1fr 1fr; } .mp-opt > :last-child { grid-column: 1 / -1; }
  .mp-str .hide-sm { display: none; }
  .mp-secs { grid-template-columns: 1fr; } .mp-sec-col + .mp-sec-col .h { display: none; }
  .mp-legend dl { grid-template-columns: 1fr; }
  .md-strip { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(190px, 1fr); overflow-x: auto; scrollbar-width: thin; }
}
@media (max-width: 900px) { .md-grid, .mp-read { grid-template-columns: 1fr; } .md-brief .r { grid-template-columns: 1fr auto 20px; } .md-brief .t { grid-column: 1 / -1; grid-row: 2; } }
@media (max-width: 767px) {
  .mp-below, .mp-two, .mp-three { grid-template-columns: 1fr; }
  .mp-kvs { grid-template-columns: 1fr 1fr; }
  .mp-row { grid-template-columns: minmax(0, 1fr) 28% 50px; }
  .mp-pick { min-width: 0; max-width: none; flex: 1 1 100%; }
  .zc-card { padding: var(--sp-2); }
  .zc-toggles { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  .zc-tg { flex: none; }
  .zc-legend { right: 56px; font-size: 10.5px; gap: 0 8px; }
  .zc-legend .ema { display: none; }
  .md-panel { padding: var(--sp-3); }
  .md-gauges { grid-template-columns: 1fr; }
  .md-two { grid-template-columns: 1fr; }
  .md-board .r { grid-template-columns: minmax(0, 1fr) 80px 70px; }
  .md-board .hide-xs { display: none; }
  .md-bars .r { grid-template-columns: minmax(0, 1fr) 30% 56px; }
  .md-full { padding: var(--sp-3); }
  .mp-scn .lab { font-size: 11px; }
  .mp-opt { grid-template-columns: 1fr; }
  .mp-str .hide-xs, .mp-secs .hide-xs { display: none; }
  .mp-sec { grid-template-columns: minmax(0, 1fr) 82px 60px 52px; gap: 6px; padding: 5px 2px; }
  .mp-tbl .table th, .mp-tbl .table td { padding: 8px 6px; }
  .mp-lad .r { grid-template-columns: 44px minmax(0, 1fr) 58px minmax(0, 1fr) 44px; gap: 4px; padding: 1px 2px; }
  .mp-legend dl div { grid-template-columns: 1fr; gap: 2px; }
  .mx-grid { grid-template-columns: 1fr; }
  .mx-corner, .mx-ch, .mx-rh { display: none; }
  .mx-at { display: block; }
  .mx-cell { min-height: 0; }
  .mx-lrow { grid-template-columns: 1fr; gap: 4px; }
  .mx-ent-t { table-layout: fixed; width: 100%; }
  .mx-ent-t th, .mx-ent-t td { padding: 6px 5px; font-size: 12px; overflow-wrap: anywhere; }
  .mx-ent-t th[scope="row"] { white-space: normal; width: 28%; }
  .mx-ent-t td { width: 36%; }
}

/* Scenario Map (pages/outlook.js) */
.oc-theme { display: grid; gap: var(--sp-3); padding: var(--sp-5); }
.oc-th-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.oc-th-head h4 { margin: 0; font: 700 var(--fs-md, 17px)/1.25 var(--font-display); flex: 1 1 auto; }
.oc-th-head .faint { font-size: var(--fs-xs); }
.oc-branches { display: grid; gap: 0; border-top: 1px solid var(--divider); }
.oc-branch { border-bottom: 1px solid var(--divider); }
.oc-br-row { all: unset; box-sizing: border-box; cursor: pointer; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) minmax(80px, 28%) 44px 16px; gap: 12px; align-items: center; padding: 10px 2px; }
.oc-br-row:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: 2px; border-radius: 6px; }
.oc-br-row .chev { transition: transform .15s; color: var(--text-3); }
.oc-branch.open .chev { transform: rotate(180deg); }
.oc-br-name { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: var(--fs-sm); min-width: 0; }
.oc-prob { height: 8px; border-radius: 99px; background: var(--accent-soft); overflow: hidden; }
.oc-prob i { display: block; height: 100%; background: var(--accent); border-radius: 99px; }
.oc-pct { text-align: right; font-size: var(--fs-sm); }
.oc-br-body { display: grid; gap: var(--sp-2); padding: 0 2px 14px; font-size: var(--fs-sm); }
.oc-br-body p { margin: 0; }
.oc-ev { margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: var(--fs-sm); }
.oc-play { display: flex; flex-wrap: wrap; gap: 6px; }
.oc-actor { display: grid; gap: var(--sp-2); align-content: start; padding: var(--sp-4); font-size: var(--fs-sm); }
.oc-actor h4 { margin: 0; font: 700 var(--fs-md, 17px)/1.2 var(--font-display); }
.oc-actor p { margin: 0; }
.oc-gauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); gap: 8px; }
.oc-gauges > div { display: grid; gap: 2px; padding: 8px 10px; border-radius: 8px; background: var(--surface-2, var(--accent-soft)); }
.oc-gauges small { font-size: 11px; color: var(--text-3); }
.oc-gauges span { font-size: 11px; }
.oc-tbl td small, .oc-tbl td .chip + small { display: block; font-size: 11px; margin-top: 2px; }
.oc-tbl td { vertical-align: top; }
.oc-months { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px; }
.oc-months > div { display: grid; justify-items: center; gap: 2px; padding: 4px 0; border-radius: 6px; font-size: 11px; }
.oc-months > div.now { background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent-ring); }
.oc-months > div.next { background: var(--accent-soft); }
.oc-months .bar { position: relative; width: 60%; height: 64px; }
.oc-months .bar::after { content: ""; position: absolute; left: -20%; right: -20%; top: 50%; border-top: 1px solid var(--divider); }
.oc-months .bar i { position: absolute; left: 0; right: 0; border-radius: 2px; }
.oc-months .bar i.p { background: var(--up); } .oc-months .bar i.n { background: var(--down); }
.oc-months b { font-size: 11px; }
.oc-planets { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; }
.oc-planets > span { display: grid; gap: 1px; padding: 8px 10px; border: 1px solid var(--divider); border-radius: 8px; font-size: var(--fs-sm); }
.oc-planets small { font-size: 11px; color: var(--text-3); }
.oc-planets .faint { font-size: 11px; }
.oc-cal { list-style: none; margin: 0; padding: 0; display: grid; }
.oc-cal li { display: grid; grid-template-columns: 74px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--divider); font-size: var(--fs-sm); }
.oc-cal li:first-child { border-top: 0; }
.oc-cal li.now .d { color: var(--accent); }
.oc-cal .d { font-weight: 700; font-size: var(--fs-xs); }
.oc-cal .d small { display: block; font-weight: 400; color: var(--text-3); }
.oc-ledger td:first-child { white-space: nowrap; }
.oc-ledger td.nowrap { white-space: nowrap; }
@media (max-width: 767px) {
  .oc-theme { padding: var(--sp-3); }
  .oc-br-row { grid-template-columns: minmax(0, 1fr) 56px 40px 16px; gap: 8px; }
  .oc-months { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .oc-cal li { grid-template-columns: 62px minmax(0, 1fr); }
  .oc-cal li > .chip { grid-column: 2; justify-self: start; }
  .oc-ledger .hide-xs { display: none; }
  .oc-tbl th, .oc-tbl td { padding: 8px 6px; }
}