:root{
  --paper:#F3EADA;
  --paper-2:#EADFC8;
  --card:#FBF6EC;
  --ink:#191510;
  --ink-2:#6A6153;
  --line:#DDCEB2;
  --red:#DE4B3C;
  --red-dk:#A5301F;
  --red-lt:#F0705F;
  --gold:#F5C243;
  --gold-dk:#C99514;
  --teal:#0F9B8E;
  --violet:#6C4FD8;
  --steel:#CDD2D9;
  --steel-dk:#8B929C;
  --steel-lt:#EDF0F4;
  --r-lg:34px;
  --r-md:22px;
  --r-sm:14px;
  --pop:cubic-bezier(.22,1.4,.36,1);
  --ease:cubic-bezier(.22,.61,.36,1);
  --f-disp:"Fredoka","Trebuchet MS",sans-serif;
  --f-body:"Instrument Sans",system-ui,-apple-system,sans-serif;
  --f-mono:"Space Mono",ui-monospace,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--f-body); font-size:17px; line-height:1.62;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--f-disp); font-weight:600; letter-spacing:-.02em; margin:0}
kbd{font-family:var(--f-mono); font-size:.78em; background:var(--card);
  border:1px solid var(--line); border-bottom-width:2px; border-radius:6px; padding:1px 6px}
.skip{position:absolute; left:-9999px; top:0; z-index:99;
  background:var(--ink); color:var(--paper); padding:10px 16px; border-radius:0 0 12px 0}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--violet); outline-offset:3px; border-radius:6px}
.grain{
  position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.30;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
}
.wash{position:fixed; z-index:0; pointer-events:none; border-radius:50%; filter:blur(90px)}
.wash--a{width:60vw; height:60vw; max-width:620px; max-height:620px;
  top:-12vw; right:-14vw; background:rgba(245,194,67,.34)}
.wash--b{width:52vw; height:52vw; max-width:520px; max-height:520px;
  bottom:6vh; left:-16vw; background:rgba(15,155,142,.20)}
main,.nav,.foot{position:relative; z-index:1}
.micro{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.20em;
  text-transform:uppercase; color:var(--ink-2); margin:0 0 14px;
}
.nav{position:sticky; top:0; z-index:40; padding:12px 0;
  backdrop-filter:blur(12px) saturate(1.2);
  background:linear-gradient(rgba(243,234,218,.92),rgba(243,234,218,.62));
  border-bottom:1px solid rgba(221,206,178,.8)}
.nav__in{max-width:1180px; margin:0 auto; padding:0 26px;
  display:flex; align-items:center; gap:20px}
.nav__mark{font-family:var(--f-disp); font-weight:600; font-size:15px;
  letter-spacing:.06em; text-decoration:none; display:flex; align-items:center; gap:9px}
