@font-face{font-family:"Archivo";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/archivo-700.woff2") format("woff2");}
@font-face{font-family:"Archivo";font-style:normal;font-weight:800;font-display:swap;src:url("/fonts/archivo-800.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/plex-sans-400.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/plex-sans-500.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/plex-mono-400.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/plex-mono-500.woff2") format("woff2");}
:root{
  --ground:#E9ECF0; --surface:#F4F6F8; --panel:#FBFCFD; --ink:#10141B;
  --muted:#5A6371; --faint:#6B7482; --rule:#C5CCD6; --rule-strong:#AEB6C2;
  --accent:#173E72; --accent-deep:#12335f; --signal:#1F7A53; --bear:#A23A2E;
  --grid:rgba(16,20,27,0.030); --maxw:1180px;
}
*{box-sizing:border-box;}
html,body{margin:0; padding:0;}
.k-root{
  background:var(--ground);
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:64px 64px;
  color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  line-height:1.6; letter-spacing:-0.005em;
  min-height:100vh;
}
.k-root .mono{font-family:"IBM Plex Mono",ui-monospace,monospace;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,5vw,56px);}
.k-root a{color:inherit;}
.k-root h1,.k-root h2,.k-root h3{font-family:"Archivo",sans-serif;}

/* register bar */
.reg{border-bottom:1px solid var(--rule-strong); background:rgba(244,246,248,.6);
  backdrop-filter:blur(4px); position:sticky; top:0; z-index:10;}
.reg-inner{display:flex; align-items:center; gap:16px; padding:14px 0;}
.wordmark{font-family:"Archivo",sans-serif; font-weight:800; letter-spacing:-0.02em;
  font-size:1.12rem; text-transform:uppercase; line-height:1; white-space:nowrap;}
.wordmark .g{color:var(--muted); font-weight:600;}
.reg-nav{display:flex; gap:2px; margin-left:14px; font-size:.7rem; letter-spacing:.08em;
  text-transform:uppercase;}
.reg-nav span{padding:5px 12px; border:1px solid transparent; color:var(--faint);
  display:inline-flex; align-items:center; gap:8px;}
.reg-nav .on{color:#fff; background:var(--accent); border-color:var(--accent);}
.reg-nav .off{border-color:var(--rule);}
.soon{font-style:normal; font-size:.56rem; letter-spacing:.1em; color:var(--faint);
  border:1px solid var(--rule); padding:1px 5px;}
.status{margin-left:auto; display:flex; align-items:center; gap:18px; font-size:.72rem;
  letter-spacing:.06em; color:var(--muted); text-transform:uppercase; white-space:nowrap;}
#kclock{color:var(--ink);}

/* masthead: slim label row aligned to the data rail */
.masthead{padding:clamp(22px,3.5vh,40px) 0 14px;}
.mast-row{display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  flex-wrap:wrap; padding-bottom:14px; border-bottom:1px solid var(--rule-strong);}
.eyebrow{margin:0; font-size:.72rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent); font-weight:500;}
.mast-meta{margin:0; font-size:.68rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--faint);}

/* market tape */
.tape{display:flex; flex-wrap:wrap; gap:1px; background:var(--rule);
  border:1px solid var(--rule); margin:8px 0 40px;}
.tick{flex:1 1 160px; background:var(--panel); padding:16px clamp(14px,1.6vw,20px); min-width:0;}
.tick .k{font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--faint);
  margin-bottom:9px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.tick .v{font-family:"IBM Plex Mono",monospace; font-weight:500; font-size:1.28rem;
  letter-spacing:-0.02em; font-variant-numeric:tabular-nums;}
.tick .v .unit{font-size:.7rem; color:var(--faint); margin-left:2px;}
.tick .v .qual{font-size:.56rem; letter-spacing:.1em; text-transform:uppercase; color:var(--faint);
  margin-left:8px; vertical-align:middle;}

/* two-column body */
.body-grid{display:grid; grid-template-columns:1.45fr 1fr; gap:clamp(20px,3vw,40px);
  align-items:start; padding-bottom:40px;}
