html,body{overscroll-behavior:none;touch-action:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;color:#fff4dc;background:#0b0814;height:100%;margin:0;font-family:system-ui,Segoe UI,sans-serif;overflow:hidden}#app{cursor:crosshair;position:fixed;inset:0}#app canvas{display:block}#hud{pointer-events:none;z-index:2;position:fixed;inset:0;overflow:hidden}.hud-panel{left:calc(16px + env(safe-area-inset-left));top:calc(14px + env(safe-area-inset-top));background:#0e091899;border:1px solid #fff4dc1f;border-radius:10px;min-width:220px;padding:10px 14px;position:absolute}.room-name{letter-spacing:.08em;text-transform:uppercase;opacity:.7;margin-bottom:6px;font-size:13px}.hp{align-items:center;gap:8px;display:flex}.hp-heart{color:#ff5f7a;font-size:18px}.hp-bar{background:#ffffff1f;border-radius:5px;flex:1;height:10px;overflow:hidden}.hp-fill{transform-origin:0;background:linear-gradient(90deg,#ff5f7a,#ffb36b);height:100%;transition:transform .15s}.hp-fill.low{background:#ff3048;animation:.6s infinite alternate pulse}.hp-text{font-variant-numeric:tabular-nums;text-align:right;min-width:26px;font-size:13px}.ghost-count{color:#bfefff;margin-top:6px;font-size:13px}.ghost-label{text-align:center;will-change:transform;display:none;position:absolute;top:0;left:0}.gl-num{color:#fff;text-shadow:0 0 6px #5fd3ff,0 2px #1b1024,0 0 2px #1b1024;font-variant-numeric:tabular-nums;font-size:30px;font-weight:800;line-height:1;display:block}.gl-bar{background:#0a0614b3;border:1px solid #fff6;border-radius:4px;width:70px;height:7px;margin:4px auto 0;overflow:hidden}.gl-fill{transform-origin:0;background:#7fe6ff;height:100%}.gl-tension{background:#0a0614b3;border-radius:2px;width:70px;height:4px;margin:3px auto 0;overflow:hidden}.gl-tension-fill{transform-origin:0;background:linear-gradient(90deg,#ffd23f,#ff3048);height:100%;transform:scaleX(0)}.gl-status{letter-spacing:.08em;height:16px;margin-top:3px;font-size:13px;font-weight:800}.gl-status.blocked{color:#c9c3d6;text-shadow:0 1px #1b1024}.gl-status.surge{color:#ffb36b;text-shadow:0 0 8px #ff8c28cc,0 1px #1b1024;animation:.12s infinite alternate pulse}.ghost-label.slipping .gl-num{color:#ff8a8a;animation:.15s infinite alternate pulse}.wallet{color:#ffe27a;text-shadow:0 0 8px #ffc83c59;transform-origin:0;font-variant-numeric:tabular-nums;align-items:center;gap:6px;margin-top:6px;font-size:15px;font-weight:800;display:flex}.wallet-icon{color:#5a3a00;width:18px;height:18px;text-shadow:none;background:linear-gradient(#ffe27a,#e0a020);border-radius:50%;place-items:center;font-size:12px;display:inline-grid}.inventory{transform-origin:0;flex-wrap:wrap;gap:5px;margin-top:6px;display:flex}.inventory:empty{display:none}.key-chip{color:#ffe9a8;background:#ffd23f29;border:1px solid #ffd23f99;border-radius:999px;align-items:center;gap:5px;padding:2px 8px 2px 6px;font-size:12px;font-weight:700;display:inline-flex}.key-chip:before{content:"🗝";font-size:13px}.float-text.loot{font-size:16px;font-style:normal;font-weight:800}.float-text.loot.money{color:#9dff8a;text-shadow:0 1px #1b1024,0 0 8px #78ff6480}.float-text.loot.heart{color:#ff8aa3;text-shadow:0 1px #1b1024,0 0 10px #ff3b5cb3;font-size:18px}.float-text.loot.gem{font-size:19px}.float-text.ruby{color:#ff6b82;text-shadow:0 1px #1b1024,0 0 10px #ff2a4ab3}.float-text.sapphire{color:#7aa8ff;text-shadow:0 1px #1b1024,0 0 10px #2f73ffb3}.float-text.emerald{color:#5dff9e;text-shadow:0 1px #1b1024,0 0 10px #20d67ab3}.float-text.diamond{color:#f2fdff;text-shadow:0 1px #1b1024,0 0 12px #c8f5ffe6}.interact-prompt{color:#ffe9c4;white-space:nowrap;opacity:0;will-change:transform;background:#0e0918c7;border:1px solid #ffd98a8c;border-radius:999px;align-items:center;gap:6px;padding:4px 10px 4px 5px;font-size:13px;font-weight:700;transition:opacity .12s;display:flex;position:absolute;top:0;left:0}.interact-prompt.shown{opacity:1}.interact-prompt .key{color:#1b1024;background:#ffd98a;border-radius:5px;place-items:center;width:20px;height:20px;font-size:12px;font-weight:800;display:inline-grid;box-shadow:0 2px #a8823a}.float-text{color:#d8ccb8;text-shadow:0 1px #1b1024,0 0 6px #0009;white-space:nowrap;will-change:transform;font-size:14px;font-style:italic;font-weight:600;display:none;position:absolute;top:0;left:0}.room-title{opacity:0;white-space:nowrap;pointer-events:none;align-items:center;gap:18px;display:flex;position:absolute;top:38%;left:50%;transform:translate(-50%,-50%)}.room-title-name{text-transform:uppercase;letter-spacing:.32em;color:#f3e6c8;text-shadow:0 0 18px #c9a8ff73,0 2px #0009;font-family:Georgia,Times New Roman,serif;font-size:clamp(22px,5vw,38px);font-weight:400}.room-title-rule{background:linear-gradient(90deg,#0000,#f3e6c8cc,#0000);width:clamp(28px,8vw,90px);height:1px}.banner{text-align:center;background:#0e0918b8;border-radius:14px;padding:18px 34px;transition:opacity .4s;position:absolute;top:30%;left:50%;transform:translate(-50%,-50%)}.banner.hidden{opacity:0}.banner-title{letter-spacing:.02em;font-size:clamp(26px,6vw,40px);font-weight:800}.banner.good .banner-title{color:#ffd98a;text-shadow:0 0 18px #ffc46bb3}.banner.bad .banner-title{color:#ff8a9a;text-shadow:0 0 18px #ff304899}.banner-sub{opacity:.85;margin-top:6px;font-size:16px}.vignette{background:radial-gradient(75% 70%,#04020a00 45%,#04020a8c 78%,#04020aeb 100%);transition:opacity .2s;position:absolute;inset:0}.fade{opacity:0;z-index:3;background:#000;display:none;position:absolute;inset:0}.hurt-flash{opacity:0;background:radial-gradient(#ff002800 45%,#ff002873 100%);position:absolute;inset:0}.controls-hint{left:calc(16px + env(safe-area-inset-left));bottom:calc(12px + env(safe-area-inset-bottom));opacity:.55;font-size:12px;position:absolute}.debug-overlay{color:#9dff5f;white-space:pre;pointer-events:none;z-index:10;background:#000000a6;border-radius:6px;padding:8px 10px;font:12px/1.45 ui-monospace,Consolas,monospace;position:fixed;bottom:12px;right:12px}@keyframes pulse{0%{opacity:1}to{opacity:.45}}.hud-buttons{gap:6px;margin-top:8px;display:flex}.hud-btn{pointer-events:auto;cursor:pointer;touch-action:manipulation;background:linear-gradient(#3a2850,#241634);border:1px solid #e8c45a73;border-radius:9px;place-items:center;width:38px;height:34px;padding:0;transition:transform .1s,box-shadow .15s,border-color .15s;display:grid;box-shadow:inset 0 1px #ffffff14,0 2px 6px #0006}.hud-btn svg{filter:drop-shadow(0 1px 1px #00000080);display:block}.hud-btn:hover{border-color:#e8c45ae6;box-shadow:inset 0 1px #ffffff1a,0 0 10px #e8c45a59}.hud-btn:active{transform:scale(.94)}.touch-layer{z-index:1;touch-action:none;position:fixed;inset:0}.touch-zone{touch-action:none;width:50%;position:absolute;top:0;bottom:0}.touch-zone.left{left:0}.touch-zone.right{right:0}.stick-base{pointer-events:none;background:#ffffff12;border:2px solid #fff4dc47;border-radius:50%;width:112px;height:112px;margin:-56px 0 0 -56px;position:absolute}.stick-base.idle.left{left:calc(96px + env(safe-area-inset-left));top:calc(100% - 110px - env(safe-area-inset-bottom));opacity:.45}.stick-base.idle.right{display:none}.stick-knob{background:#fff4dc80;border-radius:50%;width:52px;height:52px;margin:-26px 0 0 -26px;position:absolute;top:50%;left:50%;box-shadow:0 2px 8px #0006}.touch-btn{letter-spacing:.04em;color:#fff4dc;touch-action:none;background:#0e091899;border:2px solid #fff4dc4d;border-radius:50%;place-items:center;font-weight:800;transition:transform 60ms,background .1s,opacity .15s;display:grid;position:absolute}.touch-btn.vac{width:92px;height:92px;right:calc(22px + env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));color:#bfefff;border-color:#7fe6ffb3;font-size:18px}.touch-btn.vac.pressed{background:#7fe6ff59;transform:scale(.94)}.touch-btn.blow{width:64px;height:64px;right:calc(124px + env(safe-area-inset-right));bottom:calc(26px + env(safe-area-inset-bottom));color:#dce8ff;border-color:#c8dcff8c;font-size:12px}.touch-btn.blow.pressed{background:#c8dcff4d;transform:scale(.94)}.touch-btn.interact{width:70px;height:70px;right:calc(33px + env(safe-area-inset-right));bottom:calc(128px + env(safe-area-inset-bottom));opacity:.45;font-size:11px}.touch-btn.interact.ready{opacity:1;color:#ffe9c4;background:#ffd98a38;border-color:#ffd98a;animation:.9s infinite alternate ready-pulse}.touch-btn.interact.pressed{transform:scale(.92)}@keyframes ready-pulse{0%{box-shadow:0 0 #ffd98a00}to{box-shadow:0 0 18px #ffd98a99}}.touch-mode .interact-prompt .key{display:none}.touch-mode .interact-prompt{padding:4px 10px}.touch-mode .controls-hint{left:50%;bottom:calc(14px + env(safe-area-inset-bottom));text-align:center;max-width:40%;animation:1s 9s forwards hint-fade;transform:translate(-50%)}@media (max-width:640px),(max-height:500px){.hud-panel{min-width:0;padding:7px 10px}.room-name{margin-bottom:4px;font-size:11px}.hp-bar{flex:none;width:90px}.ghost-count{font-size:12px}.gl-num{font-size:22px}.gl-bar,.gl-tension{width:56px}.banner{max-width:80vw;padding:12px 20px}.banner-sub{font-size:14px}.controls-hint{font-size:11px}}@media (max-width:640px) and (orientation:portrait){.touch-mode .controls-hint{bottom:auto;top:calc(150px + env(safe-area-inset-top));max-width:88%}}@keyframes hint-fade{to{opacity:0}}.codex{z-index:5;touch-action:none;background:#06030cb8;place-items:center;transition:opacity .18s;display:grid;position:fixed;inset:0}.codex.hidden{opacity:0;pointer-events:none}.codex-book{background:#2a1d3a;border:2px solid #c9a24a;border-radius:14px;flex-direction:column;width:min(760px,92vw);max-height:88vh;display:flex;overflow:hidden;box-shadow:0 0 0 6px #1a1024,0 18px 60px #000000b3}.codex-header{background:linear-gradient(#3a2850,#2a1d3a);border-bottom:1px solid #c9a24a80;justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.codex-title{letter-spacing:.12em;color:#f0d78c;text-shadow:0 0 10px #f0d78c59;align-items:center;gap:10px;font-family:Georgia,Times New Roman,serif;font-size:22px;display:flex}.codex-icon svg{filter:drop-shadow(0 0 6px #f0d78c59);width:32px;height:32px;display:block}.codex-close{color:#f0d78c;cursor:pointer;background:#ffffff0d;border:1px solid #f0d78c66;border-radius:8px;width:34px;height:34px;font-size:16px}.codex-body{gap:14px;min-height:0;padding:14px;display:flex;overflow:auto}.codex-list{flex-direction:column;gap:6px;min-width:170px;display:flex}.codex-entry{color:#e8dcc2;text-align:left;cursor:pointer;background:#ffffff0a;border:1px solid #f0d78c2e;border-radius:8px;align-items:center;gap:8px;padding:8px 10px;font:600 14px Georgia,serif;display:flex}.codex-entry.selected{color:#fff4dc;background:#f0d78c29;border-color:#f0d78cb3}.codex-swatch{border-radius:50%;width:12px;height:12px;box-shadow:0 0 6px}.codex-page{color:#2b1d12;background:linear-gradient(#f1e5c6,#e2d1a8);border-radius:10px;flex:1;padding:16px 18px 18px;box-shadow:inset 0 0 24px #78501e59}.codex-preview{aspect-ratio:1;background:radial-gradient(circle at 50% 45%,#3c2a5a 0%,#1a1024 70%);border:3px solid #b8903e;border-radius:50%;width:min(220px,50vw);margin:0 auto 10px;overflow:hidden;box-shadow:0 4px 14px #3c1e0a66}.codex-preview canvas{display:block;width:100%!important;height:100%!important}.codex-name{text-align:center;letter-spacing:.04em;font:700 26px Georgia,serif}.codex-stats{text-transform:uppercase;letter-spacing:.1em;color:#6b4a2a;justify-content:center;gap:22px;margin:6px 0 10px;font:14px Georgia,serif;display:flex}.codex-stats b{color:#2b1d12;font-size:16px}.codex-desc{margin:0;font:15px/1.5 Georgia,serif}@media (max-width:640px){.codex-body{flex-direction:column}.codex-list{flex-flow:wrap;min-width:0}}