.nav__cap{width:16px; height:16px; border-radius:50%;
  background:linear-gradient(#FBEFDA 0 50%, var(--red) 50% 100%);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.nav__links{margin-left:auto; display:flex; gap:22px}
.nav__links a{font-size:14px; text-decoration:none; color:var(--ink-2);
  transition:color .18s var(--ease)}
.nav__links a:hover{color:var(--ink)}
.nav__count{display:flex; align-items:baseline; gap:8px;
  background:var(--ink); color:var(--paper); padding:6px 13px; border-radius:999px}
.nav__countLabel{font-family:var(--f-mono); font-size:9px; letter-spacing:.16em; opacity:.65}
.nav__count b{font-family:var(--f-disp); font-size:15px; font-weight:600}
.hero{max-width:1180px; margin:0 auto; padding:64px 26px 40px;
  display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center}
.hero__h1{font-size:clamp(38px,5.2vw,64px); line-height:1.04; letter-spacing:-.035em}
.hero__h1 em{font-style:normal; color:var(--red);
  background:linear-gradient(transparent 62%, rgba(245,194,67,.55) 62%)}
.hero__lede{max-width:50ch; color:#3A342B; margin:20px 0 24px}
.hero__lede strong{font-weight:600}
.hero__lede a{color:var(--teal); text-decoration-thickness:1px; text-underline-offset:3px}
.pill{display:inline-flex; align-items:center; gap:9px;
  background:rgba(251,246,236,.75); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-radius:999px; padding:7px 15px}
.pill__led{width:7px; height:7px; border-radius:50%; background:var(--teal);
  box-shadow:0 0 0 0 rgba(15,155,142,.55); animation:led 2.4s ease-in-out infinite}
@keyframes led{
  0%,100%{box-shadow:0 0 0 0 rgba(15,155,142,.5)}
  50%{box-shadow:0 0 0 6px rgba(15,155,142,0)}
}
.pill__txt{font-family:var(--f-mono); font-size:10.5px; letter-spacing:.13em}
.hero__facts{list-style:none; display:flex; gap:30px; margin:30px 0 0; padding:0; flex-wrap:wrap}
.hero__facts li{display:flex; flex-direction:column}
.hero__facts b{font-family:var(--f-disp); font-size:30px; font-weight:600; line-height:1}
.hero__facts span{font-family:var(--f-mono); font-size:10px; letter-spacing:.11em;
  text-transform:uppercase; color:var(--ink-2); margin-top:5px}
.stage{display:flex; flex-direction:column; align-items:center; gap:16px}
.machine{width:min(330px,86vw); position:relative; user-select:none}
.dome{
  position:relative; width:100%; aspect-ratio:1/.86;
  border-radius:50% 50% 16px 16px / 62% 62% 16px 16px;
  background:
    radial-gradient(ellipse 70% 60% at 32% 22%, rgba(255,255,255,.95), rgba(255,255,255,.18) 60%, transparent 72%),
    linear-gradient(175deg, rgba(255,255,255,.5), rgba(206,220,228,.55));
  box-shadow:
    inset 0 -14px 26px rgba(120,132,142,.35),
    inset 0 6px 14px rgba(255,255,255,.9),
    inset 0 0 0 2px rgba(255,255,255,.75),
    0 16px 26px -14px rgba(40,32,20,.4);
  overflow:hidden; isolation:isolate;
}
.dome__caps{position:absolute; inset:0}
.dome__glass{position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(255,255,255,.42) 0 26%, transparent 42%);
  pointer-events:none}
.dome__spec{position:absolute; inset:-20%; pointer-events:none;
  background:radial-gradient(circle 120px at var(--sx,30%) var(--sy,22%),
    rgba(255,255,255,.85), rgba(255,255,255,0) 68%);
  opacity:0; transition:opacity .3s var(--ease); mix-blend-mode:screen}
.machine:hover .dome__spec,.machine.is-touched .dome__spec{opacity:1}
.dcap{position:absolute; border-radius:50%; transform:translate(-50%,-50%) rotate(var(--rot,0deg));
  box-shadow:inset 0 -3px 5px rgba(0,0,0,.22), inset 0 2px 3px rgba(255,255,255,.7)}
.dcap::after{content:""; position:absolute; left:18%; top:14%; width:34%; height:24%;
  border-radius:50%; background:rgba(255,255,255,.75)}
.neck{width:74%; height:16px; margin:-6px auto 0;
  background:linear-gradient(var(--red-dk),var(--red)); border-radius:6px 6px 0 0}
.body{
  position:relative; padding:20px 20px 26px; border-radius:20px 20px 8px 8px;
  background:linear-gradient(178deg,var(--red-lt) 0%, var(--red) 22%, var(--red-dk) 100%);
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,.42),
    inset 0 -18px 24px rgba(0,0,0,.24),
    0 14px 0 #7E2214,
    0 30px 40px -22px rgba(40,20,10,.7);
}
.body__topline{position:absolute; left:14px; right:14px; top:9px; height:2px;
  background:rgba(255,255,255,.3); border-radius:2px}
.plate{
  display:flex; align-items:center; gap:9px; margin:6px 0 18px;
  background:linear-gradient(#F6F1E6,#D9D2C4);
  border:1px solid rgba(0,0,0,.22); border-radius:8px; padding:8px 11px;
  box-shadow:inset 0 1px 0 #fff, inset 0 -2px 4px rgba(0,0,0,.16);
}
.plate__lamp{width:9px; height:9px; border-radius:50%; flex:none;
  background:#9A9186; box-shadow:inset 0 1px 2px rgba(0,0,0,.5);
  transition:background .25s var(--ease), box-shadow .25s var(--ease)}
.plate.is-ready .plate__lamp{background:#3FD08A;
  box-shadow:0 0 8px rgba(63,208,138,.9), inset 0 1px 2px rgba(0,0,0,.25)}
.plate__txt{font-family:var(--f-mono); font-weight:700; font-size:11px; letter-spacing:.15em;
  color:#2A241B; flex:1}
.plate__stock{font-family:var(--f-mono); font-size:9.5px; letter-spacing:.1em; color:#6C6355}
.plate__stock b{color:#2A241B}
.controls{display:flex; align-items:flex-end; justify-content:space-between; gap:10px}
.brandplate{flex:1; text-align:center; padding-bottom:11px; line-height:1.28;
  font-family:var(--f-disp); font-weight:600; letter-spacing:.04em; font-size:11px;
  white-space:nowrap; color:rgba(116,24,13,.7); text-shadow:0 1px 0 rgba(255,255,255,.32)}
.brandplate span{display:block}
.brandplate__rule{height:1px; margin:7px 14% 6px;
  background:linear-gradient(90deg,transparent,rgba(116,24,13,.45),transparent)}
.brandplate__fine{font-family:var(--f-mono); font-weight:700; font-size:7.5px;
  letter-spacing:.07em; color:rgba(255,255,255,.62); text-shadow:none}
.controls__cap{font-family:var(--f-mono); font-size:8.5px; letter-spacing:.14em;
  color:rgba(255,255,255,.72); text-align:center; margin:9px 0 0}
.slotwrap{display:flex; flex-direction:column; align-items:center; position:relative}
.slot{width:13px; height:34px; border-radius:7px;
  background:linear-gradient(#1A120C,#3A2A1E);
  box-shadow:inset 0 2px 4px rgba(0,0,0,.9), 0 1px 0 rgba(255,255,255,.28);
  display:grid; place-items:center}
.slot i{width:4px; height:24px; border-radius:3px; background:#0B0703}
.coin{
  position:absolute; top:-36px; left:50%; margin-left:-32px;
  width:30px; height:30px; border-radius:50%; border:0; cursor:pointer; padding:0;
  transform:rotate(-16deg);
  background:
    radial-gradient(circle at 34% 28%, #FFE9A8, #E9B93A 46%, #B7860F 100%);
  box-shadow:0 4px 0 #8C6208, 0 8px 12px -4px rgba(0,0,0,.5),
    inset 0 1px 2px rgba(255,255,255,.9);
  display:grid; place-items:center;
  transition:transform .18s var(--pop), box-shadow .18s var(--ease);
}
.coin:hover{transform:translateY(-5px) rotate(6deg)}
.coin:active{transform:translateY(2px) rotate(-16deg); box-shadow:0 1px 0 #8C6208}
.coin.is-wait::after{content:""; position:absolute; inset:-7px; border-radius:50%;
  border:2px solid rgba(245,194,67,.9); animation:ring 1.9s ease-out infinite; pointer-events:none}
.coin__face{font-family:var(--f-mono); font-weight:700; font-size:10px; color:#6E4C05}
.coin.is-in{animation:coinIn .55s var(--ease) forwards; pointer-events:none}
@keyframes coinIn{
  40%{transform:translate(20px,6px) rotate(70deg) scale(.92)}
  100%{transform:translate(32px,44px) rotate(220deg) scale(.26); opacity:0}
}
.knobwrap{display:flex; flex-direction:column; align-items:center}
.knob{position:relative; width:88px; height:88px; border-radius:50%; cursor:grab;
  touch-action:none;
  background:radial-gradient(circle at 34% 28%, #F6F9FC, #C3CAD3 44%, #878E97 74%, #6A7078);
  box-shadow:0 6px 0 #545A62, 0 14px 20px -8px rgba(0,0,0,.6),
    inset 0 2px 3px rgba(255,255,255,.8);
  transition:filter .25s var(--ease), opacity .25s var(--ease)}
.knob.is-locked{filter:grayscale(.6) brightness(.8); opacity:.7; cursor:not-allowed}
.knob:active{cursor:grabbing}
.knob__knurl{position:absolute; inset:0; border-radius:50%; will-change:transform;
  background:repeating-conic-gradient(from 0deg,
    #E9EEF4 0 6deg, #7F868F 6deg 12deg);
  -webkit-mask:radial-gradient(circle, transparent 0 47%, #000 49%);
          mask:radial-gradient(circle, transparent 0 47%, #000 49%)}
.knob__grip{position:absolute; left:50%; top:3px; margin-left:-5px;
  width:10px; height:19px; border-radius:3px 3px 6px 6px;
  background:linear-gradient(var(--gold),#C9930F);
  box-shadow:0 1px 2px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.8)}
.knob__light{position:absolute; inset:0; border-radius:50%; pointer-events:none; opacity:.55;
  background:conic-gradient(from 210deg, rgba(255,255,255,.9), rgba(0,0,0,.5) 38%,
    rgba(255,255,255,.7) 62%, rgba(0,0,0,.4) 88%, rgba(255,255,255,.85));
  mix-blend-mode:overlay}
.knob__hub{position:absolute; inset:28%; border-radius:50%;
  background:radial-gradient(circle at 36% 30%, #FFF, #B9C0C9 52%, #7C838D);
  box-shadow:inset 0 -2px 4px rgba(0,0,0,.45), 0 1px 2px rgba(255,255,255,.7),
    0 0 0 2px rgba(70,76,84,.35)}
.knob__hub::after{content:""; position:absolute; left:22%; right:22%; top:calc(50% - 1.5px);
  height:3px; border-radius:2px; background:rgba(80,86,94,.55)}
.knob::before{
  content:""; position:absolute; inset:-11px; border-radius:50%; pointer-events:none;
  background:conic-gradient(var(--gold) calc(var(--turn,0)*1deg), rgba(255,255,255,.22) 0);
  -webkit-mask:radial-gradient(circle, transparent 0 calc(50% - 4px), #000 calc(50% - 3px));
          mask:radial-gradient(circle, transparent 0 calc(50% - 4px), #000 calc(50% - 3px));
}
.chute{margin-top:18px; height:26px; border-radius:8px 8px 4px 4px;
  background:linear-gradient(#1D1209,#402C1C);
  box-shadow:inset 0 5px 10px rgba(0,0,0,.85), inset 0 -1px 0 rgba(255,255,255,.15);
  display:grid; place-items:center}
.chute span{width:64%; height:5px; border-radius:4px; background:rgba(0,0,0,.6)}
.tray{
  position:relative; margin:0 16px; min-height:124px; padding:14px;
  border-radius:0 0 20px 20px;
  background:linear-gradient(rgba(190,204,214,.42),rgba(224,234,240,.62));
  border:1px solid rgba(255,255,255,.7); border-top:0;
  box-shadow:inset 0 8px 18px rgba(80,96,110,.28), 0 10px 20px -14px rgba(0,0,0,.5);
  display:grid; place-items:center;
}
.tray__hint{font-family:var(--f-mono); font-size:9.5px; letter-spacing:.16em;
  text-transform:uppercase; color:#7E8794; margin:0}
.tray__holder{position:absolute; inset:0; display:grid; place-items:center; padding:18px 12px 12px}
.tray__lip{position:absolute; left:0; right:0; bottom:0; height:12px;
  background:linear-gradient(rgba(255,255,255,.5),rgba(255,255,255,0))}
.stage__note{font-family:var(--f-mono); font-size:10.5px; line-height:1.7;
  letter-spacing:.06em; color:var(--ink-2); text-align:center; max-width:34ch; margin:0}
.drop{width:68px; animation:dropIn .78s var(--ease) both}
@keyframes dropIn{
  0%{transform:translateY(-190px) rotate(-40deg); opacity:0}
  38%{opacity:1}
  56%{transform:translateY(6px) rotate(6deg)}
  72%{transform:translateY(-16px) rotate(-4deg)}
  86%{transform:translateY(3px) rotate(2deg)}
  100%{transform:translateY(0) rotate(0)}
}
.drop .cap{cursor:pointer}
.drop.is-fresh .cap__ball::after{
  content:""; position:absolute; inset:-8px; border-radius:50%;
  border:2px solid rgba(245,194,67,.9); animation:ring 1.6s ease-out infinite;
}
@keyframes ring{
  0%{transform:scale(.9); opacity:.9}
  100%{transform:scale(1.28); opacity:0}
}
.drop__tag{font-family:var(--f-mono); font-size:9px; letter-spacing:.14em;
  text-transform:uppercase; color:#5E6773; text-align:center; margin:6px 0 0}
.cap{position:relative; width:100%; aspect-ratio:1; container-type:inline-size}
.cap__tilt{position:absolute; inset:0; transform-style:preserve-3d;
  transition:transform .32s var(--ease)}
.cap__ball{position:absolute; inset:0}
.cap__half{position:absolute; left:0; right:0; height:50%;
  transition:transform .55s var(--pop)}
.cap__top{top:0; border-radius:50% 50% 0 0 / 100% 100% 0 0;
  background:
    radial-gradient(ellipse 46% 62% at 30% 34%, rgba(255,255,255,.95), rgba(255,255,255,.15) 68%),
    linear-gradient(170deg, color-mix(in srgb, var(--c) 26%, #FFFFFF),
                            color-mix(in srgb, var(--c) 54%, #FFFFFF));
  box-shadow:inset 0 -3cqw 5cqw rgba(0,0,0,.14);
  z-index:3}
.cap__bot{bottom:0; border-radius:0 0 50% 50% / 0 0 100% 100%;
  background:linear-gradient(var(--c), color-mix(in srgb, var(--c) 76%, #000));
  box-shadow:inset 0 -4cqw 7cqw rgba(0,0,0,.3), inset 0 2cqw 3cqw rgba(255,255,255,.25);
  display:grid; place-items:center; z-index:2}
.cap__mono{font-family:var(--f-disp); font-weight:700; color:rgba(255,255,255,.94);
  line-height:1; margin-top:2cqw; letter-spacing:-.02em;
  text-shadow:0 1px 2px rgba(0,0,0,.28)}
.cap__rim{position:absolute; left:1%; right:1%; top:calc(50% - 2.6cqw); height:5.2cqw;
  border-radius:50%; z-index:4;
  background:linear-gradient(rgba(0,0,0,.22), rgba(255,255,255,.42));
  transition:opacity .35s var(--ease)}
.cap__gloss{position:absolute; inset:0; border-radius:50%; pointer-events:none; z-index:5;
  background:radial-gradient(circle 40cqw at var(--gx,32%) var(--gy,26%),
    rgba(255,255,255,.62), rgba(255,255,255,0) 62%);
  opacity:0; transition:opacity .3s var(--ease); mix-blend-mode:screen}
.capcell:hover .cap__gloss,.cap:hover .cap__gloss{opacity:1}
.cap__shadow{position:absolute; left:12%; right:12%; bottom:-6%; height:9%;
  border-radius:50%; background:rgba(60,44,26,.26); filter:blur(6px); z-index:0}
.cap__prize{
  position:absolute; left:15%; right:15%; top:3%; z-index:1;
  display:flex; flex-direction:column; align-items:center; gap:2cqw;
  opacity:0; transform:translateY(16%) scale(.5);
  transition:opacity .3s var(--ease), transform .5s var(--pop);
}
.cap__prizeTok{width:34cqw; height:34cqw; border-radius:26%;
  background:linear-gradient(150deg,#FFF6E2,#F0E0BE);
  border:1px solid rgba(0,0,0,.16);
  box-shadow:0 3cqw 6cqw rgba(0,0,0,.24), inset 0 1px 0 #fff;
  display:grid; place-items:center;
  font-family:var(--f-disp); font-weight:700; font-size:13cqw; color:var(--c)}
.cap__prizeR{font-family:var(--f-mono); font-weight:700; font-size:7cqw;
  letter-spacing:.1em; color:var(--ink)}
.cap.is-open .cap__top{transform:translate(-12%,-54%) rotate(-20deg) scale(.92); z-index:0}
.cap.is-open .cap__bot{transform:translateY(12%)}
.cap.is-open .cap__rim{opacity:0}
.cap.is-open .cap__prize{opacity:1; transform:translateY(0) scale(1)}
.sec{max-width:1180px; margin:0 auto; padding:74px 26px}
.sechead{max-width:62ch; margin-bottom:30px}
.sechead h2{font-size:clamp(27px,3.5vw,42px); line-height:1.1}
.sechead__sub{color:var(--ink-2); margin:12px 0 0; font-size:15.5px}
.sechead__sub b{color:var(--ink); font-weight:600}
.banners{display:flex; flex-wrap:wrap; gap:9px; margin-bottom:26px}
.ban{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.11em; text-transform:uppercase;
  background:var(--card); color:var(--ink-2); cursor:pointer;
  border:1px solid var(--line); border-bottom-width:3px; border-radius:999px;
  padding:8px 15px; display:inline-flex; gap:7px; align-items:center;
  transition:transform .12s var(--ease), background .2s var(--ease), color .2s var(--ease);
}
.ban b{font-weight:700; opacity:.55}
.ban:hover{transform:translateY(-2px)}
.ban:active{transform:translateY(1px); border-bottom-width:1px}
.ban.is-on{background:var(--ink); color:var(--paper); border-color:var(--ink)}
.ban.is-on b{opacity:.6}
.capgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(178px,1fr)); gap:16px}
.capcell{
  position:relative; background:var(--card); border:1px solid var(--line);
  border-radius:var(--r-md); padding:36px 16px 16px; cursor:pointer;
  transition:transform .22s var(--ease), box-shadow .22s var(--ease), opacity .3s var(--ease);
  box-shadow:0 2px 0 rgba(221,206,178,.9);
}
.capcell:hover{transform:translateY(-4px); box-shadow:0 12px 22px -14px rgba(50,36,20,.55)}
.capcell.is-hidden{display:none}
.capcell.is-active{border-color:var(--ink); box-shadow:0 0 0 2px var(--ink)}
.capcell__r{
  position:absolute; top:11px; right:11px; z-index:6;
  font-family:var(--f-mono); font-weight:700; font-size:9px; letter-spacing:.1em;
  padding:3px 7px; border-radius:6px; color:#2B2418;
}
.r-SSR{background:linear-gradient(120deg,#FFE9A0,#F5C243); box-shadow:0 0 0 1px rgba(0,0,0,.14)}
.r-SR{background:#DDD4F7; box-shadow:0 0 0 1px rgba(0,0,0,.1); color:#3C2E76}
.r-R{background:#E2E6EA; box-shadow:0 0 0 1px rgba(0,0,0,.09); color:#4A5058}
.capcell__name{font-family:var(--f-disp); font-weight:600; font-size:16px;
  margin:16px 0 3px; line-height:1.2}
.capcell__meta{font-family:var(--f-mono); font-size:9.5px; letter-spacing:.08em;
  color:var(--ink-2); text-transform:uppercase}
.capcell__state{
  position:absolute; left:14px; top:13px; z-index:6;
  font-family:var(--f-mono); font-size:9px; letter-spacing:.1em; color:var(--ink-2)}
.detail{margin-top:20px}
.dpanel{
  display:grid; grid-template-columns:132px 1fr; gap:26px; align-items:start;
  background:linear-gradient(160deg, rgba(251,246,236,.9), rgba(251,246,236,.62));
  backdrop-filter:blur(10px);
  border:1px solid var(--line); border-radius:var(--r-lg); padding:26px 28px;
  box-shadow:0 24px 44px -34px rgba(50,36,20,.7);
  animation:panelIn .4s var(--ease) both;
}
@keyframes panelIn{from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none}}
.dpanel__plinth{
  border-radius:var(--r-md); padding:16px; display:grid; place-items:center;
  background:linear-gradient(160deg, color-mix(in srgb,var(--c) 22%,#fff), color-mix(in srgb,var(--c) 55%,#fff));
  border:1px solid rgba(0,0,0,.1); position:relative; overflow:hidden;
}
.dpanel__plinth::after{content:""; position:absolute; inset:0; opacity:.16; color:var(--c);
  background-image:radial-gradient(currentColor 1.5px, transparent 1.6px);
  background-size:10px 10px}
.dpanel__tok{position:relative; z-index:1; width:76px; height:76px; border-radius:24%;
  background:#fff; border:1px solid rgba(0,0,0,.12);
  box-shadow:0 8px 16px -8px rgba(0,0,0,.4);
  display:grid; place-items:center;
  font-family:var(--f-disp); font-weight:700; font-size:26px; color:var(--c)}
.dpanel h3{font-size:26px; margin-bottom:4px}
.dpanel__meta{font-family:var(--f-mono); font-size:10px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-2); margin:0 0 14px}
.dpanel__desc{margin:0 0 16px; color:#3A342B; max-width:62ch}
.dpanel__tags{display:flex; flex-wrap:wrap; gap:7px; list-style:none; padding:0; margin:0 0 18px}
.dpanel__tags li{font-family:var(--f-mono); font-size:10px; letter-spacing:.06em;
  background:var(--paper-2); border-radius:999px; padding:4px 11px}
.dpanel__foot{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.rowbtns{display:flex; gap:10px; margin-top:22px; flex-wrap:wrap}
.btn{
  font-family:var(--f-disp); font-weight:600; font-size:14.5px;
  border:0; cursor:pointer; text-decoration:none; display:inline-flex;
  align-items:center; justify-content:center; gap:8px;
  padding:12px 22px; border-radius:999px; background:var(--ink); color:var(--paper);
  box-shadow:0 4px 0 #000; transition:transform .12s var(--ease), box-shadow .12s var(--ease);
}
.btn:hover{transform:translateY(-2px); box-shadow:0 6px 0 #000}
.btn:active{transform:translateY(3px); box-shadow:0 1px 0 #000}
.btn--big{width:100%; margin-top:18px; background:var(--gold); color:#3A2A05;
  box-shadow:0 5px 0 var(--gold-dk); font-size:15px}
.btn--big:hover{box-shadow:0 7px 0 var(--gold-dk)}
.btn--big:active{box-shadow:0 1px 0 var(--gold-dk)}
.btn--big:disabled{background:#C9BFA8; color:#7E7561; box-shadow:0 5px 0 #A79E88;
  cursor:not-allowed; transform:none}
.btn--ghost{background:transparent; color:var(--ink);
  border:1px solid var(--line); border-bottom-width:3px; box-shadow:none}
.btn--ghost:hover{background:var(--card); transform:translateY(-2px); box-shadow:none}
.btn--ghost:active{transform:translateY(1px); border-bottom-width:1px}
.btn--link{background:var(--teal); color:#fff; box-shadow:0 4px 0 #0A6F66; font-size:13.5px;
  padding:10px 18px}
.btn--link:hover{box-shadow:0 6px 0 #0A6F66}
.btn--link:active{box-shadow:0 1px 0 #0A6F66}
.btn--sheen{position:relative; overflow:hidden; font-size:17px; padding:15px 30px}
.btn--sheen::after{
  content:""; position:absolute; top:0; bottom:0; width:44%; left:-60%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.42), transparent);
  transition:left .6s var(--ease);
}
.btn--sheen:hover::after{left:120%}
.sec--rates{padding-top:20px}
.rates{display:grid; gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden}
.rate{background:var(--card); padding:15px 20px;
  display:grid; grid-template-columns:1.1fr 2.2fr 74px; gap:20px; align-items:center}
.rate__n{display:flex; flex-direction:column}
.rate__n b{font-family:var(--f-disp); font-weight:600; font-size:16px}
.rate__n span{font-family:var(--f-mono); font-size:9.5px; letter-spacing:.09em;
  color:var(--ink-2); text-transform:uppercase; margin-top:2px}
.rate__bar{height:11px; border-radius:999px; background:var(--paper-2); overflow:hidden}
.rate__fill{display:block; height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg, var(--c), color-mix(in srgb,var(--c) 62%,#fff));
  transition:width 1s var(--ease)}
.rate__v{font-family:var(--f-mono); font-weight:700; font-size:14px; text-align:right}
.rate__stars{font-size:11px; letter-spacing:.08em; color:var(--gold-dk)}
.rates__foot{font-family:var(--f-mono); font-size:10.5px; letter-spacing:.06em;
  color:var(--ink-2); margin:14px 0 0}
.prizes{display:grid; grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); gap:16px}
.prize{position:relative; border-radius:var(--r-lg); padding:26px 24px 24px;
  overflow:hidden; display:flex; flex-direction:column}
.prize--gold{background:var(--gold); color:#40300A}
.prize--red{background:var(--red); color:#FFF4EE}
.prize--teal{background:var(--teal); color:#EAFFFB}
.prize--violet{background:var(--violet); color:#F1EDFF}
.prize__pat{position:absolute; right:-10px; top:-10px; width:118px; height:118px;
  opacity:.24; color:currentColor;
  background-image:radial-gradient(currentColor 1.6px, transparent 1.7px);
  background-size:11px 11px}
.prize__pat--hatch{background-image:repeating-linear-gradient(-45deg,
  currentColor 0 1.5px, transparent 1.5px 8px)}
.prize > *{position:relative; z-index:1}
.prize__n{font-family:var(--f-disp); font-weight:700; font-size:52px; line-height:.95;
  letter-spacing:-.03em}
.prize__l{font-family:var(--f-disp); font-weight:600; font-size:16px; margin-top:10px}
.prize__d{font-size:13.5px; line-height:1.5; opacity:.82; margin-top:8px}
.proof{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:34px}
.shot{margin:0}
.shot__img{position:relative; border-radius:var(--r-md); overflow:hidden;
  aspect-ratio:4/3; background:var(--paper-2)}
.shot__img img{width:100%; height:100%; object-fit:cover;
  filter:sepia(.18) grayscale(.16) contrast(1.03);
  transition:transform .5s var(--ease), filter .4s var(--ease)}
.shot:hover .shot__img img{transform:scale(1.045); filter:none}
.shot__img::after{content:""; position:absolute; inset:0; pointer-events:none;
  background:var(--red); mix-blend-mode:multiply; opacity:.10;
  transition:opacity .4s var(--ease)}
.shot:hover .shot__img::after{opacity:0}
.shot{position:relative}
.shot::before,.shot::after{content:""; position:absolute; width:22px; height:22px;
  border:2px solid var(--ink); pointer-events:none}
.shot::before{left:-7px; top:-7px; border-right:0; border-bottom:0; border-radius:4px 0 0 0}
.shot::after{right:-7px; bottom:-7px; border-left:0; border-top:0; border-radius:0 0 4px 0}
.shot figcaption{display:flex; flex-direction:column; margin-top:13px}
.shot figcaption b{font-family:var(--f-disp); font-weight:600; font-size:15px}
.shot figcaption span{font-family:var(--f-mono); font-size:10px; letter-spacing:.07em;
  color:var(--ink-2); margin-top:4px}
.leaders{margin:0; display:flex; flex-direction:column; gap:2px}
.lead{position:relative; display:flex; justify-content:space-between; gap:16px;
  align-items:baseline; padding:9px 0}
.lead::after{content:""; position:absolute; left:0; right:0; bottom:13px;
  border-bottom:1.5px dotted var(--line); z-index:0}
.lead dt,.lead dd{position:relative; z-index:1; background:var(--paper); margin:0}
.lead dt{padding-right:10px; font-weight:500}
.lead dd{padding-left:10px; font-family:var(--f-mono); font-size:11.5px;
  letter-spacing:.05em; color:var(--ink-2); white-space:nowrap}
.sec--contact{padding-bottom:40px}
.counterwin{
  background:var(--ink); color:var(--paper); border-radius:var(--r-lg);
  padding:clamp(34px,5vw,64px); text-align:center; position:relative; overflow:hidden;
}
.counterwin::before{content:""; position:absolute; inset:0; opacity:.10;
  background-image:radial-gradient(#F5C243 1.5px, transparent 1.6px); background-size:14px 14px}
.counterwin > *{position:relative; z-index:1}
.counterwin .micro{color:rgba(243,234,218,.6)}
.counterwin h2{font-size:clamp(28px,4.4vw,46px)}
.counterwin__sub{color:rgba(243,234,218,.72); max-width:46ch; margin:14px auto 26px}
.counterwin .btn--sheen{background:var(--gold); color:#3A2A05; box-shadow:0 5px 0 var(--gold-dk)}
.counterwin__links{list-style:none; display:flex; gap:22px; justify-content:center;
  flex-wrap:wrap; padding:0; margin:26px 0 0}
.counterwin__links a{font-family:var(--f-mono); font-size:11.5px; letter-spacing:.09em;
  color:rgba(243,234,218,.72); text-decoration:none;
  border-bottom:1px solid rgba(243,234,218,.28); padding-bottom:2px;
  transition:color .2s var(--ease), border-color .2s var(--ease)}
.counterwin__links a:hover{color:var(--gold); border-color:var(--gold)}
.foot{max-width:1180px; margin:0 auto; padding:26px; display:flex; gap:16px;
  justify-content:space-between; flex-wrap:wrap;
  font-size:13px; color:var(--ink-2); border-top:1px solid var(--line)}
.foot__mono{font-family:var(--f-mono); font-size:10px; letter-spacing:.14em}
.js .reveal{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease)}
.js .reveal.is-in{opacity:1; transform:none}
@media (max-width:920px){
  .hero{grid-template-columns:1fr; gap:44px; padding-top:40px}
  .stage{order:-1}
  .dpanel{grid-template-columns:1fr}
  .dpanel__plinth{max-width:150px}
  .rate{grid-template-columns:1fr; gap:9px}
  .rate__v{text-align:left}
  .nav__links{display:none}
}
@media (max-width:520px){
  body{font-size:16px}
  .sec{padding:54px 18px}
  .hero{padding:30px 18px 20px}
  .nav__in{padding:0 18px}
  .capgrid{grid-template-columns:repeat(2,1fr); gap:12px}
  .capcell{padding:30px 12px 13px}
  .capcell__name{font-size:14px}
  .lead{flex-direction:column; gap:2px}
  .lead::after{display:none}
  .lead dd{padding-left:0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .js .reveal{opacity:1; transform:none}
}