:root{--sea: #1b4558;--ink: #1d1a24;--paper: #f4f1ea;--muted: #cfc8b8;--gold: #ffd75e;--roof: #c9683a;--leaf: #5a8742;color-scheme:dark}*{box-sizing:border-box}html,body,#app{position:fixed;inset:0;margin:0;overflow:hidden;overscroll-behavior:none}body{background:var(--sea);color:var(--paper);font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:none}#stage,.pixel-text{image-rendering:pixelated;image-rendering:crisp-edges}#stage{position:absolute;left:0;top:0}.probe{position:absolute;visibility:hidden;pointer-events:none;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}.controls{position:absolute;inset:0;display:flex}.zone{flex:1;position:relative;touch-action:none}.stick{position:absolute;left:calc(env(safe-area-inset-left,0px) + 92px);bottom:calc(env(safe-area-inset-bottom,0px) + 64px);width:104px;height:104px;margin:0 0 0 -52px;border-radius:50%;border:3px solid rgb(244 241 234 / .25);background:#1d1a2440;opacity:.6;pointer-events:none;transition:opacity .15s}.stick.active{margin:-52px 0 0 -52px;opacity:1;transition:none}.knob{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:#f4f1ead9;box-shadow:0 0 0 3px var(--ink),0 4px 0 3px #1d1a2499}.act{position:absolute;right:calc(env(safe-area-inset-right,0px) + 36px);bottom:calc(env(safe-area-inset-bottom,0px) + 60px);width:108px;height:108px;display:grid;place-items:center;border-radius:50%;background:#3b6aa0;box-shadow:0 0 0 4px var(--ink),inset 0 -8px #284a75,inset 0 4px #ffffff40,0 7px 0 4px #1d1a248c;font-weight:800;font-size:13px;letter-spacing:.08em;color:var(--paper);text-shadow:0 2px 0 var(--ink);pointer-events:none;opacity:.85}.act.pressed{transform:translateY(4px);box-shadow:0 0 0 4px var(--ink),inset 0 -4px #284a75,0 3px 0 4px #1d1a248c}.act.ready{background:#e0b04a;color:var(--ink);text-shadow:none;opacity:1;box-shadow:0 0 0 4px var(--ink),inset 0 -8px #a87a26,inset 0 4px #fff6,0 0 26px 8px #ffe68c8c}.act.shop{background:var(--roof);box-shadow:0 0 0 4px var(--ink),inset 0 -8px #8f4128,inset 0 4px #ffffff40,0 7px 0 4px #1d1a248c}@media(hover:hover)and (pointer:fine){.stick,.act{display:none}}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:calc(env(safe-area-inset-top,0px) + 20px) 20px calc(env(safe-area-inset-bottom,0px) + 20px);border:0;margin:0;background:#141e228c;color:var(--paper);font:inherit;text-align:center;cursor:pointer}.overlay[hidden]{display:none}.logo{filter:drop-shadow(0 6px 0 rgb(29 26 36 / .5))}.tag{margin:0;color:var(--muted);font-size:15px;max-width:30ch}.howto{margin:4px 0;padding:14px 18px;list-style:none;font-size:14px;line-height:1.7;text-align:left;background:#1d1a24b3;box-shadow:0 0 0 3px var(--ink);border-radius:4px}.howto b{color:var(--paper)}.howto .spark{color:var(--gold)}.keys{display:none;margin:0;color:var(--muted);font-size:13px}@media(hover:hover)and (pointer:fine){.keys{display:block}.howto li:first-child b{font-size:0}.howto li:first-child b:after{content:"WASD";font-size:14px}}.cta{padding:12px 26px;background:var(--roof);color:var(--paper);font-weight:800;font-size:16px;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 0 0 3px var(--ink),inset 0 -5px #8f4128;animation:bob 1.2s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-3px)}}#dead h1{margin:0;font-size:44px;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 5px 0 var(--ink)}#dead .where{margin:0;color:var(--muted);max-width:28ch}.panel{cursor:default}.sheet{width:min(420px,100%);max-height:100%;display:flex;flex-direction:column;gap:10px;padding:14px;background:#2a2630;box-shadow:0 0 0 3px var(--ink),inset 0 0 0 3px #4a4352;border-radius:4px;text-align:left}.sheet header{display:flex;justify-content:space-between;align-items:center}.sheet h2{margin:0;font-size:16px;text-transform:uppercase;letter-spacing:.06em}.purse{color:var(--gold);font-weight:800;font-size:18px}.coin{display:inline-block;width:10px;height:10px;margin-right:5px;border-radius:50%;background:#f2c84a;box-shadow:0 0 0 2px #7a4a12,inset -2px -2px #c8902a;vertical-align:-1px}.sheet ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;overflow-y:auto;touch-action:pan-y}.sheet li{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#3a3442;border-radius:3px}.info{flex:1;display:flex;flex-direction:column;gap:2px}.info b{font-size:14px}.info small{color:var(--muted);font-size:12px}.pips{display:flex;gap:3px;margin-top:3px}.pips i{width:8px;height:4px;background:#1d1a24}.pips i.on{background:var(--gold)}.sheet button{font:inherit;cursor:pointer;border:0}.sheet li button{min-width:74px;padding:10px 8px;background:var(--leaf);color:var(--paper);font-weight:800;box-shadow:0 0 0 2px var(--ink),inset 0 -4px #3a5a2c}.sheet li button:disabled{background:#4a4352;color:#8a8296;box-shadow:0 0 0 2px var(--ink);cursor:default}.leave{padding:12px;background:var(--roof);color:var(--paper);font-weight:800;text-transform:uppercase;letter-spacing:.06em;box-shadow:0 0 0 3px var(--ink),inset 0 -5px #8f4128}
