:root{
  --bg:oklch(0.145 0.012 265); --panel:oklch(0.185 0.012 265);
  --panel2:oklch(0.215 0.012 265); --rule:oklch(0.265 0.012 265);
  --fg:oklch(0.97 0.003 265); --mut:oklch(0.63 0.010 265);
  --dim:oklch(0.605 0.010 265);
  --ac:#16e07a; --neg:oklch(0.68 0.19 25); --amb:#ffc44d;
  --qb:#ff7a5c; --rb:#59c2ff; --wr:#c08cff; --te:#ffc44d;
  --anton:'Anton',Impact,sans-serif;
  --body:'Archivo',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);
  font-size:15px;line-height:1.55;font-variant-numeric:tabular-nums;
  -webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible,.btn:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
h1,h2,h3{margin:0}
.wrap{max-width:1320px;margin:0 auto;padding:0 30px}
.scroll{overflow-x:auto}
.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}

/* nav */
.nav{background:oklch(0.115 0.012 265);border-bottom:1px solid var(--rule);
  position:sticky;top:0;z-index:20}
.nav-in{max-width:1320px;margin:0 auto;padding:0 30px;height:60px;display:flex;
  align-items:center;justify-content:space-between;gap:20px}
.mark{font-family:var(--anton);font-size:19px;text-transform:uppercase;letter-spacing:.01em}
.mark em{color:var(--ac);font-style:normal}
.nav-links{display:flex;gap:20px;font-size:12px;font-weight:600;
  text-transform:uppercase;letter-spacing:.05em;color:var(--mut)}
.nav-links a:hover{color:var(--fg)}
.nav-links a.on{color:var(--fg);border-bottom:2px solid var(--ac);padding-bottom:3px}
.nav-right{display:flex;align-items:center;gap:13px}
.ask{display:flex;align-items:center;gap:9px;border:1px solid var(--ac);
  border-radius:20px;padding:9px 15px;white-space:nowrap;cursor:default}
.ask span{font-size:12px;font-weight:600;color:var(--ac)}
.ask kbd{font-family:var(--mono);font-size:9.5px;color:var(--dim);
  border-left:1px solid var(--rule);padding-left:9px}
.avatar{width:26px;height:26px;border-radius:50%;background:var(--panel2)}
.btn{background:var(--ac);color:var(--bg);font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;padding:10px 17px;border-radius:4px}
.btn.ghost{background:transparent;border:2px solid var(--rule);color:var(--fg)}
.btn.lg{font-size:13.5px;padding:16px 30px;border-radius:0}
.btn.ghost.lg{padding:14px 30px}

/* strips */
.bar{background:var(--panel);border-bottom:1px solid var(--rule);
  font-family:var(--mono);font-size:10px;letter-spacing:.07em;color:var(--amb)}
.bar-in{max-width:1320px;margin:0 auto;padding:7px 30px;display:flex;
  align-items:center;gap:10px;flex-wrap:wrap}
.dot{width:5px;height:5px;border-radius:50%;background:var(--amb);flex:0 0 auto}
.bar .q{color:var(--dim)}
.samp{border-bottom:1px dotted var(--dim);padding-bottom:1px}

/* section head */
.head{padding:34px 0 18px;display:flex;align-items:flex-end;
  justify-content:space-between;gap:30px;flex-wrap:wrap}
.kick{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ac);margin-bottom:8px}
.head h1,.head h2{font-family:var(--anton);font-size:34px;line-height:1.04;
  text-transform:uppercase;text-wrap:balance}
.head p{margin:0;font-size:13px;line-height:1.6;color:var(--mut);
  max-width:44ch;text-wrap:pretty}

/* chips + pills */
.pos{display:inline-block;font-family:var(--mono);font-size:9px;font-weight:700;
  letter-spacing:.04em;border:1px solid currentColor;border-radius:2px;
  padding:1px 4px;line-height:1.3}
.pos.qb{color:var(--qb)} .pos.rb{color:var(--rb)}
.pos.wr{color:var(--wr)} .pos.te{color:var(--te)}
.pill{font-family:var(--body);font-size:11.5px;font-weight:600;padding:7px 15px;
  border-radius:4px;background:var(--panel2);color:var(--mut);cursor:default}
.pill.on{background:var(--ac);color:var(--bg)}
.pill.mono{font-family:var(--mono);font-size:11px;font-weight:700;padding:7px 13px}
.pills{display:flex;gap:6px;flex-wrap:wrap}
.tag{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.08em;
  border:1px solid currentColor;border-radius:2px;padding:2px 7px;white-space:nowrap}
.tag.ac{color:var(--ac)} .tag.amb{color:var(--amb)}
.tag.neg{color:var(--neg)} .tag.dim{color:var(--dim)}

/* panels */
.panel{border:1px solid var(--rule);background:var(--panel)}
.panel.ac{border-color:var(--ac)}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:12px 20px;border-bottom:1px solid var(--rule)}
.panel-h h2{font-family:var(--anton);font-size:16px;text-transform:uppercase}
.panel-h .meta{font-family:var(--mono);font-size:10px;letter-spacing:.07em;color:var(--dim)}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media(max-width:980px){.grid2,.grid3,.grid4{grid-template-columns:1fr}}

/* tables */
table{border-collapse:collapse;width:100%;min-width:900px}
th{font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;color:var(--dim);
  text-transform:uppercase;font-weight:400;text-align:left;padding:9px 10px;
  border-bottom:1px solid var(--rule);white-space:nowrap}
td{padding:10px;border-bottom:1px solid oklch(0.20 0.012 265);font-size:13px}
tbody tr:nth-child(odd){background:var(--panel)}
.num{font-family:var(--mono);text-align:right}
th.num{text-align:right}
.nm{font-weight:600}
.up{color:var(--ac);font-weight:600} .down{color:var(--neg);font-weight:600}
.meter{height:5px;background:oklch(0.24 0.012 265);border-radius:3px;overflow:hidden;min-width:60px}
.meter i{display:block;height:100%;background:var(--ac)}
.meter.neg i{background:var(--neg)}
.range{position:relative;height:6px;background:oklch(0.24 0.012 265);
  border-radius:3px;overflow:hidden;min-width:90px}
.range i{position:absolute;top:0;bottom:0;background:oklch(0.42 0.06 155)}
.range b{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--ac)}

/* responsive */
@media(max-width:900px){
  .nav-in{height:auto;padding:10px 16px;flex-wrap:wrap;gap:10px}
  .nav-links{order:3;width:100%;overflow-x:auto;gap:16px;padding-bottom:4px;
    -webkit-overflow-scrolling:touch}
  .nav-links a{white-space:nowrap}
  .nav-links a.on{padding-bottom:2px}
  .ask kbd{display:none}
  .ask{padding:8px 12px}
  .wrap{padding:0 16px}
  .bar-in{padding:7px 16px}
  .head{padding:24px 0 14px}
  .head h1{font-size:27px}
  .dr-cols{grid-template-columns:minmax(0,1fr) !important}
}
@media(max-width:520px){
  .btn.lg{width:100%;text-align:center}
}

/* footer */
footer{border-top:1px solid var(--rule);margin-top:40px;background:oklch(0.115 0.012 265)}
.foot-in{max-width:1320px;margin:0 auto;padding:26px 30px 34px;display:flex;
  justify-content:space-between;gap:24px;flex-wrap:wrap;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--dim)}
.foot-in a:hover{color:var(--mut)}
