/* FinQuarry - UI styles. Fonts: Geist / Geist Mono (SIL OFL 1.1) from your visual assets folder. */
@font-face { font-family: "Geist"; src: url("../fonts/GeistVF.woff") format("woff"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Geist Mono"; src: url("../fonts/GeistMonoVF.woff") format("woff"); font-weight: 100 900; font-display: swap; }

:root {
  color-scheme: dark;
  --bg: #04060d;
  --ink: #eef2fb;
  --ink-2: #b9c2d6;
  --ink-3: #8691ab;
  --ink-4: #5a6680;
  --line: rgba(255, 255, 255, .08);
  --line-2: rgba(255, 255, 255, .15);
  --glass: rgba(12, 17, 31, .5);
  --glass-2: rgba(19, 26, 45, .62);
  --glass-solid: rgba(10, 14, 26, .86);
  --truth: #4fe3c1; --truth-2: #19a88c;
  --imp: #ffc15a; --imp-2: #ff8f3a;
  --act: #b98cff; --act-2: #ff76d4;
  --up: #3ddc97; --down: #ff5c7a; --mixed: #f5c451; --unclear: #8b95ad;
  --high: #4fe3c1; --mid: #ffc15a; --low: #ff6b8b;
  --accent: #8fb4ff;
  --radius: 22px; --radius-sm: 14px; --radius-xs: 10px;
  --font: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "Geist Mono", ui-monospace, "Cascadia Code", Consolas, monospace;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --spring: cubic-bezier(.34, 1.36, .64, 1);
  --topbar-h: 62px;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
html { scrollbar-gutter: stable; }
html.locked { overflow: hidden; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: 14px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  font-feature-settings: "ss01", "cv11";
}
button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }
::selection { background: rgba(143, 180, 255, .35); }
:focus-visible { outline: 2px solid rgba(143, 180, 255, .75); outline-offset: 2px; border-radius: 10px; }
.mono { font-family: var(--mono); font-feature-settings: "tnum"; }
.ic { flex: none; display: block; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ------------------------------------------------------------ backdrop */
#bg { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: -3; opacity: 0; transition: opacity 1.4s var(--ease); }
#bg.ready { opacity: 1; }
.scrim { position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background:
    radial-gradient(130% 80% at 50% -15%, rgba(4, 6, 13, 0) 0%, rgba(4, 6, 13, .28) 70%),
    linear-gradient(180deg, rgba(4, 6, 13, .05) 0%, rgba(4, 6, 13, .28) 45%, rgba(4, 6, 13, .6) 100%); }
body.no-webgl .scrim { background: radial-gradient(90% 60% at 20% 0%, #15306b 0%, transparent 60%), radial-gradient(70% 60% at 90% 20%, #0f5d63 0%, transparent 55%), var(--bg); }

/* ------------------------------------------------------------ glass */
.glass, .lg { position: relative; isolation: isolate; border-radius: var(--radius); }
.glass {
  background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .015) 60%), var(--glass);
  -webkit-backdrop-filter: blur(22px) saturate(1.55);
  backdrop-filter: blur(22px) saturate(1.55);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .13), inset 0 -1px 0 rgba(255, 255, 255, .025),
              0 28px 60px -34px rgba(0, 0, 0, .8), 0 10px 26px -16px rgba(0, 0, 0, .55);
}
.lg {
  background: linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .03)), rgba(16, 22, 40, .34);
  -webkit-backdrop-filter: blur(16px) saturate(1.7);
  backdrop-filter: blur(16px) saturate(1.7);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 1px rgba(255, 255, 255, .06),
              inset 0 0 18px rgba(255, 255, 255, .035), 0 18px 40px -22px rgba(0, 0, 0, .75);
}
.glass::before, .lg::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none; z-index: 1;
  background: linear-gradient(150deg, rgba(255, 255, 255, .42), rgba(255, 255, 255, .07) 28%, rgba(255, 255, 255, .02) 58%, rgba(255, 255, 255, .2));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.glass::after, .lg::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 1;
  background: radial-gradient(380px circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .09), transparent 46%);
  opacity: var(--spec, 0); transition: opacity .4s var(--ease);
}
.lg::after { background: radial-gradient(220px circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .16), transparent 55%); }

/* ------------------------------------------------------------ top bar */
.topbar {
  position: sticky; top: 12px; z-index: 40; margin: 12px auto 0; width: min(1560px, calc(100vw - 28px));
  min-height: var(--topbar-h); display: grid; grid-template-columns: minmax(190px, 1fr) auto minmax(max-content, 1fr);
  align-items: center; gap: 10px; padding: 10px 12px 10px 18px; border-radius: 22px;
}
/* Cards scroll under this bar, so its dark base fill sits a step above the shared .lg fill (.34 -> .64). Only the fill
   colour changes here; the highlight gradient, border, blur and shadows still come from .lg. */
