.doom-game{aspect-ratio:4/3;color:#f2ede4;isolation:isolate;-webkit-user-select:none;user-select:none;color-scheme:dark;background:#000;border-radius:12px;width:100%;max-height:calc(100dvh - 120px);margin:0 auto;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:block;position:relative;overflow:hidden}.doom-game:fullscreen{aspect-ratio:auto;border-radius:0;width:100vw;height:100vh;max-height:none}.doom-game.is-fullscreen-fallback{z-index:400;aspect-ratio:auto;border-radius:0;width:auto;height:auto;max-height:none;position:fixed;inset:0}.doom-stage-inner{position:absolute;inset:0;overflow:hidden;container-type:size}.doom-game.is-rotated .doom-stage-inner{width:100dvh;height:100dvw;inset:50% auto auto 50%;transform:translate(-50%,-50%)rotate(90deg)}.doom-game{--safe-top:0px;--safe-right:0px;--safe-bottom:0px;--safe-left:0px}.doom-game:fullscreen:not(.is-rotated),.doom-game.is-fullscreen-fallback:not(.is-rotated){--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}.doom-game *{box-sizing:border-box}.doom-canvas{--canvas-ar:4 / 3;width:auto;max-width:100cqw;height:100cqh;max-height:100cqh;aspect-ratio:var(--canvas-ar);image-rendering:pixelated;touch-action:none;background:#000;outline:none;margin:auto;display:block;position:absolute;inset:0}.doom-canvas:focus-visible{outline-offset:-3px;outline:2px solid #ff944d}.doom-gate{z-index:10;background:radial-gradient(#3a1208 0%,#120503 70%,#000 100%);place-items:center;padding:16px;display:grid;position:absolute;inset:0}.doom-gate[hidden]{display:none}.doom-gate-card{text-align:center;width:min(460px,90cqw)}.doom-gate-eyebrow{letter-spacing:.16em;text-transform:uppercase;color:#f2ede4a6;margin:0 0 8px;font-size:11px}.doom-gate-title{letter-spacing:.06em;color:#ff6b01;text-shadow:0 2px #7a2a00,0 0 24px #ff6b0159;margin:0 0 12px;font:800 clamp(40px,12cqw,88px)/1 ui-sans-serif,Impact,Arial Black,sans-serif}.doom-gate-message{color:#f2ede4d9;margin:0;font-size:clamp(12px,2.6cqw,14px);line-height:1.5}.doom-gate-error{text-align:left;white-space:pre-wrap;overflow-wrap:anywhere;color:#ffd6c2;background:#ffffff14;border-radius:8px;max-height:32cqh;margin:14px 0 0;padding:12px;font:11px/1.5 ui-monospace,monospace;overflow:auto}.doom-gate-error[hidden]{display:none}.doom-gate-actions{justify-content:center;gap:8px;margin-top:20px;display:flex}.doom-gate-start,.doom-gate-retry{cursor:pointer;-webkit-tap-highlight-color:transparent;border:1px solid #0000;border-radius:8px;min-height:44px;padding:0 20px;font:500 14px/20px inherit;transition:background-color .15s,color .15s,border-color .15s}.doom-gate-start{color:#1a0a04;background:#ff6b01}.doom-gate-start:hover{background:#ff8126}.doom-gate-start:disabled{cursor:progress;opacity:.75}.doom-gate-retry{color:#f2ede4;background:0 0;border-color:#fff6}.doom-gate-retry:hover{background:#ffffff1a}.doom-gate-retry[hidden],.doom-gate-start[hidden]{display:none}.doom-gate-start:focus-visible,.doom-gate-retry:focus-visible{outline-offset:2px;outline:2px solid #ff944d}.doom-gate.loading .doom-gate-title{animation:1.4s ease-in-out infinite doom-pulse}@keyframes doom-pulse{0%,to{opacity:1}50%{opacity:.55}}.doom-keypad{--pad-opacity:.75;--stick:136px;--turn:120px;--btn:46px;--fire:70px;--ring-gap:6px;--ring-r:calc(var(--turn) / 2 + var(--btn) / 2 + var(--ring-gap));--inset:12px;z-index:4;pointer-events:none;position:absolute;inset:0}.doom-game:has(.doom-gate:not([hidden])) .doom-keypad>:not(.doom-menu-wrap){display:none}@media not (pointer:coarse){.doom-game[data-keypad-mode=coarse] .doom-keypad>:not(.doom-menu-wrap){display:none!important}}.doom-keypad button,.doom-stick{pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;user-select:none}.doom-keypad button{color:#f2ede4;cursor:pointer;backdrop-filter:blur(8px);opacity:var(--pad-opacity);background:#14141499;border:1px solid #ffffff59;font:600 12px/1 inherit;transition:background-color .12s,border-color .12s}.doom-keypad button:focus-visible{outline-offset:2px;outline:2px solid #ff944d}.doom-keypad button.held,.doom-keypad button[aria-pressed=true]{color:#1a0a04;background:#ff6b01cc;border-color:#ff944d}.doom-corner{border-radius:22px;align-items:center;gap:6px;min-height:44px;padding:0 12px;display:inline-flex}.doom-corner[hidden]{display:none}.doom-corner svg{width:18px;height:18px}.doom-corner-group{top:max(var(--inset), var(--safe-top));left:max(var(--inset), var(--safe-left));z-index:5;pointer-events:none;gap:8px;display:flex;position:absolute}.doom-corner-group>*{pointer-events:auto}.doom-menu-wrap{top:0;right:max(var(--inset), var(--safe-right));padding-top:max(var(--inset), var(--safe-top));z-index:6;pointer-events:none;position:absolute}.doom-menu-wrap>*{pointer-events:auto}.doom-corner-right{position:relative;top:auto}.doom-menu-sep{background:#ffffff26;height:1px;margin:4px 0}.doom-menu{backdrop-filter:blur(12px);background:#101010eb;border:1px solid #ffffff40;border-radius:12px;gap:4px;min-width:220px;max-height:calc(100cqh - 72px);margin-top:8px;padding:8px;display:grid;overflow-y:auto}.doom-menu[hidden]{display:none}.doom-menu-item{text-align:left;border-radius:8px;justify-content:space-between;align-items:center;min-height:44px;padding:0 12px;display:flex;opacity:1!important;color:#f2ede4!important;background:0 0!important;border-color:#0000!important}.doom-menu-item:hover{background:#ffffff14!important}.doom-menu-item[aria-pressed=true]{color:#ff944d!important}.doom-menu-item kbd{color:#f2ede4b3;border:1px solid #ffffff4d;border-radius:4px;padding:2px 6px;font:11px/1 ui-monospace,monospace}.doom-menu-range{color:#f2ede4d9;gap:6px;padding:8px 12px;font-size:12px;display:grid}.doom-menu-range output{float:right;color:#ff944d}.doom-menu-range input{accent-color:#ff6b01;pointer-events:auto;touch-action:pan-x;width:100%}.doom-stick{--jx:0px;--jy:0px;backdrop-filter:blur(8px);opacity:var(--pad-opacity);background:#14141480;border:1px solid #ffffff4d;border-radius:50%;position:absolute}.doom-stick-track{border:1px solid #ffffff38;border-radius:50%;position:absolute;inset:12px}.doom-stick-track i{color:#ffffff8c;font:700 12px/1 ui-sans-serif,sans-serif;position:absolute;transform:translate(-50%,-50%)}.doom-stick-track i:first-child{top:12%;left:50%}.doom-stick-track i:nth-child(2){top:50%;left:88%}.doom-stick-track i:nth-child(3){top:88%;left:50%}.doom-stick-track i:nth-child(4){top:50%;left:12%}.doom-stick-move[data-dir~=up] i:first-child,.doom-stick-move[data-dir~=right] i:nth-child(2),.doom-stick-move[data-dir~=down] i:nth-child(3),.doom-stick-move[data-dir~=left] i:nth-child(4){color:#ff944d}.doom-stick-knob{width:40%;height:40%;transform:translate(calc(-50% + var(--jx)), calc(-50% + var(--jy)));background:#ff6b018c;border:1px solid #ffffff80;border-radius:50%;transition:transform .12s ease-out;position:absolute;top:50%;left:50%;box-shadow:0 3px 10px #00000073}.doom-stick.held .doom-stick-knob{background:#ff6b01d9;transition:none}.doom-stick-move{left:max(var(--inset), var(--safe-left));bottom:max(var(--inset), var(--safe-bottom));width:var(--stick);height:var(--stick)}.doom-stick[hidden]{display:none}.doom-right{right:max(var(--inset), var(--safe-right));bottom:max(var(--inset), var(--safe-bottom));width:calc(2 * (var(--ring-r) + var(--fire) / 2));height:calc(2 * (var(--ring-r) + var(--fire) / 2));pointer-events:none;position:absolute}.doom-stick-turn{width:var(--turn);height:var(--turn);top:50%;left:50%;transform:translate(-50%,-50%)}.doom-stick-turn .doom-stick-track i:first-child{top:50%;left:16%}.doom-stick-turn .doom-stick-track i:nth-child(2){top:50%;left:84%}.doom-stick-turn[data-dir~=left] i:first-child,.doom-stick-turn[data-dir~=right] i:nth-child(2){color:#ff944d}.doom-ring{pointer-events:none;display:none;position:absolute;inset:0}.doom-keypad[data-ui-mode=title] .doom-ring[data-cluster=title],.doom-keypad[data-ui-mode=demo] .doom-ring[data-cluster=demo],.doom-keypad[data-ui-mode=menu] .doom-ring[data-cluster=menu],.doom-keypad[data-ui-mode=game] .doom-ring[data-cluster=game],.doom-keypad[data-ui-mode=map] .doom-ring[data-cluster=map],.doom-keypad[data-ui-mode=intermission] .doom-ring[data-cluster=intermission],.doom-keypad[data-ui-mode=finale] .doom-ring[data-cluster=finale]{display:block}.doom-act-btn{--r:var(--ring-r);transform:translate(-50%, -50%) rotate(var(--angle)) translateY(calc(-1 * var(--r))) rotate(calc(-1 * var(--angle)));border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;top:50%;left:50%}.doom-act-small{width:var(--btn);height:var(--btn);font-size:11px}.doom-act-large{--r:calc(var(--ring-r) + (var(--fire) - var(--btn)) / 2);width:var(--fire);height:var(--fire);background:#781408b3;font-size:14px}.doom-act-center{--r:0px;--angle:0deg;width:var(--turn);height:var(--turn);font-size:15px}@container (width<=640px){.doom-keypad{--stick:116px;--turn:104px;--btn:40px;--fire:60px}}@container (height<=400px){.doom-keypad{--stick:100px;--turn:92px;--btn:36px;--fire:54px;--inset:8px;--ring-gap:4px}.doom-corner{min-height:36px}.doom-corner span{display:none}}@media (prefers-reduced-motion:reduce){.doom-gate.loading .doom-gate-title{animation:none}.doom-stick-knob,.doom-keypad button{transition:none}}