:root{--hud-bg: #1a0a0a;--hud-border: #5a2a1a;--hud-text: #f4d35e;--hud-accent: #ff6b3d;--hud-dim: #8a6a3a;font-family:Courier New,Lucida Console,monospace;color:var(--hud-text)}*{box-sizing:border-box}html,body,#root,.app{width:100%;height:100%;margin:0;padding:0;background:#000;overflow:hidden;touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.app{position:relative}.canvas-wrap{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;image-rendering:pixelated;image-rendering:-moz-crisp-edges}canvas{image-rendering:pixelated!important;image-rendering:-moz-crisp-edges!important}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5;text-shadow:1px 1px 0 #000;-webkit-user-select:none;user-select:none}.crosshair{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--hud-text);box-shadow:0 0 0 1px #000;border-radius:50%;opacity:.8}.objective{position:absolute;top:12px;left:0;right:0;text-align:center;font-size:14px;letter-spacing:1px;color:var(--hud-text)}.interact-prompt{position:absolute;left:50%;top:58%;transform:translate(-50%);background:#0009;border:1px solid var(--hud-border);padding:4px 10px;font-size:13px;color:var(--hud-text);letter-spacing:1px;white-space:nowrap}.statusbar{position:absolute;left:0;right:0;bottom:0;height:70px;background:linear-gradient(180deg,#2a1208,#150805);border-top:2px solid var(--hud-border);display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:13px;letter-spacing:1px}.statusbar .face{width:56px;height:56px;background:#2a1208;border:1px solid var(--hud-border);display:flex;align-items:center;justify-content:center;font-size:28px;color:var(--hud-text)}.statusbar .stat{display:flex;flex-direction:column;align-items:center;min-width:80px}.statusbar .stat .label{color:var(--hud-dim);font-size:10px;letter-spacing:2px}.statusbar .stat .value{color:var(--hud-text);font-size:22px;font-weight:700}.statusbar .inventory{display:flex;gap:4px}.statusbar .inventory .key{width:22px;height:22px;border:1px solid var(--hud-border);display:flex;align-items:center;justify-content:center;font-size:14px}.statusbar .inventory .key.has{background:var(--hud-accent);color:#000}.title-screen{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,#1a0a0a,#000 80%);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;pointer-events:auto}.title-screen h1{font-size:56px;color:var(--hud-accent);text-shadow:4px 4px 0 #000,0 0 16px #ff3300;letter-spacing:4px;margin:0 0 8px;text-align:center}.title-screen .subtitle{font-size:22px;color:var(--hud-text);letter-spacing:6px;margin-bottom:60px;text-align:center}.title-screen .start-btn{background:#2a1208;color:var(--hud-text);border:2px solid var(--hud-border);padding:14px 36px;font-family:inherit;font-size:20px;letter-spacing:4px;cursor:pointer;text-transform:uppercase}.title-screen .start-btn:hover{background:var(--hud-accent);color:#000}.title-screen .hint{margin-top:30px;color:var(--hud-dim);font-size:13px;letter-spacing:2px;max-width:520px;text-align:center;line-height:1.6}.photo-viewer{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:8;pointer-events:auto}.photo-viewer .frame{background:#1a0a0a;border:4px solid #5a2a1a;padding:14px;max-width:80vw;max-height:80vh;display:flex;flex-direction:column;align-items:center}.photo-viewer .frame img{max-width:70vw;max-height:60vh;image-rendering:pixelated;border:1px solid #5a2a1a}.photo-viewer .frame .caption{margin-top:14px;color:var(--hud-text);font-size:15px;max-width:600px;text-align:center;line-height:1.5;letter-spacing:1px}.photo-viewer .frame .close{margin-top:10px;color:var(--hud-dim);font-size:11px;letter-spacing:2px}.keypad{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:8;pointer-events:auto}.keypad .pad{background:#1a0a0a;border:4px solid #5a2a1a;padding:24px;display:flex;flex-direction:column;align-items:center}.keypad .pad .display{background:#000;color:var(--hud-accent);font-size:36px;letter-spacing:16px;padding:10px 18px;border:1px solid #5a2a1a;margin-bottom:16px;min-width:160px;text-align:center}.keypad .pad .grid{display:grid;grid-template-columns:repeat(3,60px);gap:8px}.keypad .pad .key{background:#2a1208;color:var(--hud-text);border:1px solid #5a2a1a;font-family:inherit;font-size:22px;height:50px;cursor:pointer}.keypad .pad .key:hover{background:var(--hud-accent);color:#000}.keypad .pad .key.wide{grid-column:span 3;height:36px;font-size:13px;letter-spacing:2px}.keypad .pad .err{color:#ff3030;margin-top:8px;letter-spacing:2px;height:18px;font-size:13px}.dialog{position:absolute;left:50%;bottom:90px;transform:translate(-50%);background:#1a0a0a;border:2px solid var(--hud-border);padding:14px 18px;width:min(640px,90vw);z-index:7;pointer-events:auto}.dialog .name{color:var(--hud-accent);font-size:14px;letter-spacing:3px;margin-bottom:6px;text-transform:uppercase}.dialog .text{color:var(--hud-text);font-size:16px;line-height:1.5;letter-spacing:1px;min-height:22px}.dialog .hint{margin-top:10px;color:var(--hud-dim);font-size:11px;letter-spacing:2px;text-align:right}.finale-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;z-index:6;text-align:center}.finale-overlay h1{font-size:88px;color:#ffe066;letter-spacing:8px;text-shadow:0 0 20px #ff8800,4px 4px 0 #000;margin:0;animation:pulse 1.2s ease-in-out infinite}.finale-overlay h2{font-size:40px;color:#fff;letter-spacing:4px;text-shadow:2px 2px 0 #000;margin-top:14px}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.9}}.confetti{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:5}.confetti span{position:absolute;top:-20px;width:10px;height:14px;animation:fall linear infinite}@keyframes fall{0%{transform:translateY(-20px) rotate(0);opacity:1}to{transform:translateY(105vh) rotate(720deg);opacity:.8}}@keyframes hitFlash{0%{opacity:0}20%{opacity:1}to{opacity:0}}@keyframes hpHit{0%{transform:scale(1)}30%{transform:scale(1.6)}to{transform:scale(1)}}@keyframes deathFade{0%{opacity:0}to{opacity:1}}@keyframes deathPulse{0%,to{transform:scale(1);text-shadow:4px 4px 0 #000,0 0 24px #ff0000,0 0 64px #800}50%{transform:scale(1.04);text-shadow:4px 4px 0 #000,0 0 48px #ff3030,0 0 96px #b00}}@keyframes deathBlink{0%,to{opacity:.3}50%{opacity:1}}.mc-look{position:fixed;right:0;top:0;width:50vw;height:100vh;z-index:4;background:transparent;touch-action:none}.mc-joy-zone{position:fixed;left:0;bottom:0;width:50vw;height:70vh;z-index:4;background:transparent;touch-action:none}.mc-joy-base{position:fixed;width:140px;height:140px;border-radius:50%;border:2px solid rgba(244,211,94,.55);background:#1a0a0a73;transform:translate(-50%,-50%);pointer-events:none;z-index:8;box-shadow:0 0 18px #0009}.mc-joy-knob{position:fixed;width:64px;height:64px;border-radius:50%;background:#ff6b3dd9;border:2px solid rgba(255,224,102,.9);transform:translate(-50%,-50%);pointer-events:none;z-index:9;box-shadow:0 0 12px #ff6b3db3}.mc-actions{position:fixed;right:18px;bottom:86px;z-index:9;display:flex;flex-direction:column;gap:14px;pointer-events:none}.mc-btn{width:78px;height:78px;border-radius:50%;border:2px solid #5a2a1a;background:#1a0a0ad9;color:#f4d35e;font-family:inherit;font-size:28px;font-weight:700;letter-spacing:1px;pointer-events:auto;display:flex;align-items:center;justify-content:center;user-select:none;-webkit-user-select:none;cursor:pointer;text-shadow:1px 1px 0 #000;box-shadow:0 2px 12px #0009,inset 0 -3px #0006}.mc-btn:active{background:var(--hud-accent);color:#000;transform:translateY(1px)}.mc-btn-pulse{animation:mcBtnPulse 1.1s ease-in-out infinite;border-color:var(--hud-accent)}@keyframes mcBtnPulse{0%,to{box-shadow:0 2px 12px #0009,inset 0 -3px #0006,0 0 #ff6b3d99}50%{box-shadow:0 2px 12px #0009,inset 0 -3px #0006,0 0 0 14px #ff6b3d00}}.mc-close{position:fixed;top:16px;right:16px;z-index:20;width:56px;height:56px;border-radius:50%;border:2px solid #5a2a1a;background:#000000b3;color:#f4d35e;font-family:inherit;font-size:26px;cursor:pointer;pointer-events:auto;user-select:none;-webkit-user-select:none}.mc-respawn{position:fixed;left:50%;bottom:12vh;transform:translate(-50%);z-index:110;padding:18px 36px;border:2px solid var(--hud-accent);background:#000000d9;color:#ffe066;font-family:inherit;font-size:22px;letter-spacing:4px;cursor:pointer;pointer-events:auto}@media (max-width: 700px),(hover: none) and (pointer: coarse){.statusbar{height:56px;padding:0 10px;font-size:11px}.statusbar .face{width:40px;height:40px;font-size:20px}.statusbar .stat{min-width:56px}.statusbar .stat .value{font-size:16px}.statusbar .inventory .key{width:16px;height:16px;font-size:11px}.objective{font-size:11px;padding:0 12px}.mc-actions{bottom:72px}}