body{margin:0;background:#0b0221}
a{color:#22d3ff}a:hover{color:#ffe600}
.fx{font-family:'VT323',monospace}
.px{font-family:'Press Start 2P',monospace}
[hidden]{display:none !important}

@keyframes rainbow{0%{color:#ff2d6f}16%{color:#ff9f1c}33%{color:#ffe600}50%{color:#2bff88}66%{color:#22d3ff}83%{color:#b46bff}100%{color:#ff2d6f}}
@keyframes rainbowBg{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes hue{from{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-22px) rotate(14deg)}}
@keyframes wobble{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg) scale(1.05)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes drive{0%{left:0}45%{left:calc(100% - 300px)}50%{left:calc(100% - 300px)}95%{left:0}100%{left:0}}
@keyframes flip{0%,46%{transform:scaleX(1)}50%,96%{transform:scaleX(-1)}100%{transform:scaleX(1)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes eq{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
@keyframes glitch{0%,100%{text-shadow:5px 0 #ff2d6f,-5px 0 #22d3ff,0 0 28px #b46bff}50%{text-shadow:-5px 0 #ff2d6f,5px 0 #22d3ff,0 0 44px #2bff88}}
@keyframes road{from{background-position:0 0}to{background-position:-120px 0}}
@keyframes pop{from{transform:scale(.6) rotate(-6deg);opacity:0}to{transform:scale(1) rotate(0deg);opacity:1}}
@keyframes puff{0%{transform:translate(0,0) scale(.4);opacity:.9}100%{transform:translate(-26px,-14px) scale(1.6);opacity:0}}
@keyframes gridmove{from{background-position:0 0}to{background-position:0 60px}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@keyframes rgbStroke{0%{stroke:#ff2d6f}25%{stroke:#ffe600}50%{stroke:#2bff88}75%{stroke:#22d3ff}100%{stroke:#ff2d6f}}
@keyframes rgbFill{0%{fill:#ff2d6f}25%{fill:#ffe600}50%{fill:#2bff88}75%{fill:#22d3ff}100%{fill:#ff2d6f}}
@keyframes neon{0%,100%{box-shadow:0 0 18px #ff2d6f}33%{box-shadow:0 0 18px #22d3ff}66%{box-shadow:0 0 18px #2bff88}}

.rainbow{animation:rainbow 2s linear infinite}
.rgbborder{background:linear-gradient(90deg,#ff2d6f,#ff9f1c,#ffe600,#2bff88,#22d3ff,#b46bff,#ff2d6f);background-size:200% 100%;animation:rainbowBg 3s linear infinite}
.hue{animation:hue 4s linear infinite}
.bounce{animation:bounce 1.2s ease-in-out infinite}
.blink{animation:blink 1.2s steps(1) infinite}
.floaty{animation:floaty 4s ease-in-out infinite}
.wobble{animation:wobble 1.6s ease-in-out infinite}
.wheel{transform-box:fill-box;transform-origin:center;animation:spin .6s linear infinite}
.driver{animation:drive 14s linear infinite}
.flipper{animation:flip 14s linear infinite}
.bob{animation:bob .4s ease-in-out infinite}
.marquee{animation:marquee 20s linear infinite}
.eq{transform-box:fill-box;transform-origin:bottom;animation:eq .9s ease-in-out infinite}
.tl{animation:rainbow 2s linear infinite,glitch 1.6s ease-in-out infinite}
.road{animation:road .7s linear infinite}
.pop{animation:pop .35s cubic-bezier(.2,1.6,.4,1) both}
.puff{transform-box:fill-box;transform-origin:center;animation:puff 1s ease-out infinite}
.gridfloor{animation:gridmove 2s linear infinite}
.pulse{animation:pulse 1.4s ease-in-out infinite}
.rgbstroke{animation:rgbStroke 2s linear infinite}
.rgbfill{animation:rgbFill 2s linear infinite}
.neon{animation:neon 3s linear infinite}

.egg{background:none;border:0;padding:0;margin:0;cursor:pointer;color:inherit}
.egg:hover{filter:drop-shadow(0 0 14px #ffffff) brightness(1.15)}
.egg:focus-visible{outline:4px dashed #ffe600;outline-offset:6px}
.btn{font-family:'Press Start 2P',monospace;font-size:13px;line-height:1.4;padding:16px 20px;border:0;cursor:pointer;background:#ffe600;color:#0b0221;box-shadow:6px 6px 0 #ff2d6f;min-height:44px}
.btn:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 #22d3ff}
.btn:active{transform:translate(4px,4px);box-shadow:2px 2px 0 #ff2d6f}
.btn:focus-visible{outline:4px dashed #22d3ff;outline-offset:4px}
@media (prefers-reduced-motion: reduce){.fx,.fx *{animation:none !important}}

.root{position:relative;overflow:hidden;min-height:100vh;background:linear-gradient(180deg,#0b0221 0%,#1a0540 55%,#2d0b52 100%);color:#f4ecff;font-size:24px;line-height:1.25}
.gridfloor{position:absolute;left:-20%;right:-20%;bottom:0;height:560px;background-image:linear-gradient(#ff2d6f66 2px,transparent 2px),linear-gradient(90deg,#ff2d6f66 2px,transparent 2px);background-size:60px 60px;transform:perspective(420px) rotateX(60deg);transform-origin:bottom;opacity:.7;z-index:0}
.decor{position:absolute;inset:0;pointer-events:none;z-index:0}
.decor span{position:absolute}
.scanlines{position:absolute;inset:0;pointer-events:none;z-index:40;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0px,rgba(0,0,0,.18) 2px,transparent 2px,transparent 4px)}
.page{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:0 16px 56px;display:flex;flex-direction:column;gap:56px}

.top{display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding-top:16px}
.ticker{flex:1 1 320px;min-width:0;overflow:hidden;border:4px solid #22d3ff;background:#0b0221}
.marquee{display:flex;width:max-content;padding:14px 0;font-size:13px;color:#ffe600;white-space:nowrap}
.marquee span{padding-right:48px}
.hiscore{font-size:12px;text-align:right;display:flex;flex-direction:column;gap:10px}

.hero{display:flex;flex-direction:column;align-items:center;gap:28px;text-align:center;padding:16px 0 0}
.title{margin:0;display:flex;flex-direction:column;align-items:center;gap:.18em;font-size:clamp(44px,11vw,136px);line-height:1;font-weight:400}
.word{display:flex}
.word>span,.word .tl{display:inline-block}

.row{display:flex;flex-wrap:wrap;gap:32px;align-items:stretch}
.card{background:#120632;padding:28px;height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:20px}
.sheet{margin:0;display:grid;grid-template-columns:max-content 1fr;gap:12px 24px;align-items:baseline}
.sheet dt{font-size:12px;color:#ff9f1c}
.sheet dd{margin:0;font-size:30px}
.secrets{flex:1 1 300px;border:4px dashed #ffe600;padding:24px;display:flex;flex-direction:column;gap:16px;background:rgba(11,2,33,.75)}
.slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.slot{border:3px solid #b46bff;padding:14px 8px;text-align:center;font-size:11px;background:transparent;color:#cbb8ff}
.slot.on{background:#2bff88;color:#0b0221;border-color:#2bff88}
#all-found{display:flex;flex-direction:column;gap:16px}

.roadbox{position:relative;height:230px;background:linear-gradient(180deg,#1a0540 0%,#3b0d63 40%,#1c1c2e 40%,#1c1c2e 100%);border:4px solid #ff2d6f;box-shadow:0 0 24px #ff2d6f;overflow:hidden}
.road{position:absolute;left:0;right:0;top:150px;height:8px;background-image:linear-gradient(90deg,#ffe600 0px,#ffe600 60px,transparent 60px,transparent 120px);background-size:120px 8px}

.zone{flex:1 1 360px;display:flex;flex-direction:column;gap:20px;align-items:center;border:4px solid;padding:24px;background:rgba(11,2,33,.75)}
.zone h2{margin:0;font-size:16px;line-height:1.5;align-self:flex-start;font-weight:400}

.gear{display:flex;flex-wrap:wrap;gap:18px;justify-content:center}
.chip{display:inline-block;padding:14px 18px;font-size:13px;color:#0b0221}

.modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}
.backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;margin:0;background:rgba(5,0,20,.86);cursor:pointer}
.sheet-wrap{position:relative;width:100%;max-width:900px;max-height:calc(100vh - 32px);overflow:auto}
.modal-card{flex-direction:row;flex-wrap:wrap;gap:28px;align-items:flex-start}
.avatar-col{flex:0 1 220px;display:flex;flex-direction:column;align-items:center;gap:14px;margin:0 auto}
.info-col{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:14px}
.stat{display:grid;grid-template-columns:minmax(0,170px) 1fr 76px;gap:12px;align-items:center;font-size:22px}
.stat .bar{display:block;height:16px;background:#2a1a55;border:2px solid #f4ecff}
.stat .bar span{display:block;height:100%}
.stat .val{font-size:11px;text-align:right}
.result{min-height:76px;border:3px dashed;padding:14px;display:flex;flex-direction:column;gap:8px}