:root {
  --bg:#050505;
  --panel:#11110e;
  --panel2:#1b1a12;
  --stroke:#39382d;
  --text:#f6f6f1;
  --sub:#b9b9ad;
  --aqua:#EBFF00;
  --purple:#ffaf24;
  --gold:#EBFF00;
}
body {
  background:radial-gradient(ellipse 70% 42% at 83% 4%,#332900 0,transparent 70%),
    radial-gradient(ellipse 75% 40% at 0 54%,#201b07 0,transparent 72%),#050505;
}
header {background:#090905ed;border-bottom-color:#383525;backdrop-filter:blur(16px)}
nav {max-width:1240px}
.container {max-width:1240px}
.brand {font-size:15px}
.brand em {color:var(--aqua)}
nav .links a:hover,nav .links a[aria-current=page] {color:#EBFF00}
.hero {
  grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);
  align-items:center;
  gap:clamp(22px,3vw,52px);
  padding:62px 0 34px;
}
.hero-copy {position:relative;z-index:1}
.hero .eyebrow {display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:11px}
.concept-pill {display:inline-block;padding:5px 8px;border:1px solid #9d8810;color:#EBFF00;background:#342b0633;font-size:9px;letter-spacing:.12em}
h1 {font-size:clamp(42px,5.1vw,73px);letter-spacing:-.065em;margin-top:23px}
.hero p {font-size:17px;line-height:1.7}
.heroactions {margin:30px 0 23px}
.btn {border-radius:4px;background:#191914;border-color:#575244;color:#f7f7ef}
.btn.main {background:#EBFF00;color:#111107;box-shadow:0 5px 30px #EBFF0026}
.btn.main:hover {background:#EBFF00;filter:none;box-shadow:0 5px 35px #EBFF0050}
.tag {border-radius:3px;color:#e5dfbd;border-color:#746a39;background:#1b190c}
.notice {background:#3126027a;border-color:#8a6b18;border-radius:5px;color:#e8d69b;max-width:575px;margin-top:24px}
.pass-feature {
  min-width:0;
  margin:0;
  border:1px solid #65571e;
  background:linear-gradient(135deg,#171505,#080808 58%);
  box-shadow:0 18px 70px #000b,0 0 70px #EBFF0020;
  position:relative;
}
.pass-feature:before {content:"";position:absolute;inset:-1px;pointer-events:none;border-top:2px solid #EBFF00;z-index:1}
.pass-art {overflow:hidden;background:#000}
.pass-art img {display:block;width:100%;height:auto;aspect-ratio:1.16;object-fit:cover;object-position:center 53%}
.pass-feature figcaption {
  display:flex;justify-content:space-between;align-items:center;gap:18px;
  padding:18px 22px 20px;border-top:1px solid #524818;
  background:linear-gradient(90deg,#181707,#0d0d0b);
}
.pass-feature figcaption>div {display:grid;gap:3px}
.pass-feature .smallhead {font-size:10px;margin:0;color:#e4d451}
.pass-feature figcaption strong {font-size:19px;letter-spacing:-.03em}
.pass-feature figcaption .muted {font-size:12px}
#pass-status {white-space:nowrap;color:#EBFF00}
.explain {background:#17160e;border-left-color:#EBFF00;color:#d7d4bd}
.explain a {color:#EBFF00;text-underline-offset:3px}
.box,.card,.metric {background:linear-gradient(150deg,#1b1a12,#0d0d0c);border-color:#44402d;border-radius:5px}
.metric {min-height:112px}
.metric b {color:#faf5cc}
.tab {border-color:#514b32;background:#191810;color:#ddd9c2;border-radius:3px}
.tab[aria-selected=true] {background:#EBFF00;color:#151305}
.task {background:#14140f;border-color:#403c2c;border-radius:4px}
.task input {accent-color:#EBFF00}
.task a {display:inline-block;margin-top:4px;color:#e2d363}
.progress {background:#3b3824}
.progress>div {background:linear-gradient(90deg,#d7a500,#EBFF00)}
.reward {border-color:#484431;border-radius:3px}
.reward.unlocked {border-color:#c7a925;background:#36300c77}
.xp,.smallhead,.toast {color:#EBFF00}
.foot {border-color:#3a3725}
.section[id] {scroll-margin-top:108px}
.skip:focus {background:#141309}
@media(max-width:980px) {
  .hero {grid-template-columns:1fr;max-width:760px;margin:auto;padding-top:43px}
  .hero-copy {max-width:700px}
  .pass-art img {aspect-ratio:1.24}
}
@media(max-width:540px) {
  nav {gap:9px}
  nav .links {gap:12px;font-size:12px}
  .hero {padding:25px 0 14px;gap:25px}
  .pass-feature {order:-1}
  h1 {font-size:clamp(38px,10vw,54px);margin-top:19px}
  .hero p {font-size:15px;line-height:1.65}
  .heroactions {margin:23px 0 18px}
  .pass-art img {aspect-ratio:1.13;object-position:center 54%}
  .pass-feature figcaption {padding:13px;align-items:flex-start;flex-direction:column;gap:10px}
  .pass-feature figcaption strong {font-size:17px}
  .pass-feature .smallhead {font-size:9px}
  .metric {min-height:100px}
}
.pass-discovery{display:flex;flex-wrap:wrap;align-items:center;gap:6px 13px;margin:17px 0 0;padding:13px 15px;border-left:2px solid #EBFF00;background:#1b1a0e;color:#e6dfba}
.pass-discovery>span{font-size:10px;font-weight:800;letter-spacing:.13em;color:#d8c354}
.pass-discovery>a{font-size:13px;font-weight:800;color:#EBFF00;text-underline-offset:3px}
.pass-discovery>small{width:100%;font-size:12px;color:#aaa589}
@media(max-width:540px){.pass-discovery{align-items:flex-start;flex-direction:column;padding:12px}}
.pass-ecosystem{border-block:1px solid #504823;padding:30px 0 34px}
.pass-ecosystem-heading{max-width:780px}.pass-ecosystem h2{font-size:clamp(25px,3vw,37px);margin:9px 0}.pass-ecosystem p{font-size:13px;margin:0 0 20px;line-height:1.55}
.pass-ecosystem-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.pass-ecosystem-grid a{min-width:0;display:flex;flex-direction:column;gap:8px;min-height:155px;padding:20px;border:1px solid #5d522b;background:linear-gradient(135deg,#22200f,#11120f);text-decoration:none}
.pass-ecosystem-grid a:hover{border-color:#EBFF00}.pass-ecosystem-grid span{color:#e6cd54;letter-spacing:.1em;font-size:10px;font-weight:800}.pass-ecosystem-grid strong{color:#f5f2de;font-size:19px;line-height:1.1}.pass-ecosystem-grid small{color:#b8b299;font-size:11px;margin-top:auto}
@media(max-width:850px){.pass-ecosystem-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.pass-ecosystem-grid{grid-template-columns:1fr}.pass-ecosystem-grid a{min-height:126px;padding:17px}}

/* Season 0 keeps its layout and artwork; the official families now load. */
@font-face{font-family:Orbitron;src:url('/fonts/Orbitron-Black.ttf') format('truetype');font-style:normal;font-weight:900;font-display:swap}
body{font-family:'Space Grotesk',system-ui,sans-serif;font-variant-numeric:tabular-nums}
.brand,h1,.eyebrow{font-family:Orbitron,'Space Grotesk',system-ui,sans-serif}
h1{font-weight:900;line-height:1.14;letter-spacing:-.045em;overflow-wrap:anywhere}
.btn,button,nav,.task,.metric,.card,.foot{font-family:'Space Grotesk',system-ui,sans-serif}
@media(max-width:600px){h1{font-size:clamp(31px,8.3vw,48px)}.brand{font-size:clamp(12px,3vw,15px)}.hero,.pass-feature{min-width:0}}
