:root{--ink: #1b1322;--charcoal: #2e2240;--slate: #4a3f5c;--ash: #6f6685;--mist: #a89db8;--cream: #f5ecd6;--teal-deep: #103a3a;--teal: #1e6f6a;--teal-bright: #2ec4b6;--teal-pale: #8fe3d8;--coral: #ff6b6b;--coral-deep: #8c2f3a;--gold: #ffd23f;--mustard: #e0a52e;--plum: #7b3fa0;--orchid: #b06fd6;--p1: var(--coral);--p2: var(--teal-bright);--p3: var(--gold);--p4: var(--orchid);--font: ui-monospace, "SFMono-Regular", "DejaVu Sans Mono", Menlo, Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{width:100%;height:100%}body{background:var(--teal-deep);color:var(--cream);font-family:var(--font);text-transform:uppercase;letter-spacing:.06em;overflow:hidden;image-rendering:pixelated;-webkit-font-smoothing:none;user-select:none}#app{position:relative}.shell{position:absolute;inset:0;display:flex;flex-direction:column;background-image:radial-gradient(circle at 20% 10%,rgba(46,196,182,.08),transparent 40%),radial-gradient(circle at 85% 90%,rgba(255,107,107,.08),transparent 45%)}.hidden{display:none!important}.gate{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;background:radial-gradient(120% 90% at 50% 16%,#1d5d5d 0%,#114343 48%,var(--teal-deep) 100%)}.gate-bg{position:absolute;inset:0;pointer-events:none}.gate-bg .blob{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;animation:drift 16s ease-in-out infinite}.gate-bg .b1{width:46vmax;height:46vmax;left:-12vmax;top:-14vmax;background:radial-gradient(circle,rgba(46,196,182,.36),transparent 70%)}.gate-bg .b2{width:40vmax;height:40vmax;right:-14vmax;bottom:-16vmax;background:radial-gradient(circle,rgba(255,107,107,.22),transparent 70%);animation-delay:-6s}.gate-bg .b3{width:30vmax;height:30vmax;right:14vw;top:6vh;background:radial-gradient(circle,rgba(255,210,63,.16),transparent 70%);animation-delay:-10s}.gate:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(125% 100% at 50% 48%,transparent 52%,rgba(0,0,0,.5))}.gate-stage{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:1vh;text-align:center}.scoot-scene{width:clamp(220px,33vw,440px);height:auto;filter:drop-shadow(0 14px 20px rgba(0,0,0,.45))}.scooter{animation:scoot 4.8s cubic-bezier(.5,0,.3,1) infinite}.invite{transform-box:fill-box;transform-origin:center;animation:invite 4.8s ease-in-out infinite}.invite .spark{transform-box:fill-box;transform-origin:center;animation:sparkle 1.2s ease-in-out infinite}.wordmark{margin-top:1vh;font-size:clamp(56px,14vw,200px);font-weight:800;letter-spacing:.07em;line-height:.9;color:var(--cream);text-shadow:0 0 28px rgba(46,196,182,.45),0 6px 0 var(--coral-deep),0 8px 24px rgba(0,0,0,.45);animation:bob 3.6s ease-in-out infinite}.wordmark span{color:var(--teal-bright);text-shadow:0 0 28px rgba(46,196,182,.7),0 6px 0 #0c3030}.gate .sub{color:var(--teal-pale);font-size:clamp(12px,2.1vw,22px);letter-spacing:.2em}.gate .prompt{margin-top:2.4vh;color:var(--ink);background:var(--gold);padding:.7em 1.4em;border-radius:999px;font-size:clamp(12px,1.9vw,22px);font-weight:800;letter-spacing:.1em;box-shadow:0 0 24px #ffd23f80,0 5px #9c5a1e;animation:pulse 1.5s ease-in-out infinite}@keyframes drift{0%,to{transform:translate(0) scale(1)}50%{transform:translate(2vw,2vh) scale(1.08)}}@keyframes scoot{0%,14%{transform:translate(82px)}36%,64%{transform:translate(0)}86%,to{transform:translate(82px)}}@keyframes invite{0%,30%{opacity:0;transform:scale(.6)}46%,60%{opacity:1;transform:scale(1)}74%,to{opacity:0;transform:scale(.6)}}@keyframes sparkle{0%,to{opacity:.4;transform:scale(.8) rotate(0)}50%{opacity:1;transform:scale(1.2) rotate(45deg)}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-1.1vh)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}@keyframes blink{50%{opacity:.25}}.topbar{display:flex;align-items:center;justify-content:space-between;padding:2.2vh 3vw}.brand{font-size:clamp(20px,3.4vw,40px);font-weight:800;color:var(--cream);text-shadow:3px 3px 0 var(--coral-deep)}.brand b{color:var(--teal-bright)}.tagline{color:var(--mist);font-size:clamp(10px,1.6vw,16px)}.shelf-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:0 3vw}.shelf{display:flex;gap:2.2vw;align-items:stretch;max-width:100%}.cart{position:relative;width:clamp(150px,20vw,240px);min-height:clamp(190px,30vh,300px);border-radius:14px;background:var(--charcoal);border:3px solid var(--slate);box-shadow:0 10px #0000004d;display:flex;flex-direction:column;padding:16px;transition:transform .12s ease,box-shadow .12s ease,border-color .12s;overflow:hidden}.cart:before{content:"";position:absolute;left:0;top:0;bottom:0;width:10px;background:var(--spine, var(--teal-bright))}.cart .badge{font-size:clamp(40px,6vw,72px);line-height:1;margin:6px 0 12px;filter:drop-shadow(0 3px 0 rgba(0,0,0,.3))}.cart .title{font-size:clamp(15px,2vw,22px);font-weight:800;color:var(--cream)}.cart .tag{margin-top:8px;font-size:clamp(9px,1.3vw,13px);color:var(--mist);text-transform:none;letter-spacing:.02em;line-height:1.4}.cart .players{margin-top:auto;font-size:clamp(9px,1.2vw,12px);color:var(--teal-pale)}.cart.selected{transform:translateY(-14px) scale(1.06);border-color:var(--gold);box-shadow:0 18px #00000059,0 0 26px #ffd23f66}.cart .play{position:absolute;bottom:10px;right:12px;color:var(--gold);font-size:12px;opacity:0;animation:blink 1.1s steps(1) infinite}.cart.selected .play{opacity:1}.footer{display:flex;align-items:center;justify-content:space-between;padding:1.6vh 3vw 2.6vh;color:var(--mist);font-size:clamp(10px,1.4vw,15px);min-height:6vh}.players-strip{display:flex;gap:12px;align-items:center}.chip{display:inline-flex;align-items:center;gap:6px}.dot{width:12px;height:12px;border-radius:3px;background:var(--slate)}.dot.on1{background:var(--p1)}.dot.on2{background:var(--p2)}.dot.on3{background:var(--p3)}.dot.on4{background:var(--p4)}.join-hint{color:var(--gold);animation:blink 1.1s steps(1) infinite}.legend b{color:var(--cream)}.settings{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1vh}.settings h2{font-size:clamp(20px,4vw,40px);color:var(--coral);margin-bottom:2vh}.rows{width:min(640px,86vw);display:flex;flex-direction:column;gap:6px}.row{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border:2px solid transparent;border-radius:8px;background:#2ec4b60d;font-size:clamp(12px,1.8vw,18px)}.row.selected{border-color:var(--gold);background:#ffd23f1a}.row .val{color:var(--teal-pale);min-width:6ch;text-align:right}.row .val.on{color:var(--teal-bright)}.row .val.off{color:var(--ash)}.bar{display:inline-block;width:100px;height:10px;background:var(--slate);border-radius:3px;overflow:hidden;vertical-align:middle}.bar>span{display:block;height:100%;background:var(--teal-bright)}.host{position:absolute;inset:0;background:#000}