:root{--bg: #14110d;--panel: #1f1a13;--ink: #ece6dc;--muted: #b8ad9a;--accent: #c0843a;--accent2: #5ad1c0}*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(1200px 700px at 50% -10%,#241d14,var(--bg));color:var(--ink);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{max-width:600px;margin:0 auto;padding:18px 14px 40px}header h1{margin:0;font-size:28px;letter-spacing:4px;color:var(--accent);font-weight:800}.sub{margin:4px 0 14px;color:var(--muted);font-size:13px}.bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}.seg{display:inline-flex;background:var(--panel);border-radius:8px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}.seg button{background:transparent;color:var(--muted);border:0;padding:7px 12px;cursor:pointer;font-size:13px}.seg button.active{background:var(--accent);color:#1a1408;font-weight:700}.btn{background:var(--panel);color:var(--ink);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:7px 12px;cursor:pointer;font-size:13px}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);color:#1a1408;font-weight:700;border:0}.status{background:var(--panel);border:1px solid rgba(255,255,255,.07);border-radius:8px;padding:9px 12px;font-size:13px;color:var(--muted);margin-bottom:10px;min-height:18px}.stage{position:relative;background:#100d09;border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:8px}canvas{width:100%;height:auto;display:block;touch-action:none;border-radius:6px}.row{display:flex;align-items:center;gap:10px;margin:10px 0;flex-wrap:wrap}.phase2{background:var(--panel);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 12px;margin-top:12px}.phase2 .seg button{font-family:ui-monospace,monospace;font-size:12px}input[type=range]{flex:1;accent-color:var(--accent2)}#cval{font-family:ui-monospace,monospace;color:var(--accent2);min-width:70px}.hint{margin-top:12px;color:var(--muted);font-size:13px;line-height:1.5}.hidden{display:none!important}