:root{
  --bg:#100d08; --bg2:#0a0805; --panel:#181410; --panel2:#211b14;
  --line:rgba(233,214,176,.13); --line2:rgba(233,214,176,.06);
  --ink:#ece3d0; --ink-dim:#a89d87; --ink-faint:#8f8470;
  --gold:#f0b429; --gold-2:#caa24a; --gold-glow:rgba(240,180,41,.18);
  --up:#82b96c; --down:#d96b4f;
  --poly:#6b9bff; --kalshi:#2bd4a8; --agg:#f0b429;
  --font-display:'Fraunces',Georgia,'Times New Roman',serif;
  --font-body:'Newsreader',Georgia,serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --maxw:1280px;
  --r:4px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font-body); font-size:17px; line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:9999;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  opacity:.035; mix-blend-mode:overlay;
}
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:9998;
  background:none;
}

a{color:var(--gold-2); text-decoration:none; border-bottom:1px solid rgba(202,162,74,.35)}
a:hover{color:var(--gold); border-color:var(--gold)}
::selection{background:var(--gold-glow); color:#fff}

::-webkit-scrollbar{width:11px; height:11px}
::-webkit-scrollbar-track{background:var(--bg2)}
::-webkit-scrollbar-thumb{background:#2c241a; border:2px solid var(--bg2); border-radius:6px}
::-webkit-scrollbar-thumb:hover{background:#3a2f21}

.masthead{
  border-bottom:1px solid var(--line); background:linear-gradient(180deg,var(--bg2),var(--bg));
  position:relative; z-index:5;
}
.masthead-inner{
  max-width:var(--maxw); margin:0 auto; padding:18px 26px 14px;
  display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.brand{display:flex; flex-direction:column; gap:2px}
.brand .kicker{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold-2);
}
.brand h1{
  font-family:var(--font-display); font-weight:900; font-size:clamp(28px,4.4vw,46px);
  line-height:.92; margin:2px 0 0; letter-spacing:-.01em;
  font-optical-sizing:auto;
}
.brand h1 .em{font-style:italic; color:var(--gold); font-weight:600}
.dateline{
  font-family:var(--font-mono); font-size:11px; color:var(--ink-faint); letter-spacing:.04em;
  line-height:1.7; display:flex; align-items:center; justify-content:flex-end; gap:14px;
}
.dateline-text{text-align:right}
.dateline .live{display:inline-flex; align-items:center; gap:6px; color:var(--ink-dim)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--up);box-shadow:0 0 0 0 rgba(130,185,108,.6);animation:pulse 2.2s infinite}
.dot.warn{background:var(--gold)}
.dot.off{background:var(--ink-faint);animation:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(130,185,108,.5)}70%{box-shadow:0 0 0 7px rgba(130,185,108,0)}100%{box-shadow:0 0 0 0 rgba(130,185,108,0)}}

.tabs{
  position:sticky; top:0; z-index:20; background:rgba(16,13,8,.86); backdrop-filter:blur(9px);
  border-bottom:1px solid var(--line);
}
.tabs-inner{max-width:var(--maxw); margin:0 auto; padding:0 18px; display:flex; gap:2px; overflow-x:auto}
.tab{
  appearance:none; background:none; border:none; cursor:pointer; position:relative;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--ink-faint); padding:15px 16px; white-space:nowrap; transition:color .18s;
}
.tab:hover{color:var(--ink-dim)}
.tab.active{color:var(--ink)}
.tab.active::after{
  content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:2px; background:var(--gold);
  box-shadow:0 0 12px var(--gold-glow);
}
.tab .tdot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:7px;vertical-align:middle}

main{max-width:var(--maxw); margin:0 auto; padding:34px 26px 90px; position:relative; z-index:3}
.view{display:none}
.view.active{display:block}
section{margin-bottom:46px}
.rise{opacity:0; transform:translateY(14px); animation:riseIn .7s cubic-bezier(.2,.7,.2,1) forwards; animation-delay:var(--d,0s)}
@keyframes riseIn{to{opacity:1; transform:none}}

.eyebrow{
  font-family:var(--font-mono); font-size:11px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--gold-2); margin:0 0 14px; display:flex; align-items:center; gap:12px;
}
.eyebrow::after{content:""; flex:1; height:1px; background:var(--line)}
h2.head{font-family:var(--font-display); font-weight:600; font-size:clamp(22px,3vw,32px); margin:.1em 0 .35em; letter-spacing:-.01em}
h3.sub{font-family:var(--font-display); font-weight:600; font-size:20px; margin:0 0 12px}
.prose{max-width:68ch; color:var(--ink); font-size:17.5px}
.prose p{margin:0 0 1em}
.prose .lede{font-size:21px; line-height:1.5; color:var(--ink)}
.muted{color:var(--ink-dim)} .faint{color:var(--ink-faint)}
.mono{font-family:var(--font-mono)}

