@font-face{font-family:Bungee;src:url(fonts/bungee-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url(fonts/chakra-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url(fonts/chakra-700.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--night:#17063f;--deep:#240a63;--violet:#3b12a3;--vivid:#6a2cf5;--y:#ffe600;--amber:#ffb800;--pink:#ff4fb0;--text:#f6f1ff;--soft:#d8ccf8;--disp:Bungee,Impact,"Arial Black",sans-serif;--body:"Chakra Petch","Trebuchet MS",sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background-color:var(--deep);background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:28px 28px;color:var(--text);font:400 18px/1.6 var(--body);overflow-wrap:break-word}
img{display:block;max-width:100%;height:auto}
a{color:var(--y)}
h1,h2{font-family:var(--disp);font-weight:400;line-height:1.08;margin:0}
h2{font-size:clamp(25px,3.4vw,38px);color:#fff}
.wrap{width:min(1000px,100% - 32px);margin-inline:auto}
:focus-visible{outline:3px solid var(--pink);outline-offset:3px}

.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--y);color:var(--night);font:400 19px/1 var(--disp);text-decoration:none;padding:17px 28px;border-radius:12px;box-shadow:0 6px 0 var(--amber),0 10px 24px rgba(0,0,0,.35);transition:transform .12s,box-shadow .12s;text-align:center}
.btn:hover{transform:translateY(3px);box-shadow:0 3px 0 var(--amber),0 6px 14px rgba(0,0,0,.35)}
.btn:active{transform:translateY(6px);box-shadow:0 0 0 var(--amber)}
.btn-s{font-size:15px;padding:11px 18px;box-shadow:0 4px 0 var(--amber)}
.btn-xl{font-size:clamp(21px,2.3vw,30px);padding:clamp(18px,1.9vw,26px) clamp(24px,3.2vw,48px);border-radius:16px;box-shadow:0 8px 0 var(--amber),0 16px 34px rgba(255,214,0,.3)}

.top{background:var(--night);border-bottom:3px solid var(--vivid);position:relative;z-index:20}
.top-in{width:min(1320px,100% - 32px);margin-inline:auto;display:flex;align-items:center;gap:22px;height:72px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--soft);font-size:14px;line-height:1.1;flex:none}
.brand img{height:42px;width:auto}
.brand span{border-left:2px solid var(--vivid);padding-left:12px}
.nav{display:flex;gap:24px;margin-left:auto}
.nav a{color:#fff;text-decoration:none;font-weight:700;font-size:16px;padding:6px 0;border-bottom:3px solid transparent}
.nav a:hover,.nav a[aria-current]{border-color:var(--y)}
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;font-weight:700;font-size:15px;padding:9px 12px;border:2px solid var(--vivid);border-radius:8px}
.menu summary::-webkit-details-marker{display:none}
.menu-box{position:absolute;right:0;top:calc(100% + 10px);background:var(--night);border:2px solid var(--vivid);border-radius:10px;padding:8px;min-width:190px}
.menu-box a{display:block;color:#fff;text-decoration:none;padding:11px 12px;font-weight:700}

.stage{padding:18px 16px 26px;background:radial-gradient(70% 90% at 80% 30%,#7b22e8 0,transparent 70%)}
.cab{width:min(1320px,100%);margin-inline:auto;background:var(--night);border:5px solid var(--y);border-radius:26px;box-shadow:0 0 0 5px var(--violet),0 0 50px rgba(255,230,0,.25);overflow:hidden}
.cab-bar{display:flex;align-items:center;gap:14px;background:var(--y);color:var(--night);font:400 15px/1 var(--disp);padding:9px 22px}
.lights{display:flex;gap:7px}
.lights i{width:12px;height:12px;border-radius:50%;background:var(--pink);box-shadow:inset 0 -2px 0 rgba(0,0,0,.25)}
.lights i:nth-child(2){background:var(--vivid)}
.lights i:nth-child(3){background:var(--night)}
.screen{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(0,1fr);grid-template-areas:"h art" "n art" "c art" "g art";column-gap:18px;padding:30px 0 0 44px;background:radial-gradient(60% 90% at 84% 58%,#c02be0 0,#6a2cf5 45%,transparent 75%),linear-gradient(120deg,#2a0a78,#3b12a3);position:relative}
.screen h1{grid-area:h;font-size:clamp(36px,4vw,56px);color:#fff}
.nums{grid-area:n;display:flex;align-items:flex-end;gap:44px;margin-top:20px}
.nums p{margin:0;display:grid}
.nums small{font-size:18px;font-weight:700;color:#fff;line-height:1}
.nums span{font-size:18px;font-weight:700;color:#fff;line-height:1.2}
.n-big b{font:400 clamp(84px,8.6vw,124px)/.98 var(--disp);color:var(--y);text-shadow:0 5px 0 #b34bff}
.n-mid b{font:400 clamp(42px,4.5vw,64px)/1.05 var(--disp);color:var(--y)}
.art{grid-area:art;align-self:end;justify-self:end;position:relative;width:100%;max-width:500px;display:flex;justify-content:center}
.art:before{content:"";position:absolute;left:50%;bottom:-8%;width:92%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:repeating-conic-gradient(var(--y) 0 12deg,var(--amber) 12deg 24deg);opacity:.95}
.art img{position:relative;width:100%}
.chips{grid-area:c;display:grid;grid-template-columns:auto auto;justify-content:start;gap:12px;margin-top:20px;position:relative;z-index:2}
.chips p{margin:0;background:var(--night);border:2px solid var(--vivid);border-radius:12px;padding:10px 18px;display:grid}
.chips b{font:400 clamp(20px,2vw,28px)/1.15 var(--disp);color:#fff}
.chips span{font-size:16px;color:var(--soft);line-height:1.25}
.go{grid-area:g;display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;margin:26px 0 30px}
.terms{margin:0;font-size:15px;font-weight:700;color:#fff}

.ticker{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 34px;background:var(--y);color:var(--night);font:400 clamp(14px,1.6vw,19px)/1.2 var(--disp);padding:13px 16px}
.col{display:grid;gap:72px;padding:64px 0 80px}
.col>section{min-width:0}
.kick{font:700 16px/1 var(--body);color:var(--y);margin:0 0 10px;text-transform:uppercase;letter-spacing:.08em}
.col h2{margin-bottom:24px}
.check{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.check li{display:grid;gap:2px;background:var(--violet);border-radius:10px;padding:16px 20px 16px 60px;position:relative}
.check li:before{content:"";position:absolute;left:20px;top:20px;width:24px;height:24px;border-radius:6px;background:var(--y)}
.check li:after{content:"";position:absolute;left:26px;top:25px;width:12px;height:7px;border-left:3px solid var(--night);border-bottom:3px solid var(--night);transform:rotate(-45deg)}
.check b{font-size:20px;color:#fff;line-height:1.25}
.check span{color:var(--soft)}
.rack{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.rack figure{margin:0;border-radius:14px;overflow:hidden;box-shadow:0 6px 0 var(--night)}
.ladder{background:var(--y);color:var(--night);border-radius:22px;padding:32px clamp(18px,3.5vw,38px)}
.ladder h2{color:var(--night)}
.ladder .kick{color:var(--violet)}
.ladder>p{margin:18px 0 0;font-weight:700}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:end}
.steps li{background:var(--night);color:#fff;border-radius:14px;padding:16px;display:grid;justify-items:start}
.steps li:nth-child(2){padding-top:36px}
.steps li:nth-child(3){padding-top:58px;background:var(--violet)}
.steps span{font-size:16px;font-weight:700;color:var(--soft)}
.steps b{font:400 clamp(34px,5vw,58px)/1.05 var(--disp);color:var(--y)}
.steps em{font-style:normal;font-weight:700;font-size:18px}
.go-row{display:flex;align-items:center;flex-wrap:wrap;gap:14px 22px;margin-top:22px}
.ladder .btn{background:var(--night);color:var(--y);box-shadow:0 6px 0 var(--vivid)}
.go-row small{font-size:15px;font-weight:700}
.rooms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.room{border-radius:16px;overflow:hidden;position:relative;background:linear-gradient(180deg,var(--vivid),var(--pink));padding-top:12px}
.r2{background:linear-gradient(180deg,#1a9df0,var(--vivid))}
.r3{background:linear-gradient(180deg,var(--pink),var(--amber))}
.room img{margin-inline:auto;height:260px;width:auto;max-width:none}
.room b{position:absolute;inset:auto 0 0;background:var(--night);text-align:center;font:400 clamp(16px,2.2vw,22px)/1 var(--disp);padding:13px 4px}
.g-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.g-card{background:var(--violet);color:#fff;text-decoration:none;border-radius:14px;padding:20px 22px;display:grid;gap:4px;box-shadow:0 6px 0 var(--vivid);transition:box-shadow .15s,transform .15s}
.g-card:hover{box-shadow:0 6px 0 var(--y);transform:translateY(-3px)}
.g-card b{font:400 21px/1.15 var(--disp);color:var(--y)}
.g-card span{color:var(--soft)}
.faq{display:grid;gap:10px}
.faq details{background:var(--night);border-radius:12px;padding:15px 20px}
.faq summary{font-weight:700;font-size:19px;cursor:pointer;color:#fff}
.faq p{margin:10px 0 2px;color:var(--soft)}

.g-head{background:radial-gradient(60% 120% at 90% 0,#a227e6 0,transparent 70%),linear-gradient(120deg,#2a0a78,#3b12a3);padding:26px 0 30px;border-bottom:4px solid var(--y)}
.g-head-s{padding-bottom:26px}
.g-head-s h1{font-size:clamp(30px,4.4vw,46px)}
.g-grid{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:24px;align-items:end}
.g-head h1{font-size:clamp(28px,4vw,44px);color:#fff}
.g-art{height:172px;width:auto;margin-left:auto;margin-bottom:-10px}
.crumb{font-size:15px;margin:0 0 10px;color:var(--soft)}
.lede{font-size:20px;margin:12px 0 0;color:#fff}
.strip{margin-top:16px;background:var(--y);color:var(--night);border-radius:16px;display:flex;align-items:center;flex-wrap:wrap;gap:12px 30px;padding:14px 22px}
.strip-n{display:grid}
.strip-n b{font:400 clamp(25px,3vw,34px)/1 var(--disp)}
.strip-n span{font-size:14px;font-weight:700;line-height:1.3}
.strip-c{margin-left:auto;display:grid;justify-items:center;gap:9px}
.strip .btn{background:var(--night);color:var(--y);box-shadow:0 5px 0 var(--vivid);font-size:17px;padding:14px 20px}
.strip small{font-size:13.5px;font-weight:700}
.prose{padding:44px 0 72px;max-width:800px}
.prose h2{font-size:clamp(23px,2.9vw,31px);margin:44px 0 14px;color:var(--y)}
.prose p,.prose li{color:var(--text)}
.prose .notice{background:var(--night);box-shadow:inset 0 0 0 1px var(--pink);padding:14px 18px;border-radius:8px;font-size:16px}
.prose .rack{margin:38px 0}
.numbered{padding:0;list-style:none;counter-reset:s;display:grid;gap:10px}
.numbered li{counter-increment:s;background:var(--violet);border-radius:10px;padding:14px 18px 14px 62px;position:relative}
.numbered li:before{content:counter(s);position:absolute;left:14px;top:12px;width:34px;height:34px;display:grid;place-items:center;background:var(--y);color:var(--night);font:400 19px/1 var(--disp);border-radius:8px}
.ticks{padding:0;list-style:none;display:grid;gap:8px}
.ticks li{padding-left:28px;position:relative}
.ticks li:before{content:"";position:absolute;left:2px;top:9px;width:13px;height:13px;background:var(--y);transform:rotate(45deg)}
.pairs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.pairs div{background:var(--violet);border-radius:12px;padding:16px 18px}
.pairs b{color:var(--y)}
.pairs p{margin:6px 0 0;font-size:17px}
table{width:100%;border-collapse:collapse;background:var(--night);border-radius:12px;overflow:hidden}
th{background:var(--y);color:var(--night);text-align:left;font-size:16px}
th,td{padding:12px 16px}
tbody tr+tr td{border-top:1px solid var(--violet)}
.prose h2+.faq{margin-top:0}

.foot{background:var(--night);padding:36px 0;border-top:4px solid var(--vivid)}
.notice{margin:0 0 18px;font-size:16px;color:#fff}
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 24px;margin-bottom:14px}
.foot-note{font-size:14.5px;color:var(--soft);margin:0}
.sticky{display:none}

@media(max-width:900px){
  .nav,.top-in>.btn{order:0}
  .nav{display:none}
  .menu{display:block;order:3}
  .top-in{height:62px;gap:10px}
  .top-in>.btn{margin-left:auto}
  .brand img{height:36px}
  .brand span{display:none}
  body{padding-bottom:78px;font-size:17px}
  .sticky{display:flex;align-items:center;gap:10px;position:fixed;inset:auto 0 0;background:var(--night);border-top:3px solid var(--y);padding:9px 12px;z-index:30}
  .sticky .btn{flex:1;font-size:18px;padding:14px 10px;box-shadow:0 3px 0 var(--amber)}
  .sticky small{font-size:13px;font-weight:700;white-space:nowrap}
  .stage{padding:10px 8px 14px}
  .cab{border-width:3px;border-radius:18px;box-shadow:0 0 0 2px var(--violet)}
  .cab-bar{padding:6px 14px;font-size:12px}
  .lights i{width:9px;height:9px}
  .screen{grid-template-columns:minmax(0,56%) minmax(0,1fr);grid-template-areas:"h h" "n art" "c c" "g g";padding:14px 12px 16px;column-gap:0}
  .screen h1{font-size:clamp(23px,7.3vw,32px)}
  .nums{flex-direction:column;align-items:flex-start;gap:8px;margin-top:12px}
  .nums small,.nums span{font-size:14px}
  .n-big b{font-size:12.6vw;text-shadow:0 3px 0 #b34bff}
  .n-mid b{font-size:8.6vw}
  .art{max-width:none;margin-top:6px;align-self:end}
  .art:before{bottom:-14%;width:100%}
  .art img{width:112%;max-width:none;margin-left:-6%}
  .chips{grid-template-columns:1fr 1fr;margin-top:0;gap:8px}
  .chips p{padding:8px 10px}
  .chips b{font-size:clamp(14px,4.5vw,18px)}
  .chips span{font-size:13.5px}
  .go{margin:14px 0 0;justify-content:center;gap:12px}
  .go .btn{width:100%}
  .btn-xl{box-shadow:0 5px 0 var(--amber)}
  .terms{font-size:14px;text-align:center}
  .col{gap:52px;padding:44px 0 56px}
  .rack{grid-template-columns:repeat(4,44%);overflow-x:auto;padding-bottom:10px;scroll-snap-type:x proximity}
  .rack figure{scroll-snap-align:start}
  .room img{height:190px}
  .g-cards,.pairs{grid-template-columns:1fr}
  .g-grid{grid-template-columns:minmax(0,1fr) 92px;gap:12px}
  .g-art{height:118px}
  .lede{font-size:18px}
  .strip{gap:10px 18px;padding:12px 14px}
  .strip-c{margin:0;width:100%}
  .strip .btn{width:100%}
  th,td{padding:10px 12px}
}
@media(max-width:360px){
  .chips b{font-size:13px}
  .check li{padding-left:54px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.nums,.chips,.art{text-decoration:none;color:inherit}
.nums:hover b,.chips:hover b{color:#fff}
.art:hover img{transform:translateY(-4px)}
.art img{transition:transform .15s}
.nums{gap:28px;flex-wrap:wrap}
.nums b{white-space:nowrap}
.n-big b{font-size:clamp(64px,8vw,116px)}
.n-mid b{font-size:clamp(30px,3.6vw,52px)}
.ladder .kick{margin:0 0 10px}
@media(max-width:900px){
  .nums{gap:8px;flex-wrap:nowrap}
  .n-big b{font-size:12.6vw}
  .n-mid b{font-size:8.6vw}
  .steps{grid-template-columns:1fr;gap:8px}
  .steps li,.steps li:nth-child(2),.steps li:nth-child(3){grid-template-columns:1fr auto;grid-template-areas:"s b" "e b";align-items:center;padding:12px 14px}
  .steps li:nth-child(2){margin-left:8px}
  .steps li:nth-child(3){margin-left:16px}
  .steps span{grid-area:s}.steps em{grid-area:e}
  .steps b{grid-area:b;font-size:34px}
}
