:root{
  --bg:#0b0c0f; --panel:#15161c; --panel2:#1c1e26; --line:#2a2c36;
  --gold:#d4af37; --gold-soft:rgba(212,175,55,.12);
  --text:#f3f2ec; --muted:#9a9ba4;
  --green:#33c88a; --green-soft:rgba(51,200,138,.14);
  --red:#e2574c; --red-soft:rgba(226,87,76,.14);
  --amber:#e0a63a; --blue:#4a90e2;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  overflow:hidden;-webkit-font-smoothing:antialiased;
}
#deck{position:relative;height:100vh;width:100vw}
.slide{
  position:absolute;inset:0;display:none;flex-direction:column;
  padding:5.2vh 6vw 8vh;opacity:0;transition:opacity .35s ease;
  overflow-y:auto;
}
.slide.active{display:flex;opacity:1}
.eyebrow{color:var(--gold);font-size:.82rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;margin-bottom:1.1rem}
h1{font-size:clamp(2rem,4.6vw,3.6rem);font-weight:600;line-height:1.08;letter-spacing:-.02em}
h2{font-size:clamp(1.5rem,3vw,2.4rem);font-weight:600;line-height:1.12;letter-spacing:-.015em;margin-bottom:.4rem}
h3{font-size:1.05rem;font-weight:600;color:var(--text)}
p{color:var(--muted);font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.65}
.lead{font-size:clamp(1.15rem,1.8vw,1.5rem);color:var(--text);line-height:1.5}
.gold{color:var(--gold)} .green{color:var(--green)} .red{color:var(--red)} .amber{color:var(--amber)}
strong{color:var(--text);font-weight:600}

/* cover */
.cover{justify-content:center}
.cover .brand{font-size:1.1rem;letter-spacing:.35em;color:var(--gold);font-weight:600;margin-bottom:2.5rem}
.cover h1{max-width:16ch}
.cover .sub{margin-top:1.6rem;font-size:1.15rem;color:var(--muted);max-width:52ch}
.cover .meta{margin-top:3rem;display:flex;gap:2.4rem;flex-wrap:wrap;color:var(--muted);font-size:.92rem}
.cover .meta b{color:var(--text);display:block;font-size:1.05rem;font-weight:600}

/* layout helpers */
.grid{display:grid;gap:1.1rem;margin-top:1.8rem}
.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:1.4rem 1.5rem}
.card.accent{border-color:rgba(212,175,55,.4);background:linear-gradient(180deg,var(--gold-soft),transparent)}
.card.good{border-color:rgba(51,200,138,.35)}
.card.bad{border-color:rgba(226,87,76,.4);background:linear-gradient(180deg,var(--red-soft),transparent)}
.stat{font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:700;letter-spacing:-.02em;line-height:1}
.stat.sm{font-size:clamp(1.4rem,2.4vw,2rem)}
.klabel{color:var(--muted);font-size:.9rem;margin-bottom:.6rem;font-weight:500}
.knote{color:var(--muted);font-size:.86rem;margin-top:.5rem;line-height:1.45}
.chartwrap{position:relative;width:100%;flex:1;min-height:0;margin-top:1.4rem}
.two-col{display:grid;grid-template-columns:1.05fr .95fr;gap:2.6rem;flex:1;min-height:0;align-items:center}
.two-col .chartwrap{height:100%}
ul.clean{list-style:none;margin-top:1.2rem;display:flex;flex-direction:column;gap:.95rem}
ul.clean li{display:flex;gap:.8rem;color:var(--text);font-size:1.05rem;line-height:1.45;align-items:flex-start}
ul.clean li .dot{flex:none;width:.55rem;height:.55rem;border-radius:50%;background:var(--gold);margin-top:.55rem}
ul.clean li.g .dot{background:var(--green)} ul.clean li.r .dot{background:var(--red)}
ul.clean li span.mut{color:var(--muted)}
.tag{display:inline-block;font-size:.78rem;font-weight:600;padding:.25rem .7rem;border-radius:20px;letter-spacing:.02em}
.tag.g{background:var(--green-soft);color:var(--green)} .tag.r{background:var(--red-soft);color:var(--red)} .tag.a{background:var(--gold-soft);color:var(--gold)}
table.mini{width:100%;border-collapse:collapse;margin-top:1.4rem;font-size:1rem}
table.mini th{text-align:left;color:var(--muted);font-weight:500;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;padding:.5rem .6rem;border-bottom:1px solid var(--line)}
table.mini td{padding:.62rem .6rem;border-bottom:1px solid rgba(42,44,54,.5)}
table.mini td.num{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.ask{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;margin-top:2rem}
.ask .card{position:relative;padding-top:2.4rem}
.ask .num{position:absolute;top:1.1rem;left:1.5rem;color:var(--gold);font-weight:700;font-size:1.1rem}
.footer-note{margin-top:auto;padding-top:1.4rem;color:var(--muted);font-size:.85rem;border-top:1px solid var(--line)}

/* nav */
#nav{position:fixed;bottom:0;left:0;right:0;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 2rem;background:linear-gradient(0deg,var(--bg),transparent);z-index:20}
#nav .dots{display:flex;gap:.5rem}
#nav .dots i{width:7px;height:7px;border-radius:50%;background:var(--line);cursor:pointer;transition:all .2s}
#nav .dots i.on{background:var(--gold);width:20px;border-radius:6px}
#nav button{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:9px;padding:.5rem .9rem;cursor:pointer;font-size:1rem;transition:.15s}
#nav button:hover{border-color:var(--gold);color:var(--gold)}
#nav .count{color:var(--muted);font-size:.85rem;font-variant-numeric:tabular-nums;min-width:52px;text-align:center}
#bar{position:fixed;top:0;left:0;height:3px;background:var(--gold);z-index:30;transition:width .35s ease}
.kbd{color:var(--muted);font-size:.8rem}
@media(max-width:760px){.two-col{grid-template-columns:1fr;gap:1.2rem}.g2,.g3,.g4,.ask{grid-template-columns:1fr}.slide{padding:4vh 6vw 9vh}}