:root{--bg: #0e1016;--panel: #171a24;--panel-border: #2a3142;--ink: #ece8e1;--muted: #8b8794;--ready: #94e044;--wait: #e59500;--shadow: 0 12px 40px rgba(0, 0, 0, .45)}*{box-sizing:border-box}html,body,#root,.app{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:IBM Plex Mono,ui-monospace,monospace;overflow:hidden}.board-wrap{position:absolute;top:0;right:0;bottom:0;left:0}.board{width:100%;height:100%;display:block;touch-action:none;cursor:crosshair;outline:none}.topbar{position:absolute;top:14px;left:14px;right:14px;display:flex;align-items:center;gap:16px;pointer-events:none;z-index:2}.brand{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--panel-border);border-radius:12px;padding:8px 12px;box-shadow:var(--shadow)}.logo{width:18px;height:18px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;background:linear-gradient(#e50000,#e50000) 0 0 / 50% 50% no-repeat,linear-gradient(#0000ea,#0000ea) 100% 0 / 50% 50% no-repeat,linear-gradient(#e5d900,#e5d900) 0 100% / 50% 50% no-repeat,linear-gradient(#02be01,#02be01) 100% 100% / 50% 50% no-repeat}.wordmark{font-family:Syne,sans-serif;font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:15px}.meta{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--panel-border);border-radius:12px;padding:8px 12px;font-size:12px;color:var(--muted);box-shadow:var(--shadow)}.coord{color:var(--ink);min-width:4.5em}.sep{opacity:.4}.ready{display:inline-flex;align-items:center;gap:8px;color:var(--ready);font-weight:600}.ready.is-wait{color:var(--wait)}.timer{width:12px;height:12px;border-radius:50%;background:conic-gradient(currentColor calc(var(--p, 100) * 1%),#2a2e3a 0)}.banner{pointer-events:none;margin-left:auto;background:#3a2410;color:#ffd7a1;border-radius:999px;padding:6px 12px;font-size:12px}.dock{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 12px max(16px,env(safe-area-inset-bottom));z-index:2}.palette{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:6px;max-width:min(680px,calc(100vw - 24px));padding:10px 12px;background:var(--panel);border:1px solid var(--panel-border);border-radius:16px;box-shadow:var(--shadow)}.swatch{width:32px;height:32px;border:2px solid transparent;border-radius:6px;padding:0;cursor:pointer;box-shadow:inset 0 -2px #00000040}.swatch.is-selected{border-color:#fff;transform:translateY(-2px) scale(1.08);box-shadow:0 0 0 2px #0e1016,0 0 0 4px #fff}.palette.is-cooling{opacity:.85}.palette-lock{display:none}.hint{margin:0;font-size:11px;color:var(--muted);text-align:center}.zoom-btns{position:absolute;right:14px;bottom:108px;display:flex;flex-direction:column;gap:6px;z-index:2}.zoom-btns button{width:36px;height:36px;border-radius:10px;border:1px solid var(--panel-border);background:var(--panel);color:var(--ink);font-size:18px;cursor:pointer;box-shadow:var(--shadow)}.zoom-btns button:hover{border-color:#4a5368}@media(max-width:640px){.hint{display:none}.swatch{width:28px;height:28px}.meta{font-size:11px;padding:6px 10px}.zoom-btns{bottom:168px}}