:root{--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--radius:10px;--font:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--text-sm:12px;--text-md:14px;--bg:#f1f2f4;--surface:#fff;--border:#dfe1e6;--text:#1b1d24;--muted:#666c7a;--accent:#5b4bd6;--hover:#eceef2;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--bg:#16181d;--surface:#1f2229;--border:#323640;--text:#eceef3;--muted:#9aa1b2;--accent:#9a8cff;--hover:#2a2e37;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#app{height:100%;margin:0}body{font:var(--text-md) / 1.4 var(--font);background:var(--bg);color:var(--text);overscroll-behavior:none;-webkit-user-select:none;user-select:none}#app{flex-direction:column;display:flex}.topbar{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);padding-top:max(var(--space-2), env(safe-area-inset-top));background:var(--surface);border-bottom:1px solid var(--border);display:flex}.brand{align-items:center;gap:var(--space-2);color:var(--accent);font-weight:650;text-decoration:none;display:flex}.brand span{color:var(--text)}.spacer{flex:1}.group{gap:2px;display:flex}.btn{min-width:36px;height:36px;padding:0 var(--space-3);border-radius:var(--radius);color:var(--text);font:inherit;cursor:pointer;background:0 0;border:0}.btn:hover{background:var(--hover)}.btn:focus-visible,#canvas:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.btn.zoom{font-variant-numeric:tabular-nums;min-width:64px}.stage{flex:1;min-height:0;position:relative}#canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block;position:absolute;inset:0}#canvas.panning{cursor:grabbing}.hud,.hint{left:var(--space-3);padding:var(--space-1) var(--space-2);border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);color:var(--muted);font-size:var(--text-sm);pointer-events:none;position:absolute}.hud{bottom:var(--space-3);font-variant-numeric:tabular-nums}.hint{transition:opacity .4s;bottom:48px}.hint.hidden{opacity:0}kbd{font:inherit;padding:0 var(--space-1);border:1px solid var(--border);border-radius:4px}.error{inset:var(--space-4);max-width:420px;height:-moz-fit-content;height:fit-content;padding:var(--space-4);border-radius:var(--radius);background:var(--surface);border:1px solid #d64545;margin:auto;position:absolute}@media (max-width:520px){.brand span{display:none}.hint{right:var(--space-3)}}@media (prefers-reduced-motion:reduce){.hint{transition:none}}