:root{--name-font:'Grenze Gotisch',serif;--ui:'Inter','Manrope',system-ui,sans-serif;--glass:rgba(12,14,22,.55);--line:rgba(255,255,255,.14);--tx:#f2f3f7;--dim:#b9bfcc;--acc:#ffb347}
*{box-sizing:border-box}html,body{margin:0;background:#05060a;color:var(--tx);font-family:var(--ui)}
#bg{position:fixed;inset:0;width:100vw;height:100vh;z-index:0}
main{position:relative;z-index:1;max-width:980px;margin:0 auto;padding:56px 20px 30px;display:grid;gap:22px}
.hero{text-align:center;padding:10px 0 4px}
.name{font-family:var(--name-font);font-weight:800;font-size:clamp(56px,11vw,112px);margin:0;line-height:1;letter-spacing:.01em;background:linear-gradient(180deg,#fff 0%,#dfe3ea 30%,#7d8796 48%,#f6f7fa 56%,#a9b1bd 75%,#e9ecf1 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 10px rgba(0,0,0,.6))}
.tag{color:var(--dim);margin:10px 0 0;font-size:16px;text-shadow:0 1px 6px #000}
.panel{background:var(--glass);border:1px solid var(--line);border-radius:20px;backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);box-shadow:0 10px 40px rgba(0,0,0,.35)}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:12px;color:var(--acc);margin:0 0 6px;font-weight:600}
h2{margin:0 0 8px;font-size:clamp(26px,4vw,36px);font-weight:700}h3{margin:6px 0;font-size:20px}
p{line-height:1.55;color:#dde1ea}
.merch{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;align-items:center;padding:30px}
.ctas{display:grid;gap:12px}
.btn{position:relative;display:inline-flex;justify-content:center;align-items:center;padding:12px 20px;border-radius:999px;background:#f4f5f8;color:#0b0d12;font-weight:700;text-decoration:none;border:0;cursor:pointer;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(255,179,71,.35)}
.btn.big{font-size:20px;padding:18px 26px;background:linear-gradient(135deg,#ffcf70,#ff8a3d);color:#1a0e00}
.btn.ghost{background:transparent;color:var(--tx);border:1px solid var(--line)}
.btn.soon{background:rgba(255,255,255,.08);color:var(--dim);cursor:default}.btn.soon:hover{transform:none;box-shadow:none}
.sechead{text-align:center;margin-bottom:12px}.sechead h2{text-shadow:0 2px 10px #000}
.bots{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bot{padding:22px;display:flex;flex-direction:column}.bot p{flex:1;font-size:15px}
.ava{width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.1);display:grid;place-items:center;font-size:26px}
.row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:14px}
.chip{position:relative;padding:9px 15px;border-radius:999px;border:1px solid var(--line);color:var(--tx);text-decoration:none;font-size:14px;font-weight:500;background:rgba(255,255,255,.05)}
.chip:hover{background:rgba(255,255,255,.14)}
footer{display:flex;flex-wrap:wrap;gap:6px 16px;justify-content:center;font-size:13px;color:var(--tx);text-shadow:0 1px 4px #000}.dim{color:var(--dim)}
.tools{position:fixed;top:12px;right:12px;z-index:5;display:flex;gap:8px}
.tool{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--glass);color:#fff;font-size:17px;cursor:pointer;backdrop-filter:blur(10px)}
#critters{position:fixed;inset:0;pointer-events:none;z-index:10}
.critter{position:fixed;filter:drop-shadow(0 3px 6px rgba(0,0,0,.6))}
@keyframes rocket{0%{transform:translateY(0)}15%{transform:translateY(4px)}100%{transform:translateY(-110vh)}}
@keyframes puff{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(2.4)}}
@keyframes seal{0%,100%{transform:translateY(60px)}25%,75%{transform:translateY(0)}45%{transform:translateY(0) rotate(-8deg)}55%{transform:translateY(0) rotate(8deg)}}
@keyframes cat{0%{transform:translate(-80px,0);opacity:0}12%{transform:translate(-40px,0);opacity:1}28%{transform:translate(0,-60px)}38%{transform:translate(0,-40px)}62%{transform:translate(0,-40px)}74%{transform:translate(40px,-70px)}84%{transform:translate(70px,0)}100%{transform:translate(160px,0);opacity:0}}
@keyframes ufo{0%{transform:translate(0,-80px);opacity:0}15%{transform:translate(0,0);opacity:1}65%{transform:translate(0,0)}100%{transform:translate(70vw,-50vh) scale(.3);opacity:0}}
@keyframes beam{0%,15%{opacity:0}25%,60%{opacity:.85}68%,100%{opacity:0}}
@keyframes robot{0%{transform:scale(0) translateY(20px)}20%{transform:scale(1.1) translateY(0)}30%,85%{transform:scale(1)}100%{transform:scale(0)}}
@keyframes wave{0%,100%{transform:rotate(0)}50%{transform:rotate(-35deg)}}
@media (max-width:760px){.merch{grid-template-columns:1fr;padding:22px}.bots{grid-template-columns:1fr}main{padding-top:64px}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition:none!important}}
.critter svg{transform:scale(1.45);transform-origin:center bottom;overflow:visible}

#vbg{position:fixed;inset:0;z-index:0;overflow:hidden;background:#2b1a4a center/cover no-repeat}#vbg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}#vbg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.15) 40%,rgba(0,0,0,.45))}body.vid #bg{visibility:hidden}

/* v2 floating layout */
main{gap:26px;padding-top:70px}
.hero{padding:0}.tag{font-size:15px;color:#e8ebf2;text-shadow:0 1px 3px #000,0 0 14px rgba(0,0,0,.8)}
.merch{position:relative;display:block;text-align:center;padding:26px 16px;max-width:640px;margin:0 auto}
.merch::before{content:"";position:absolute;inset:-30px -60px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at center,rgba(0,0,0,.55) 0%,rgba(0,0,0,.35) 40%,rgba(0,0,0,0) 72%)}
.merch h2,.merch p,.sechead h2,.sechead .eyebrow{text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 18px rgba(0,0,0,.75)}
.merch p{color:#f0f2f6;margin:0 0 4px}
.ctas{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:14px}
.btn{padding:8px 16px;font-size:15px}
.btn.hot{background:linear-gradient(135deg,#ffcf70,#ff8a3d);color:#1a0e00}
.btn.ghost{background:rgba(0,0,0,.35);border-color:rgba(255,255,255,.4)}
.row{padding:0;gap:8px}
.chip{padding:6px 12px;font-size:14px;background:rgba(0,0,0,.4);border-color:rgba(255,255,255,.28);text-shadow:0 1px 2px #000}
.chip:hover{background:rgba(0,0,0,.6)}
.bots{gap:12px}.bot{padding:16px}.bot p{font-size:14px;margin:6px 0 12px}.bot .btn{align-self:flex-start;font-size:14px;padding:7px 14px}
.ava{width:38px;height:38px;font-size:21px;border-radius:11px}h3{font-size:18px}
@media (max-width:760px){.merch{padding:20px 8px}.merch::before{inset:-20px -10px}main{padding-top:64px}}
/* v3 open hero */
main{padding-top:0}
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;text-align:left;padding:0 0 9vh;margin:0 -20px 0;padding-left:20px}
.herobox{max-width:430px}
.merch{max-width:none;margin:0;padding:0;text-align:left}
.merch::before{display:none}
.merch .mtext h2{font-size:clamp(24px,3vw,30px);margin:0 0 4px}.merch .mtext p{font-size:14px;line-height:1.45}
.merch .eyebrow{margin:10px 0 2px}
.tag{margin:0;font-size:14px}
.ctas{justify-content:flex-start;margin-top:10px}
.tag,.merch h2,.merch p,.merch .eyebrow,.sechead h2,.sechead .eyebrow,footer,.chip{text-shadow:0 1px 2px rgba(0,0,0,.85),0 2px 6px rgba(0,0,0,.5)}
body.noshadow .tag,body.noshadow .merch h2,body.noshadow .merch p,body.noshadow .merch .eyebrow,body.noshadow .sechead h2,body.noshadow .sechead .eyebrow,body.noshadow footer,body.noshadow .chip{text-shadow:none}
.cue{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);color:rgba(255,255,255,.55);text-decoration:none;font-size:22px;animation:cue 2.4s ease-in-out infinite}
@keyframes cue{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,5px)}}
#bots{padding-top:30px}
@media (min-width:1200px){.hero{margin-left:calc((980px - 100vw)/2 + 0px);padding-left:5vw}}
@media (max-width:760px){main{padding-top:0}.hero{padding-bottom:10vh}.herobox{max-width:100%}}
/* v4 bottom band */
.hero{min-height:calc(100vh - 110px);min-height:calc(100svh - 110px);justify-content:center;align-items:flex-end;padding:0 0 14px!important;margin:0 -20px!important;text-align:center}
@media (min-width:1200px){.hero{margin-left:calc((980px - 100vw)/2)!important;margin-right:calc((980px - 100vw)/2)!important}}
.band{display:flex;align-items:center;justify-content:center;gap:16px;max-width:min(1180px,96vw);padding:8px 16px;border-radius:16px;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.34))}
.band .tag{flex:0 1 250px;font-size:17px;font-weight:600;line-height:1.3;color:#fff;text-align:left}
.mc{display:flex;align-items:center;gap:4px;flex:0 1 560px;min-width:0}
.mtrack{display:flex;gap:10px;overflow-x:auto;scroll-behavior:auto;scrollbar-width:none;padding:4px 2px;flex:1;min-width:0;-webkit-mask:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.mtrack::-webkit-scrollbar{display:none}
.mi{flex:0 0 auto;width:104px;height:104px;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.45);transition:transform .15s}
.mi:hover{transform:translateY(-3px)}.mi img{width:100%;height:100%;object-fit:cover;display:block}
.mca{flex:0 0 auto;width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(0,0,0,.45);color:#fff;font-size:20px;line-height:1;cursor:pointer}
.btn.shop{flex:0 0 auto;font-size:17px;padding:11px 20px}
#bots{padding-top:4px}.cue{display:none}
@media (max-width:760px){.hero{min-height:calc(100svh - 90px)}.band{flex-wrap:wrap;gap:8px 12px;padding:8px 10px}.band .tag{flex:1 1 auto;font-size:15px}.mc{flex:1 1 100%;order:3}.mi{width:90px;height:90px}.band .tag{order:1}.btn.shop{order:2;font-size:15px;padding:9px 16px}}
.hero{min-height:calc(100vh - 165px);min-height:calc(100svh - 165px)}.band{padding:6px 14px}.mi{width:96px;height:96px}.sechead{margin-bottom:8px}
@media (max-width:760px){.hero{min-height:calc(100svh - 130px)}.mi{width:88px;height:88px}}

#welcome{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:9999;font-family:var(--ui);font-size:clamp(18px,3vw,30px);letter-spacing:.08em;color:#fff;opacity:.9;text-shadow:0 1px 4px rgba(0,0,0,.85),0 0 10px rgba(0,0,0,.5);pointer-events:none;white-space:nowrap;background:none}