:root{
  --bg:#0A0E14;--panel:#0F172A;--border:#1E293B;--text:#F8FAFC;--muted:#94A3B8;
  --dim:#76879E;--faint:#475569;--blue:#38BDF8;--green:#34D399;--amber:#FBBF24;--red:#F87171;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{background:var(--bg);color:var(--text);line-height:1.5;font-feature-settings:"ss01","cv11";
  font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,sans-serif;padding:5rem 1.5rem 4rem}
nav.wordmark{position:fixed;top:1.5rem;left:1.5rem;z-index:10}
nav.top-nav{position:fixed;top:1.5rem;right:1.5rem;z-index:10;display:flex;gap:1.75rem}
nav a{color:var(--muted);text-decoration:none;font-size:.875rem;letter-spacing:.05em;text-transform:uppercase;
  font-weight:500;padding:.5rem .25rem;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
nav a:hover,nav a:focus-visible{color:var(--text);border-bottom-color:var(--blue)}
nav a[aria-current="page"]{color:var(--text);border-bottom-color:var(--blue)}
main{max-width:48rem;margin:0 auto}
.back{display:inline-block;color:var(--dim);font-size:.78rem;text-decoration:none;margin-bottom:1.25rem;letter-spacing:.03em}
.back:hover{color:var(--blue)}
.crumbs{font-size:.78rem;color:var(--dim);letter-spacing:.03em;margin-bottom:.35rem}
.crumbs a{color:var(--dim);text-decoration:none}
.crumbs a:hover{color:var(--blue)}
.crumbs .sep{margin:0 .4rem;color:var(--faint)}
.crumbs .here{color:var(--muted)}
.eyebrow{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em}
.read-hero{font-size:clamp(1.5rem,3.5vw,2rem);font-weight:600;letter-spacing:-.02em;line-height:1.2;margin:.5rem 0 .75rem;max-width:36rem}
.badgerow{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.badge{font-size:.66rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;padding:3px 10px;border-radius:999px}
.badge.ok{background:#16261f;color:var(--green)} .badge.watch{background:#2c2517;color:var(--amber)}
.badge.elevated{background:#3a2a17;color:#FB923C} .badge.alert{background:#3b1f24;color:var(--red)}
.badge.unknown{background:#1d2433;color:var(--dim)}
.badge.neutral{background:#13233a;color:var(--blue)}
.updated{font-size:.72rem;color:var(--dim)}
.scoreboard{display:grid;grid-template-columns:repeat(4,1fr);gap:.625rem;margin:1.5rem 0 .5rem}
@media(max-width:620px){.scoreboard{grid-template-columns:1fr 1fr}}
.signal{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:.75rem}
.signal .k{font-size:.62rem;text-transform:uppercase;letter-spacing:.07em;color:var(--dim)}
.signal .v{font-size:1.15rem;font-weight:600;margin:.25rem 0 .125rem}
.signal .s{font-size:.66rem;font-weight:600}
.s.ok{color:var(--green)} .s.watch{color:var(--amber)} .s.elevated{color:#FB923C} .s.alert{color:var(--red)} .s.unknown{color:var(--dim)}
.s.up{color:var(--green)} .s.down{color:var(--red)} .s.flat{color:var(--amber)} .s.info{color:var(--blue)}
.ind{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:1.375rem;margin-top:1.125rem}
.ind-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem}
.ind-title{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:600}
.ind-num{text-align:right;flex:none}
.ind-val{font-size:1.5rem;font-weight:600;letter-spacing:-.01em}
.ind-asof{font-size:.64rem;color:var(--dim);margin-top:.1rem;white-space:nowrap}
.ranges{display:flex;gap:.375rem;margin:.625rem 0 .375rem;align-items:center}
.ranges button{font:inherit;font-size:.68rem;color:var(--dim);background:transparent;border:1px solid var(--border);
  border-radius:6px;padding:3px 9px;cursor:pointer;transition:.15s}
.ranges button:hover{color:var(--text)}
.ranges button.active{color:var(--bg);background:var(--muted);border-color:var(--muted);font-weight:600}
.chart-box{position:relative;height:200px;margin-top:.25rem}
.context{margin-top:1rem;display:grid;gap:.75rem}
.ctx-block .lbl{font-size:.64rem;text-transform:uppercase;letter-spacing:.1em;color:var(--dim);margin-bottom:.1875rem}
.ctx-block.read .lbl{color:var(--amber)}
.ctx-block p{color:var(--muted);font-size:.9rem;line-height:1.6}
.foot{margin:1.875rem 0 .375rem;padding-top:1.125rem;border-top:1px solid var(--border);font-size:.74rem;color:var(--dim);line-height:1.6}
.foot a{color:var(--muted)}
.status-msg{text-align:center;color:var(--dim);font-size:.9rem;padding:4rem 0}
.status-msg.error{color:var(--red)}
/* Small screens: the fixed corner header can't hold the wordmark plus four
   nav items — let both flow, centered, above the content (mirrors home). */
@media(max-width:640px){
  body{padding:1.25rem 1rem 3rem}
  nav.wordmark{position:static;text-align:center;margin-bottom:.25rem}
  nav.top-nav{position:static;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem}
}

/* Hub pages (dashboards index + category hubs) — shared with hub.js */
h1{font-size:clamp(2rem,4.5vw,2.75rem);font-weight:600;letter-spacing:-.02em;line-height:1.15;margin-bottom:.75rem}
h1 .badge,.cat-head .badge{vertical-align:middle;flex:none}
/* category prefix on cross-category cards (Today's Brief) */
.hub-cat{color:var(--dim);font-weight:600}
p.lede{color:var(--muted);font-size:1.0625rem;max-width:40rem;margin-bottom:2.25rem}
p.lede strong{color:var(--text);font-weight:600}
.hub-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:640px){.hub-grid{grid-template-columns:1fr}}
.hub-card{display:block;text-decoration:none;color:inherit;background:var(--panel);border:1px solid var(--border);
  border-radius:14px;padding:1.25rem;transition:border-color .2s ease,transform .2s ease}
.hub-card:hover,.hub-card:focus-visible{border-color:var(--blue);transform:translateY(-2px)}
.hub-card:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.hub-eyebrow{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;display:flex;align-items:center;gap:.5rem;margin-bottom:.6rem}
.hub-read{color:var(--text);font-size:1rem;font-weight:600;line-height:1.35;margin-bottom:.85rem}
.spark{width:100%;height:34px;display:block;margin-bottom:.85rem}
.hub-stats{display:flex;gap:1.1rem;font-size:.72rem;color:var(--muted);flex-wrap:wrap}
.hub-stats b{color:var(--text);font-weight:600}
/* change since the previous observation; neutral color — up isn't always good */
.delta{font-style:normal;font-size:.66rem;color:var(--dim);white-space:nowrap}
.delta.up::before{content:"▲"}
.delta.down::before{content:"▼"}
.hub-cta{margin-top:.85rem;font-size:.74rem;color:var(--blue);letter-spacing:.03em}
.hub-fresh{font-size:.68rem;color:var(--dim);margin-top:.5rem}
.hub-fresh.stale{color:var(--amber)}
@media(prefers-reduced-motion:reduce){.hub-card{transition:none}.hub-card:hover{transform:none}}

/* Banking tier & ranking tables (category #2). Scoped so the bare status
   classes used elsewhere don't bleed background colors into table cells. */
.tbl-sec{margin-top:1.75rem;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl-sec .lens-table{min-width:30rem}
.tbl-lab{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--blue);font-weight:600}
.tbl-sub{font-size:.8rem;color:var(--muted);margin:.25rem 0 .65rem}
.lens-table{width:100%;border-collapse:collapse;font-size:.85rem}
.lens-table th{text-align:left;color:var(--dim);font-size:.65rem;text-transform:uppercase;letter-spacing:.07em;font-weight:600;padding:.5rem .55rem;border-bottom:1px solid var(--border)}
.lens-table td{padding:.6rem .55rem;border-bottom:1px solid #131c2e;color:#E2E8F0;background:transparent}
.lens-table td.num,.lens-table th.num{text-align:right;font-variant-numeric:tabular-nums}
.lens-table td.ok{color:var(--green)}
.lens-table td.watch{color:var(--amber)}
.lens-table td.elevated{color:#FB923C}
.lens-table td.alert{color:var(--red)}
.lens-table .bankname{color:var(--text);font-weight:500}
.lens-table .bankloc{color:var(--dim);font-size:.72rem}
.tpill{display:inline-block;font-size:.6rem;padding:.1rem .5rem;border-radius:999px;border:1px solid currentColor;text-transform:uppercase;letter-spacing:.05em;background:transparent}
.tpill.ok{color:var(--green)}
.tpill.watch{color:var(--amber)}
.tpill.elevated{color:#FB923C}
.tpill.alert{color:var(--red)}
.tpill.unknown{color:var(--dim)}

/* ---- Today's Brief ---- */
.brief-sec-label{font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;
  color:var(--dim);margin:.8rem 0 .45rem}
.brief-trans{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;text-decoration:none;
  color:inherit;padding:.5rem .6rem;border-radius:9px;transition:background-color .15s ease}
.brief-trans:hover{background:rgba(255,255,255,.03)}
.brief-trans-title{font-weight:600;font-size:.86rem}
.brief-cat{font-size:.62rem;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;font-weight:600;flex:none}
.brief-arrow{display:inline-flex;align-items:center;gap:.4rem;color:var(--dim);font-size:.8rem}
.brief-trans-read{color:var(--muted);font-size:.8rem;flex:1 1 14rem;min-width:0}
@media(max-width:640px){
  .brief-trans{gap:.4rem}
  .brief-trans-read{flex-basis:100%}
}

/* --- The State of Things (panel, page cards, steady chips) --- */
.state-panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:1rem 1.15rem;margin-bottom:1.5rem}
.state-verdict{display:flex;align-items:baseline;gap:.7rem;flex-wrap:wrap}
.state-sentence{font-size:1.02rem;font-weight:600;line-height:1.45}
.state-link{color:var(--blue);text-decoration:none;font-size:.85rem;white-space:nowrap}
.state-link:hover{text-decoration:underline}
.state-lens{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;padding:.35rem 0;color:var(--text);text-decoration:none}
.state-lens:hover .state-lens-read{text-decoration:underline}
.state-lens-title{color:var(--muted);font-size:.85rem;flex:none}
.state-lens-read{font-size:.95rem}
.state-steady{display:inline-flex;align-items:center;gap:.5rem;background:var(--panel);border:1px solid var(--border);border-radius:999px;padding:.4rem .9rem;margin:0 .5rem .5rem 0;color:var(--text);text-decoration:none;font-size:.9rem}
.state-steady:hover{border-color:var(--blue)}

/* --- Brief: compact pressure rows (replace the old per-status card walls) --- */
.att-row{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;padding:.42rem .5rem;border-radius:9px;color:var(--text);text-decoration:none}
.att-row:hover{background:rgba(255,255,255,.03)}
.att-row .brief-cat{flex:none;width:4.6rem}
.att-row .att-title{font-weight:600;font-size:.88rem;flex:none}
.att-row .att-read{color:var(--muted);font-size:.82rem;flex:1 1 16rem;min-width:0}
.att-group{margin-bottom:.9rem}
@media(max-width:640px){.att-row .att-read{flex-basis:100%}}

/* ---- Predictions: next-print blocks (predict.js) ---- */
.predict{margin-top:.9rem;padding:.8rem 1rem;border:1px solid var(--border);border-radius:10px;background:var(--panel)}
.predict .pred-head{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.predict .pred-due{text-transform:none;letter-spacing:0;margin-left:.4rem}
.predict .pred-line{font-size:.95rem}
.predict .pred-range{color:var(--muted);font-size:.85rem}
.predict .pred-why{color:var(--muted);font-size:.85rem;margin-top:.3rem}
.predict .pred-last{margin-top:.55rem;font-size:.85rem;color:var(--muted);border-top:1px dashed var(--border);padding-top:.55rem}
.predict .pred-last a{color:var(--blue);text-decoration:none}
.predict .pred-last a:hover{text-decoration:underline}
.pred-mark.hit{color:#34D399;font-weight:700}
.pred-mark.miss{color:#F87171;font-weight:700}
.pred-rev{font-size:.78rem}

/* ---- Predictions: Track Record page ---- */
.track{max-width:880px;margin:0 auto;padding:1.5rem 1rem 4rem}
.track-sub{color:var(--muted)}
.track-stats{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.25rem 0}
.track-stat{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1.1rem}
.track-num{font-size:2.2rem;font-weight:700}
.track-lab{color:var(--text);margin-top:.25rem}
.track-note{color:var(--muted);font-size:.82rem;margin-top:.5rem}
.track-row{display:flex;gap:.6rem;align-items:baseline;padding:.5rem .25rem;border-bottom:1px solid var(--border);text-decoration:none;color:var(--text)}
.track-row:hover .track-ind{color:var(--blue)}
.track-ind{font-weight:600}
.track-said{color:var(--muted);font-size:.85rem}
@media (max-width:640px){.track-stats{grid-template-columns:1fr}}

/* --- Slim hub: category cards (Phase C) --- */
.cat-card{display:block;text-decoration:none;color:inherit;background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:1.25rem;transition:border-color .2s ease,transform .2s ease}
.cat-card:hover,.cat-card:focus-visible{border-color:var(--blue);transform:translateY(-2px)}
.cat-card .cat-title{display:flex;align-items:center;gap:.6rem;font-weight:600;font-size:1.08rem;margin-bottom:.35rem}
.cat-card .cat-desc{color:var(--muted);font-size:.85rem;line-height:1.5;margin-bottom:.8rem}
.lens-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.lens-chip{display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;color:var(--muted);background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:999px;padding:.22rem .65rem}
.lens-chip .chip-dot{width:.5rem;height:.5rem;border-radius:50%;flex:none}
.chip-dot.ok{background:var(--green)}.chip-dot.watch{background:var(--amber)}.chip-dot.elevated{background:#FB923C}.chip-dot.alert{background:var(--red)}.chip-dot.neutral{background:var(--blue)}.chip-dot.unknown{background:var(--dim)}

/* ---- Brief archive chrome (distribution phase) ---- */
.archive-banner { background: var(--panel); border: 1px solid var(--border); border-radius: 10px;
  padding: .7rem .9rem; margin: 1rem 0; font-size: .9rem; color: var(--muted); }
.archive-banner a { color: var(--blue); }
.archive-nav { font-size: .82rem; color: var(--faint); margin: .6rem 0 0; }
.archive-nav a { color: var(--muted); text-decoration: none; }
.archive-nav a:hover { color: var(--text); text-decoration: underline; }

/* ---- Email subscribe (distribution phase) ---- */
.subscribe-band { margin-top: 2.25rem; }
.subscribe-form { display: flex; gap: .5rem; max-width: 26rem; }
.subscribe-form input { flex: 1; background: var(--panel); border: 1px solid var(--border);
  border-radius: 8px; color: var(--text); padding: .6rem .8rem; font-size: .9rem; }
.subscribe-form button { background: var(--blue); color: var(--bg); border: 0; border-radius: 8px;
  padding: .6rem 1.1rem; font-size: .9rem; font-weight: 600; cursor: pointer; }
.subscribe-form button:hover { filter: brightness(1.1); }