.topbar.lg { background-color: rgba(16, 22, 40, .64); }
.brand { display: flex; align-items: center; gap: 13px; min-width: 0; }
.logo-mark { width: 30px; height: 30px; flex: none; display: block; }
.brand canvas { width: 46px; height: 46px; flex: none; opacity: 0; transition: opacity .8s; filter: drop-shadow(0 4px 14px rgba(120, 170, 255, .28)); }
.brand canvas[hidden] { display: none; }
.brand canvas.ready { opacity: 1; }
.brand canvas.no-webgl { opacity: 1; background: url("../img/logo.svg") center/70% no-repeat; filter: invert(1); }
.wordmark { display: flex; flex-direction: column; line-height: 1.05; min-width: 0; }
.wordmark b { font-weight: 650; letter-spacing: .2em; font-size: 13.5px; white-space: nowrap; color: var(--ink); }
.wordmark span { font-size: 11.5px; color: var(--ink-3); margin-top: 5px; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* view switcher: a flat segmented control; the sliding thumb marks the active view and its icon takes the view's colour */
.tabs {
  position: relative; display: flex; gap: 2px; padding: 3px; border-radius: 13px;
  background: rgba(255, 255, 255, .035); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .075), inset 0 1px 2px rgba(0, 0, 0, .22);
}
.tab {
  position: relative; z-index: 2; display: flex; align-items: center; gap: 7px; height: 34px; border: 0; background: none; cursor: pointer;
  padding: 0 10px; border-radius: 10px; color: var(--ink-3); font: 550 13px/1 var(--font); letter-spacing: .005em; white-space: nowrap;
  transition: color .2s var(--ease), background-color .2s var(--ease);
}
.tab[data-tab="breaking"] { --tab-accent: #ff5c7a; }
.tab[data-tab="important"] { --tab-accent: #ffc15a; }
.tab[data-tab="weekly"] { --tab-accent: #78c9ff; }
.tab[data-tab="calendar"] { --tab-accent: #6adacb; }
.tab[data-tab="earnings"] { --tab-accent: #d4a3ff; }
.tab[data-tab="actionable"] { --tab-accent: #b98cff; }
.tab[data-tab="sources"] { --tab-accent: #4fe3c1; }
.tab .ic { width: 15px; height: 15px; opacity: .7; transition: color .2s var(--ease), opacity .2s var(--ease); }
.tab:hover { color: var(--ink-2); }
.tab:hover:not(.active) { background: rgba(255, 255, 255, .03); }
.tab.active { color: var(--ink); }
.tab.active .ic { opacity: 1; color: var(--tab-accent); }
.tab .count:empty { display: none; }
.tab .count { font: 500 11px/1 var(--mono); font-variant-numeric: tabular-nums; color: var(--ink-4); margin-left: 1px; }
.tab.active .count { color: var(--ink-3); }
.tab:focus-visible { outline: 2px solid rgba(143, 180, 255, .55); outline-offset: 1px; }
.tab-indicator {
  position: absolute; z-index: 1; top: 3px; bottom: 3px; left: 0; width: 0; border-radius: 10px;
  transform: translateX(var(--x, 0)); width: var(--w, 0);
  transition: transform .42s var(--ease), width .42s var(--ease);
  background: rgba(255, 255, 255, .085);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), inset 0 1px 0 rgba(255, 255, 255, .06), 0 1px 3px rgba(0, 0, 0, .35);
}

.status { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
.status > * { flex-shrink: 0; }
.status .chip { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.chip {
  display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 12px; border-radius: 11px; border: 0;
  background: rgba(255, 255, 255, .05); color: var(--ink-2); font-size: 12.5px; white-space: nowrap; cursor: default;
  box-shadow: inset 0 0 0 1px var(--line);
}
button.chip { cursor: pointer; transition: background .2s; }
button.chip:hover { background: rgba(255, 255, 255, .09); }
.chip b { color: var(--ink); font-weight: 600; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink-4); flex: none; position: relative; }
.dot.ok { background: var(--up); box-shadow: 0 0 10px rgba(61, 220, 151, .8); }
.dot.warn { background: var(--mixed); box-shadow: 0 0 10px rgba(245, 196, 81, .7); }
.dot.err { background: var(--down); box-shadow: 0 0 10px rgba(255, 92, 122, .7); }
.dot.busy::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 1.5px solid currentColor; color: var(--up); animation: ping 1.6s var(--ease) infinite; }
@keyframes ping { from { transform: scale(.6); opacity: .9; } to { transform: scale(1.9); opacity: 0; } }

.icon-btn {
  width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; border: 0; cursor: pointer;
  color: var(--ink-2); background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--line); transition: background .2s, color .2s, transform .2s;
}
.icon-btn:hover { background: rgba(255, 255, 255, .1); color: var(--ink); }
.icon-btn:active { transform: scale(.94); }

.refresh { width: 42px; height: 42px; border-radius: 50%; border: 0; cursor: pointer; display: grid; place-items: center; color: var(--ink); padding: 0; }
.refresh svg.ring { position: absolute; inset: 3px; width: calc(100% - 6px); height: calc(100% - 6px); transform: rotate(-90deg); z-index: 2; }
.refresh .ring circle { fill: none; stroke-width: 2.4; }
.refresh .ring .trk { stroke: rgba(255, 255, 255, .08); }
.refresh .ring .val { stroke: url(#ringGrad); stroke-linecap: round; transition: stroke-dashoffset 1s linear; }
.refresh .ic { position: relative; z-index: 3; transition: transform .6s var(--ease); }
.refresh.spinning .ic { animation: spin 1.1s linear infinite; }
.refresh.cooling { color: var(--ink-3); cursor: not-allowed; }
.refresh .cd { position: absolute; z-index: 3; bottom: -4px; right: -4px; font: 600 10px var(--mono); background: rgba(8, 12, 22, .9);
  padding: 1px 5px; border-radius: 7px; box-shadow: inset 0 0 0 1px var(--line-2); color: var(--ink-2); }
@keyframes spin { to { transform: rotate(360deg); } }

/* ------------------------------------------------------------ tape */
.tape { width: min(1560px, calc(100vw - 28px)); margin: 12px auto 0; height: 38px; border-radius: 14px; overflow: hidden; display: flex; align-items: center;
  -webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.tape[hidden] { display: none; }
.tape-track { display: flex; gap: 34px; white-space: nowrap; animation: tape 80s linear infinite; padding-left: 20px; }
.tape:hover .tape-track { animation-play-state: paused; }
.tape-item { display: inline-flex; align-items: center; gap: 9px; color: var(--ink-2); font-size: 12.5px; cursor: pointer; }
.tape-item:hover { color: var(--ink); }
.tape-item .sep { width: 4px; height: 4px; border-radius: 50%; background: var(--ink-4); }
.tape-item .sc { font-family: var(--mono); font-size: 11px; color: var(--ink-3); }
.tape-item .sc i { font-style: normal; }
@keyframes tape { to { transform: translateX(-50%); } }
.market-tape { margin-top: 5px; height: 35px; }
.market-tape.tv { height: 46px; -webkit-mask: none; mask: none; gap: 10px; padding-right: 12px; }
.market-tape.tv .market-track { display: none; }
.tv-placeholder { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; color: var(--ink-3); font-size: 11px; line-height: 1.3; }
.tv-placeholder .btn { flex: none; padding: 5px 9px; font-size: 11px; }
.tv-placeholder label { display: inline-flex; align-items: center; gap: 4px; flex: none; white-space: nowrap; cursor: pointer; }
.tv-placeholder input { accent-color: var(--accent); }
.market-tape.tv:has(.tv-placeholder) { height: auto; min-height: 46px; padding: 5px 12px; }
/* color-scheme must stay "normal" on the widget iframe: the page is color-scheme: dark and TradingView's document declares
   none, and browsers paint an opaque white canvas behind an embedded document whose color scheme differs from its iframe's. */
.market-tape .tv-tape { flex: 1; min-width: 0; height: 46px; border: 0; background: transparent; color-scheme: normal;
  -webkit-mask: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); mask: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); }
.market-tape .tv-credit { flex: none; font-size: 10.5px; color: var(--ink-4); text-decoration: none; white-space: nowrap; }
.market-tape .tv-credit:hover { color: #7aa7ff; }
.market-track { gap: 26px; animation-duration: 110s; }
.market-item { display: inline-flex; align-items: center; gap: 8px; color: var(--ink-2); font-size: 11.5px; }
.market-item b { font-weight: 650; color: var(--ink); }
.market-value, .market-change { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.market-change { display: inline-flex; align-items: center; gap: 3px; }
.market-item.up .market-change { color: var(--up); }
.market-item.down .market-change { color: var(--down); }
.market-item.flat .market-change { color: var(--ink-3); }
.market-item.stale { opacity: .48; }
html[data-motion="reduced"] .market-tape, .market-tape:has(.market-track:focus-within) { overflow-x: auto; mask: none; -webkit-mask: none; }
html[data-motion="reduced"] .market-track { animation: none; width: max-content; }
html[data-motion="reduced"] .market-duplicate { display: none; }
.week-filters { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 4px 18px; }
.week-filters button { border: 0; cursor: pointer; padding: 8px 12px; border-radius: 10px; color: var(--ink-3); background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px var(--line); font: 600 11.5px var(--font); }
.week-filters button.active { color: #bce7ff; background: rgba(120,201,255,.13); box-shadow: inset 0 0 0 1px rgba(120,201,255,.38); }
.week-day { display: flex; align-items: center; gap: 6px; color: #78c9ff; font: 600 11px var(--mono); }
.week-archive { margin-left: auto; color: var(--ink-4); font: 500 10px var(--font); }
.week-outlets { color: var(--ink-3); font-size: 11px; }
.week-empty-icon { color: #78c9ff; }
.week-card:focus-visible { outline: 2px solid #78c9ff; outline-offset: 3px; }
.week-card .rank { font-size: 18px; bottom: 12px; letter-spacing: 0; }

/* ------------------------------------------------------------ layout */
main { width: min(1560px, calc(100vw - 28px)); margin: 18px auto 60px; min-height: 60vh; }
.view { animation: viewIn .5s var(--ease) both; }
@keyframes viewIn { from { opacity: 0; transform: translateY(8px); } }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin: 26px 4px 14px; }
.section-head h2 { margin: 0; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; }
.section-head .sub { color: var(--ink-4); font-size: 12px; }

/* ------------------------------------------------------------ hero */
.hero-row { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(320px, 1fr); gap: 16px; }
.hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); overflow: hidden; min-height: 400px; cursor: pointer; }
.hero-media { position: relative; min-height: 260px; overflow: hidden; border-radius: var(--radius) 0 0 var(--radius); }
.hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 55%, rgba(10, 14, 26, .55)), linear-gradient(0deg, rgba(4, 6, 13, .55), transparent 45%); }
.hero-body { padding: 26px 26px 22px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.rank-badge { display: inline-flex; align-items: center; gap: 8px; font: 600 11px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--imp); }
.rank-badge .ic { color: var(--imp); }
.hero h1 { margin: 0; font-size: clamp(22px, 2.1vw, 31px); line-height: 1.12; letter-spacing: -.022em; font-weight: 680; text-wrap: balance; }
.hero p.sum { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }
.why { display: flex; gap: 10px; align-items: flex-start; padding: 11px 13px; border-radius: 14px; background: rgba(143, 180, 255, .07);
  box-shadow: inset 0 0 0 1px rgba(143, 180, 255, .14); color: var(--ink-2); font-size: 13px; }
.why .ic { color: var(--accent); margin-top: 1px; }
.dials { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.hero .foot { margin-top: auto; display: flex; flex-direction: column; gap: 12px; }

/* dials */
.dial { position: relative; display: grid; place-items: center; flex: none; }
.dial svg { transform: rotate(-90deg); display: block; }
.dial .trk { stroke: rgba(255, 255, 255, .07); fill: none; }
.dial .val { fill: none; stroke-linecap: round; transition: stroke-dashoffset 1.1s var(--ease); }
.dial .num { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding-top: .07em;
  font-family: var(--mono); font-weight: 600; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dial .est { position: absolute; left: 0; right: 0; text-align: center; font: 650 8px/1 var(--font); letter-spacing: .2em; text-indent: .2em;
  text-transform: uppercase; color: var(--ink-3); pointer-events: none; }
.dial .lbl { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); text-align: center; margin-top: 6px; font-weight: 600; }
.dial-wrap { display: flex; flex-direction: column; align-items: center; }
.dial.truth .val { stroke: url(#gTruth); } .dial.importance .val { stroke: url(#gImp); } .dial.action .val { stroke: url(#gAct); }
.dial.truth .num { color: var(--truth); } .dial.importance .num { color: var(--imp); } .dial.action .num { color: var(--act); }
.dial .glow { position: absolute; inset: 18%; border-radius: 50%; filter: blur(14px); opacity: .28; }
.dial.truth .glow { background: var(--truth); } .dial.importance .glow { background: var(--imp); } .dial.action .glow { background: var(--act); }

/* mini score pills */
.scores { display: flex; gap: 6px; flex-wrap: wrap; }
.sp { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 9px 0 7px; border-radius: 9px; font: 600 12px var(--mono);
  background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-2); }
.sp .bar { width: 26px; height: 4px; border-radius: 3px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.sp .bar i { display: block; height: 100%; border-radius: 3px; }
.sp.t .bar i { background: linear-gradient(90deg, var(--truth-2), var(--truth)); } .sp.t b { color: var(--truth); }
.sp.i .bar i { background: linear-gradient(90deg, var(--imp-2), var(--imp)); } .sp.i b { color: var(--imp); }
.sp.a .bar i { background: linear-gradient(90deg, var(--act), var(--act-2)); } .sp.a b { color: var(--act); }
.sp small { font-size: 9.5px; letter-spacing: .08em; color: var(--ink-4); font-family: var(--font); }

/* coverage */
.coverage { display: flex; flex-direction: column; gap: 7px; }
.cov-bar { display: flex; height: 7px; border-radius: 6px; overflow: hidden; background: rgba(255, 255, 255, .05); gap: 2px; }
.cov-bar i { display: block; height: 100%; border-radius: 3px; transition: flex-grow .6s var(--ease); }
.cov-bar .h { background: linear-gradient(90deg, #1fb89a, var(--high)); } .cov-bar .m { background: linear-gradient(90deg, #ff9d2e, var(--mid)); } .cov-bar .l { background: linear-gradient(90deg, #e2436a, var(--low)); }
.cov-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 11.5px; color: var(--ink-3); }
.cov-meta .legend { display: flex; gap: 10px; }
.cov-meta .legend span::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 2px; margin-right: 5px; vertical-align: 0; }
.cov-meta .legend .h::before { background: var(--high); } .cov-meta .legend .m::before { background: var(--mid); } .cov-meta .legend .l::before { background: var(--low); }
.stack { display: flex; align-items: center; }
.mono-badge { --h: 210; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; flex: none; font: 700 9.4px/1 var(--font); letter-spacing: 0;
  white-space: nowrap; overflow: hidden;
  color: hsl(var(--h) 90% 88%); background: radial-gradient(circle at 30% 25%, hsl(var(--h) 60% 42% / .95), hsl(var(--h) 55% 22% / .95));
  box-shadow: 0 0 0 2px rgba(8, 11, 20, .9), inset 0 1px 0 rgba(255, 255, 255, .25); }
.mono-badge.l3 { font-size: 8.6px; } .mono-badge.l4 { font-size: 7.3px; letter-spacing: -.02em; }
.stack .mono-badge { position: relative; z-index: calc(40 - var(--k, 0)); }
.stack .mono-badge + .mono-badge { margin-left: -2px; }
.stack .more { font: 600 11px var(--mono); color: var(--ink-3); margin-left: 7px; }
.mono-badge.band-high { box-shadow: 0 0 0 2px rgba(8, 11, 20, .9), 0 0 0 3px rgba(79, 227, 193, .35), inset 0 1px 0 rgba(255, 255, 255, .25); }
.mono-badge.band-low { box-shadow: 0 0 0 2px rgba(8, 11, 20, .9), 0 0 0 3px rgba(255, 107, 139, .38), inset 0 1px 0 rgba(255, 255, 255, .25); }
.mono-badge.lg-badge { width: 44px; height: 44px; font-size: 12.5px; } .mono-badge.lg-badge.l4 { font-size: 11px; }

/* markets */
.markets { display: flex; flex-wrap: wrap; gap: 6px; }
.mk { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px 0 7px; border-radius: 10px; font-size: 12px; color: var(--ink-2);
  background: rgba(255, 255, 255, .045); box-shadow: inset 0 0 0 1px var(--line); white-space: nowrap; }
.mk .ic { width: 14px; height: 14px; }
.mk.up .ic { color: var(--up); } .mk.down .ic { color: var(--down); } .mk.mixed .ic { color: var(--mixed); } .mk.unclear .ic { color: var(--unclear); }
.mk .sym { font: 600 11.5px var(--mono); color: var(--ink); }
.mk .imp { font: 500 10.5px var(--mono); color: var(--ink-4); }
.mk.watch { box-shadow: inset 0 0 0 1px rgba(255, 193, 90, .45); background: rgba(255, 193, 90, .07); }

/* tags */
.tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.tag { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: 7px; font-size: 11px; font-weight: 560; letter-spacing: .02em;
  color: var(--ink-2); background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px var(--line); white-space: nowrap; }
.tag .ic { width: 12px; height: 12px; }
.tag.pending { color: #cfd6ff; background: rgba(143, 180, 255, .1); box-shadow: inset 0 0 0 1px rgba(143, 180, 255, .25); }
.tag.watch { color: var(--imp); background: rgba(255, 193, 90, .1); box-shadow: inset 0 0 0 1px rgba(255, 193, 90, .3); }
.tag.flag { color: #ffb3c2; background: rgba(255, 92, 122, .1); box-shadow: inset 0 0 0 1px rgba(255, 92, 122, .28); }
.tag.official { color: #9ff5dd; background: rgba(79, 227, 193, .1); box-shadow: inset 0 0 0 1px rgba(79, 227, 193, .28); }
.meta { display: flex; align-items: center; gap: 8px; color: var(--ink-3); font-size: 12px; flex-wrap: wrap; }
.meta .ic { width: 13px; height: 13px; }
.meta .sep { width: 3px; height: 3px; border-radius: 50%; background: var(--ink-4); }

/* ------------------------------------------------------------ brief card */
.brief { padding: 22px; display: flex; flex-direction: column; gap: 14px; min-height: 400px; }
.brief-head { display: flex; align-items: center; justify-content: space-between; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; font: 600 11px var(--font); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); }
.eyebrow .ic { color: var(--accent); }
.brief p.text { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink); text-wrap: pretty; }
.brief .next { color: var(--ink-2); font-size: 12.5px; display: flex; gap: 8px; align-items: flex-start; }
.brief .next .ic { color: var(--imp); margin-top: 2px; }
.tone { display: flex; flex-direction: column; gap: 6px; }
.tone-track { position: relative; height: 8px; border-radius: 6px; background: linear-gradient(90deg, var(--down), #e8a54b 50%, var(--up)); opacity: .85; }
.tone-knob { position: absolute; top: 50%; width: 16px; height: 16px; border-radius: 50%; background: #fff; transform: translate(-50%, -50%);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, .15), 0 4px 12px rgba(0, 0, 0, .6); transition: left 1.2s var(--ease); }
.tone-knob.off { box-shadow: 0 0 0 4px rgba(255, 92, 122, .28), 0 4px 12px rgba(0, 0, 0, .6); }
.tone-knob.on { box-shadow: 0 0 0 4px rgba(61, 220, 151, .28), 0 4px 12px rgba(0, 0, 0, .6); }
.tone-labels { display: flex; justify-content: space-between; align-items: baseline; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-4); }
.tone-mid b { font-weight: 650; color: var(--ink-3); margin-left: 6px; }
.tone-mid b.off { color: #ff8aa0; } .tone-mid b.on { color: #6ee7b7; } .tone-mid b.mid { color: var(--mixed); }
.tone-drivers { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 2px; }
.td { display: inline-flex; align-items: center; gap: 3px; height: 22px; padding: 0 8px; border-radius: 7px; font-size: 11.5px; font-weight: 560;
  color: var(--ink-2); background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--line); cursor: default; }
.td i { font-style: normal; font-weight: 700; }
.td.off i { color: #ff8aa0; } .td.on i { color: #6ee7b7; }
.td.off { box-shadow: inset 0 0 0 1px rgba(255, 92, 122, .28); background: rgba(255, 92, 122, .06); }
.td.on { box-shadow: inset 0 0 0 1px rgba(61, 220, 151, .28); background: rgba(61, 220, 151, .06); }
.brief-prog { display: flex; flex-direction: column; gap: 6px; margin-top: -6px; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: auto; }
.stat { padding: 11px 12px; border-radius: 14px; background: rgba(255, 255, 255, .035); box-shadow: inset 0 0 0 1px var(--line); }
.stat b { display: block; font: 600 20px var(--mono); letter-spacing: -.02em; }
.stat span { font-size: 11px; color: var(--ink-3); }

/* ------------------------------------------------------------ cards grid */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)); gap: 16px; }
.card { display: flex; flex-direction: column; overflow: hidden; cursor: pointer; transition: transform .45s var(--ease), box-shadow .45s var(--ease);
  animation: cardIn .7s var(--ease) both; animation-delay: calc(var(--i, 0) * 40ms); }
.card:hover { transform: translateY(-4px); }
@keyframes cardIn { from { opacity: 0; transform: translateY(14px) scale(.985); } }
.card-media { position: relative; aspect-ratio: 2 / 1; max-height: 230px; flex: none; overflow: hidden; border-radius: var(--radius) var(--radius) 0 0; }
.card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4, 6, 13, .05) 30%, rgba(8, 12, 22, .85)); }
.card-media .rank { position: absolute; z-index: 2; left: 14px; bottom: 6px; font: 700 44px/1 var(--mono); letter-spacing: -.06em; color: rgba(255, 255, 255, .92);
  text-shadow: 0 4px 24px rgba(0, 0, 0, .6); }
.card-media .tl { position: absolute; z-index: 2; top: 12px; left: 12px; right: 12px; display: flex; justify-content: space-between; gap: 6px; }
.card-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.card h3 { margin: 0; font-size: 16px; line-height: 1.28; letter-spacing: -.012em; font-weight: 620; text-wrap: balance; }
.card p.sum { margin: 0; color: var(--ink-3); font-size: 12.8px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card .foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 4px; }
.cover { position: absolute; inset: 0; overflow: hidden; container-type: size; }
.cover .glyph { position: absolute; top: 50%; right: 8%; transform: translateY(-50%); width: min(62cqh, 42cqw); height: min(62cqh, 42cqw); opacity: .17; color: #fff; }
.cover .glyph svg { width: 100%; height: 100%; }
.cover::after { content: ""; position: absolute; inset: 0; opacity: .35; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.55'/></svg>"); }
.card.fresh { box-shadow: 0 0 0 1px rgba(143, 180, 255, .35), 0 0 40px -8px rgba(143, 180, 255, .45), 0 28px 60px -34px rgba(0, 0, 0, .8); }

/* ------------------------------------------------------------ toolbar */
.toolbar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 12px 16px; border-radius: 18px; margin-bottom: 16px; }
.toolbar .grow { flex: 1; }
.live { display: inline-flex; align-items: center; gap: 8px; font: 700 11px var(--font); letter-spacing: .16em; color: #ff8aa0; text-transform: uppercase; }
.live .dot { background: var(--down); box-shadow: 0 0 12px var(--down); animation: blink 1.6s ease-in-out infinite; }
@keyframes blink { 50% { opacity: .35; } }
.slider { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--ink-3); }
.slider b { font: 600 12px var(--mono); color: var(--ink); min-width: 26px; text-align: right; }
input[type=range] { -webkit-appearance: none; appearance: none; width: 130px; height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .12); outline: none; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; border-radius: 50%; background: #fff; cursor: pointer;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, .12), 0 2px 8px rgba(0, 0, 0, .5); }
.slider.t input { accent-color: var(--truth); } .slider.i input { accent-color: var(--imp); }
.seg { display: inline-flex; padding: 3px; border-radius: 12px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--line); gap: 2px; flex-wrap: wrap; }
.seg button { border: 0; background: none; padding: 7px 12px; border-radius: 9px; cursor: pointer; color: var(--ink-3); font-size: 12.5px; font-weight: 560; display: inline-flex; gap: 6px; align-items: center; }
.seg button:hover { color: var(--ink); }
.seg button.on { background: rgba(255, 255, 255, .11); color: var(--ink); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2); }
.switch { display: inline-flex; align-items: center; gap: 9px; cursor: pointer; font-size: 12.5px; color: var(--ink-2); user-select: none; }
.switch input { display: none; }
.switch i { width: 34px; height: 20px; border-radius: 12px; background: rgba(255, 255, 255, .12); position: relative; transition: background .25s; flex: none; }
.switch i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .35s var(--spring); box-shadow: 0 2px 6px rgba(0, 0, 0, .4); }
.switch input:checked + i { background: linear-gradient(90deg, #5b8cff, var(--act)); }
.switch input:checked + i::after { transform: translateX(14px); }

/* ------------------------------------------------------------ breaking */
.timeline { list-style: none; margin: 0; padding: 0 0 0 4px; position: relative; }
.timeline::before { content: ""; position: absolute; left: 112px; top: 10px; bottom: 10px; width: 2px; border-radius: 2px;
  background: linear-gradient(180deg, rgba(255, 92, 122, .6), rgba(143, 180, 255, .25) 30%, rgba(255, 255, 255, .06)); }
.tl { display: grid; grid-template-columns: 96px 32px minmax(0, 1fr); align-items: start; gap: 0; margin-bottom: 12px; animation: cardIn .6s var(--ease) both; animation-delay: calc(var(--i, 0) * 35ms); }
.tl time { text-align: right; padding-top: 16px; font: 600 13px var(--mono); color: var(--ink-2); }
.tl time small { display: block; font: 500 11px var(--font); color: var(--ink-4); margin-top: 2px; }
.tl .node { justify-self: center; margin-top: 19px; width: 12px; height: 12px; border-radius: 50%; background: #1a2340; box-shadow: 0 0 0 3px rgba(8, 11, 20, .9), inset 0 0 0 2px var(--accent); position: relative; }
.tl.fresh .node { background: var(--down); box-shadow: 0 0 0 3px rgba(8, 11, 20, .9), 0 0 14px var(--down); }
.tl.fresh .node::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 1.5px solid var(--down); animation: ping 1.8s var(--ease) infinite; }
.tl-card { padding: 14px 16px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 18px; cursor: pointer; transition: transform .35s var(--ease); }
.tl-card:hover { transform: translateX(3px); }
.tl-card h3 { margin: 0; font-size: 16px; line-height: 1.3; font-weight: 620; letter-spacing: -.01em; }
.tl-card .side { grid-row: span 3; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.tl-card .thumb { width: 112px; height: 70px; border-radius: 12px; position: relative; overflow: hidden; flex: none; }
.tl-card .thumb::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px var(--line); pointer-events: none; }

/* ------------------------------------------------------------ actionable */
.act-list { display: flex; flex-direction: column; gap: 14px; }
.act-card { display: grid; grid-template-columns: 138px minmax(0, 1.25fr) minmax(300px, 1fr); gap: 18px; padding: 18px; cursor: pointer; animation: cardIn .6s var(--ease) both; animation-delay: calc(var(--i, 0) * 40ms); transition: transform .4s var(--ease); }
.act-card:hover { transform: translateY(-3px); }
.act-left { display: flex; flex-direction: column; align-items: center; gap: 8px; justify-content: center; border-right: 1px solid var(--line); padding-right: 14px; }
.act-left .rk { font: 600 11px var(--mono); color: var(--ink-4); letter-spacing: .12em; }
.act-mid { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.act-mid h3 { margin: 0; font-size: 17px; line-height: 1.28; font-weight: 640; letter-spacing: -.012em; }
.act-mid p { margin: 0; color: var(--ink-2); font-size: 13px; }
.matrix { display: flex; flex-direction: column; gap: 6px; justify-content: center; }
.mrow { display: grid; grid-template-columns: 22px minmax(0, 1fr) 70px 70px 62px; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 11px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px var(--line); font-size: 12px; }
.mrow.watch { box-shadow: inset 0 0 0 1px rgba(255, 193, 90, .4); background: rgba(255, 193, 90, .05); }
.mrow .dir { width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; }
.mrow .dir.up { color: var(--up); background: rgba(61, 220, 151, .12); } .mrow .dir.down { color: var(--down); background: rgba(255, 92, 122, .12); }
.mrow .dir.mixed { color: var(--mixed); background: rgba(245, 196, 81, .12); } .mrow .dir.unclear { color: var(--unclear); background: rgba(139, 149, 173, .12); }
.mrow .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font-weight: 560; }
.mrow .nm small { color: var(--ink-4); font: 500 10.5px var(--mono); margin-left: 6px; }
.mbar { display: flex; flex-direction: column; gap: 3px; font: 500 9.5px var(--font); letter-spacing: .06em; color: var(--ink-4); text-transform: uppercase; }
.mbar i { display: block; height: 4px; border-radius: 3px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.mbar i b { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--act), var(--act-2)); }
.mbar.p i b { background: linear-gradient(90deg, #5b8cff, var(--accent)); }
.hz { font: 600 10px var(--mono); color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; text-align: right; }
.matrix .none { color: var(--ink-4); font-size: 12.5px; padding: 12px; text-align: center; }

/* ------------------------------------------------------------ sources */
.src-head { padding: 22px 24px; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 1fr); gap: 24px; margin-bottom: 16px; }
.src-head h2 { margin: 0 0 8px; font-size: 24px; letter-spacing: -.02em; font-weight: 680; }
.src-head p { margin: 0; color: var(--ink-2); font-size: 13.5px; line-height: 1.6; }
.src-head .legend { display: flex; flex-direction: column; gap: 10px; justify-content: center; }
.band-row { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--ink-2); }
.band-sw { width: 34px; height: 8px; border-radius: 4px; }
.src-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 16px; }
.src-card { padding: 18px; display: flex; flex-direction: column; gap: 13px; animation: cardIn .6s var(--ease) both; animation-delay: calc(var(--i, 0) * 30ms); }
.src-card.off { opacity: .55; }
.src-top { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; }
.src-top h3 { margin: 0; font-size: 16px; font-weight: 650; letter-spacing: -.01em; }
.src-top .kind { font-size: 11.5px; color: var(--ink-3); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.src-score { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center; }
.src-score .big { position: relative; }
.insufficient-data { display: flex; align-items: center; justify-content: center; width: 92px; min-height: 92px; padding: 8px; border: 1px solid var(--line); border-radius: 50%; color: var(--ink-3); font-size: 11px; line-height: 1.25; text-align: center; }
.delta { display: inline-flex; align-items: center; gap: 4px; font: 600 12px var(--mono); padding: 3px 8px; border-radius: 8px; }
.delta.up { color: var(--up); background: rgba(61, 220, 151, .1); } .delta.down { color: var(--down); background: rgba(255, 92, 122, .1); } .delta.flat { color: var(--ink-3); background: rgba(255, 255, 255, .05); }
.spark { width: 100%; height: 42px; display: block; }
.src-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.src-stats div { padding: 8px 9px; border-radius: 11px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px var(--line); }
.src-stats b { display: block; font: 600 14px var(--mono); }
.src-stats span { font-size: 10px; color: var(--ink-4); letter-spacing: .04em; text-transform: uppercase; }
.src-card p.bias { margin: 0; color: var(--ink-2); font-size: 13px; line-height: 1.55; }
.src-card p.watchfor { margin: 0; color: var(--ink-3); font-size: 12.5px; line-height: 1.5; display: flex; gap: 8px; }
.src-card p.watchfor .ic { color: var(--mixed); margin-top: 2px; }
.noticed { display: flex; flex-direction: column; gap: 5px; }
.noticed .t { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-4); font-weight: 600; }
.feeds { display: flex; flex-direction: column; gap: 4px; border-top: 1px solid var(--line); padding-top: 10px; }
.feed { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: 11.5px; color: var(--ink-3); }
.feed > span:nth-child(2) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.src-top .kind { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-wrap: nowrap; }
.src-top > div { min-width: 0; }
.feed .dot { width: 7px; height: 7px; }
.feed .st { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); white-space: nowrap; }
.feed .err { grid-column: 2 / 4; color: #ffb3c2; font-size: 11px; }
.method { padding: 22px 24px; margin-top: 16px; }
.method h3 { margin: 0 0 12px; font-size: 15px; }
.method-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.method-grid div { padding: 14px; border-radius: 14px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px var(--line); font-size: 12.5px; color: var(--ink-2); line-height: 1.55; }
.method-grid b { display: flex; gap: 7px; align-items: center; color: var(--ink); margin-bottom: 6px; font-size: 13px; }

/* ------------------------------------------------------------ drawer */
.drawer-scrim { position: fixed; inset: 0; z-index: 60; background: rgba(3, 5, 10, .45); opacity: 0; pointer-events: none; transition: opacity .35s var(--ease); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.drawer-scrim.open { opacity: 1; pointer-events: auto; }
.drawer { position: fixed; z-index: 61; top: 12px; right: 12px; bottom: 12px; width: min(640px, calc(100vw - 24px)); border-radius: 26px; overflow: hidden;
  transform: translateX(calc(100% + 30px)); transition: transform .55s var(--spring); display: flex; flex-direction: column;
  background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02)), rgba(9, 13, 25, .82); }
.drawer.open { transform: none; }
.drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); position: relative; z-index: 2; }
.drawer-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 22px 24px 40px; display: flex; flex-direction: column; gap: 20px; position: relative; z-index: 2; scrollbar-width: thin; }
.drawer h1 { margin: 0; font-size: 25px; line-height: 1.16; letter-spacing: -.02em; font-weight: 680; text-wrap: balance; }
.drawer .lead-img { aspect-ratio: 16 / 9; max-height: 340px; flex: none; border-radius: 18px; position: relative; overflow: hidden; }
.drawer .lead-img::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px var(--line); pointer-events: none; }
.claim { padding: 13px 15px; border-radius: 14px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--line); font-size: 13.5px; color: var(--ink-2); }
.claim b { display: block; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-4); margin-bottom: 5px; }
.breakdown { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.bd { padding: 14px; border-radius: 16px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px var(--line); display: flex; flex-direction: column; gap: 10px; align-items: stretch; }
.bd .dial-wrap { align-self: center; }
.bd .row { display: grid; grid-template-columns: minmax(0, 1fr) 36px; gap: 8px; align-items: center; font-size: 11.5px; color: var(--ink-3); }
.bd .row i { grid-column: 1 / 3; height: 4px; border-radius: 3px; background: rgba(255, 255, 255, .07); overflow: hidden; margin-top: -4px; }
.bd .row i b { display: block; height: 100%; border-radius: 3px; }
.bd.truth .row i b { background: var(--truth); } .bd.importance .row i b { background: var(--imp); } .bd.action .row i b { background: var(--act); }
.bd .row span:last-child { text-align: right; font: 600 11.5px var(--mono); color: var(--ink-2); }
.bd .row.sub { padding-left: 12px; margin-top: -2px; font-size: 10.5px; color: var(--ink-4); position: relative; }
.bd .row.sub::before { content: ""; position: absolute; left: 3px; top: 50%; width: 5px; height: 1px; background: var(--ink-4); opacity: .6; }
.bd .row.sub span:last-child { font: 500 10.5px var(--mono); color: var(--ink-3); }
.block-title { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; margin: 0 0 10px; display: flex; align-items: center; gap: 8px; }
.art { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; padding: 12px; border-radius: 14px; background: rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px var(--line); align-items: start; }
.art + .art { margin-top: 8px; }
.art h4 { margin: 0 0 3px; font-size: 13.5px; font-weight: 580; line-height: 1.35; }
.art h4 a:hover { text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .3); text-underline-offset: 3px; }
.art p { margin: 0; color: var(--ink-3); font-size: 12px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.art .assess { display: flex; flex-direction: column; gap: 4px; min-width: 84px; font-size: 10px; color: var(--ink-4); letter-spacing: .04em; text-transform: uppercase; }
.art .assess i { display: block; height: 4px; border-radius: 3px; background: rgba(255, 255, 255, .07); overflow: hidden; }
.art .assess i b { display: block; height: 100%; }
.art .letter { font: 700 10px var(--mono); color: var(--ink-4); margin-left: 4px; }
.btn { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border-radius: 12px; border: 0; cursor: pointer; font-weight: 600; font-size: 13px; white-space: nowrap; flex: none;
  background: rgba(255, 255, 255, .08); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-2), inset 0 1px 0 rgba(255, 255, 255, .12); transition: background .2s, transform .15s; }