@media(max-width:920px){.body-grid{grid-template-columns:1fr;}}

.panel{border:1px solid var(--rule); background:var(--panel);}
.panel + .panel{margin-top:20px;}
.panel-h{display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  padding:14px 18px; border-bottom:1px solid var(--rule);}
.panel-h .t{font-family:"Archivo",sans-serif; font-weight:700; font-size:.96rem;
  letter-spacing:-0.01em;}
.panel-h .m{font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--faint);}
.panel-h.sub-h{border-top:1px solid var(--rule); border-bottom:0;}
.panel-h.sub-h .t{font-size:.82rem;}

/* news feed */
.feed{list-style:none; margin:0; padding:0;}
.story{padding:16px 18px; border-bottom:1px solid var(--rule); display:flex;
  flex-direction:column; gap:8px;}
.story:last-child{border-bottom:0;}
.story-top{display:flex; align-items:center; gap:8px; font-size:.68rem;
  letter-spacing:.04em; color:var(--faint); text-transform:uppercase;}
.story-top .src{color:var(--accent); font-weight:500;}
.story-top .sep{opacity:.5;}
.flag{margin-left:auto; color:var(--ink); border:1px solid var(--rule-strong);
  padding:2px 7px; font-size:.6rem; letter-spacing:.1em;}
.story-h{font-family:"Archivo",sans-serif; font-weight:600; font-size:1.06rem;
  line-height:1.28; letter-spacing:-0.012em; text-decoration:none; color:var(--ink);
  text-wrap:balance;}
.story-h:hover{color:var(--accent);}
.tags{display:flex; gap:7px;}
.tag{font-family:"IBM Plex Mono",monospace; font-size:.62rem; letter-spacing:.08em;
  text-transform:uppercase; padding:3px 9px; border:1px solid var(--rule-strong);
  color:var(--muted);}
.feed-foot{padding:14px 18px; text-align:center;}
.loadmore{font-family:"IBM Plex Mono",monospace; font-size:.7rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--accent); background:none; border:1px solid var(--rule-strong);
  padding:9px 18px; cursor:pointer;}
.loadmore:hover{background:var(--surface);}
.loadmore:disabled{opacity:.5; cursor:default;}
.empty-state,.err-state{padding:22px 18px; font-size:.82rem; color:var(--muted);}

/* charts */
.chart{padding:16px 18px 18px;}
.spark{width:100%; height:auto; display:block;}
.spark .area{fill:rgba(23,62,114,.10);}
.spark .line{fill:none; stroke:var(--accent); stroke-width:2;}
.spark .end{fill:var(--accent);}
.spark .cg{stroke:var(--rule); stroke-width:1; stroke-dasharray:2 4;}
.spark .cgt{fill:var(--faint); font-family:"IBM Plex Mono",monospace; font-size:11px;}
.chart-foot{display:flex; gap:14px; flex-wrap:wrap; padding:12px 18px 0; margin-top:2px;
  font-size:.68rem; color:var(--muted); letter-spacing:.03em;
  font-variant-numeric:tabular-nums;}
.chart-foot b{color:var(--ink); font-weight:500;}

