*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#000;color:#d9d4c7;font-family:Inter,Helvetica Neue,Arial,sans-serif}#app canvas{display:block;touch-action:none}.hidden{display:none!important}#grain{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.09;mix-blend-mode:screen;z-index:2}#vignette{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2;background:radial-gradient(ellipse at center,#0000 45%,#000000d9)}#slats{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:3;background:repeating-linear-gradient(180deg,#000 0,#000 26px,#0000 26px,#0000 34px)}#redflash{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:4;background:#6a0000;opacity:0;mix-blend-mode:multiply}#fade{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:20;background:#000;opacity:0;transition:opacity .6s}#floorCard{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:21;pointer-events:none;font-size:64px;font-weight:800;letter-spacing:.3em;color:#e8e2d2;opacity:0;transition:opacity 1s}#hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}#floorTag{position:absolute;left:calc(24px + env(safe-area-inset-left));top:calc(20px + env(safe-area-inset-top));font-weight:800;letter-spacing:.25em;font-size:15px;color:#cfc8b6}#objective{position:absolute;left:calc(24px + env(safe-area-inset-left));top:calc(44px + env(safe-area-inset-top));font-size:14px;color:#a39d8e;max-width:380px;transition:opacity 1s}#crosshair{position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:#e6e1d2b3}#holdRing{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px;transform:rotate(-90deg);opacity:0}#holdRing circle{fill:none;stroke-width:3}#holdRing .bg{stroke:#ffffff1f}#holdRing .fg{stroke:#e8e2d2;stroke-dasharray:100.5;stroke-dashoffset:100.5}#prompt{position:absolute;left:50%;top:calc(50% + 34px);transform:translate(-50%);font-size:15px;color:#e8e2d2;text-shadow:0 0 6px #000;white-space:nowrap}#prompt em{font-style:normal;color:#a39d8e}#message{position:absolute;left:50%;top:calc(50% + 60px);transform:translate(-50%);font-size:14px;color:#b9b2a2;text-shadow:0 0 6px #000;transition:opacity .5s;white-space:nowrap}#caption{position:absolute;left:50%;bottom:90px;transform:translate(-50%);font-size:16px;color:#e8e2d2;background:#0000008c;padding:6px 14px;border-radius:4px;opacity:0;transition:opacity .4s;white-space:nowrap}#meters{position:absolute;left:calc(24px + env(safe-area-inset-left));bottom:calc(22px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:7px}.meter{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.18em;color:#8f8979}.meter span{width:52px}.bar{width:120px;height:4px;background:#ffffff1a}.bar i{display:block;height:100%;width:100%;background:#d9d4c7}#noise{background:#c9452c}#inv{position:absolute;right:calc(24px + env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:flex-end;gap:5px}.inv-slots{display:flex;gap:10px}.inv-hint{font-size:9px;letter-spacing:.16em;color:#d9d4c773;text-transform:uppercase}.slot{width:92px;height:82px;border:1px solid rgba(255,255,255,.15);background:#00000073;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.slot.sel{border-color:#e8e2d2}.slot .ic svg{width:36px;height:36px;stroke:#e8e2d2;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.slot .nm{font-size:11px;color:#cfc8b6}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;align-items:center;justify-content:center;background:#000000d1}#title{background:radial-gradient(ellipse at 50% 40%,#1a120c,#000 70%)}.card{max-width:860px;padding:36px;text-align:left}.pause-card{max-width:780px}.card h1{font-size:56px;font-weight:800;letter-spacing:.12em;color:#e8e2d2;margin-bottom:18px}.card h2{font-size:34px;font-weight:800;letter-spacing:.06em;color:#e8e2d2;margin-bottom:14px}.card .lead{font-size:18px;color:#d9d4c7;margin-bottom:10px}.card .sub{font-size:14px;line-height:1.55;color:#9c9585;margin-bottom:18px}.keyboard-diagram{display:flex;flex-direction:column;gap:6px;padding:14px;margin:18px 0 20px;background:#ffffff06;border:1px solid rgba(255,255,255,.08)}.key-row{display:flex;justify-content:center;align-items:stretch;gap:6px;min-height:42px}.key-lit,.key-muted,.mouse-lit{min-width:54px;padding:5px 8px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(255,255,255,.09);border-radius:3px;background:#ffffff09}.key-lit{border-color:#c6b99d6b;background:#bfad8d1a;box-shadow:inset 0 0 12px #bfad8d0b}.key-lit kbd{min-width:28px;text-align:center;margin:0;border-color:#e8e2d28c;background:#00000059}.key-lit i,.mouse-lit i{min-width:74px;font-size:10px;line-height:1.25;font-style:normal;color:#b9b2a2;text-align:left}.key-lit.wide{min-width:206px}.key-lit.wide i{min-width:116px}.key-muted{min-width:40px;border-color:#ffffff09;color:#d9d4c72b;font-size:9px;background:#ffffff03}.mouse-lit{min-width:96px;border-color:#c6b99d6b;background:#bfad8d1a}.mouse-lit b{width:16px;height:24px;border:1px solid rgba(232,226,210,.65);border-radius:9px;position:relative}.mouse-lit b:after{content:"";position:absolute;left:7px;top:2px;height:6px;border-left:1px solid #e8e2d2}kbd{display:inline-block;font-family:inherit;font-size:11px;padding:2px 6px;border:1px solid rgba(255,255,255,.25);border-radius:3px;color:#e8e2d2;margin-right:4px}button{font-family:inherit;font-size:15px;font-weight:700;letter-spacing:.06em;padding:13px 26px;border:0;border-radius:4px;background:#c9452c;color:#fff;cursor:pointer;margin-right:10px;margin-top:6px}button:hover{background:#dd5236}button.ghost{background:transparent;border:1px solid rgba(255,255,255,.3);color:#d9d4c7}.touch-diagram,body.touch-mode .keyboard-diagram{display:none}body.touch-mode .touch-diagram{display:grid}.touch-guide-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}.touch-guide-thumbs div{display:flex;align-items:center;justify-content:center;gap:8px;min-height:38px;border:1px solid rgba(198,185,157,.34);background:#bfad8d14;color:#b9b2a2;font-size:11px}.touch-guide-thumbs b{color:#e8e2d2;font-size:11px}.touch-guide-thumbs span{color:#b9b2a2}.touch-guide-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 8px;padding:10px;border:1px solid rgba(255,255,255,.08);background:#ffffff06}.touch-guide-actions span{color:#b9b2a2;font-size:10px;line-height:1.35}.touch-guide-actions b{display:inline-block;min-width:55px;color:#e8e2d2}#touchControls{display:none}#virtualJoystick{display:none;position:fixed;z-index:6;width:140px;height:140px;transform:translate(-50%,-50%);border:1px solid rgba(217,212,199,.55);border-radius:50%;background:#0808077a;pointer-events:none}#virtualJoystick.active{display:block}#virtualJoystick:before{content:"";position:absolute;top:10px;right:10px;bottom:10px;left:10px;border:1px solid rgba(217,212,199,.18);border-radius:50%}#virtualKnob{position:absolute;left:50%;top:50%;width:48px;height:48px;transform:translate(-50%,-50%);border:1px solid rgba(232,226,210,.72);border-radius:50%;background:#bfad8d40}#touchButtons{position:fixed;right:calc(20px + env(safe-area-inset-right));bottom:calc(118px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,60px);gap:6px;pointer-events:auto}button.touch-button{min-width:56px;min-height:56px;margin:0;padding:0 5px;border:1px solid rgba(217,212,199,.3);border-radius:7px;background:#11110fcc;color:#e8e2d2;font-size:10px;line-height:1.1;letter-spacing:.04em;touch-action:none;-webkit-user-select:none;user-select:none}button.touch-button:hover{background:#11110fcc}button.touch-button.pressed{border-color:#e8e2d2d9;background:#64553ec7}body.touch-mode #touchControls{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none}body.touch-mode #touchButtons{display:grid}button.touch-pause{display:none;position:fixed;z-index:7;top:calc(12px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right));width:68px;min-height:44px;pointer-events:auto}body.touch-mode button.touch-pause{display:block}button.touch-drop{display:none;position:fixed;z-index:7;right:calc(226px + env(safe-area-inset-right));bottom:calc(33px + env(safe-area-inset-bottom));width:50px;min-width:50px;min-height:44px;font-size:9px;pointer-events:auto}body.touch-mode button.touch-drop{display:block}#rotateOverlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:25;align-items:center;justify-content:center;padding:24px;background:#0000008f;pointer-events:none;text-align:center}#rotateOverlay span{padding:12px 16px;border:1px solid rgba(217,212,199,.35);background:#090908db;color:#e8e2d2;font-size:15px;letter-spacing:.04em}@media (max-width: 760px){.card{max-width:100%;padding:22px}.card h1{font-size:38px}.keyboard-diagram{padding:8px;gap:4px}.key-lit,.key-muted,.mouse-lit{min-width:40px;padding:4px;gap:4px}.key-lit i,.mouse-lit i{min-width:50px;font-size:8px}.key-lit.wide{min-width:150px}.key-lit.wide i{min-width:84px}}@media (orientation: landscape) and (max-height: 500px){body.touch-mode .card{padding:14px 20px}body.touch-mode .card h1{font-size:30px;margin-bottom:8px}body.touch-mode .card h2{font-size:24px;margin-bottom:8px}body.touch-mode .card .lead{font-size:14px;margin-bottom:5px}body.touch-mode .card .sub{font-size:11px;line-height:1.3;margin-bottom:8px}body.touch-mode .touch-guide-thumbs div{min-height:30px;font-size:10px}body.touch-mode .touch-guide-actions{padding:6px;gap:4px 6px}body.touch-mode .touch-guide-actions span{font-size:9px}body.touch-mode #title button{padding:9px 18px}}@media (orientation: portrait) and (max-width: 900px){body.touch-mode #rotateOverlay{display:flex}body.touch-mode #touchButtons{right:calc(12px + env(safe-area-inset-right));bottom:calc(116px + env(safe-area-inset-bottom));grid-template-columns:repeat(2,60px)}body.touch-mode button.touch-drop{position:static;right:auto;bottom:auto;width:50px;min-width:50px;min-height:44px}}