.btn:hover { background: rgba(255, 255, 255, .14); }
.btn:active { transform: scale(.97); }
.btn.primary { background: linear-gradient(180deg, #7aa2ff, #5b7cf0); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 20px -8px rgba(91, 124, 240, .8); }
.btn.primary:hover { filter: brightness(1.08); }
.btn.danger { background: rgba(255, 92, 122, .14); color: #ffb3c2; box-shadow: inset 0 0 0 1px rgba(255, 92, 122, .3); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; }

/* ------------------------------------------------------------ modal / settings */
.modal-scrim { position: fixed; inset: 0; z-index: 70; background: rgba(3, 5, 10, .55); display: grid; place-items: center; opacity: 0; pointer-events: none; transition: opacity .3s var(--ease); padding: 16px; }
.modal-scrim.open { opacity: 1; pointer-events: auto; }
.modal { width: min(980px, 100%); height: min(820px, calc(100vh - 32px)); display: grid; grid-template-columns: 210px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); overflow: hidden; border-radius: 26px;
  transform: translateY(14px) scale(.98); transition: transform .5s var(--spring); background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02)), rgba(9, 13, 25, .9); }
.modal-scrim.open .modal { transform: none; }
.modal nav { padding: 18px 12px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 3px; position: relative; z-index: 2; min-height: 0; overflow-y: auto; }
.modal nav .t { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-4); padding: 4px 10px 12px; font-weight: 600; }
.modal nav button { display: flex; align-items: center; gap: 10px; border: 0; background: none; text-align: left; padding: 10px 12px; border-radius: 11px; color: var(--ink-3); cursor: pointer; font-weight: 560; }
.modal nav button:hover { color: var(--ink); background: rgba(255, 255, 255, .04); }
.modal nav button.on { color: var(--ink); background: rgba(255, 255, 255, .09); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14); }
.modal .pane { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 22px 26px 30px; position: relative; z-index: 2; display: flex; flex-direction: column; gap: 18px; }
.modal .pane > * { flex: none; }
.modal .pane, .modal nav, .drawer-body, .pop, .activity { scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .2) transparent; }
.modal .pane h2 { margin: 0; font-size: 20px; letter-spacing: -.015em; }
.modal .pane p.lead { margin: -8px 0 0; color: var(--ink-3); font-size: 13px; line-height: 1.55; }
.field { display: flex; flex-direction: column; gap: 7px; }
.field label, .field .lbl { font-size: 12px; color: var(--ink-2); font-weight: 560; }
.field .hint, .hint { font-size: 11.5px; color: var(--ink-4); line-height: 1.5; }
.input, select.input, textarea.input { height: 40px; padding: 0 12px; border-radius: 11px; border: 0; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--line-2); outline: none; color: var(--ink); width: 100%; }
textarea.input { height: auto; min-height: 76px; padding: 10px 12px; resize: vertical; line-height: 1.5; }
.input:focus { box-shadow: inset 0 0 0 1px rgba(143, 180, 255, .6), 0 0 0 4px rgba(143, 180, 255, .12); }
select.input option { background: #0c1220; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.adv { margin: -2px 0; }
.adv > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ink-2); padding: 4px 0; }
.adv > summary::-webkit-details-marker { display: none; }
.adv > summary .chev { transition: transform .25s var(--ease); }
.adv[open] > summary .chev { transform: rotate(90deg); }
.panel { padding: 16px; border-radius: 16px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px var(--line); display: flex; flex-direction: column; gap: 12px; }
.kv { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 6px 12px; font-size: 12.5px; }
.kv span { color: var(--ink-4); } .kv b { font-weight: 560; color: var(--ink-2); overflow-wrap: anywhere; }
.pre { font: 12px/1.5 var(--mono); color: var(--ink-2); background: rgba(0, 0, 0, .3); padding: 10px 12px; border-radius: 10px; white-space: pre-wrap; overflow-wrap: anywhere; box-shadow: inset 0 0 0 1px var(--line); max-height: 220px; overflow: auto; }
.src-toggle { display: grid; grid-template-columns: auto minmax(0, 1fr) 90px auto; gap: 12px; align-items: center; padding: 9px 12px; border-radius: 12px; background: rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px var(--line); }
.src-toggle .n { font-size: 13px; font-weight: 560; } .src-toggle .n small { color: var(--ink-4); font-weight: 500; margin-left: 6px; }
.src-toggle input.input { height: 32px; text-align: center; font-family: var(--mono); }
.netlog { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.netlog th { text-align: left; font-weight: 600; color: var(--ink-4); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; padding: 6px 8px; position: sticky; top: 0; background: rgba(9, 13, 25, .95); }
.netlog td { padding: 6px 8px; border-top: 1px solid var(--line); color: var(--ink-2); font-family: var(--mono); white-space: nowrap; max-width: 280px; overflow: hidden; text-overflow: ellipsis; }
.netlog td.c2 { color: var(--up); } .netlog td.c3 { color: var(--accent); } .netlog td.c4, .netlog td.c5, .netlog td.cx { color: var(--down); }
.themes { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.theme { height: 90px; border-radius: 16px; border: 0; cursor: pointer; position: relative; overflow: hidden; box-shadow: inset 0 0 0 1px var(--line-2); display: flex; align-items: flex-end; padding: 10px 12px; font-weight: 600; font-size: 12.5px; color: #fff; text-shadow: 0 1px 6px rgba(0, 0, 0, .6); }
.theme.on { box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .85), 0 0 0 4px rgba(143, 180, 255, .25); }
.pipeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; position: relative; }
.agent { padding: 12px; border-radius: 14px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px var(--line); display: flex; flex-direction: column; gap: 6px; position: relative; transition: box-shadow .3s, background .3s; }
.agent .nm { display: flex; align-items: center; gap: 7px; font-weight: 620; font-size: 13px; }
.agent .ds { font-size: 11px; color: var(--ink-4); line-height: 1.4; }
.agent .q { font: 600 18px var(--mono); }
.agent.active { background: rgba(143, 180, 255, .09); box-shadow: inset 0 0 0 1px rgba(143, 180, 255, .45), 0 0 26px -6px rgba(143, 180, 255, .55); }
.agent.active .nm .ic { animation: spin 2.2s linear infinite; }
.activity { display: flex; flex-direction: column; gap: 2px; max-height: 300px; overflow-y: auto; }
.act-line { display: grid; grid-template-columns: 58px 82px minmax(0, 1fr); gap: 8px; font-size: 12px; padding: 6px 8px; border-radius: 8px; color: var(--ink-2); }
.act-line:nth-child(odd) { background: rgba(255, 255, 255, .02); }
.act-line time { font: 500 11px var(--mono); color: var(--ink-4); }
.act-line b { font-weight: 600; font-size: 11px; letter-spacing: .04em; }
.act-line.warn { color: #ffcfa0; }
.agent-Analyst { color: var(--act); } .agent-Triage { color: var(--accent); } .agent-Editor { color: var(--imp); } .agent-Auditor { color: var(--truth); } .agent-Fetcher { color: var(--ink-3); } .agent-Reputation { color: #9ff5dd; } .agent-Runtime { color: #d7b3ff; } .agent-System { color: var(--down); }

/* thin progress bar: AI popover progress block, brief-card slim progress line */
.pbar { height: 6px; border-radius: 4px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.pbar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--truth-2), var(--truth)); transition: width .6s var(--ease); }
.pbar.sm { height: 4px; }

/* AI popover: endpoints (This PC / Cloud / Jev) and in-flight jobs */
.ep-list { display: flex; flex-direction: column; gap: 6px; }
.ep-row { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 12px; background: rgba(255, 255, 255, .03); box-shadow: inset 0 0 0 1px var(--line); }
.ep-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ep-nm { display: flex; align-items: center; gap: 6px; font-weight: 620; font-size: 12.5px; }
.ep-sub { font-size: 11px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ep-stat { flex: none; font: 600 12px var(--mono); color: var(--ink-2); }
.jobs { display: flex; flex-direction: column; gap: 2px; max-height: 220px; overflow-y: auto; }
.job-row { display: grid; grid-template-columns: 78px minmax(0, 1fr) auto 34px; gap: 8px; align-items: center; font-size: 12px; padding: 6px 8px; border-radius: 8px; color: var(--ink-2); }
.job-row:nth-child(odd) { background: rgba(255, 255, 255, .02); }
.job-row .tx { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-row .el { font: 500 11px var(--mono); color: var(--ink-4); text-align: right; }

/* ------------------------------------------------------------ popover */
.pop, .modal, .drawer { -webkit-backdrop-filter: blur(30px) saturate(1.5); backdrop-filter: blur(30px) saturate(1.5); }
.pop { position: fixed; z-index: 55; top: calc(var(--topbar-h) + 22px); right: max(14px, calc((100vw - 1560px) / 2)); width: min(620px, calc(100vw - 28px)); padding: 18px; border-radius: 22px;
  max-height: calc(100vh - var(--topbar-h) - 40px); overflow-y: auto; overscroll-behavior: contain;
  display: flex; flex-direction: column; gap: 14px; opacity: 0; pointer-events: none; transform: translateY(-8px) scale(.98); transition: opacity .3s var(--ease), transform .45s var(--spring);
  background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)), rgba(9, 13, 25, .9); box-shadow: inset 0 0 0 1px var(--line-2), 0 30px 80px -20px rgba(0,0,0,.85); }
.pop.open { opacity: 1; pointer-events: auto; transform: none; }
.pop > * { position: relative; z-index: 2; }

/* ------------------------------------------------------------ banners, toasts, empty */
.banner { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 16px; margin-bottom: 16px; font-size: 13px; color: var(--ink-2); }
.banner .ic { color: var(--imp); }
.banner .grow { flex: 1; }
.toasts { position: fixed; z-index: 90; left: 50%; bottom: 22px; transform: translateX(-50%); display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
.toast { padding: 11px 16px; border-radius: 14px; font-size: 13px; display: flex; align-items: center; gap: 10px; animation: toastIn .5s var(--spring) both; pointer-events: auto;
  background: linear-gradient(180deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .03)), rgba(12, 17, 31, .9); box-shadow: inset 0 0 0 1px var(--line-2), 0 14px 40px -10px rgba(0, 0, 0, .8); }
.toast.out { animation: toastOut .35s var(--ease) both; }
@keyframes toastIn { from { opacity: 0; transform: translateY(12px) scale(.96); } }
@keyframes toastOut { to { opacity: 0; transform: translateY(8px); } }
.empty { display: grid; place-items: center; text-align: center; padding: 70px 20px; gap: 16px; }
.empty canvas { width: 180px; height: 180px; }
.empty h2 { margin: 0; font-size: 22px; letter-spacing: -.015em; }
.empty p { margin: 0; color: var(--ink-3); max-width: 520px; line-height: 1.6; }
.warm { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; max-width: 760px; }
.warm .tag.ok { color: #9ff5dd; box-shadow: inset 0 0 0 1px rgba(79, 227, 193, .3); }
.skel { position: relative; overflow: hidden; background: rgba(255, 255, 255, .04); border-radius: 10px; }
.skel::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .07), transparent); animation: shimmer 1.6s infinite; }
@keyframes shimmer { to { transform: translateX(100%); } }
footer { width: min(1560px, calc(100vw - 28px)); margin: 0 auto 26px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; color: var(--ink-4); font-size: 11.5px; }
footer a:hover { color: var(--ink-2); }

