:root{--bg: #0a0c11;--panel: #151924;--ink: #e6ebf5;--muted: #9aa6c0;--accent: #5a7ad0;--on: #5a7ad0}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{display:flex;justify-content:center;padding:16px}.wrap{width:100%;max-width:560px;display:flex;flex-direction:column;gap:12px;align-items:center}.title{margin:4px 0 0;font-size:26px;letter-spacing:.5px;color:var(--ink)}.title:after{content:"";display:block;width:60px;height:3px;background:var(--accent);margin:6px auto 0;border-radius:2px}.controls,.bench{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.seg{display:inline-flex;background:var(--panel);border-radius:8px;overflow:hidden;border:1px solid #232a3c}.seg button{background:transparent;color:var(--muted);border:none;padding:7px 12px;font-size:13px;cursor:pointer}.seg button.on{background:var(--accent);color:#fff;font-weight:600}.btn{background:var(--panel);color:var(--ink);border:1px solid #232a3c;border-radius:8px;padding:7px 14px;cursor:pointer;font-size:13px}.btn:hover{border-color:var(--accent)}.goal{font-size:15px;color:var(--ink);background:var(--panel);padding:8px 14px;border-radius:8px;border:1px solid #232a3c}.board{width:100%;max-width:520px;aspect-ratio:520 / 380;border-radius:12px;border:1px solid #232a3c;touch-action:manipulation}.status{font-size:14px;color:var(--muted);min-height:20px;text-align:center}.status.win{color:#7ad05a;font-weight:600}.status.warn{color:#d0905a}.help{font-size:12px;color:var(--muted);text-align:center;max-width:480px;line-height:1.5}