.hero{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:38px; align-items:center;
  border:1px solid var(--line); border-radius:var(--r); padding:34px 36px;
  background:
    radial-gradient(80% 140% at 0% 0%, rgba(240,180,41,.06), transparent 60%),
    linear-gradient(180deg,var(--panel),var(--panel2));
  position:relative; overflow:hidden;
}
.hero::before{content:""; position:absolute; inset:0; background-image:repeating-linear-gradient(0deg,transparent,transparent 27px,var(--line2) 27px,var(--line2) 28px); opacity:.5; pointer-events:none}
.hero-num{font-family:var(--font-display); font-weight:900; font-size:clamp(46px,11vw,128px); line-height:.86; letter-spacing:-.03em; color:var(--ink); position:relative}
.hero-num .pt{color:var(--gold)}
.hero-cap{font-family:var(--font-mono); font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:6px}
.hero-chg{font-family:var(--font-mono); font-size:18px; margin-top:14px}
.hero-read{font-family:var(--font-display); font-style:italic; font-weight:400; font-size:clamp(19px,2.4vw,26px); line-height:1.34; color:var(--ink-dim)}
.hero-read .hl{color:var(--gold); font-style:normal; font-weight:600}

.grid{display:grid; gap:14px}
.grid.c4{grid-template-columns:repeat(4,1fr)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c2{grid-template-columns:repeat(2,1fr)}
.card{
  border:1px solid var(--line); border-radius:var(--r); padding:16px 18px; background:var(--panel);
  position:relative; transition:border-color .2s, transform .2s;
}
.card:hover{border-color:rgba(233,214,176,.24)}
.card .label{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint)}
.card .val{font-family:var(--font-display); font-weight:600; font-size:30px; line-height:1.1; margin-top:7px; letter-spacing:-.01em}
.card .val.mono{font-family:var(--font-mono); font-weight:500; font-size:26px}
.card .foot{font-family:var(--font-mono); font-size:11px; color:var(--ink-dim); margin-top:5px}
.val .up,.foot .up,.up{color:var(--up)} .val .down,.foot .down,.down{color:var(--down)}

.panel{border:1px solid var(--line); border-radius:var(--r); background:var(--panel); padding:20px 22px}
.panel-h{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:14px; flex-wrap:wrap}
.panel-h h3{font-family:var(--font-display); font-weight:600; font-size:19px; margin:0}
.panel-h .note{font-family:var(--font-mono); font-size:11px; color:var(--ink-faint)}
.chart-wrap{position:relative; width:100%}
svg.chart{display:block; width:100%; overflow:visible; font-family:var(--font-mono)}
.chart .grid-line{stroke:var(--line2)}
.chart .axis-txt{fill:var(--ink-faint); font-size:10px}
.chart .ser-line{fill:none; stroke-width:2; stroke-linejoin:round; stroke-linecap:round}
.chart .ser-area{opacity:.10}
.chart .crosshair{stroke:var(--ink-faint); stroke-dasharray:3 3; opacity:.6}
.chart .dot-hover{stroke:var(--bg); stroke-width:2}
.tooltip{
  position:absolute; pointer-events:none; z-index:30; background:rgba(10,8,5,.96); border:1px solid var(--line);
  border-radius:var(--r); padding:8px 11px; font-family:var(--font-mono); font-size:11.5px; color:var(--ink);
  transform:translate(-50%,-115%); white-space:nowrap; opacity:0; transition:opacity .12s; box-shadow:0 8px 26px rgba(0,0,0,.5)
}
.tooltip .t-d{color:var(--ink-faint); margin-bottom:3px}
.tooltip .sw{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;vertical-align:middle}

.legend{display:flex; gap:18px; flex-wrap:wrap; font-family:var(--font-mono); font-size:11.5px; color:var(--ink-dim)}
.legend span{display:inline-flex; align-items:center; gap:7px}
.legend i{width:14px; height:3px; border-radius:2px; display:inline-block}

