:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#081222;color:#f2f6ff;font-synthesis:none;--gold:#ffd889;--muted:#a8b8d1;--accent:#73d9ff}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 75% 20%,#152d4e77,transparent 55%),#081222}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:5px}button{transition:background .15s,border-color .15s,transform .15s}button:not(:disabled):active{transform:translateY(2px)}button img{width:22px;height:22px}a{color:#afdcff}.topbar{height:100px;max-width:1520px;margin:auto;padding:20px 40px;display:flex;align-items:center;gap:32px;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.brand>img{width:52px;height:52px;border-radius:14px}.brand span{font-size:10px;letter-spacing:.18em;line-height:1.7}.brand b{font-size:18px;letter-spacing:.12em}.top-caption{font-size:10px;letter-spacing:.18em;color:#7e94af}.toolbar{display:flex;gap:10px}.icon-button{width:42px;height:42px;background:#12233a;border:1px solid #2a3d57;border-radius:50%;display:grid;place-items:center}.icon-button img{width:19px;height:19px}main{max-width:1440px;margin:auto;padding:18px 40px 30px}h1,h2,p{margin-top:0}h1{font-size:clamp(36px,4.5vw,64px);line-height:1.04;letter-spacing:-.04em;margin-bottom:20px}h2{letter-spacing:-.03em}p{color:var(--muted);line-height:1.6}.eyebrow{display:block;font-size:10px;letter-spacing:.22em;font-weight:700;color:var(--gold);margin-bottom:18px}.intro{position:relative;min-height:195px}.intro h1{font-size:clamp(38px,4.2vw,60px)}.intro em{font-style:normal;color:var(--gold)}.intro>p{position:absolute;right:0;bottom:16px;text-align:right;font-size:15px}.setup-grid{display:grid;grid-template-columns:360px 1fr;gap:26px}.selection-panel{background:#111f32;border:1px solid #29394d;padding:26px;border-radius:24px}.section-label{font-size:10px;letter-spacing:.13em;font-weight:700;color:#cad5e6;margin-bottom:15px;display:flex;align-items:center;gap:9px}.section-label>span{font-size:10px;background:#23344c;border-radius:50%;width:24px;height:24px;display:grid;place-items:center;color:#91abc9}.world-switch{display:grid;gap:10px;margin-bottom:25px}.world-choice{display:flex;align-items:center;gap:15px;text-align:left;padding:14px;border-radius:14px;background:#0c182a;border:1px solid #273a53}.world-choice>img{width:38px;height:38px;object-fit:contain}.world-choice span{font-size:14px;font-weight:700}.world-choice small,.mode-choice small{display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:4px}.world-choice.selected,.mode-choice.selected{border-color:#e5c481;background:#293344}.mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mode-choice{border:1px solid #273a53;border-radius:12px;background:#0c182a;padding:14px 10px;display:flex;gap:10px;align-items:center;text-align:left}.mode-choice span{font-size:12px;font-weight:600}.mode-choice img{width:20px;height:20px}.muted{font-size:12px;color:#8fa3bd;line-height:1.6}.selection-panel>.muted{min-height:38px;margin:17px 0}.primary{background:linear-gradient(110deg,#ffe2a7,#efbd65);color:#271a09;display:inline-flex;justify-content:center;align-items:center;gap:12px;border:1px solid #ffdb95;border-radius:12px;font-weight:750;font-size:14px;padding:16px 24px;min-height:54px;box-shadow:0 5px 25px #ffcf7117}.primary>img{filter:brightness(.14)}.primary:hover:not(:disabled){background:#ffe9bb}.selection-panel>.primary{width:100%}.primary>span:last-child:not(:first-child){margin-left:auto}.secondary{display:inline-flex;justify-content:center;align-items:center;gap:9px;border:1px solid #3a4d65;background:#17263d;border-radius:12px;padding:13px 21px;min-height:48px}.secondary:hover{background:#253b58}.text-button{display:block;margin:14px auto 0;background:none;border:none;color:#adc3dc;font-size:12px;text-decoration:underline;text-underline-offset:4px;padding:7px}.load-status{color:#9fb6ce;font-size:11px;text-align:center;margin-top:10px;min-height:16px}.character-stage{min-height:515px;border:1px solid #526580;border-radius:24px;background:linear-gradient(0deg,#061224cc,transparent 70%),url('/assets/worlds/snow-background.png') center/cover;position:relative;display:flex;flex-direction:column;padding:25px;overflow:hidden}.stage-title{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:10px;letter-spacing:.13em;text-shadow:0 2px 6px #000}.pill{background:#061222a8;border:1px solid #ffffff30;padding:6px 10px;border-radius:20px;font-size:8px;white-space:nowrap}.character-cards{display:flex;gap:12px;justify-content:center;align-items:end;flex:1;padding-top:25px}.character-choice{flex:1;max-width:310px;position:relative;display:flex;flex-direction:column;align-items:center;padding:0 10px 18px;background:linear-gradient(0deg,#09172bc7,transparent 60%);border:1px solid transparent;border-radius:20px}.character-choice>img{width:100%;height:280px;object-fit:contain;filter:drop-shadow(0 10px 18px #0004);transition:transform .25s}.character-choice:hover>img{transform:translateY(-6px)}.character-choice strong{font-size:22px;letter-spacing:-.02em;margin-top:12px}.character-choice small{font-size:10px;color:#d4e2f1;margin-top:6px}.character-choice.selected{border-color:#ffe1a678;background:linear-gradient(0deg,#172338e8,transparent 80%)}.character-choice .team-marker{background:#10263cc9;color:var(--gold);padding:6px 10px;border-radius:10px;font-size:9px;letter-spacing:.12em;position:absolute;top:0;right:10px}.stage-bottom{display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:#d7e6fa;margin-top:20px}.stage-bottom img{width:15px;height:15px}.how-to{display:flex;justify-content:space-between;gap:20px;margin-top:27px;color:#a2b5ce;font-size:11px}.how-to div{display:flex;gap:10px;align-items:center}.how-to b{border:1px solid #39516c;border-radius:50%;width:26px;height:26px;display:grid;place-items:center;color:var(--gold);flex-shrink:0}footer{text-align:center;letter-spacing:.15em;font-size:9px;color:#6f89a7;margin:25px 15px 28px}footer span{color:var(--gold);margin:0 15px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:25px 0}.section-heading h1{font-size:44px}.room-label{font-size:10px;letter-spacing:.15em;text-align:center;color:#9cb3cf}.room-label strong{display:block;color:#ffe0a0;font-size:30px;letter-spacing:.13em;margin-top:8px}.qr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.qr-card{background:#111f32;border:1px solid #2d425e;border-radius:20px;padding:20px;text-align:center;position:relative}.qr-card.connected{border-color:#67d6b2}.qr-card .card-head{display:flex;align-items:center;gap:10px;text-align:left}.card-head>img{width:48px;height:55px;object-fit:contain}.card-head strong{font-size:13px}.card-head span{display:block;color:var(--gold);font-size:11px;margin-top:4px}.qr-wrap{padding:22px;margin:14px auto 10px;background:url('/assets/ui/elements/qr-snow.png') center/100% 100%;max-width:225px}.qr-wrap>img{display:block;width:100%;height:auto;aspect-ratio:1;background:#fff}.qr-card a{font-size:10px}.badge{font-size:10px;margin:14px 0 0;color:#92aac6}.connected .badge{color:#81e1bd}.connection-status{font-size:14px;text-align:center;color:#a9e9ce;margin-top:25px}.lobby-actions{display:flex;justify-content:center;gap:14px;margin:22px 0}.center{text-align:center}.race-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.race-bar .eyebrow{margin-bottom:5px;font-size:9px}.race-bar b{font-size:15px}.clock{display:flex;align-items:center;gap:10px;font-variant-numeric:tabular-nums;font-size:30px;font-weight:700}.clock img{width:24px;height:24px}.race-actions .secondary{font-size:12px;min-height:40px;padding:10px 15px}#stage{position:relative;border:1px solid #47607c;border-radius:20px;overflow:hidden;background:#0c1c31;max-width:calc((100vh - 220px) * 16 / 9);margin:auto}canvas{display:block;width:100%;height:auto;aspect-ratio:16/9}.race-help{font-size:11px;text-align:center;margin:14px auto}.game-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#031023aa;backdrop-filter:blur(5px)}.overlay-card{text-align:center;padding:25px 40px;background:#122238ee;border:1px solid #4c6684;border-radius:24px;max-width:90%}.overlay-card>img{width:35px}.overlay-card h2{font-size:32px;margin:15px 0}.overlay-card p{font-size:13px;max-width:320px}.overlay-card .primary{min-width:220px}.result-hero{display:flex;justify-content:center;align-items:center;gap:45px;padding:40px 0}.result-hero h1{font-size:50px;max-width:600px}.result-visual{position:relative;width:270px;height:300px;flex-shrink:0;background:radial-gradient(ellipse,#e6b54c35,transparent 65%)}#winner-portrait{position:absolute;width:230px;height:270px;object-fit:contain;right:0;bottom:0}.result-glow{position:absolute;left:-25px;top:30px;width:130px;filter:drop-shadow(0 0 20px #ffd66a4a)}.result-actions{display:flex;gap:12px;flex-wrap:wrap}.results-table{width:100%;border-collapse:collapse;border-radius:16px;background:#112036;overflow:hidden;font-size:14px}.results-table th{color:#8fa6c1;text-align:left;font-size:10px;letter-spacing:.1em;padding:16px 22px}.results-table td{padding:18px 22px;border-top:1px solid #283e59}.results-table td:first-child{font-weight:700;color:#ffdca0}.results-table img{width:36px;height:36px;object-fit:contain;vertical-align:middle;margin-right:10px}#notice{background:#302b21;border:1px solid #806c42;border-radius:12px;padding:14px 20px;font-size:13px;color:#ffe0a0;margin-bottom:20px}[data-world=office]{--accent:#d6b4ff;background:radial-gradient(ellipse at 75% 20%,#3e254a60,transparent 55%),#081222}[data-world=office] .character-stage{background-image:linear-gradient(0deg,#110c21db,transparent 70%),url('/assets/worlds/office-background.png')}[data-world=office] .qr-wrap{background-image:url('/assets/ui/elements/qr-office.png')}
@media(min-width:1700px){main{padding-top:45px}.intro{min-height:220px}.character-stage{min-height:560px}.character-choice>img{height:330px}}
@media(max-width:1000px){.top-caption{display:none}.setup-grid{grid-template-columns:310px 1fr;gap:18px}.selection-panel{padding:20px}.character-stage{padding:18px}.character-choice>img{height:230px}.character-choice strong{font-size:18px}.pill{display:none}.intro>p{font-size:12px}.qr-grid{grid-template-columns:repeat(2,1fr)}.result-hero{gap:20px}.result-hero h1{font-size:36px}}
@media(max-width:700px){.topbar{padding:16px 20px;height:82px}main{padding:10px 18px}.intro{min-height:0}.intro h1{font-size:41px}.intro>p{position:static;text-align:left;margin:15px 0 25px}.setup-grid{display:flex;flex-direction:column-reverse}.character-stage{min-height:350px}.character-choice>img{height:190px}.character-choice strong{font-size:18px}.selection-panel{padding:22px}.world-switch{grid-template-columns:1fr 1fr;gap:8px}.world-choice{padding:10px;gap:7px}.world-choice>img{width:26px}.world-choice span{font-size:11px}.world-choice small{font-size:9px}.how-to{flex-direction:column;gap:12px}.section-heading{display:block;margin:16px 0}.section-heading h1{font-size:32px}.section-heading p{font-size:13px}.room-label{text-align:left}.room-label strong{display:inline;font-size:22px;margin-left:10px}.qr-grid{gap:10px}.qr-card{padding:12px}.card-head>img{width:30px;height:40px}.card-head strong{font-size:11px}.qr-wrap{padding:16px;margin:8px auto}.badge{font-size:9px}.race-bar b{font-size:12px}.clock{font-size:23px}.race-actions .secondary{font-size:0;gap:0}#stage{border-radius:12px;max-width:none}.overlay-card{padding:12px 18px}.overlay-card h2{font-size:23px;margin:5px 0}.overlay-card>img{display:none}.overlay-card p{font-size:11px;margin:6px 0}.overlay-card .primary{min-height:38px;padding:8px 16px}.overlay-card .text-button{margin-top:5px}.result-hero{flex-direction:column;gap:10px;text-align:center;padding:20px 0}.result-visual{height:210px;width:220px}#winner-portrait{height:200px;width:180px}.result-glow{width:100px;left:0}.result-hero h1{font-size:34px}.result-actions{justify-content:center}.results-table th,.results-table td{padding:12px 8px;font-size:10px}.results-table img{display:none}footer{font-size:8px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

#demo{display:block;width:100%;padding:16px;margin-top:12px;border:1px solid #f5cf7b;border-radius:14px;background:#f5cf7b18;color:#ffe3a6;font-weight:800;font-size:16px}
#direct-controls{display:flex;justify-content:center;gap:16px;padding:14px;flex-wrap:wrap}
#direct-controls[hidden]{display:none}
#direct-controls>div{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
#direct-controls strong{width:100%;text-align:center;font-size:13px}
#direct-controls button{touch-action:none;user-select:none;padding:16px 20px;border-radius:12px;border:1px solid #8eb7d3;background:#173b56;color:white;font-weight:700}
#direct-controls button:active{background:#316c8d}

#control-mode{width:100%;padding:14px;margin:8px 0 16px;border-radius:12px;background:#14334d;color:white;border:1px solid #63839c;font:inherit}

.route-legend{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;padding:20px;background:#0c2035;border:1px solid #46627b;border-radius:16px;margin:20px 0}.route-legend span{max-width:270px;font-size:14px;color:#d6e3ec}.route-legend b{display:block;color:#ffe18a;margin-bottom:6px}.route-legend span:nth-child(2) b{color:#ff8a9b}.route-legend span:nth-child(3) b{color:#a6f4ff}

#race-standing{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:linear-gradient(100deg,#59431c,#172d47);border:1px solid #d8b866;border-radius:14px;padding:14px 20px;margin:10px 0 16px}#race-standing[hidden]{display:none}#leader-name{font-size:clamp(18px,2.5vw,27px);font-weight:850;color:#ffe6a3}#leader-gap{font-size:15px;color:#f0f5ff}

.race-actions{display:flex;gap:8px}
#race:fullscreen{width:100vw;height:100dvh;max-width:none;margin:0;padding:8px 12px;background:#081222;display:flex;flex-direction:column;gap:6px;overflow:hidden}
#race:fullscreen .race-bar{margin:0;flex-shrink:0;min-height:40px}
#race:fullscreen .race-bar>div:first-child{display:none}
#race:fullscreen .clock{font-size:24px}
#race:fullscreen #race-standing{margin:0;padding:6px 12px;flex-shrink:0;border-radius:8px}
#race:fullscreen #leader-name{font-size:18px}
#race:fullscreen #leader-gap{font-size:13px}
#race:fullscreen #stage{flex:1;min-height:0;width:100%;max-width:none;border:0;border-radius:0;margin:0}
#race:fullscreen #game{width:100%;height:100%;object-fit:contain;aspect-ratio:auto}
#race:fullscreen .race-help,#race:fullscreen #direct-controls{display:none!important}
@media(pointer:coarse){#race:fullscreen #direct-controls:not([hidden]){display:flex!important;position:absolute;bottom:10px;left:10px;right:10px;padding:0;z-index:2;justify-content:space-between;pointer-events:none}#race:fullscreen #direct-controls button{pointer-events:auto;padding:12px;background:#102b43cc}#race:fullscreen #direct-controls strong{display:none}}

[data-world=wedding]{--accent:#ffd5df;background:radial-gradient(ellipse at 75% 20%,#754f5544,transparent 55%),#081222}
[data-world=wedding] .character-stage{background-image:linear-gradient(0deg,#29162cdb,transparent 70%),url('/assets/worlds/wedding-background.png')}
[data-world=wedding] .qr-wrap{background-image:url('/assets/ui/elements/qr-wedding.png')}
@media(max-width:700px){.world-switch{grid-template-columns:1fr}.world-choice span{font-size:14px}.world-choice small{font-size:11px}}

[data-world=baby]{--accent:#f2b6d5;background:radial-gradient(ellipse at 75% 20%,#573d6355,transparent 55%),#081222}[data-world=baby] .character-stage{background-image:linear-gradient(0deg,#241b3cdd,transparent 80%),url('/assets/worlds/baby-background.png')}
[data-world=baby] .qr-wrap{background-image:url('/assets/ui/elements/qr-baby.png')}

/* Setup preview uses the same renderer and assets as the playable race. */
.character-stage{min-height:0;min-width:0;gap:14px}
.preview-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:.1em;color:var(--gold)}
#preview-toggle{font-size:11px;letter-spacing:normal;background:#10263c;border:1px solid #647b91;border-radius:9px;padding:8px 12px}
#game-preview{display:block;width:100%;height:auto;aspect-ratio:16/9;border:1px solid #647b91;border-radius:14px;background:#081222}
.character-stage .character-cards{flex:0;padding-top:0;align-items:stretch}
.character-stage .character-choice{min-width:0;padding:10px;max-width:none}
.character-stage .character-choice>img{width:62px;height:70px}
.character-stage .character-choice .team-marker{position:static;font-size:8px;padding:4px 7px}
.character-stage .character-choice strong{font-size:16px;margin-top:5px}
.character-stage .character-choice small{font-size:10px;text-align:center}
.character-stage .stage-bottom{margin-top:0;text-align:center}
@media(max-width:500px){.topbar{height:auto;flex-wrap:wrap;gap:12px}.toolbar{margin-left:auto;flex-wrap:wrap;max-width:100%}}