:root{--bg-dark:#0a0a0c;--bg-panel:#101012f2;--accent-purple:#3e3e42;--accent-gold:gold;--text-main:#f0f0f5;--text-dim:#8a8a93;--panel-radius:0px;--font-retro:"Press Start 2P", monospace;--font-sans:"Outfit", sans-serif;--shadow-neon:0 0 10px #ffffff08}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:var(--text-main);font-family:var(--font-sans);background-image:radial-gradient(at 50% 0,#ffffff08 0,#0000 60%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex;overflow-x:hidden}#app{flex-direction:column;align-items:center;gap:15px;width:660px;max-width:100%;display:flex}.game-header{text-align:center;padding-bottom:5px}.game-title{font-family:var(--font-retro);color:#fff;text-shadow:0 0 8px #fff3;letter-spacing:2px;font-size:26px}.game-title .glyph{white-space:pre;will-change:transform;display:inline-block}.game-title .glyph.shuffling{color:#ada695}.game-title .glyph.settling{animation:.34s ease-out glyph-settle}@keyframes glyph-settle{0%{transform:translateY(-2px)rotate(-7deg)}45%{transform:translateY(1px)rotate(5deg)}to{transform:translateY(0)rotate(0)}}.dashboard{flex-direction:column;align-items:center;width:100%;display:flex}.stage-bar{justify-content:flex-end;width:100%;max-width:640px;margin-bottom:6px;display:flex}.canvas-wrapper{border-radius:var(--panel-radius);box-shadow:0 8px 25px #000000b3, var(--shadow-neon);aspect-ratio:4/3;border:4px solid #1a1a1e;width:100%;max-width:640px;position:relative;overflow:hidden}#game-canvas{width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;background-color:#1e281f;display:block}.overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:10;background:#040406d9;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .2s;display:flex;position:absolute;top:0;left:0}.overlay.hidden{opacity:0;pointer-events:none}.overlay-content{text-align:center;background:var(--bg-panel);border:2px solid var(--accent-purple);border-radius:var(--panel-radius);max-width:380px;padding:24px;box-shadow:0 0 15px #ffffff0d}.overlay-content h2{font-family:var(--font-retro);color:#fff;margin-bottom:15px;font-size:16px}.overlay-content p{color:var(--text-dim);margin-bottom:20px;font-size:14px;line-height:1.4}.retro-btn{font-family:var(--font-retro);color:#fff;cursor:pointer;background:#101012;border:2px solid #fff;border-radius:0;padding:12px 24px;font-size:11px;transition:background .15s,color .15s,transform .1s;box-shadow:0 3px #ffffff26}.retro-btn:hover{color:#101012;box-shadow:none;background:#fff;transform:translateY(1px)}.minimal-pickup{color:#fff;background:var(--bg-panel);border-radius:var(--panel-radius);border:1px solid #ffffff1a;align-items:center;gap:20px;max-width:340px;padding:20px 28px;display:flex;box-shadow:0 4px 20px #00000080}.pickup-text{text-align:left}.minimal-pickup h2{font-family:var(--font-retro);letter-spacing:1px;font-size:11px}.minimal-pickup p{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;margin-top:10px;font-size:10px}#pickup-item-icon{width:64px;height:64px;image-rendering:pixelated;flex-shrink:0}.dialogue-overlay{z-index:12;justify-content:center;padding:0 16px 18px;transition:opacity .18s;display:flex;position:absolute;bottom:0;left:0;right:0}.dialogue-overlay.hidden{opacity:0;pointer-events:none}.dialogue-box{background:var(--bg-panel);border:2px solid var(--accent-purple);border-radius:var(--panel-radius);width:100%;max-width:540px;padding:16px 18px 12px;box-shadow:0 6px 24px #0009}.dialogue-speaker{font-family:var(--font-retro);letter-spacing:1px;color:var(--accent-gold);margin-bottom:10px;font-size:10px}.dialogue-text{color:var(--text-main);min-height:3em;margin-bottom:12px;font-size:15px;line-height:1.5}.dialogue-choices{flex-direction:column;gap:8px;margin-bottom:10px;display:flex}.dialogue-choices:empty{margin-bottom:0}.dialogue-choice{font-family:var(--font-sans);text-align:left;color:var(--text-dim);border-radius:var(--panel-radius);cursor:pointer;background:#101012;border:1px solid #ffffff26;border-left-width:3px;padding:9px 14px;font-size:14px;transition:background .12s,color .12s,border-color .12s}.dialogue-choice:hover{color:var(--text-main);border-left-color:var(--accent-gold)}.dialogue-choice.active{color:var(--text-main);border-left-color:var(--accent-gold);background:#1c1c20}.dialogue-hint{font-family:var(--font-retro);letter-spacing:1px;color:var(--text-dim);text-align:right;font-size:7px}.controls-guide{width:100%;color:var(--text-dim);border-top:1px solid #ffffff14;flex-wrap:wrap;justify-content:center;align-items:center;gap:22px;padding-top:12px;font-size:12px;display:flex}.guide-item{flex-direction:column;align-items:center;gap:6px;display:flex}.guide-key{justify-content:center;align-items:center;height:44px;display:flex}.wasd{grid-template-rows:repeat(2,22px);grid-template-columns:repeat(3,22px);display:grid}.key{width:22px;height:22px;color:var(--text-dim);overflow:visible}.key polygon{fill:none;stroke:currentColor;stroke-width:2px;stroke-linejoin:round}.key text{fill:#fff;text-anchor:middle;dominant-baseline:central;font-family:Outfit,sans-serif;font-size:12px;font-weight:700}.key-up{grid-area:1/2}.key-left{grid-area:2/1}.key-down{grid-area:2/2}.key-right{grid-area:2/3}kbd{color:#fff;background-color:#1a1824;border:1px solid #3d3950;border-radius:0;padding:1px 5px;font-size:10px;font-weight:700;display:inline-block;box-shadow:0 1px #0006}.mute-btn-small{color:var(--text-dim);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:0;padding:3px 8px;font-size:11px;transition:background .2s}.mute-btn-small:hover{color:#fff;background:#ffffff1a}.mobile-controls{background:var(--bg-panel);-webkit-user-select:none;user-select:none;touch-action:none;width:100%;max-width:640px;box-shadow:0 8px 25px #000000b3, var(--shadow-neon);border:4px solid #1a1a1e;justify-content:space-between;align-items:center;margin-top:15px;padding:20px;display:none}.mobile-controls.visible{display:flex}.dpad{background:#101012;border:2px solid #1a1a1e;border-radius:8px;grid-template-rows:repeat(3,44px);grid-template-columns:56px 44px 56px;gap:0;padding:4px;display:grid;position:relative}.dpad-btn{color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;background:#18181c;border:1px solid #2a2a2e;outline:none;justify-content:center;align-items:center;font-size:16px;transition:background 50ms,color 50ms;display:flex}.dpad-btn:active,.dpad-btn.active{background:var(--text-main);color:var(--bg-dark);border-color:var(--text-main)}.btn-up{border-bottom:none;border-radius:4px 4px 0 0;grid-area:1/2}.btn-left{border-right:none;border-radius:4px 0 0 4px;grid-area:2/1}.dpad-center{background:#18181c;border:1px solid #2a2a2e;grid-area:2/2;justify-content:center;align-items:center;display:flex;position:relative}.dpad-center:after{content:"";background:#2a2a2e;border-radius:50%;width:8px;height:8px}.btn-right{border-left:none;border-radius:0 4px 4px 0;grid-area:2/3}.btn-down{border-top:none;border-radius:0 0 4px 4px;grid-area:3/2}.action-buttons{flex-direction:column;align-items:flex-end;gap:12px;display:flex}.sub-actions{gap:6px;display:flex}.action-btn-small{color:var(--text-dim);font-family:var(--font-retro);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;background:#18181c;border:2px solid #2a2a2e;outline:none;padding:6px 12px;font-size:9px;transition:all .1s}.action-btn-small:active,.action-btn-small.active{color:#101012;background:#fff;border-color:#fff}.action-btn-large{color:#fff;font-family:var(--font-retro);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;text-align:center;background:#18181c;border:3px solid #fff;outline:none;width:100%;padding:12px 24px;font-size:11px;transition:all 50ms;box-shadow:0 4px #ffffff26}.action-btn-large:active,.action-btn-large.active{color:#101012;box-shadow:none;background:#fff;transform:translateY(2px)}@media (width<=680px){body{padding:10px}.controls-guide{display:none}}@media (height<=600px){body{padding:5px}#app{gap:8px}.game-title{font-size:18px}.canvas-wrapper{max-width:69.3333vh;max-height:52vh}.mobile-controls{margin-top:5px;padding:10px}.dpad{grid-template-rows:repeat(3,36px);grid-template-columns:46px 36px 46px}.action-btn-large{padding:8px 18px;font-size:9px}.action-btn-small{padding:4px 8px;font-size:8px}}button.mute-btn-small.active-toggle{color:#000;background:#fff;border-color:#fff}@media (width<=600px){.mobile-controls{padding:10px 12px}.sub-actions{gap:4px}.action-btn-small{padding:6px 8px;font-size:8px}.action-btn-large{padding:10px 16px;font-size:10px}}