/* Visual contract from the approved September 5 prototype. Keep data state in dashboard.js. */
.driver-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.story-card { display:block; padding:22px; border:1px solid var(--border); background:var(--panel); text-decoration:none; border-radius:3px; }
.story-card:hover { border-color:var(--muted); }
.story-top { display:flex; justify-content:space-between; align-items:center; color:var(--muted); font-size:12px; }
.story-card h3 { font-family:Georgia,serif; font-size:23px; line-height:1.2; margin:22px 0 12px; }
.story-card p { font-size:13px; line-height:1.65; color:var(--muted); }
.story-reading { font-size:25px; color:var(--text); }
.story-reading small { font-size:12px; color:var(--muted); }
.countercase { display:grid; grid-template-columns:200px 1fr; gap:25px; border-top:1px solid var(--border); margin-top:24px; padding:24px 0 0; font-size:13px; line-height:1.7; }
.countercase>strong { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:1px; }
.countercase p:first-child { margin-top:0; }
.channel-row { display:grid; grid-template-columns:1.3fr 1fr 1fr .7fr; align-items:center; gap:25px; padding:24px 0; border-bottom:1px solid var(--border); text-decoration:none; }
.channel-row>strong { font-family:Georgia,serif; font-weight:400; font-size:22px; }
.channel-head { padding:0 0 12px; font-size:10px; text-transform:uppercase; letter-spacing:1px; color:var(--muted); }
.channel-band>small { display:none; }
.channel-band .risk-rail { margin:8px 0 0; }
.channel-band .rail-step { font-size:0; padding:0; }
.channel-detail-bands { display:grid; grid-template-columns:1fr 1fr; gap:30px; margin:30px 0; }
.channel-detail-bands>article { padding:20px; background:var(--panel2); }
.watch-section { display:grid; grid-template-columns:1fr 1.2fr; gap:60px; }
.watch-section h2 { font-family:Georgia,serif; font-size:36px; font-weight:400; }
.watch-section p { color:var(--muted); font-size:13px; line-height:1.7; }
#watch-conditions article { display:flex; gap:20px; margin-bottom:24px; }
#watch-conditions h3 { margin:0; font-size:16px; }
.condition-symbol { color:var(--coral); font-size:27px; }
.threshold-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }
.threshold-grid span { display:grid; gap:8px; background:var(--panel2); padding:15px; }
.threshold-grid small { color:var(--muted); }
.review-entry { padding:18px 0; border-top:1px solid var(--border); }
.review-entry summary { cursor:pointer; }
.review-entry article { padding:15px 0; }
.review-entry small { color:var(--muted); }
@media(max-width:900px) { .driver-grid { gap:10px; }.story-card { padding:16px; }.channel-row { gap:15px; }.channel-row>strong { font-size:18px; } }
@media(max-width:700px) {
  .driver-grid,.countercase,.watch-section,.channel-detail-bands { grid-template-columns:1fr; gap:20px; }
  .story-card h3 { margin-top:14px; }.countercase { gap:8px; }
  .channel-head { display:none; }.channel-row { grid-template-columns:1fr 1fr; gap:16px; }
  .channel-row>strong { grid-column:1/-1; font-size:22px; }.channel-row>span:last-child { grid-column:1/-1; }
  .channel-band>small { display:block; color:var(--muted); font-size:10px; margin-bottom:10px; }
  .watch-section h2 { font-size:30px; }.threshold-grid { grid-template-columns:1fr 1fr; }
}
:root {
  --bg:#111416; --panel:#191d20; --panel2:#202529; --border:#363c40;
  --ink:#edece6; --muted:#b1b7b9; --dim:#939b9f; --white:#fff9ed;
  --low:#a9c9b6; --watch:#dbd1b9; --elevated:#e8bb72; --high:#f1847e; --critical:#ec6565;
  --serif:Georgia,'Times New Roman',serif; --sans:'Segoe UI',Arial,sans-serif;
  --mono:Consolas,'Courier New',monospace;
}
html { background:#0b0d0f; }
body { width:calc(100% - 48px); max-width:1440px; margin:0 auto; font-size:16px; }
.site-header { max-width:none; min-height:98px; padding:0 48px; gap:32px; justify-content:flex-start; }
.brand { font:400 27px/1 var(--serif); letter-spacing:-1px; }
.brand:hover { text-decoration:none; }
.brand-mark { display:flex; width:27px; height:23px; gap:3px; align-items:flex-start; margin-right:13px; transform:skew(-16deg); background:none; border-radius:0; }
.brand-mark i { display:block; background:var(--high); width:5px; height:9px; }
.brand-mark i:nth-child(2) { height:16px; }
.brand-mark i:nth-child(3) { height:23px; }
.wordmark-period { color:var(--high); }
.site-header nav { margin-left:36px; gap:28px; font-size:14px; align-items:center; align-self:stretch; }
.site-header nav a { display:flex; align-items:center; }
.site-header nav a[aria-current=page] { text-decoration:underline; text-underline-offset:6px; }
.header-meta { display:flex; align-items:center; gap:8px; margin-left:auto; font-size:12px; color:var(--muted); white-space:nowrap; }
.status-dot { display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--low); flex-shrink:0; }
main { max-width:none; padding:0 48px 64px; }
.shadow-banner { margin:0; padding:13px 0 0; gap:13px; font-size:10px; letter-spacing:.5px; }
.hero { padding:30px 0 28px; }
.hero-top { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:16px; }
.eyebrow { color:var(--muted); font-size:11px; font-weight:500; letter-spacing:1.8px; }
.assessment-meta { border:0; margin:0; padding:0; font:11px var(--mono); color:var(--muted); }
h1 { font:400 48px/1.15 var(--serif); letter-spacing:-1.6px; color:var(--white); margin:0; }
h2 { font:400 29px/1.25 var(--serif); letter-spacing:-.5px; }
.deck { max-width:850px; font-size:16px; line-height:1.65; margin:14px 0 0; }
.main-cards { gap:18px; margin:0; }
.risk-card { padding:25px 28px 20px; border-radius:3px; }
.card-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.card-heading h2 { font-size:20px; letter-spacing:-.4px; margin:0; }
.card-heading>span { font:10px var(--mono); color:var(--dim); }
.risk-top { grid-template-columns:minmax(0,1.2fr) minmax(135px,.85fr); gap:8px; }
.risk-top>div { min-width:0; }
.horizon-label { font-size:11px; letter-spacing:.7px; }
.verdict-main { display:flex; align-items:center; gap:16px; }
.verdict { font:400 46px/1.2 var(--serif); letter-spacing:-1.2px; margin:0; }
.verdict-meta { display:grid; gap:4px; flex-shrink:0; }
.direction { font-size:12px; }
.direction.rising { color:var(--high); }
.direction.falling { color:var(--low); }
.risk-position { font-size:11px; color:var(--muted); white-space:nowrap; }
.card-gauge { width:100%; max-width:220px; height:124px; justify-self:end; }
.card-gauge .gauge-position { fill:var(--ink); font:32px var(--serif); }
.card-gauge .gauge-total { fill:var(--muted); font:13px var(--sans); }
.card-gauge .gauge-caption { font:12px var(--mono); letter-spacing:.4px; }
.card-gauge .gauge-end { font:13px var(--sans); }
.risk-rail { gap:5px; margin:10px 0 12px; }
.rail-step { font-size:11px; line-height:1.5; padding-top:5px; border-top-width:4px; }
.rail-step.selected:before { width:0; height:0; left:calc(50% - 3px); top:-10px; border:0; border-left:3px solid transparent; border-right:3px solid transparent; border-top:4px solid var(--white); background:none; border-radius:0; }
.risk-card p { font-size:14px; line-height:1.6; margin:9px 0 0; min-height:45px; }
.buildup { margin-top:19px; padding-top:15px; gap:14px; }
.buildup>span { font-size:12px; letter-spacing:0; }
.buildup small { display:block; font-size:11px; color:var(--dim); }
.buildup-result { display:flex; align-items:center; gap:13px; }
.buildup-result strong { font-size:17px; }
.buildup-result span { font-size:11px; letter-spacing:0; color:var(--muted); }
.buildup-result span:first-of-type { font-family:var(--mono); }
.mini-rail { margin:10px 0 0; }
.mini-rail .rail-step { font-size:0; padding:0; border-top-width:4px; line-height:0; }
.card-status { display:flex; align-items:center; flex-wrap:wrap; gap:6px; font-size:11px; color:var(--muted); margin-top:15px; }
.card-status .status-dot { background:var(--muted); width:4px; height:4px; }
.coverage-status { margin-left:auto; color:var(--dim); }
.assessment-foot { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:14px 0 8px; color:var(--muted); font-size:12px; }
#assessment-coverage:before { content:''; display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--low); margin-right:8px; }
.assessment-explainer { font-size:12px; margin:12px 0 0; }
.panel { border-radius:3px; }
.view>section.panel { background:transparent; border:0; border-top:1px solid var(--border); border-radius:0; padding:28px 0 0; margin:38px 0 0; }
.section-head { align-items:flex-end; margin-bottom:23px; }
.section-head h2 { margin:6px 0 0; }
.segmented { padding:0; background:transparent; border-radius:0; gap:5px; }
.segmented button { border:1px solid var(--border); border-radius:3px; padding:9px 12px; font-size:12px; }
.segmented button[aria-pressed=true] { background:var(--ink); color:var(--bg); }
.history-facets { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.history-facets>div+div { border-left:1px solid var(--border); padding-left:30px; }
.history-facets h3 { margin:0 0 15px; font-size:14px; }
.history-svg { min-height:0; }
.chart-note { font-size:12px; }
.matrix-cell { border-radius:3px; }
.matrix-cell.missing { background:repeating-linear-gradient(135deg,#202529,#202529 4px,#191d20 4px,#191d20 8px); }
.mechanism { border-radius:3px; background:var(--panel); }
.mechanism h3 { font-size:14px; }
.mechanism b { font-size:11px; }
footer { max-width:none; margin:10px 48px 0; padding:26px 0 30px; font-size:11px; }
.footer-brand { font:21px var(--serif); letter-spacing:-.6px; }
.view:not(#overview) { padding-top:34px; }
.view:not(#overview)>.deck { margin-bottom:25px; }
@media(max-width:1100px) {
  .header-meta { display:none; }
  .site-header { justify-content:space-between; }
  .site-header nav { margin-left:0; }
  .risk-top { grid-template-columns:minmax(0,1fr) 160px; gap:4px; }
  .verdict-main { display:block; }
  .verdict-meta { display:flex; flex-wrap:wrap; gap:3px 9px; }
  .verdict { font-size:37px; }
  .card-gauge { height:110px; }
}
@media(max-width:800px) {
  body { width:100%; }
  .site-header { padding:0 24px; }
  main { padding-right:24px; padding-left:24px; }
  .site-header nav { gap:18px; font-size:12px; }
  .risk-top { grid-template-columns:1fr; }
  .card-gauge { display:none; }
  .verdict-main { display:flex; }
  .verdict-meta { display:grid; }
  footer { margin-right:24px; margin-left:24px; }
}
@media(max-width:700px) {
  .site-header { min-height:0; padding:20px 20px 15px; gap:18px; flex-direction:column; align-items:flex-start; }
  .brand { font-size:25px; }
  .site-header nav { gap:25px; font-size:12px; margin:0; }
  main { padding:0 20px 40px; }
  .shadow-banner { padding-top:12px; font-size:9px; margin:0; }
  .shadow-banner span { display:none; }
  .hero { padding:20px 0 20px; }
  .hero-top { align-items:flex-start; flex-direction:column; gap:7px; margin-bottom:10px; }
  .eyebrow { font-size:10px; }
  .assessment-meta { font-size:10px; padding:0; margin:0; }
  h1 { font-size:32px; letter-spacing:-.9px; margin:0; }
  .deck { font-size:13px; line-height:1.55; margin:11px 0 0; }
  .hero .deck { display:none; }
  .main-cards { gap:12px; margin:0; }
  .risk-card { padding:14px 18px 13px!important; }
  .card-heading { margin-bottom:8px; }
  .card-heading h2 { font-size:20px; margin:0!important; }
  .risk-top>div { display:block; }
  .horizon-label { font-size:10px; }
  .verdict-main { gap:17px; }
  .verdict { font-size:34px; line-height:1.2; margin:0; }
  .direction,.risk-position { font-size:11px; }
  .risk-rail { margin:8px 0 6px; gap:4px; }
  .rail-step { font-size:11px; padding-top:3px; border-top-width:3px; }
  .rail-step.selected:before { top:-9px; }
  .risk-card p { font-size:12px; line-height:1.45!important; margin:7px 0 0; min-height:0; }
  .buildup { margin-top:8px; padding-top:8px; }
  .buildup>span { font-size:11px; }
  .buildup-result { gap:9px; }
  .buildup-result strong { font-size:15px; }
  .buildup-result span { font-size:10px; }
  .mini-rail { margin:4px 0 0!important; }
  .mini-rail .rail-step { font-size:0; padding:0; border-top-width:3px; }
  .card-status { font-size:10px; margin-top:10px; }
  .assessment-foot { font-size:10px; align-items:flex-start; flex-direction:column; gap:5px; }
  .assessment-explainer { font-size:11px; margin-top:8px; }
  .section-head { align-items:flex-start; gap:17px; margin-bottom:18px; }
  .section-head h2 { margin:6px 0 0; font-size:27px; }
  .segmented { margin:0; }
  .segmented button { font-size:11px; }
  .history-facets { grid-template-columns:1fr; gap:24px; }
  .history-facets>div+div { padding:20px 0 0; border:0; border-top:1px solid var(--border); }
  .chart-note { font-size:11px; }
  footer { margin:10px 20px 0; padding:24px 0; }
}
.bridge-warning{display:grid;grid-template-columns:1fr auto;gap:8px;padding:14px 0;border-top:1px solid var(--border);font-size:14px}
.bridge-warning small{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.bridge-warning .risk-rail{grid-column:1/-1}
.risk-card .card-definition { min-height:0; margin:-8px 0 12px; font-size:12px; color:var(--muted); }
.risk-card .immediate-summary,.risk-card .buildup-summary { min-height:0; }
.risk-card .card-details { margin-top:12px; padding-top:12px; border-top:1px solid var(--border); font-size:12px; color:var(--muted); }
.card-details summary { cursor:pointer; }
.card-details p { min-height:0; font-size:12px; }
.coverage-status { margin-left:0; }
.unavailable-verdict { font-size:30px; }
.measurement-search { display:flex; align-items:center; gap:18px; font-size:13px; color:var(--muted); }
.measurement-search input { min-width:0; flex:1; max-width:520px; background:var(--panel); color:var(--ink); border:1px solid var(--border); border-radius:3px; padding:12px; font:inherit; }
.horizon-control { margin-bottom:18px; }
.driver-overflow summary { padding:18px 0; cursor:pointer; color:var(--ink); }
.channel-detail-bands .level-label { font-size:24px; }
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible { outline:2px solid var(--elevated); outline-offset:4px; }
#main:focus { outline:none; }
.view h1:focus,.view h2:focus { outline:none; }
.chart-dates { display:flex; justify-content:space-between; gap:12px; font-size:11px; color:var(--muted); margin:0 0 18px; }
.observation-history { margin:18px 0; font-size:12px; }
.observation-history summary { cursor:pointer; padding:12px 0; }
.risk-card { align-self:start; }
@media(max-width:700px) {
  .hero .deck { display:block; }
  .risk-card .card-definition { margin:0 0 10px; font-size:11px; }
  .measurement-search { align-items:stretch; flex-direction:column; gap:8px; }
  .buildup-result { flex-wrap:wrap; justify-content:flex-end; }
  .segmented { flex-wrap:wrap; }
  .driver-row { grid-template-columns:minmax(0,1fr) minmax(80px,.6fr) 16px; }
  .driver-row .level-label { display:block; grid-column:1/3; grid-row:2; font-size:11px; }
  .driver-row .level-label small { display:inline; margin-left:10px; }
  .driver-row>span:last-child { grid-column:3; grid-row:1/3; align-self:center; }
}
