:root{--bg: #100e18;--panel: #1c1830;--accent: #8a6fd0;--text: #e8e4f4;--muted: #9a8fd0}*{box-sizing:border-box}.standing{margin:4px 0 0;min-height:1.2em;color:var(--accent);font-size:14px;text-align:center}html,body{margin:0;background:radial-gradient(1200px 600px at 50% -10%,#221b3a,var(--bg));color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;min-height:100%}#app{max-width:940px;margin:0 auto;padding:18px 16px 40px}header h1{margin:0;font-size:30px;letter-spacing:3px;color:var(--accent);font-weight:800}header .sub{margin:6px 0 14px;color:var(--muted);font-size:14px;max-width:640px}.bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:12px}.seg{display:inline-flex;border:1px solid #3a3360;border-radius:8px;overflow:hidden}.seg button{background:transparent;color:var(--muted);border:none;padding:7px 14px;font-size:13px;cursor:pointer}.seg button.active{background:var(--accent);color:#120f1c;font-weight:700}.btn{background:#2a2444;color:var(--text);border:1px solid #3a3360;border-radius:8px;padding:7px 14px;font-size:13px;cursor:pointer}.btn:hover{background:#352c54}.status{font-size:14px;color:var(--muted);margin-bottom:10px;min-height:20px}.stage{border-radius:12px;overflow:hidden;box-shadow:0 10px 40px #00000080;line-height:0}canvas{width:100%;max-width:880px;display:block;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.hint{margin-top:12px;font-size:13px;color:#7a7298}