.controls{display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-bottom:18px}
.seg{display:inline-flex; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:var(--bg2)}
.seg button{
  appearance:none; background:none; border:none; cursor:pointer; color:var(--ink-faint);
  font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  padding:8px 13px; transition:background .15s,color .15s; white-space:nowrap;
}
.seg button:not(:last-child){border-right:1px solid var(--line)}
.seg button:hover{color:var(--ink-dim)}
.seg button.on{background:var(--gold); color:#1a1206; font-weight:600}
.ctl-label{font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); margin-right:2px}
.slider-row{display:flex; align-items:center; gap:12px; font-family:var(--font-mono); font-size:12px; color:var(--ink-dim)}
input[type=range]{-webkit-appearance:none; appearance:none; height:3px; background:var(--line); border-radius:2px; width:160px; cursor:pointer}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:15px; height:15px; border-radius:50%; background:var(--gold); border:2px solid var(--bg); box-shadow:0 0 0 1px var(--gold)}
input[type=range]::-moz-range-thumb{width:15px; height:15px; border:2px solid var(--bg); border-radius:50%; background:var(--gold)}
.slider-val{color:var(--gold); min-width:48px; display:inline-block}
.btn{
  appearance:none; cursor:pointer; font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  background:var(--panel2); color:var(--ink); border:1px solid var(--line); border-radius:var(--r); padding:9px 15px; transition:.15s;
}
.btn:hover{border-color:var(--gold); color:var(--gold)}
.btn.primary{background:var(--gold); color:#1a1206; border-color:var(--gold); font-weight:600}
.btn.primary:hover{filter:brightness(1.08); color:#1a1206}
input.text{font-family:var(--font-mono); font-size:12px; background:var(--bg2); border:1px solid var(--line); color:var(--ink); border-radius:var(--r); padding:8px 11px; min-width:280px}
input.text:focus{outline:none; border-color:var(--gold)}

.badge{font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; padding:3px 9px; border-radius:20px; border:1px solid var(--line); display:inline-flex; align-items:center; gap:6px}
.badge.live{color:var(--up); border-color:rgba(130,185,108,.4)}
.badge.snap{color:var(--gold); border-color:rgba(240,180,41,.4)}
.badge.off{color:var(--ink-faint)}

.tbl-wrap{border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
table.ctable{width:100%; border-collapse:collapse; font-size:14px}
.ctable th{
  font-family:var(--font-mono); font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-faint);
  text-align:right; padding:11px 14px; background:var(--bg2); border-bottom:1px solid var(--line); cursor:pointer; user-select:none; white-space:nowrap;
}
.ctable th:first-child{text-align:left}
.ctable th:hover{color:var(--ink-dim)}
.ctable th .ar{color:var(--gold); margin-left:4px}
.ctable td{padding:10px 14px; text-align:right; border-bottom:1px solid var(--line2); font-family:var(--font-mono); font-variant-numeric:tabular-nums; color:var(--ink-dim)}
.ctable td:first-child{text-align:left; font-family:var(--font-body); color:var(--ink); max-width:420px}
.ctable tr:last-child td{border-bottom:none}
.ctable tbody tr{transition:background .12s}
.ctable tbody tr:hover{background:rgba(240,180,41,.045)}
.ctable .q{display:block; line-height:1.3}
.ctable .ev{display:block; font-family:var(--font-mono); font-size:10.5px; color:var(--ink-faint); margin-top:2px}
.pricebar{display:inline-block; height:8px; border-radius:2px; background:var(--gold); opacity:.8; vertical-align:middle; margin-right:8px}
.chgpill{font-family:var(--font-mono); font-size:12px}

.hist{display:flex; align-items:flex-end; gap:3px; height:150px; padding-top:10px}
.hist .bar{flex:1; background:linear-gradient(180deg,var(--gold),var(--gold-2)); border-radius:2px 2px 0 0; min-height:2px; position:relative; opacity:.85; transition:height .5s cubic-bezier(.2,.7,.2,1)}
.hist .bar:hover{opacity:1}
.hist-x{display:flex; justify-content:space-between; font-family:var(--font-mono); font-size:10px; color:var(--ink-faint); margin-top:8px}

.movers{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.mlist{border:1px solid var(--line); border-radius:var(--r); background:var(--panel); overflow:hidden}
.mlist h4{font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; margin:0; padding:12px 16px; border-bottom:1px solid var(--line); color:var(--ink-faint)}
.mrow{display:flex; justify-content:space-between; gap:12px; padding:9px 16px; border-bottom:1px solid var(--line2); font-size:14px}
.mrow:last-child{border:none}
.mrow .mq{color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mrow .mv{font-family:var(--font-mono); white-space:nowrap}

.quote{border-left:3px solid var(--gold); padding:6px 0 6px 22px; margin:26px 0; font-family:var(--font-display); font-style:italic; font-size:21px; line-height:1.45; color:var(--ink)}
.quote cite{display:block; font-family:var(--font-mono); font-style:normal; font-size:12px; letter-spacing:.08em; color:var(--ink-faint); margin-top:12px}
.note-box{border:1px dashed var(--line); border-radius:var(--r); padding:16px 20px; background:rgba(240,180,41,.03); font-size:15px; color:var(--ink-dim)}
.note-box b{color:var(--ink)}
.kbd{font-family:var(--font-mono); font-size:12.5px; background:var(--bg2); border:1px solid var(--line); border-radius:3px; padding:1px 6px; color:var(--gold-2)}

.skel{background:linear-gradient(90deg,var(--panel) 25%,var(--panel2) 50%,var(--panel) 75%); background-size:200% 100%; animation:shimmer 1.3s infinite; border-radius:var(--r)}
@keyframes shimmer{to{background-position:-200% 0}}
.spinner{display:inline-block; width:13px; height:13px; border:2px solid var(--line); border-top-color:var(--gold); border-radius:50%; animation:spin .8s linear infinite; vertical-align:-2px; margin-right:7px}
@keyframes spin{to{transform:rotate(360deg)}}
.loading{font-family:var(--font-mono); font-size:13px; color:var(--ink-dim); padding:30px 0}

pre.code{background:var(--bg2); border:1px solid var(--line); border-radius:var(--r); padding:16px 18px; overflow-x:auto; font-family:var(--font-mono); font-size:12.5px; line-height:1.6; color:var(--ink-dim)}
pre.code .c{color:var(--ink-faint)} pre.code .k{color:var(--gold-2)} pre.code .s{color:var(--up)}

.cols2{display:grid; grid-template-columns:1fr 1fr; gap:34px}
.faq dt{font-family:var(--font-display); font-weight:600; font-size:18px; margin-top:22px}
.faq dd{margin:6px 0 0; color:var(--ink-dim); max-width:64ch}
.srclist{list-style:none; padding:0; margin:0}
.srclist li{padding:9px 0; border-bottom:1px solid var(--line2); font-size:15px}
.srclist .t{font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-2); margin-right:8px}

footer{border-top:1px solid var(--line); margin-top:40px}
.footer-inner{max-width:var(--maxw); margin:0 auto; padding:28px 26px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-family:var(--font-mono); font-size:11.5px; color:var(--ink-faint)}
.footer-inner a{color:var(--ink-dim)}

@media(max-width:900px){
  .hero{grid-template-columns:1fr; gap:24px; padding:26px}
  .grid.c4{grid-template-columns:repeat(2,1fr)}
  .grid.c3{grid-template-columns:1fr}
  .cols2{grid-template-columns:1fr}
  .movers{grid-template-columns:1fr}
  body{font-size:16px}
}
@media(max-width:560px){
  .grid.c4{grid-template-columns:1fr}
  main{padding:24px 16px 70px}
  .masthead-inner{padding:14px 16px}
  .dateline{width:100%; justify-content:space-between}
  .tabs-inner{padding:0 10px; gap:0}
  .tab{padding:13px 11px; font-size:11px; letter-spacing:.06em}
}
@media(max-width:600px){ .chart .axis-txt{ font-size:8px } }

:root[data-theme="light"]{
  --bg:#f4efe3; --bg2:#eae1cf; --panel:#fbf8f1; --panel2:#f1ead9;
  --line:rgba(54,40,16,.16); --line2:rgba(54,40,16,.07);
  --ink:#221d15; --ink-dim:#5d5446; --ink-faint:#766c59;
  --gold:#996a0c; --gold-2:#7c550c; --gold-glow:rgba(153,106,12,.16);
  --up:#3c7a36; --down:#b03f28;
  --poly:#2f5fc0; --kalshi:#0e8c70; --agg:#996a0c;
}
:root[data-theme="light"] body::before{ opacity:.05; mix-blend-mode:multiply }
:root[data-theme="light"] body::after{ background:none; }
:root[data-theme="light"] .tabs{ background:rgba(244,239,227,.86) }
:root[data-theme="light"] .tooltip{ background:rgba(251,248,241,.97); color:var(--ink); box-shadow:0 8px 26px rgba(80,60,20,.18) }
:root[data-theme="light"] .seg button.on,
:root[data-theme="light"] .btn.primary{ color:#fff }
:root[data-theme="light"] ::-webkit-scrollbar-track{ background:var(--bg2) }
:root[data-theme="light"] ::-webkit-scrollbar-thumb{ background:#d6c9af; border-color:var(--bg2) }
:root[data-theme="light"] .skel{ background:linear-gradient(90deg,var(--panel) 25%,var(--panel2) 50%,var(--panel) 75%) }

.theme-sel{ display:inline-flex; gap:1px; border:1px solid var(--line); border-radius:20px; overflow:hidden; background:var(--bg2) }
.theme-sel button{ appearance:none; background:none; border:none; cursor:pointer; color:var(--ink-faint);
  font-family:var(--font-mono); font-size:12px; line-height:1; padding:5px 9px; transition:color .15s,background .15s }
.theme-sel button:hover{ color:var(--ink-dim) }
.theme-sel button.on{ color:var(--gold); background:var(--gold-glow) }

.tab:focus-visible, .btn:focus-visible, .seg button:focus-visible, .theme-sel button:focus-visible,
.ctable th:focus-visible, a:focus-visible, [tabindex]:focus-visible{
  outline:2px solid var(--gold); outline-offset:2px; border-radius:2px }
input[type=range]:focus-visible{ outline:2px solid var(--gold); outline-offset:4px }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important }
}
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
