:root{--bg:#0b1030;--ink:#fff6d6;--ink-dim:#c9bfa0;--wood:#8a5429;--wood-dark:#3a200d;--wood-light:#b77a3d;--gold:#f0b43c;--gold-dark:#b37a14;--danger:#ff4d4d}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);overscroll-behavior:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;font-family:DotGothic16,Microsoft JhengHei,PingFang TC,monospace;overflow:hidden}#app{max-width:520px;height:100dvh;padding:max(8px, env(safe-area-inset-top)) 16px max(12px, env(safe-area-inset-bottom));flex-direction:column;gap:8px;margin:0 auto;display:flex}.hud{justify-content:space-between;align-items:stretch;gap:8px;display:flex}.hud-box{border:3px solid var(--wood-dark);background:#1d215a;flex-direction:column;flex:1;justify-content:center;align-items:center;min-width:0;padding:4px 6px;display:flex;box-shadow:inset 0 0 0 2px #2e2a6a}.hud-label{color:var(--ink-dim);font-size:12px}.hud-value{font-size:20px;line-height:1.1}.hud-level{color:#ff8a5c}.hud-btn{width:48px;font:inherit;color:var(--ink);border:3px solid var(--wood-dark);box-shadow:inset 0 0 0 2px #2e2a6a, 0 3px 0 var(--wood-dark);cursor:pointer;background:#1d215a;flex:none;font-size:18px}.hud-btn:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 0 0 2px #2e2a6a}.hud-btn:disabled{opacity:.4;cursor:default}#stage{flex:1;place-items:center;min-height:0;display:grid}.frame{border:6px solid var(--wood);box-shadow:0 0 0 3px var(--wood-dark), inset 0 0 0 3px var(--wood-light), 0 8px 0 3px var(--wood-dark);line-height:0;position:relative}#game{touch-action:none;image-rendering:pixelated;cursor:pointer;display:block}.overlay{text-align:center;background:#080a1ec7;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:16px;line-height:1.5;display:flex;position:absolute;inset:0}.overlay[hidden]{display:none}.title{color:var(--gold);text-shadow:3px 3px 0 var(--wood-dark);letter-spacing:4px;margin:0;font-size:40px}h2.title{font-size:32px}.subtitle{color:var(--ink-dim);letter-spacing:2px;margin:0;font-size:14px}.hint{margin:8px 0;font-size:15px}.small{color:var(--ink-dim);margin:0;font-size:14px}.big{margin:0;font-size:26px}.record{color:var(--danger);margin:0;font-size:18px;animation:.6s steps(2,end) infinite blink}.over-tier{flex-direction:column;align-items:center;gap:4px;font-size:14px;display:flex}#over-tier{width:64px;height:64px;image-rendering:pixelated}#title-moon{width:96px;height:96px;image-rendering:pixelated;filter:drop-shadow(0 0 12px #fff1a880)}.keys{opacity:.8;font-size:12px}.btn-row{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.toast{white-space:nowrap;color:var(--ink);background:var(--wood-dark);border:3px solid var(--gold);padding:8px 14px;font-size:15px;line-height:1.3;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.toast[hidden]{display:none}.pixel-btn{font:inherit;color:var(--wood-dark);background:var(--gold);border:3px solid var(--wood-dark);box-shadow:inset -3px -3px 0 var(--gold-dark), 0 4px 0 var(--wood-dark);cursor:pointer;margin-top:6px;padding:8px 28px;font-size:20px}.pixel-btn.secondary{box-shadow:inset -3px -3px 0 #4a8fc2, 0 4px 0 var(--wood-dark);background:#8fd0ff}.pixel-btn:active{box-shadow:inset -3px -3px 0 var(--gold-dark), 0 1px 0 var(--wood-dark);transform:translateY(3px)}@keyframes blink{50%{opacity:0}}