:root{--bg:#120d0b;--bg-2:#1b1411;--panel:#211814;--line:#3b2a22;--text:#efe4d2;--muted:#a8988a;--red:#c42a1c;--red-hi:#e23a22;--orange:#ff8a1f;--gold:#ffc23d;--green:#4fd36b;--x:#f5f5f5;--radius:10px;--pixel:"VT323",ui-monospace,monospace;--display:"Archivo Black",Impact,"Arial Black",sans-serif;--sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--buncss-light: ;--buncss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.45}body{background:radial-gradient(1200px 600px at 50% -200px,#c42a1c38,transparent 70%),var(--bg);min-height:100vh}a{color:var(--orange)}kbd{display:inline-block;border:1px solid var(--line);background:var(--bg-2);font-family:var(--pixel);text-align:center;border-bottom-width:2px;border-radius:4px;min-width:1.6em;margin:0 1px;padding:0 .35em;font-size:1.05em;line-height:1.3}.muted{color:var(--muted)}.page{max-width:980px;margin:0 auto;padding:32px 16px 48px}.logo{font-family:var(--display);letter-spacing:.04em;background:linear-gradient(180deg,#ffe08a 0%,var(--orange)45%,var(--red)100%);color:#0000;filter:drop-shadow(0 3px 0 #5a1208);text-decoration:none;display:inline-block;-webkit-background-clip:text;background-clip:text;font-size:44px;line-height:1}.logo-small{font-size:26px}.hero{text-align:center;padding:24px 0 28px}.hero-title{font-family:var(--display);max-width:18em;margin:18px auto 12px;font-size:clamp(26px,5vw,42px);font-weight:400;line-height:1.12}.hero-sub{color:var(--muted);max-width:34em;margin:0 auto;font-size:18px}.card{background:linear-gradient(180deg,var(--panel),var(--bg-2));border:1px solid var(--line);border-radius:14px;padding:24px;box-shadow:0 20px 60px #00000073}.create{max-width:640px;margin:0 auto}.card-title{font-family:var(--display);margin:0 0 18px;font-size:24px;font-weight:400}.footer{text-align:center;color:var(--muted);margin-top:40px;font-size:13px}.footer a{color:var(--muted)}.field{flex:1;min-width:0;margin-bottom:16px}.field-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:6px;font-size:13px}.row{display:flex;flex-wrap:wrap;gap:16px}.row>.field{flex:220px}.input,.name-input{color:var(--text);border:1px solid var(--line);border-radius:var(--radius);font:inherit;outline:none;background:#0d0908;width:100%;padding:10px 12px}.input:focus,.name-input:focus{border-color:var(--orange);box-shadow:0 0 0 3px #ff8a1f2e}select.input{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted)50%),linear-gradient(135deg,var(--muted)50%,transparent 50%);background-position:calc(100% - 18px),calc(100% - 13px);background-repeat:no-repeat;background-size:5px 5px;padding-right:32px}.hint{color:var(--muted);margin-top:6px;font-size:13px}.check{display:flex;color:var(--text);align-items: center;gap:8px;margin:-4px 0 16px}.check input{accent-color:var(--red);width:18px;height:18px}.segmented{display:flex;border:1px solid var(--line);border-radius:var(--radius);background:#0d0908;flex-wrap:wrap;gap:4px;padding:4px}.segmented button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:7px;flex:auto;min-width:48px;padding:8px 10px;font-size:14px}.segmented button:hover{color:var(--text)}.segmented button.is-active{background:var(--red);color:#fff;box-shadow:inset 0 -2px #0000004d}.error{border:1px solid var(--red);color:#ffb3a8;border-radius:var(--radius);background:#c42a1c26;margin-bottom:14px;padding:10px 12px}.btn{display:inline-flex;color:var(--text);border:1px solid var(--line);border-radius:var(--radius);font:inherit;text-decoration:none;cursor:pointer;white-space:nowrap;background:#2b201b;justify-content:center;align-items: center;gap:8px;padding:10px 16px;transition:transform 60ms,background .15s;font-weight:600}.btn:hover{background:#382a23}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:progress}.btn-play{background:linear-gradient(180deg,var(--red-hi),#9c1c11);color:#fff;font-family:var(--display);letter-spacing:.04em;text-transform:uppercase;border-color:#6d140c;font-weight:400;box-shadow:0 4px #4f0d07,0 10px 30px #c42a1c59}.btn-play:hover{background:linear-gradient(#f04a2e,#ad2214)}.btn-wide{width:100%;margin-top:6px;padding:14px;font-size:18px}.btn-x{background:var(--x);border-color:var(--x);color:#0f0f0f}.btn-x:hover{background:#fff}.btn-ghost{background:0 0}.btn-small{padding:6px 10px;font-size:14px}.x-logo{width:16px;height:16px}.share{display:flex;flex-wrap:wrap;gap:10px}.share-link{display:flex;flex:320px;min-width:0}.share-link input{color:var(--text);border:1px solid var(--line);border-radius:var(--radius)0 0 var(--radius);font:inherit;font-family:var(--pixel);background:#0d0908;border-right:0;flex:1;min-width:0;padding:10px 12px;font-size:19px}.share-link .btn{border-radius:0 var(--radius)var(--radius)0}.created-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.preview{margin-top:24px}.preview-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:8px;font-size:13px}.preview-frame{aspect-ratio:16/10;border:1px solid var(--line);display:block;background:#000;border-radius:12px;width:100%}.how{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:36px}.step{display:flex;align-items: flex-start;gap:12px}.step-n{display:grid;background:var(--red);font-family:var(--display);border-radius:50%;flex:none;place-items: center;width:34px;height:34px}.step-title{margin-bottom:2px;font-weight:700}.room-header{display:flex;align-items: center;gap:18px;margin-bottom:18px}.room-title{font-family:var(--display);margin:0;font-size:clamp(20px,3.4vw,30px);font-weight:400;line-height:1.15}.room-share{display:flex;flex-direction:column;gap:12px;margin-top:20px;padding:18px}.notfound{text-align:center;padding-top:15vh}.player{position:relative;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--line);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none;background:#000;border-radius:12px;width:100%;box-shadow:0 24px 80px #0009,0 0 60px #c42a1c26}body.is-embed{overflow:hidden;background:#000}.player-embed{position:fixed;aspect-ratio:auto;box-shadow:none;border:0;border-radius:0;width:100%;height:100%;inset:0}.player.is-fullscreen{position:fixed;z-index:1000;aspect-ratio:auto;border:0;border-radius:0;width:100%;height:100%;inset:0}.player:-webkit-full-screen{aspect-ratio:auto;border:0;border-radius:0}.player:fullscreen{aspect-ratio:auto;border:0;border-radius:0}.player-canvas{position:absolute;object-fit:contain;image-rendering:pixelated;outline:none;display:block;background:#000;inset:0;width:100%!important;height:100%!important}.phase-idle .player-canvas,.phase-loading .player-canvas{visibility:hidden}.overlay{position:absolute;z-index:2;inset:0}.click-shield{position:absolute;z-index:1;inset:0}.overlay.center{display:grid;text-align:center;place-items: center;padding:16px}.overlay.dim{backdrop-filter:blur(2px);background:#080403b8}.splash{display:grid;text-align:center;background:linear-gradient(180deg,#0a060500 30%,#0a06058c 55%,#0a0605eb 100%),var(--title-image,none)center top/cover no-repeat,radial-gradient(circle at 50% 30%,#4a120a,#0c0605 70%);image-rendering:pixelated;place-items: end center;padding:4% 4% 5%}.splash-inner{width:min(560px,100%)}.splash-kicker{font-family:var(--pixel);color:var(--gold);text-transform:uppercase;letter-spacing:.06em;text-shadow:0 2px #000;font-size:clamp(16px,3.4vmin,24px)}.splash-title{font-family:var(--display);text-shadow:0 3px #000,0 0 24px #000c;overflow-wrap:anywhere;margin:4px 0 6px;font-size:clamp(22px,7.2vmin,46px);font-weight:400;line-height:1.05}.live{font-family:var(--pixel);color:var(--text);opacity:.9;text-shadow:0 2px #000;margin-bottom:3vmin;font-size:clamp(15px,3vmin,20px)}.live-dot{display:inline-block;background:var(--muted);vertical-align:1px;border-radius:50%;width:9px;height:9px;margin-right:8px}.live-dot.is-on{background:var(--green);box-shadow:0 0 10px var(--green);animation:1.6s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.4}}.splash-form{display:flex;gap:8px;max-width:440px;margin:0 auto}.splash-form .name-input{font-family:var(--pixel);background:#000000b3;flex:1;min-width:0;padding:6px 12px;font-size:22px}.btn-play{padding:10px 22px;font-size:clamp(16px,3.6vmin,22px)}.splash-meta{color:var(--muted);text-shadow:0 1px #000;margin-top:2.6vmin;font-size:clamp(12px,2.4vmin,14px)}.splash-brand{position:absolute;font-family:var(--display);color:var(--orange);text-decoration:none;opacity:.85;font-size:13px;bottom:8px;right:10px}.loading{width:min(520px,92%)}.loading-label{font-family:var(--pixel);text-transform:uppercase;color:var(--gold);margin-bottom:12px;font-size:clamp(20px,5vmin,30px)}.blink{animation:1s steps(2,end) infinite pulse}.bar{border:1px solid var(--line);overflow:hidden;background:#1c1210;border-radius:7px;height:14px}.bar-fill{background:linear-gradient(90deg,var(--red),var(--orange));height:100%;transition:width .15s linear}.controls{display:flex;color:var(--muted);flex-wrap:wrap;justify-content:center;gap:6px 16px;margin-top:18px;font-size:clamp(12px,2.4vmin,14px)}.overlay.lobby{display:flex;background:linear-gradient(#0000,#000000d9 30%);flex-wrap:wrap;justify-content:space-between;align-items: flex-end;gap:12px;padding:10px 12px 12px;inset:auto 0 0}.lobby-banner{min-width:0}.lobby-title{font-family:var(--pixel);color:var(--gold);text-transform:uppercase;margin-bottom:6px;font-size:clamp(20px,4.6vmin,30px);line-height:1}.lobby-players{display:flex;flex-wrap:wrap;gap:6px}.chip{font-family:var(--pixel);color:#fff;background:#c42a1cd9;border-radius:6px;padding:4px 8px;font-size:18px;line-height:1}.chip-empty{border:1px dashed var(--line);color:var(--muted);background:0 0}.lobby-hint{color:var(--muted);margin-top:6px;font-size:13px}.lobby-actions{display:flex;gap:6px}.hud{position:absolute;z-index:3;display:flex;pointer-events:none;align-items: center;gap:6px;top:6px;right:6px}.hud-clock{font-family:var(--pixel);color:#fff;background:#0000008c;border-radius:6px;padding:0 8px;font-size:clamp(18px,4vmin,26px);line-height:1.2}.hud-buttons{display:flex;pointer-events:auto;gap:4px}.hud-btn{color:#fff;cursor:pointer;opacity:.7;background:#0000008c;border:0;border-radius:6px;width:30px;height:30px;font-size:15px}.hud-btn:hover{opacity:1}.toast{position:absolute;z-index:4;font-family:var(--pixel);color:var(--gold);text-transform:uppercase;pointer-events:none;white-space:nowrap;background:#000000b3;border-radius:8px;padding:4px 14px;font-size:clamp(18px,4.4vmin,28px);top:12%;left:50%;transform:translate(-50%)}.result{max-width:460px}.result-title{font-family:var(--display);color:var(--gold);text-shadow:0 4px #5a1208;text-transform:uppercase;margin:0;font-size:clamp(28px,8vmin,52px);font-weight:400}.result-detail{color:var(--text);margin:6px 0 18px}.scoreboard{list-style:none;font-family:var(--pixel);min-width:min(320px,90vw);margin:10px auto 18px;padding:0;font-size:clamp(18px,4vmin,24px)}.scoreboard li{display:flex;border-bottom:1px solid #ffffff14;align-items:baseline;gap:10px;padding:2px 10px}.scoreboard li.is-me{background:#c42a1c59;border-radius:4px}.score-rank{color:var(--gold);width:1.4em}.score-name{text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.score-frags{color:var(--gold)}.result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.touch{position:absolute;z-index:2;display:flex;pointer-events:none;inset:0}.touch-stick-zone{position:relative;pointer-events:auto;touch-action:none;flex:55%}.touch-hint{position:absolute;font-family:var(--pixel);color:#ffffff59;font-size:16px;bottom:14px;left:16px}.touch-stick{position:absolute;display:grid;background:#ffffff0f;border:2px solid #ffffff40;border-radius:50%;place-items: center;width:112px;height:112px;margin:-56px 0 0 -56px}.touch-knob{background:#ff8a1f8c;border:2px solid #fff6;border-radius:50%;width:52px;height:52px}.touch-buttons{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;pointer-events:auto;flex:none;align-content: end;gap:10px;padding:0 14px 14px 0}.touch-btn{color:#ffffffd9;font-family:var(--pixel);touch-action:none;background:#00000059;border:2px solid #ffffff59;border-radius:50%;width:58px;height:58px;font-size:18px}.touch-btn.is-down{background:#ff8a1f99}.touch-fire{grid-row:span 2;background:#c42a1c8c;align-self: end;width:84px;height:84px;font-size:22px}@media (max-width:560px){.page{padding:20px 16px 36px}.card{padding:18px}.room-header{flex-direction:column;align-items: flex-start;gap:8px}.player-page{aspect-ratio:4/5;border-radius:8px}}@media (max-height:260px){.splash-meta,.live{display:none}}