/* ------------------------------------------------------------ responsive */
@media (max-width: 1640px) { .chip.src-chip { display: none; } }
@media (max-width: 1520px) { .wordmark span { display: none; } }
@media (max-width: 1500px) and (min-width: 761px) { .tab .lbl { display: none; } .tab { padding: 0 11px; } .tab .ic { display: block !important; } }
@media (max-width: 1320px) and (min-width: 1201px) { .tab .ic { display: none; } }
@media (max-width: 1200px) {
  .topbar { grid-template-columns: 1fr auto; }
  .tabs { grid-column: 1 / 3; grid-row: 2; justify-self: center; }
}
@media (max-width: 1280px) {
  .topbar { grid-template-columns: auto minmax(0, 1fr) auto; }
  .wordmark span { display: none; }
  .tab { padding: 0 10px; }
  .act-card { grid-template-columns: 120px minmax(0, 1fr); }
  .act-card .matrix { grid-column: 1 / 3; }
}
@media (max-width: 1100px) {
  .hero-row { grid-template-columns: 1fr; }
  .brief { min-height: 0; }
  .topbar { grid-template-columns: 1fr auto; }
  .tabs { grid-column: 1 / 3; grid-row: 2; justify-self: center; }
  .src-head { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .hero { grid-template-columns: 1fr; }
  .hero-media { border-radius: var(--radius) var(--radius) 0 0; min-height: 0; aspect-ratio: 16 / 9; }
  .tab span.lbl { display: none; }
  .timeline::before { left: 18px; }
  .tl { grid-template-columns: 0 36px minmax(0, 1fr); }
  .tl time { display: none; }
  .tl-card { grid-template-columns: 1fr; } .tl-card .side { grid-row: auto; flex-direction: row; align-items: center; }
  .act-card { grid-template-columns: 1fr; } .act-left { border-right: 0; padding-right: 0; flex-direction: row; } .act-card .matrix { grid-column: auto; }
  .modal { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); } .modal nav { flex-direction: row; overflow-x: auto; overflow-y: hidden; border-right: 0; border-bottom: 1px solid var(--line); } .modal nav .t { display: none; }
  .modal nav button { flex: none; }
  .breakdown { grid-template-columns: 1fr; } .row2 { grid-template-columns: 1fr; } .src-stats { grid-template-columns: repeat(2, 1fr); }
  .chip.src-chip { display: none; }
}
html[data-motion="reduced"] *, html[data-motion="reduced"] *::before, html[data-motion="reduced"] *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
@media (prefers-reduced-motion: reduce) {
  .tape-track { animation: none; }
  .market-tape { overflow-x: auto; mask: none; -webkit-mask: none; }
  .market-track { width: max-content; }
  .market-duplicate { display: none; }
}

