html,body{height:100%;background:#2b2630}body{overscroll-behavior:none}#app{min-height:100%;display:flex;flex-direction:column}#top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:calc(8px + env(safe-area-inset-top)) 14px 4px;color:#fff}#title{text-align:center;line-height:1.15}#title b{display:block;font-size:18px}#title .muted{color:#cfc6c0;font-size:13px}.top-btn{background:#ffffff1f;color:#fff;border:0;border-radius:999px;min-height:40px;padding:0 16px;font:600 14px var(--font);cursor:pointer;touch-action:manipulation}#stage{padding:0 4px;touch-action:none;user-select:none;-webkit-user-select:none}#scene{display:block;width:100%;height:auto;max-height:calc(100dvh - 180px);margin:0 auto}#tools{display:flex;justify-content:center;gap:12px;padding:8px 16px calc(10px + env(safe-area-inset-bottom))}.top-btn.quiet{background:transparent;color:#b9b0ab;text-decoration:underline}.howto{text-align:left;padding-left:18px;margin:4px 0 0;font-size:15px;line-height:1.45}.howto li{margin-bottom:6px}.piece{cursor:grab}.piece.dragging{cursor:grabbing}.piece.fixed{cursor:default}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:#1d1a1c8c;z-index:20;overflow-y:auto}.overlay[hidden]{display:none}.panel{width:min(380px,100%);background:var(--card);border-radius:20px;padding:24px;text-align:center;box-shadow:0 12px 40px #0000004d}.panel h1{font-size:26px;margin-bottom:6px}.panel .lead{color:var(--body);font-size:16px}.panel .actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}.panel .actions .btn{width:100%}.panel .home{display:block;margin-top:14px;font-size:14px;color:var(--muted)}.pill{display:inline-block;background:var(--tint);color:var(--tint-text);font-weight:700;font-size:14px;padding:6px 12px;border-radius:999px;margin-bottom:8px}.picker-panel{width:min(440px,100%)}#picker{align-items:flex-start}.picker-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.picker-head h1{margin:0}.picker-head a{font-size:14px;color:var(--muted)}.tier-head{display:flex;justify-content:space-between;align-items:baseline;margin:16px 0 8px}.tier-head b{color:var(--tint-text);font-size:15px}.tier-head span{color:var(--muted);font-size:13px}.tier-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.lvl{min-height:48px;border-radius:12px;border:2px solid var(--border);background:var(--card);font:700 16px var(--font);color:var(--ink);cursor:pointer;touch-action:manipulation}.lvl.done{background:var(--green-tint, #e4f3ea);border-color:var(--green);color:var(--green-text, #2a7049)}.lvl.current{border-color:var(--accent);color:var(--accent)}.lvl.locked{opacity:.4;cursor:default}.hud-btn{width:44px;height:44px;border-radius:999px;border:0;background:#ffffff1f;color:#fff;font-size:20px;cursor:pointer;touch-action:manipulation}.linkish{background:none;border:0;color:#b9b0ab;font:500 14px var(--font);text-decoration:underline;cursor:pointer;touch-action:manipulation}.pulse{animation:pulse .9s ease-in-out infinite alternate}.piece.clash{filter:drop-shadow(0 0 4px #d64545) drop-shadow(0 0 2px #d64545);animation:pulse .9s ease-in-out infinite alternate}@keyframes pulse{0%{opacity:1}to{opacity:.45}}@media(prefers-reduced-motion:reduce){.pulse{animation:none}}
