.crt-scanlines{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,transparent 0px,transparent 2px,rgba(0,0,0,.3) 2px,rgba(0,0,0,.3) 4px)}.crt-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.6) 80%,rgba(0,0,0,.95) 100%)}.crt-flicker{position:absolute;inset:0;pointer-events:none;background:#000;animation:crtFlicker .1s infinite}@keyframes crtFlicker{0%{opacity:.02}5%{opacity:.1}10%{opacity:.02}15%{opacity:.1}50%{opacity:.02}55%{opacity:.1}80%{opacity:.02}to{opacity:.1}}@media(min-width:768px){:where(.crt-bezel){display:flex;flex-direction:column;align-items:center;justify-content:center;--bezel-x: 120px;--bezel-y: 160px;--screen-w: min(96vw - var(--bezel-x), (96vh - var(--bezel-y)) * 4 / 3);--screen-h: min(96vh - var(--bezel-y), (96vw - var(--bezel-x)) * 3 / 4);background:radial-gradient(ellipse at 50% 60%,#18150e,#0d0b07 60%,#080604)}:where(.crt-bezel):before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,calc(-50% + 8px));width:calc(var(--screen-w) + var(--bezel-x));height:calc(var(--screen-h) + var(--bezel-y));border-radius:18px;background:linear-gradient(170deg,#d6ca9e,#ccbe8c 15%,#c8b886 40%,#c0b07e,#b4a672);box-shadow:inset 0 2px #ffffff59,inset 0 6px 12px #ffffff14,inset 0 -2px #0003,inset 0 -8px 16px #0000000f,inset 2px 0 #ffffff26,inset -2px 0 #0000001a,0 4px #a09060,0 6px #907e52,0 8px #806e44,0 12px 40px #000000b3,0 30px 80px #0006}:where(.crt-bezel):after{content:"";width:8px;height:8px;border-radius:50%;background:#3c3;box-shadow:0 0 4px #3c3,0 0 12px #3c36;margin-top:1.2rem;z-index:2;flex-shrink:0}:where(.crt-bezel .crt-screen){position:relative;z-index:1;width:var(--screen-w);height:var(--screen-h);aspect-ratio:4 / 3;border-radius:20px;overflow:hidden;box-shadow:inset 0 0 80px #0006,inset 0 0 160px #00000026,0 0 0 5px #1a1814,0 0 0 10px #2e2c22,0 0 25px #0009}:where(.crt-bezel .crt-screen):after{content:"";position:absolute;inset:0;z-index:15;pointer-events:none;border-radius:inherit;background:linear-gradient(-30deg,transparent 0%,transparent 32%,rgba(255,255,255,.03) 40%,rgba(255,255,255,.07) 47%,rgba(255,255,255,.03) 54%,transparent 62%,transparent 100%),radial-gradient(ellipse at 50% 50%,transparent 60%,rgba(0,0,0,.12) 100%)}}.arcade-wrapper{position:relative;width:min(95vw,calc(85vh * 4 / 3));aspect-ratio:4 / 3;margin:0 auto;background:#1a1a2e;overflow:hidden;-moz-user-select:none;user-select:none;-webkit-user-select:none;touch-action:none;-webkit-touch-callout:none}.arcade-scene{position:relative;width:100%;height:100%}.arcade-floor{position:absolute;bottom:0;left:0;right:0;height:35%;background:repeating-linear-gradient(90deg,#12122a 0px 8px,#16163a 8px 16px),repeating-linear-gradient(0deg,#12122a 0px 8px,#16163a 8px 16px);background-size:16px 16px;background-blend-mode:difference}#tv{position:absolute;top:5%;left:50%;transform:translate(-50%);width:70%;z-index:10}.tv-bezel{background:#3a3a3a;border:4px solid #2a2a2a;padding:16px 16px 12px;box-shadow:inset 0 0 0 2px #444,0 4px #222,0 6px #111}.tv-screen-container{position:relative;width:100%;aspect-ratio:320 / 200;background:#000;overflow:hidden;border:2px solid #222}#static-canvas,#canvas{position:absolute;top:0;left:0;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges}#canvas{display:none;z-index:2;outline:none}#static-canvas{z-index:1}.arcade-scene .crt-scanlines{z-index:3}.arcade-scene .crt-vignette{z-index:4}.tv-stand{width:40%;height:8px;margin:0 auto;background:#2a2a2a;box-shadow:0 2px #222}.tv-led{width:8px;height:8px;margin:6px auto 0;background:#c44;box-shadow:0 0 4px #c44;transition:background .3s,box-shadow .3s}.tv-led.on{background:#4c4;box-shadow:0 0 8px #4c4}#console-unit{position:absolute;top:72%;left:50%;transform:translate(-50%);width:35%;height:10%;background:#4a4a4a;border:3px solid #3a3a3a;display:flex;align-items:center;justify-content:center;z-index:9;box-shadow:inset 0 -2px #555,0 3px #333}#cartridge-slot{width:50%;height:60%;background:#222;border:2px solid #333;transition:box-shadow .2s,border-color .2s}#cartridge-slot.highlight{border-color:#06b6d4;box-shadow:0 0 12px #06b6d499,inset 0 0 6px #06b6d44d}#cartridge-slot.filled{border-color:#555;box-shadow:none}#cartridge{position:absolute;bottom:12%;left:20%;width:14%;z-index:20;cursor:grab;touch-action:none;transition:filter .1s}#cartridge:active{cursor:grabbing}#cartridge.dragging{z-index:50;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5));cursor:grabbing}#cartridge.inserted{pointer-events:none;cursor:default}.cartridge-body{background:#5a5a5a;border:3px solid #4a4a4a;padding:4px;position:relative;box-shadow:inset 0 0 0 1px #666,0 2px #444}.cartridge-label{background:#c44;color:#fff;font-family:monospace;font-weight:700;font-size:clamp(8px,1.5vw,14px);text-align:center;padding:4px 2px;letter-spacing:2px;text-shadow:1px 1px 0 #800}.cartridge-pins{display:flex;justify-content:center;gap:2px;padding-top:2px}.cartridge-pin{width:4px;height:6px;background:#aa8}#arcade-hint{position:absolute;bottom:4%;left:50%;transform:translate(-50%);color:#06b6d4;font-family:monospace;font-size:clamp(9px,1.2vw,13px);text-align:center;white-space:nowrap;animation:hintBlink 1.5s step-end infinite;z-index:5;text-shadow:0 0 6px rgba(6,182,212,.4)}#doom-overlay{position:fixed;inset:0;z-index:1000;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:none}#doom-overlay:focus{outline:none}#doom-overlay .crt-screen{background:#000}#doom-overlay .crt-screen canvas{position:absolute;top:0;left:0;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;z-index:1}#doom-overlay .crt-scanlines{z-index:3}#doom-overlay .crt-vignette{z-index:4}.eject-btn{position:absolute;top:20px;right:20px;z-index:100;background:#c44;color:#fff;border:3px solid #a33;font-family:monospace;font-weight:700;font-size:14px;padding:8px 16px;cursor:pointer;letter-spacing:1px;text-transform:uppercase;box-shadow:0 3px #822;transition:background .1s}.eject-btn:hover{background:#d55}.eject-btn:active{box-shadow:0 1px #822;transform:translateY(2px)}@keyframes cartridgeInsert{0%{transform:translateY(0)}30%{transform:translateY(-20px)}to{transform:translateY(0);opacity:.8}}.cartridge-inserting{animation:cartridgeInsert .6s ease-out forwards}@keyframes tvFlicker{0%{opacity:1}10%{opacity:.2}20%{opacity:1}35%{opacity:.1}50%{opacity:1}65%{opacity:.3}80%{opacity:1}to{opacity:1}}.tv-flickering .tv-screen-container{animation:tvFlicker .8s step-end forwards}@keyframes cartridgeEject{0%{transform:translate(0) rotate(0);opacity:.8}15%{transform:translateY(-40px) rotate(-5deg);opacity:1}50%{transform:translate(60px,-60px) rotate(15deg)}75%{transform:translate(100px,10px) rotate(5deg)}85%{transform:translate(100px) rotate(-2deg)}to{transform:translate(100px) rotate(0);opacity:1}}.cartridge-ejecting{animation:cartridgeEject 1.2s cubic-bezier(.2,0,.3,1) forwards}@keyframes hintBlink{0%,49%{opacity:1}50%,to{opacity:0}}@media(max-width:640px){.arcade-wrapper{width:100vw;height:100dvh;height:100vh;aspect-ratio:auto}#tv{width:75%;top:5%}#console-unit{width:50%;top:55%}#cartridge{width:20%;bottom:15%;left:10%}#arcade-hint{font-size:clamp(10px,3vw,14px)}}@media(max-width:767px){#doom-overlay:not([hidden]){background:#000;display:flex;align-items:center;justify-content:center}#doom-overlay .crt-screen{position:relative;width:min(100vw,calc(100dvh * 4 / 3));max-height:100dvh;aspect-ratio:4 / 3}}#mobile-controls:not([hidden]){position:fixed;inset:0;z-index:1010;display:flex;flex-direction:column;justify-content:space-between;padding:20px;padding-bottom:max(20px,env(safe-area-inset-bottom));pointer-events:none}.mc-top-row{display:flex;justify-content:space-between;padding-top:50px}.mc-bottom-row{display:flex;justify-content:space-between;align-items:flex-end}.mc-menu-btn{width:50px;height:36px;border-radius:6px;font-size:12px;letter-spacing:1px}.mc-dpad{display:grid;grid-template-columns:repeat(3,54px);grid-template-rows:repeat(3,54px);gap:3px}.mc-btn{pointer-events:auto;touch-action:none;-webkit-touch-callout:none;-moz-user-select:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);color:#ffffffb3;font-family:monospace;font-weight:700;font-size:20px;display:flex;align-items:center;justify-content:center;padding:0;margin:0;outline:none}.mc-btn.active{background:#ffffff4d;border-color:#ffffff80}.mc-up{grid-column:2;grid-row:1;border-radius:10px 10px 2px 2px}.mc-down{grid-column:2;grid-row:3;border-radius:2px 2px 10px 10px}.mc-left{grid-column:1;grid-row:2;border-radius:10px 2px 2px 10px}.mc-right{grid-column:3;grid-row:2;border-radius:2px 10px 10px 2px}.mc-actions{display:flex;flex-direction:column;align-items:center;gap:10px}.mc-fire{width:70px;height:70px;border-radius:50%;background:#cc444440;border-color:#cc444480;font-size:13px;letter-spacing:1px}.mc-fire.active{background:#cc44448c;border-color:#c44c}.mc-use{width:56px;height:56px;border-radius:50%;font-size:12px;letter-spacing:1px}