/* settled re-renders: no entrance animations, dials jump to value */
.view.settled, .view.settled .card, .view.settled .tl, .view.settled .act-card, .view.settled .src-card { animation: none !important; }
.view.settled .dial .val { transition: none; }
.glass.fresh, .fresh > .tl-card { box-shadow: 0 0 0 1px rgba(143, 180, 255, .4), 0 0 38px -8px rgba(143, 180, 255, .5), 0 28px 60px -34px rgba(0, 0, 0, .8); transition: box-shadow 1.2s var(--ease); }
.ic.spin { animation: spin 1.1s linear infinite; }
body.offline main { opacity: .45; filter: grayscale(.4); transition: opacity .4s; }
code { font-family: var(--mono); font-size: .92em; background: rgba(255, 255, 255, .07); padding: 1px 5px; border-radius: 5px; }

/* reliability dials (sources) */
.dial.rep-high .val { stroke: url(#gTruth); } .dial.rep-high .num { color: var(--high); } .dial.rep-high .glow { background: var(--high); }
.dial.rep-mixed .val { stroke: url(#gImp); } .dial.rep-mixed .num { color: var(--mid); } .dial.rep-mixed .glow { background: var(--mid); }
.dial.rep-low .val { stroke: url(#gLow); } .dial.rep-low .num { color: var(--low); } .dial.rep-low .glow { background: var(--low); }
/* pressure map */
.pressure { display: flex; flex-direction: column; gap: 6px; }
.pressure .t { display: flex; gap: 7px; align-items: center; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-4); font-weight: 600; margin-bottom: 2px; }
.pr { display: grid; grid-template-columns: 118px minmax(0, 1fr) 22px; gap: 10px; align-items: center; font-size: 12px; }
.pr .nm { color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 560; }
.pr.watch .nm { color: var(--imp); }
.pr .bars { position: relative; height: 8px; border-radius: 5px; background: rgba(255, 255, 255, .05); display: flex; justify-content: center; }
.pr .bars::after { content: ""; position: absolute; left: 50%; top: -3px; bottom: -3px; width: 1px; background: rgba(255, 255, 255, .25); }
.pr .bars i { display: block; height: 100%; }
.pr .bars .dn { margin-right: 0; margin-left: auto; border-radius: 5px 0 0 5px; background: linear-gradient(270deg, var(--down), rgba(255, 92, 122, .35)); position: absolute; right: 50%; }
.pr .bars .upb { border-radius: 0 5px 5px 0; background: linear-gradient(90deg, rgba(61, 220, 151, .35), var(--up)); position: absolute; left: 50%; }
.pr .n { font: 600 11px var(--mono); color: var(--ink-4); text-align: right; }

/* story images: procedural cover art underneath, the photo on top once it has loaded and been fitted.
   cover   = shapes close to the box: fill it (a little trimmed)
   contain = very different shapes or small files: whole image, never upscaled past 1.6x, on a blurred copy of itself */
.ph { position: absolute; inset: 0; overflow: hidden; display: flex; align-items: center; justify-content: center; opacity: 0; }
.ph.on { opacity: 1; }
.mono-badge { position: relative; }
.mono-badge .outlet-logo { position: absolute; inset: 0; width: 100%; height: 100%; box-sizing: border-box; padding: 4px; border-radius: 50%; object-fit: contain; background: #f1f2f4; }
[data-show-logos="false"] .outlet-logo { display: none; }
.stock-ph img.fg { object-fit: cover; }
.illustration-label { position: absolute; right: 10px; bottom: 10px; z-index: 2; padding: 3px 7px; border-radius: 5px; color: #fff; background: #10131caa; font: 500 9px/1.3 var(--font); letter-spacing: .02em; }
.image-credit { margin: -8px 0 2px; color: var(--ink-3); font: 11px/1.5 var(--font); }
.image-credit a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.ph.anim { transition: opacity .6s var(--ease); }
.ph img { display: block; }
.ph img.fg { position: relative; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; transition: transform 1.2s var(--ease); }
.ph[data-fit="contain"] img.fg { object-fit: contain; max-width: calc(var(--nw, 4000) * var(--up, 1.6) * 1px); max-height: calc(var(--nh, 4000) * var(--up, 1.6) * 1px);
  filter: drop-shadow(0 10px 24px rgba(0, 0, 0, .5)); }
.ph img.bd { position: absolute; left: -12%; top: -12%; width: 124%; height: 124%; max-width: none; object-fit: cover; opacity: 0;
  filter: blur(22px) saturate(1.35) brightness(.5); transition: opacity .6s var(--ease); }
.ph[data-fit="contain"] img.bd[src] { opacity: 1; }
.hero:hover .ph[data-fit="cover"] img.fg, .card:hover .ph[data-fit="cover"] img.fg { transform: scale(1.035); }

/* ------------------------------------------------------------ desk brief: summary / in-depth switch */
.brief-mode { display: inline-flex; gap: 2px; padding: 2px; border-radius: 10px; background: rgba(255, 255, 255, .035);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .075); }
.brief-mode button { position: relative; display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px; border: 0; border-radius: 8px;
  background: none; color: var(--ink-3); font: 550 12px/1 var(--font); cursor: pointer; transition: color .2s var(--ease), background-color .2s var(--ease); }
.brief-mode button:hover { color: var(--ink); background: rgba(255, 255, 255, .05); }
.brief-mode button.on { color: var(--ink); background: rgba(255, 255, 255, .09); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); cursor: default; }
.brief-mode button .ic { opacity: .7; }
.brief-mode i.live { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 0 rgba(143, 180, 255, .6); animation: ping2 1.6s var(--ease) infinite; }
.brief-mode i.none { width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, .18); }
@keyframes ping2 { 0% { box-shadow: 0 0 0 0 rgba(143, 180, 255, .55); } 100% { box-shadow: 0 0 0 7px rgba(143, 180, 255, 0); } }

/* ------------------------------------------------------------ market pulse row */
.pulse { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.pulse.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pcard { padding: 14px 16px 14px; display: flex; flex-direction: column; gap: 10px; min-height: 236px; min-width: 0; }
.pcard > * { position: relative; z-index: 2; }
.pcard header, .pc-sub { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.pcard .pt { font: 600 11px var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); white-space: nowrap; }
.pcard .pv { font-size: 12px; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pcard .pv.muted { color: var(--ink-4); }
.pcard .pv b { font-weight: 650; }
.pv b.off, .b-tone b.off { color: #ff8aa0; } .pv b.on, .b-tone b.on { color: #6ee7b7; } .pv b.mid, .b-tone b.mid { color: var(--mixed); }
.pc-body { flex: 1 1 auto; min-height: 0; display: flex; align-items: flex-end; }
.pc-empty { color: var(--ink-4); font-size: 12.5px; align-self: center; margin: auto; text-align: center; max-width: 240px; }
.pc-svg { display: block; overflow: visible; }
.pc-svg .ax { font: 500 10px var(--mono); fill: var(--ink-4); }
.pc-svg .ax.mid { text-anchor: middle; } .pc-svg .ax.end { text-anchor: end; }
.pc-svg .gridline { stroke: rgba(255, 255, 255, .05); stroke-width: 1; }
.pc-svg .zero, .pc-svg .base { stroke: rgba(255, 255, 255, .18); stroke-width: 1; }
.tone-chart .wash.on { fill: rgba(61, 220, 151, .14); } .tone-chart .wash.off { fill: rgba(255, 92, 122, .14); }
.tone-chart .ln { fill: none; stroke: var(--ink-2); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.tone-chart .dot { stroke: #0e1422; stroke-width: 2; fill: var(--ink-2); } .tone-chart .dot.off { fill: var(--down); } .tone-chart .dot.on { fill: var(--up); }
.tone-chart .xh { stroke: rgba(255, 255, 255, .35); stroke-width: 1; }
.tone-chart .hit { cursor: crosshair; }
.flow .col { cursor: default; outline: none; }
.flow .col:hover path, .flow .col:focus path { filter: brightness(1.25); }
.tbars { display: flex; flex-direction: column; gap: 7px; width: 100%; align-self: center; }
.br { display: grid; grid-template-columns: 104px minmax(0, 1fr) 34px; align-items: center; gap: 10px; font-size: 12px; border-radius: 6px; outline: none; }
.br .bl { color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.br .bt { height: 9px; }
.br .bt i { display: block; height: 100%; border-radius: 0 4px 4px 0; background: #4f7fd9; transition: width .6s var(--ease), filter .2s; }
.br:hover .bt i, .br:focus .bt i { filter: brightness(1.25); }
.br .bv { font: 500 11px var(--mono); color: var(--ink-3); text-align: right; font-variant-numeric: tabular-nums; }
.pc-sub { margin-top: 2px; }
.srcbar { display: flex; gap: 2px; height: 10px; border-radius: 4px; overflow: hidden; }
.srcbar i { display: block; min-width: 3px; outline: none; transition: filter .2s; }
.srcbar i:hover, .srcbar i:focus { filter: brightness(1.25); }
.srcleg { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 7px; font-size: 11px; color: var(--ink-3); }
.srcleg span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.srcleg b { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.srcleg em { font-style: normal; font: 500 10.5px var(--mono); color: var(--ink-4); }
.pcard.spx { padding-bottom: 10px; }
.pcard .seg { display: inline-flex; gap: 2px; padding: 2px; border-radius: 8px; background: rgba(255, 255, 255, .035); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07); }
.pcard .seg button { height: 22px; padding: 0 8px; border: 0; border-radius: 6px; background: none; color: var(--ink-3); font: 550 11px/1 var(--font); cursor: pointer; }
.pcard .seg button:hover { color: var(--ink); }
.pcard .seg button.on { color: var(--ink); background: rgba(255, 255, 255, .09); }
.spx-body { flex: 1 1 auto; min-height: 170px; margin: 0 -6px; border-radius: 12px; overflow: hidden; }
.spx-body .tv-placeholder { min-height: 170px; padding: 16px; flex-direction: column; text-align: center; }
@media (max-width: 700px) { .market-tape .tv-placeholder { flex-wrap: wrap; padding: 4px 0; } }
.spx-frame { width: 100%; height: 100%; min-height: 170px; border: 0; display: block; background: transparent; color-scheme: normal; }
.pcard .tv-credit { align-self: flex-end; font-size: 10.5px; color: var(--ink-4); text-decoration: none; }
.pcard .tv-credit:hover { color: #7aa7ff; }
.ctip { position: fixed; z-index: 95; display: none; pointer-events: none; padding: 7px 10px; border-radius: 10px; max-width: 260px;
  background: rgba(10, 14, 26, .94); box-shadow: inset 0 0 0 1px var(--line-2), 0 10px 26px -10px rgba(0, 0, 0, .8); font-size: 11.5px; color: var(--ink-3); }
.ctip span, .ctip b { display: block; }
.ctip b { color: var(--ink); font: 650 13px var(--font); margin: 2px 0; }

/* ------------------------------------------------------------ in-depth briefing reader */
.brf-scrim { position: fixed; inset: 0; z-index: 56; background: rgba(3, 5, 10, .55); opacity: 0; pointer-events: none; transition: opacity .35s var(--ease);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.brf-scrim.open { opacity: 1; pointer-events: auto; }
.brf { position: fixed; z-index: 57; top: 16px; bottom: 16px; left: 50%; width: min(1200px, calc(100vw - 32px)); transform: translate(-50%, 18px) scale(.985);
  opacity: 0; pointer-events: none; transition: opacity .35s var(--ease), transform .45s var(--ease); border-radius: 24px; overflow: hidden;
  display: flex; flex-direction: column; background: rgba(9, 13, 24, .96); box-shadow: inset 0 0 0 1px var(--line-2), 0 40px 90px -30px rgba(0, 0, 0, .9); }
.brf.open { opacity: 1; pointer-events: auto; transform: translate(-50%, 0) scale(1); }
.brf-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px 14px 24px; border-bottom: 1px solid var(--line); }
.brf-head .l { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.brf-head .meta { font-size: 12px; color: var(--ink-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brf-head .r { display: flex; align-items: center; gap: 8px; flex: none; }
.brf-run { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--accent); }
.brf-run .spin .ic { animation: spin 1.1s linear infinite; }
.brf-body { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 220px minmax(0, 1fr); }
.brf-nav { border-right: 1px solid var(--line); padding: 22px 14px; display: flex; flex-direction: column; gap: 2px; overflow-y: auto; }
.brf-nav .mini { margin: 0 10px 8px; }
.brf-nav a { display: block; padding: 7px 10px; border-radius: 9px; color: var(--ink-3); text-decoration: none; font-size: 13px; line-height: 1.3; transition: background-color .2s, color .2s; }
.brf-nav a:hover { color: var(--ink); background: rgba(255, 255, 255, .04); }
.brf-nav a.on { color: var(--ink); background: rgba(255, 255, 255, .07); box-shadow: inset 2px 0 0 var(--accent); }
.brf-main { position: relative; overflow-y: auto; overscroll-behavior: contain; scroll-behavior: smooth; outline: none; scrollbar-width: thin; }
.brf-doc { max-width: 760px; margin: 0 auto; padding: 34px 40px 60px; }
.mini, .brf .mini { font: 600 10.5px var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-4); margin: 0 0 8px; }
.b-sec { padding: 26px 0; border-top: 1px solid var(--line); }
.b-sec.lead { border-top: 0; padding-top: 4px; }
.b-sec .kicker { font: 600 11px var(--font); letter-spacing: .16em; text-transform: uppercase; color: var(--accent); margin: 0 0 8px; }
.b-sec h1 { font-size: 31px; line-height: 1.18; letter-spacing: -.02em; margin: 0 0 16px; text-wrap: balance; }
.b-sec h2 { font-size: 21px; line-height: 1.25; letter-spacing: -.01em; margin: 0 0 12px; text-wrap: balance; }
.b-sec p { font-size: 15.5px; line-height: 1.72; color: var(--ink-2); margin: 0 0 14px; text-wrap: pretty; }
.b-sec p.lede { color: var(--ink); font-weight: 560; font-size: 16px; }
.b-sec ul, .b-sec ol { margin: 0; padding-left: 20px; color: var(--ink-2); font-size: 14.5px; line-height: 1.65; }
.b-sec li { margin: 0 0 8px; }
.takeaways { counter-reset: tk; list-style: none; padding-left: 0 !important; display: flex; flex-direction: column; gap: 10px; }
.takeaways li { counter-increment: tk; position: relative; padding: 12px 14px 12px 50px; border-radius: 14px; background: rgba(255, 255, 255, .03);
  box-shadow: inset 0 0 0 1px var(--line); margin: 0 !important; color: var(--ink); }
.takeaways li::before { content: counter(tk); position: absolute; left: 14px; top: 11px; width: 24px; height: 24px; border-radius: 8px; display: grid; place-items: center;
  font: 650 12px var(--mono); color: var(--ink); background: rgba(143, 180, 255, .16); }
.b-tone { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -4px 0 16px; }
.b-tone .k { font: 600 10.5px var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-4); margin-right: 2px; }
.b-tone b { font-size: 13px; margin-right: 6px; }
.b-aside { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px; margin-top: 6px; padding: 14px 16px; border-radius: 14px;
  background: rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px var(--line); }
.b-aside ul { padding-left: 0; list-style: none; }
.b-mk li { display: grid; grid-template-columns: 18px auto minmax(0, 1fr); gap: 8px; align-items: baseline; font-size: 13px; margin-bottom: 6px; }
.b-mk b { color: var(--ink); font-weight: 600; white-space: nowrap; }
.b-mk span:last-child { color: var(--ink-3); }
.b-mk .dir { font-weight: 700; } .b-mk .dir.up { color: var(--up); } .b-mk .dir.down { color: var(--down); } .b-mk .dir.mixed { color: var(--mixed); }
.b-watch li { font-size: 13px; color: var(--ink-2); margin-bottom: 6px; padding-left: 14px; position: relative; }
.b-watch li::before { content: ""; position: absolute; left: 0; top: .6em; width: 6px; height: 6px; border-radius: 50%; background: var(--imp); }
.b-two { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.b-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.b-chart { padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, .025); box-shadow: inset 0 0 0 1px var(--line); min-width: 0; }
.b-chart:first-child { grid-column: 1 / 3; }
.b-foot { margin-top: 10px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-4); line-height: 1.6; }
.ref { display: inline-grid; place-items: center; min-width: 19px; height: 17px; padding: 0 4px; margin: 0 1px; border: 0; border-radius: 5px; vertical-align: 1px;
  font: 600 10.5px/1 var(--mono); color: var(--accent); background: rgba(143, 180, 255, .12); cursor: pointer; transition: background-color .2s, color .2s; }
.ref:hover, .ref:focus-visible { background: rgba(143, 180, 255, .28); color: #fff; outline: none; }
.brf-empty { max-width: 560px; margin: 70px auto; text-align: center; padding: 0 24px; }
.brf-empty .ic { color: var(--accent); }
.brf-empty h1 { font-size: 26px; margin: 12px 0; }
.brf-empty p { color: var(--ink-2); line-height: 1.65; }
.brf-empty p.muted { color: var(--ink-4); font-size: 13px; }
.brf-empty .pbar { max-width: 320px; margin: 18px auto 0; }

@media (max-width: 1280px) { .pulse { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pulse.three { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .pulse, .pulse.three { grid-template-columns: 1fr; }
  .brf-body { grid-template-columns: 1fr; } .brf-nav { display: none; }
  .brf-doc { padding: 24px 20px 50px; } .b-aside, .b-two, .b-charts { grid-template-columns: 1fr; } .b-chart:first-child { grid-column: auto; }
}
.pc-svg .ax.lbl { font: 600 9.5px var(--font); letter-spacing: .12em; text-transform: uppercase; fill: rgba(255, 255, 255, .28); }
.bfoot { margin-top: 3px; font-size: 11px; color: var(--ink-4); }
.pcard[data-card="tone"] .pc-body { align-items: stretch; }
.brf-empty .ic { display: flex; justify-content: center; }
.brf.empty .brf-body { grid-template-columns: 1fr; } .brf.empty .brf-nav { display: none; }

/* Calendar and earnings share the app's glass and theme palette. */
.cal-view,.earn-view { --cal-data:#6adacb; --cal-central_bank:#9aaeff; --cal-speech:#cba4ff; --cal-politics:#ff9ba8; --cal-summit:#78c9ff; --cal-auction:#ffc876; --cal-tech:#eb9cff; --cal-earnings:#d4a3ff; --cal-other:var(--ink-3); max-width: 1560px; margin: 0 auto; padding: 24px 22px 72px; }
.cal-view .eyebrow,.earn-view .eyebrow { color:var(--ink-3);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase; }
.cal-header { display:flex;align-items:end;justify-content:space-between;gap:30px;margin:10px 4px 27px; }
.cal-header h1 { margin:4px 0 0;font-size:clamp(36px,4vw,58px);font-weight:650;letter-spacing:-.055em;line-height:1.1; }
.cal-header h1 span { color:#6adacb; } .earn-header h1 span { color:#d4a3ff; }
.cal-header p { margin:9px 0 0;color:var(--ink-2);font-size:14px; }
.cal-updated { color:var(--ink-4);font-size:11px;text-align:right;line-height:1.8; }
.cal-error { margin:0 0 20px;padding:12px 16px;border:1px solid var(--down);border-radius:12px;color:var(--down);background:var(--glass); }
.cal-section-label { display:flex;align-items:baseline;gap:12px;margin:0 4px 12px; }
.cal-section-label h2 { margin:0;color:var(--ink);font-size:21px;letter-spacing:-.035em; }
.cal-section-note { margin-left:auto;color:var(--ink-4);font-size:11px; }
.cal-next { margin-bottom:23px; }
.cal-next-row,.earn-hero-row { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px; }
.cal-next-card { min-width:0;min-height:143px;padding:15px 16px 13px;overflow:hidden;border-top:2px solid var(--kind);transition:transform .22s var(--ease),box-shadow .22s var(--ease); }
.cal-next-card:hover,.earn-hero:hover { transform:translateY(-4px);box-shadow:0 20px 35px -22px rgba(0,0,0,.8),0 0 25px -18px var(--kind); }
.cal-next-top,.cal-next-bottom { display:flex;align-items:center;justify-content:space-between;gap:8px; }
.cal-next-top { color:var(--ink-3);font-size:11px; }
.cal-country { display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:27px;padding:3px 5px;border-radius:5px;color:var(--ink);background:var(--glass-2);border:1px solid var(--line-2);font:700 10px/1 var(--mono); }
.cal-next-card h3 { min-height:39px;margin:13px 0 11px;font-size:13px;font-weight:620;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
.cal-next-bottom { color:var(--ink-3);font-size:11px; }
.cal-countdown,.earn-hero b { color:var(--kind);font:650 15px/1.2 var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap; }
.cal-next-detail { display:flex;gap:8px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--ink-4);border-top:1px solid var(--line);margin-top:12px;padding-top:9px;font-size:10px; }
.cal-next-detail b { color:var(--ink-3);font-weight:550; }
.cal-next-empty { grid-column:1/-1;min-height:100px;padding:30px;color:var(--ink-3);text-align:center; }
.kind-data{--kind:var(--cal-data)}.kind-central_bank{--kind:var(--cal-central_bank)}.kind-speech{--kind:var(--cal-speech)}.kind-politics{--kind:var(--cal-politics)}.kind-summit{--kind:var(--cal-summit)}.kind-auction{--kind:var(--cal-auction)}.kind-tech{--kind:var(--cal-tech)}.kind-earnings{--kind:var(--cal-earnings)}.kind-other,.kind-holiday{--kind:var(--cal-other)}
.cal-tools { padding:12px 15px;display:grid;gap:10px; }
.cal-tool-row { display:flex;align-items:center;gap:10px;min-width:0; }
.cal-tool-label { flex:none;width:50px;color:var(--ink-4);font-size:10px;font-weight:650;letter-spacing:.13em;text-transform:uppercase; }
.cal-tool-label.country-label { width:auto;margin-left:10px; }
.cal-chips { display:flex;gap:5px;flex-wrap:wrap;min-width:0; }
.cal-filter { display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid var(--line);border-radius:7px;background:rgba(255,255,255,.02);color:var(--ink-3);font-size:11px;line-height:1;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease),transform .2s var(--ease),border-color .2s var(--ease); }
.cal-filter:hover { color:var(--ink);transform:translateY(-2px); }
.cal-filter.on { color:var(--ink);background:var(--glass-2);border-color:var(--line-2); }
.cal-filter i { width:6px;height:6px;border-radius:50%;background:var(--kind);box-shadow:0 0 9px var(--kind); }
.cal-tool-spacer { flex:1; }
.cal-segment { display:flex;gap:2px;padding:3px;background:rgba(255,255,255,.045);border:1px solid var(--line);border-radius:9px;white-space:nowrap; }
.cal-segment button { border:0;border-radius:6px;background:none;color:var(--ink-3);cursor:pointer;font-size:11px;padding:5px 10px; }
.cal-segment button.on { background:var(--glass-2);color:var(--ink);box-shadow:0 1px 6px rgba(0,0,0,.2); }
.cal-nav,.earn-nav { display:flex;align-items:end;justify-content:space-between;gap:15px;margin:28px 4px 13px; }
.cal-nav-title h2,.earn-nav h2 { margin:2px 0 0;font-size:26px;font-weight:630;letter-spacing:-.04em; }
.cal-nav-actions { display:flex;align-items:center;gap:5px; }
.cal-nav-actions>button { height:31px;min-width:31px;padding:0 9px;border:1px solid var(--line);border-radius:8px;background:var(--glass);color:var(--ink-2);cursor:pointer;font-size:11px; }
.cal-nav-actions>button:hover { color:var(--ink);background:var(--glass-2); }
.cal-prev { transform:rotate(180deg); }
.cal-nav-actions .cal-segment { margin-left:9px; }
.cal-layout { display:grid;grid-template-columns:minmax(0,1fr) minmax(310px,27%);gap:14px;align-items:start; }
.cal-board { overflow:hidden;border-radius:17px; }
.cal-weekdays,.cal-grid { display:grid;grid-template-columns:repeat(7,minmax(0,1fr)); }
.cal-weekdays { border-bottom:1px solid var(--line); }
.cal-weekdays span { padding:11px 10px;color:var(--ink-4);font-size:10px;font-weight:650;letter-spacing:.13em;text-align:right;text-transform:uppercase; }
.cal-day { position:relative;display:flex;flex-direction:column;gap:5px;min-width:0;height:105px;padding:8px 7px;text-align:left;background:transparent;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--ink-2);cursor:pointer;transition:background .2s var(--ease),box-shadow .2s var(--ease); }
.cal-grid.week .cal-day { height:240px; }
.cal-day:nth-child(7n) { border-right:0; }.cal-day:hover { z-index:2;background:var(--glass-2);box-shadow:inset 0 0 0 1px var(--line-2); }
.cal-day.busy { background:radial-gradient(circle at 80% 10%,rgba(106,218,203,.1),transparent 67%); }
.cal-day.selected { background:rgba(143,180,255,.085);box-shadow:inset 0 0 0 1px rgba(143,180,255,.25); }
.cal-day.today .cal-date { display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--accent);border-radius:50%;box-shadow:0 0 15px rgba(143,180,255,.28);color:var(--ink); }
.cal-day.weekend,.cal-day.past { opacity:.65; }.cal-day.outside { opacity:.3; }
.cal-date { align-self:flex-end;width:23px;height:23px;text-align:center;font:650 12px/23px var(--mono); }
.cal-day-chips { display:grid;gap:3px;min-width:0; }
.cal-mini { display:flex;align-items:center;gap:4px;min-width:0;padding:2px 4px;border-left:2px solid var(--kind);border-radius:3px;background:var(--glass-2);font-size:10px;line-height:1.15; }
.cal-mini>span { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.cal-mini small { flex:none;color:var(--ink-4);font-size:9px; }
.cal-mini i,.cal-impact { flex:none;width:5px;height:5px;border-radius:50%;background:var(--ink-4); }
.cal-mini i.imp-2,.cal-impact.imp-2 { background:var(--imp); }.cal-mini i.imp-3,.cal-impact.imp-3 { background:var(--down);box-shadow:0 0 8px var(--down); }
.cal-more { color:var(--ink-3);font:550 10px var(--mono);padding-left:4px; }
.cal-panel { max-height:735px;overflow:auto;border-radius:17px; }.cal-panel>header { position:sticky;top:0;z-index:3;padding:17px 18px 12px;background:var(--glass-solid);border-bottom:1px solid var(--line); }
.cal-panel h2 { margin:3px 0;font-size:18px;font-weight:630;letter-spacing:-.03em; }.cal-panel header p { margin:0;color:var(--ink-4);font-size:11px; }
.cal-panel-list { padding:5px 15px 15px; }.cal-event { display:grid;grid-template-columns:68px 7px minmax(0,1fr);align-items:start;gap:8px;padding:14px 0;border-bottom:1px solid var(--line); }
.cal-event:last-child { border-bottom:0; }.cal-event-time { color:var(--ink-3);font:550 10px var(--mono);padding-top:4px;white-space:nowrap; }.cal-event .cal-impact { margin-top:9px; }
.cal-event-title { display:flex;align-items:flex-start;gap:6px;line-height:1.3; }.cal-event-title strong { font-weight:610;font-size:12px; }.cal-event-title>a { margin-left:auto;color:var(--ink-4); }.cal-event-title>a:hover { color:var(--accent); }
.cal-event-details { display:flex;flex-wrap:wrap;gap:3px 9px;margin-top:6px;color:var(--ink-3);font-size:10px; }.cal-event-details b { color:var(--ink-4);font-weight:600; }.cal-event-main>p { color:var(--ink-3);font-size:11px;margin:7px 0 0; }
.cal-event-sources { display:flex;gap:4px;flex-wrap:wrap;margin-top:8px; }.cal-source,.cal-news { padding:2px 5px;border:1px solid var(--line);border-radius:4px;color:var(--ink-4);font-size:9px; }.cal-news { display:inline-flex;align-items:center;gap:3px;color:var(--cal-speech); }
.cal-event.is-cancelled { opacity:.58; }.cal-event.is-cancelled .cal-event-title strong { text-decoration:line-through;text-decoration-color:var(--down); }.cal-status { display:inline-block;margin-top:5px;padding:2px 5px;border:1px solid var(--line-2);border-radius:4px;color:var(--ink-3);font-size:9px;font-weight:650;text-transform:capitalize; }.cal-status.cancelled { color:var(--down);border-color:rgba(255,92,122,.4); }.cal-status.changed { color:var(--imp);border-color:rgba(255,193,90,.4); }.cal-status.tentative { color:var(--accent);border-color:rgba(143,180,255,.4); }
.cal-panel-empty { display:flex;flex-direction:column;align-items:center;gap:10px;padding:45px 22px;color:var(--ink-4);font-size:12px;text-align:center; }.cal-now { display:flex;align-items:center;gap:8px;color:var(--down);font:650 10px var(--mono);padding:7px 0; }.cal-now i { flex:1;height:1px;background:var(--down);box-shadow:0 0 8px var(--down); }
.cal-agenda { padding:8px 17px;max-height:735px;overflow:auto; }.cal-agenda section { padding:14px 0; }.cal-agenda h3 { font-size:14px;margin:0;border-bottom:1px solid var(--line);padding-bottom:8px; }.cal-blank { padding:55px 15px;text-align:center;color:var(--ink-3); }
.cal-hover { position:fixed;z-index:60;width:275px;max-height:calc(100vh - 16px);overflow:auto;display:none;padding:12px 14px;pointer-events:none;background:var(--glass-solid);border:1px solid var(--line-2); }.cal-hover.show { display:grid;gap:6px; }.cal-hover strong { font-size:12px;margin-bottom:3px; }.cal-hover span { display:flex;align-items:center;gap:6px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--ink-2);font-size:10px; }.cal-hover small { color:var(--ink-4); }
.cal-health { display:grid;gap:10px;margin:28px 4px 0;padding:18px 0;border-top:1px solid var(--line);color:var(--ink-4);font-size:11px; }.cal-health p { margin:4px 0 0; }.cal-health-list { display:flex;flex-wrap:wrap;gap:6px; }.cal-health-chip { display:inline-flex;align-items:center;gap:5px;padding:4px 7px;border:1px solid var(--line);border-radius:6px;background:var(--glass);color:var(--ink-3);font-size:10px; }.cal-health-chip i { width:5px;height:5px;border-radius:50%;background:var(--ink-4); }.cal-health-chip.ok i { background:var(--up); }.cal-health-chip.warn i { background:var(--down); }.cal-health-chip small { color:var(--ink-4); }
.cal-health-head { display:flex;align-items:center;justify-content:space-between;gap:12px; }.cal-health-chip.disabled { opacity:.55; }.cal-health-chip input { width:11px;height:11px;accent-color:var(--accent);margin:0 2px 0 0; }.cal-switch { display:inline-flex;align-items:center;gap:7px;color:var(--ink-2);font-size:11px;white-space:nowrap;cursor:pointer; }.cal-switch input { accent-color:var(--accent); }
.cal-health-chip:has(input:disabled) { opacity:.45;cursor:not-allowed; }.cal-health-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:6px; }.cal-health-grid>div { display:grid;gap:2px;padding:8px;border:1px solid var(--line);border-radius:7px;background:var(--glass);font-size:9px; }.cal-health-grid strong { color:var(--ink-2);font-size:10px; }.cal-health-grid em { color:var(--down);font-style:normal;overflow-wrap:anywhere; }.cal-health a { color:var(--accent);text-decoration:underline;text-underline-offset:2px; }
.earn-provider { display:flex;align-items:center;gap:14px;margin:-8px 4px 22px;color:var(--ink-3);font-size:11px; }.earn-provider select { margin-left:5px;padding:5px 8px;border:1px solid var(--line);border-radius:7px;background:var(--glass-solid);color:var(--ink);font-size:11px; }.earn-provider>span { color:var(--ink-4); }
.earn-provider.glass { width:max-content;max-width:100%;padding:8px 11px;border-radius:11px; }.earn-provider label { display:inline-flex;align-items:center;gap:5px; }.earn-provider .cal-switch { padding-right:13px;border-right:1px solid var(--line); }.earn-provider .cal-switch input { width:14px;height:14px; }.earn-provider-status { padding:4px 7px;border-radius:6px;background:var(--glass-2); }
.cal-loading { max-width:580px;margin:12vh auto;padding:55px;text-align:center; }.cal-loading .ic { margin:auto;color:var(--accent); }.cal-loading h2 { margin:15px 0 5px;font-size:24px; }.cal-loading p { color:var(--ink-3); }.cal-loading-bars { display:flex;justify-content:center;gap:5px;margin-top:22px; }.cal-loading-bars i { width:25px;height:3px;border-radius:3px;background:var(--accent);animation:calPulse 1s ease-in-out infinite alternate; }.cal-loading-bars i:nth-child(2){animation-delay:.2s}.cal-loading-bars i:nth-child(3){animation-delay:.4s}@keyframes calPulse{to{opacity:.2;transform:scaleX(.7)}}

.earn-setup { display:grid;grid-template-columns:50px minmax(0,1fr) 290px;gap:18px;align-items:center;padding:22px;margin-bottom:27px;border-top:2px solid #d4a3ff; }.earn-setup-icon { display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:rgba(212,163,255,.13);color:#d4a3ff; }.earn-setup h2 { margin:4px 0 6px;font-size:21px;letter-spacing:-.035em; }.earn-setup p { margin:0 0 8px;max-width:560px;color:var(--ink-3);font-size:12px; }.earn-setup a { display:inline-flex;align-items:center;gap:4px;color:#d4a3ff;font-size:11px; }.earn-setup form { display:grid;gap:6px; }.earn-setup label { color:var(--ink-3);font-size:10px;text-transform:uppercase;letter-spacing:.1em; }.earn-setup input { width:100%;padding:9px 11px;border:1px solid var(--line-2);border-radius:8px;background:var(--glass-solid);outline:none; }.earn-setup input:focus { border-color:#d4a3ff; }.earn-setup form button { display:flex;align-items:center;justify-content:center;gap:8px;padding:9px;border:0;border-radius:8px;background:#d4a3ff;color:#171020;font-weight:650;cursor:pointer; }.earn-key-status { min-height:14px;color:var(--ink-3);font-size:10px; }
.earn-biggest { margin-bottom:28px; }.earn-hero-row { grid-template-columns:repeat(4,minmax(0,1fr)); }.earn-hero { --kind:#d4a3ff;min-height:142px;padding:16px;border-top:2px solid #d4a3ff;transition:transform .2s var(--ease); }.earn-hero h3 { margin:12px 0 1px;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }.earn-hero p { margin:0 0 12px;color:var(--ink-3);font-size:11px; }.earn-hero b { color:#d4a3ff; }
.earn-ticker { display:inline-flex;padding:5px 8px;border:1px solid rgba(212,163,255,.24);border-radius:6px;background:rgba(212,163,255,.12);color:#e4c8ff;font:700 11px/1 var(--mono);letter-spacing:.04em; }.earn-nav { margin-top:28px; }.earn-week { display:grid;grid-template-columns:repeat(var(--earn-cols),minmax(0,1fr));gap:10px;align-items:start; }.earn-day { min-width:0;min-height:300px;overflow:hidden;border-radius:15px; }.earn-day.today { box-shadow:inset 0 0 0 1px rgba(212,163,255,.36),0 0 28px -19px #d4a3ff; }.earn-day>header { display:flex;align-items:baseline;gap:7px;padding:12px 13px;border-bottom:1px solid var(--line);color:var(--ink-3);font-size:11px; }.earn-day>header b { color:var(--ink);font:650 19px var(--mono); }.earn-day>header small { margin-left:auto;color:var(--ink-4);font-size:9px;white-space:nowrap; }.earn-day>div { padding:8px; }.earn-no-reports { padding:24px 8px;text-align:center;color:var(--ink-4);font-size:11px; }
.earn-card { margin-bottom:8px;padding:11px;border:1px solid var(--line);border-radius:9px;background:var(--glass-2); }.earn-card.watch { border-color:rgba(255,193,90,.35);box-shadow:inset 2px 0 0 var(--imp); }.earn-card-head { display:flex;align-items:center;justify-content:space-between;gap:5px; }.earn-time { display:inline-flex;align-items:center;gap:3px;color:var(--ink-4);font-size:9px;white-space:nowrap; }.earn-time.bmo { color:var(--imp); }.earn-time.amc { color:#cba4ff; }.earn-card h3 { display:flex;align-items:center;gap:4px;margin:8px 0 12px;font-size:11px;font-weight:620;line-height:1.2; }.earn-card h3 .ic { color:var(--imp);fill:rgba(255,193,90,.3); }.earn-metrics { display:grid;grid-template-columns:1fr 1fr;gap:6px; }.earn-metrics div { display:grid;gap:2px;min-width:0; }.earn-metrics small { color:var(--ink-4);font-size:9px; }.earn-metrics strong { font:600 11px var(--mono);overflow:hidden;text-overflow:ellipsis; }.earn-card-foot { display:flex;justify-content:space-between;gap:5px;margin-top:11px;padding-top:7px;border-top:1px solid var(--line);color:var(--ink-4);font-size:9px; }.earn-actual { display:flex;justify-content:space-between;gap:4px;margin-top:9px;font-size:10px; }.earn-actual.beat { color:var(--up); }.earn-actual.miss { color:var(--down); }
@media (max-width:1250px) { .cal-next-row { grid-template-columns:repeat(3,minmax(0,1fr)); }.cal-layout { grid-template-columns:minmax(0,1fr) 310px; }.cal-mini small { display:none; }.earn-week { overflow-x:auto;grid-template-columns:repeat(var(--earn-cols),minmax(175px,1fr)); } }
@media (max-width:900px) { .cal-layout { grid-template-columns:1fr; }.cal-panel { max-height:none; }.cal-next-row { grid-template-columns:repeat(2,minmax(0,1fr)); }.earn-setup { grid-template-columns:40px minmax(0,1fr); }.earn-setup form { grid-column:1/-1; }.earn-hero-row { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:650px) { .cal-view,.earn-view { padding:15px 10px 45px; }.cal-header { align-items:start; }.cal-updated { display:none; }.cal-next-row { grid-template-columns:1fr 1fr; }.cal-next-card { min-height:125px;padding:10px; }.cal-next-detail { display:none; }.cal-tool-row { flex-wrap:wrap; }.cal-tool-label { width:auto; }.cal-nav,.earn-nav { align-items:start;flex-direction:column; }.cal-day { height:81px;padding:4px; }.cal-mini { font-size:9px; }.cal-mini:nth-child(n+3) { display:none; }.cal-weekdays span { padding:7px 3px;text-align:center; }.cal-date { align-self:center; }.earn-week { display:flex;overflow-x:auto; }.earn-day { min-width:220px; }.earn-hero-row { gap:7px; } }
@media (prefers-reduced-motion:reduce) { .cal-next-card,.earn-hero,.cal-day,.cal-filter { transition:none; }.cal-loading-bars i { animation:none; } }
.cal-view,.earn-view { animation:none; }
.cal-view .cal-health,.earn-view .cal-health { width:auto;max-width:100%; }
/* Keep the calendar itself in the first viewport on desktop. */
@media (min-width:901px) {
  .cal-view { padding-top:8px; }
  .cal-view .cal-header { margin:0 4px 12px; }
  .cal-view .cal-header h1 { font-size:37px;line-height:1; }
  .cal-view .cal-header p { margin-top:4px;font-size:12px; }
  .cal-view .cal-next { margin-bottom:11px; }
  .cal-view .cal-section-label { margin-bottom:6px; }
  .cal-view .cal-section-label h2 { font-size:16px; }
  .cal-view .cal-next-card { min-height:108px;padding:9px 12px; }
  .cal-view .cal-next-card h3 { min-height:29px;margin:6px 0 3px;font-size:11px; }
  .cal-view .cal-next-detail { display:block;margin-top:5px;padding-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;color:var(--ink-2); }
  .cal-view .cal-next-detail b { color:var(--ink-2);margin-right:3px; }
  .cal-view .cal-next-detail span+span::before { content:"·";color:var(--ink-4);margin:0 8px 0 3px; }
  .cal-view .cal-next-bottom { font-size:10px; }
  .cal-view .cal-countdown { font-size:12px; }
  .cal-view .cal-tools { gap:5px;padding:7px 11px; }
  .cal-view .cal-filter { padding:4px 7px;font-size:10px; }
  .cal-view .cal-segment button { padding:3px 7px; }
  .cal-view .cal-nav { margin:12px 4px 7px; }
  .cal-view .cal-nav-title h2 { font-size:22px; }
}

/* Public-site additions are scoped so the local admin layout stays unchanged. */
html[data-public="true"] [hidden] { display:none !important; }
html[data-public="true"] .snapshot-note { width:min(1500px,calc(100% - 32px)); margin:16px auto 0; }
html[data-public="true"] .updated-chip { cursor:pointer; font-size:11px; white-space:nowrap; }
html[data-public="true"] iframe { color-scheme:dark; }
html[data-public="true"] .public-outlets { display:grid; gap:15px; }
html[data-public="true"] .public-outlets .switch { white-space:normal; }
html[data-public="true"] .modal .pane a { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
html[data-public="true"] .tabs { min-width:0; max-width:100%; }
@media (min-width:1101px) {
  html[data-public="true"] .topbar { grid-template-columns:auto minmax(0,1fr) auto; }
  html[data-public="true"] .tabs { justify-self:center; }
  html[data-public="true"] .tab .lbl { display:inline; }
  html[data-public="true"] .tab { padding:0 9px; font-size:12px; }
}
@media (max-width:760px) {
  html[data-public="true"] .topbar { width:calc(100% - 16px); padding:10px; gap:8px; top:8px; }
  html[data-public="true"] .brand { gap:7px; }
  html[data-public="true"] .wordmark b { font-size:12px; letter-spacing:.12em; }
  html[data-public="true"] .status { gap:4px; }
  html[data-public="true"] .updated-chip { padding:0 7px; font-size:10px; }
  html[data-public="true"] .tabs { justify-self:stretch; overflow-x:auto; scrollbar-width:thin; }
  html[data-public="true"] .tab { flex:none; padding:0 9px; }
  html[data-public="true"] .tab .lbl { display:inline; font-size:11px; }
  html[data-public="true"] .tab .count { display:none; }
  html[data-public="true"] .grid { grid-template-columns:minmax(0,1fr); }
  html[data-public="true"] .toolbar { flex-wrap:wrap; }
  html[data-public="true"] #assetSeg { max-width:100%; flex-wrap:wrap; }
  html[data-public="true"] .act-mid, html[data-public="true"] .hero-copy { min-width:0; }
  html[data-public="true"] .drawer-body { padding:16px; }
  html[data-public="true"] .drawer .tag.flag { max-width:100%; height:auto; min-height:22px; white-space:normal; overflow-wrap:anywhere; }
  html[data-public="true"] .drawer .tag.flag .ic { flex-shrink:0; }
  html[data-public="true"] .art { grid-template-columns:auto minmax(0,1fr); gap:9px; }
  html[data-public="true"] .art > .btn { grid-column:2; justify-self:start; white-space:normal; }
  html[data-public="true"] .modal-scrim { padding:8px; }
  html[data-public="true"] .modal { height:calc(100dvh - 16px); border-radius:18px; }
  html[data-public="true"] .modal nav { padding:8px; gap:1px; flex-wrap:wrap; overflow:visible; }
  html[data-public="true"] .modal nav button { padding:8px; font-size:11px; gap:4px; }
  html[data-public="true"] .modal nav > span { display:none; }
  html[data-public="true"] .modal .pane { padding:18px; }
  html[data-public="true"] .modal .themes { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html[data-public="true"] .brf-doc { padding:20px 18px 40px; }
  html[data-public="true"] .brf-bar { flex-wrap:wrap; }
}