/* bar list */
.bars{padding:16px 18px 20px; display:flex; flex-direction:column; gap:11px;}
.bar-row{display:grid; grid-template-columns:96px 1fr 42px; align-items:center; gap:12px;}
.bar-l{font-size:.72rem; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.bar-track{height:9px; background:rgba(16,20,27,.06); position:relative;}
.bar-fill{position:absolute; inset:0 auto 0 0; background:var(--accent); max-width:100%;}
.bar-row:first-child .bar-fill{background:var(--accent-deep);}
.bar-v{font-size:.72rem; text-align:right; color:var(--ink);
  font-variant-numeric:tabular-nums;}

/* fuel-cost stacked */
.fuel{padding:16px 18px 20px;}
.fuel-bar{display:flex; height:26px; border:1px solid var(--rule); overflow:hidden;}
.fseg{height:100%;}
.seg-0{background:var(--accent-deep);} .seg-1{background:var(--accent);}
.seg-2{background:#4a688f;} .seg-3{background:#8fa2ba;} .seg-4{background:#b7c3d4;}
.fuel-leg{display:flex; gap:16px; flex-wrap:wrap; margin-top:14px; font-size:.7rem;
  color:var(--muted); font-family:"IBM Plex Mono",monospace;
  font-variant-numeric:tabular-nums;}
.fleg{display:flex; align-items:center; gap:6px;}
.fleg i{width:9px; height:9px; display:inline-block;}
.fleg b{color:var(--ink); font-weight:500;}
.fuel-total{margin-top:12px; font-size:.7rem; color:var(--faint);
  font-family:"IBM Plex Mono",monospace; letter-spacing:.04em;}
.fuel-total b{color:var(--ink); font-weight:500;}

/* procurement */
.proc{padding:16px 18px 20px;}
.proc-split{display:flex; height:22px; border:1px solid var(--rule); overflow:hidden;}
.proc-spot{background:var(--accent-deep);} .proc-term{background:var(--accent);}
.proc-leg{display:flex; gap:16px; margin-top:12px; font-size:.7rem; color:var(--muted);
  font-family:"IBM Plex Mono",monospace;}
.proc-leg b{color:var(--ink); font-weight:500;}
.proc-stat{margin-top:16px; padding-top:14px; border-top:1px solid var(--rule);}
.proc-stat .k{font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:var(--faint);}
.proc-stat .v{margin-top:6px; font-family:"IBM Plex Mono",monospace; font-size:.92rem; color:var(--ink);}

/* unavailable state */
.unavail{padding:16px 18px 20px; font-size:.78rem; color:var(--muted);
  border-top:1px dashed var(--rule);}
.unavail .lbl{font-family:"IBM Plex Mono",monospace; font-size:.62rem;
  letter-spacing:.1em; text-transform:uppercase; color:var(--faint); display:block; margin-bottom:6px;}

/* card last-update line */
.updated{padding:10px 18px 16px; font-size:.62rem; letter-spacing:.05em; color:var(--faint);
  font-family:"IBM Plex Mono",monospace;}

abbr[title]{text-decoration:underline dotted; cursor:help;}

/* per-card help */
.help-btn{flex:none; width:19px; height:19px; border-radius:50%; border:1px solid var(--rule-strong);
  background:none; color:var(--muted); font-size:.7rem; line-height:1; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; padding:0;}
.help-btn:hover{color:var(--ink); border-color:var(--faint); background:var(--surface);}
.help-btn[aria-expanded="true"]{color:#fff; background:var(--accent); border-color:var(--accent);}
.help-text{padding:14px 18px; font-size:.76rem; line-height:1.55; color:var(--muted);
  background:var(--surface); border-bottom:1px solid var(--rule);}

/* footer */
.kfoot{border-top:1px solid var(--rule-strong); padding:34px 0 48px; margin-top:12px;}
.kfoot-grid{display:flex; justify-content:space-between; gap:28px; flex-wrap:wrap;
  align-items:flex-start;}
.kfoot .brand{font-family:"Archivo",sans-serif; font-weight:800; text-transform:uppercase;
  letter-spacing:-0.02em; font-size:1rem;}
.kfoot .brand span{color:var(--muted); font-weight:600;}
.kfoot a{color:inherit; text-decoration:underline; text-underline-offset:2px; transition:color .15s ease;}
.kfoot a:hover{color:var(--accent);}
.kfoot .sub{margin-top:8px; font-size:.78rem; color:var(--muted); max-width:52ch;}
.coord{font-family:"IBM Plex Mono",monospace; font-size:.7rem; color:var(--faint);
  letter-spacing:.04em; white-space:nowrap; text-align:right;}
.coord .ttl{display:block; margin-bottom:6px; letter-spacing:.16em; text-transform:uppercase;
  font-size:.64rem;}
.kfoot .copy{margin-top:26px; font-size:.68rem; color:var(--faint); letter-spacing:.05em;
  font-family:"IBM Plex Mono",monospace;}

:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important;
    transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}