:root{--font-mono:"JetBrains Mono Variable", "JetBrains Mono", ui-monospace, Menlo, monospace;--font-grotesk:"Space Grotesk Variable", "Space Grotesk", ui-sans-serif, system-ui, sans-serif;--mono:var(--font-mono);--grotesk:var(--font-grotesk);--bg:#f3f2ee;--bg-soft:#efeee8;--bg-sunken:#e8e6df;--surface:#f8f7f3;--surface-2:#f3f2ee;--paper:var(--surface);--hover:#e7e4db;--line:#dedbd2;--line-soft:#e8e5dd;--border:var(--line);--border-strong:#cac6ba;--ink:#1c1b18;--text-1:var(--ink);--text-2:#6f6c63;--text-3:#9a978d;--text-4:#c4c0b5;--muted:var(--text-2);--faint:var(--text-3);--accent:#b4622a;--accent-soft:#efe7da;--accent-text:#9a5021;--ok:#5f7d4f;--done:var(--ok);--warn:#c07d1e;--err:#a8483a;--p0:#b4322a;--p1:#c07d1e;--p2:#b4622a;--p3:#9a978d;--kw:#9a5bd0;--ty:#4f8a4a;--fn:#b4622a;--purple:#8c52bd;--shadow-1:none;--shadow-2:0 2px 0 #1c1b180a;--shadow-3:0 24px 60px #1c1b182e;--radius:0px;--t-fast:.12s cubic-bezier(.2, .7, .3, 1);--t-med:.2s cubic-bezier(.2, .7, .3, 1)}html[data-theme=dark],.dark{--bg:#131210;--bg-soft:#0f0e0c;--bg-sunken:#0b0a09;--surface:#191815;--surface-2:#131210;--hover:#232019;--line:#2c2a25;--line-soft:#211f1b;--border-strong:#3a3833;--ink:#ececdf;--text-2:#a8a498;--text-3:#7c786d;--text-4:#56534b;--muted:#7c786d;--faint:#56534b;--accent:#d6884a;--accent-soft:#241d14;--accent-text:#d6884a;--ok:#8fae6f;--warn:#d6884a;--err:#d07a68;--p0:#d07a68;--p1:#d6a04a;--p2:#d6884a;--p3:#7c786d;--kw:#c79bf0;--ty:#7fc06f;--fn:#d6884a;--purple:#c79bf0;--shadow-2:0 2px 0 #0003;--shadow-3:0 24px 60px #00000080}*,:before,:after{box-sizing:border-box}*{margin:0;padding:0}html,body{height:100%}body{background:var(--bg);width:100vw;max-width:100vw;height:100vh;max-height:100vh;color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.5;overflow:hidden}#root{width:100%;height:100%}.app{flex-direction:column;height:100vh;display:flex}.head{border-bottom:1px solid var(--ink);background:var(--bg);flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 24px;display:flex}.head .l{align-items:center;gap:14px;display:flex}.glyph{flex-shrink:0;display:block}.glyph .gx-frame{stroke:var(--ink)}.glyph .gx-accent{stroke:var(--accent)}.glyph .gx-accent-fill{fill:var(--accent)}.lockup{align-items:center;gap:13px;min-width:0;display:flex}.lockup .nm{font-family:var(--grotesk);letter-spacing:.06em;color:var(--ink);font-size:15px;font-weight:700}.lockup .crumb{color:var(--faint);letter-spacing:.02em;font-size:14px}.lockup .crumb b{color:var(--muted);font-weight:400}.head .hint{color:var(--faint);letter-spacing:.02em;margin-left:8px;font-size:11.5px}.head .hint code{color:var(--accent)}.head .r{align-items:center;gap:18px;display:flex}.head .stat{letter-spacing:.04em;color:var(--muted);align-items:center;gap:7px;font-size:11.5px;display:flex}.dot{background:var(--ok);border-radius:50%;width:7px;height:7px}.dot.err{background:var(--err)}.head .theme{font:inherit;color:var(--muted);cursor:pointer;letter-spacing:.04em;background:0 0;border:0;font-size:12px}.head .theme:hover{color:var(--ink)}.head .share{font:inherit;letter-spacing:.04em;color:var(--accent);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:4px;padding:4px 10px;font-size:12px}.head .share:hover{background:var(--accent-soft);border-color:var(--accent)}.body{flex:1;grid-template-columns:minmax(360px,1fr) 8px minmax(420px,1.25fr);min-height:0;display:grid}.pane{flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.pane--editor{border-right:1px solid var(--ink)}.gutter-h{cursor:col-resize;background:0 0;position:relative}.gutter-h:after{content:"";background:0 0;position:absolute;inset:0 3px}.gutter-h:hover:after{background:var(--line)}.etabs{border-bottom:1px solid var(--line);background:var(--bg);flex-shrink:0;align-items:stretch;height:42px;display:flex}.etab{font:inherit;letter-spacing:.02em;color:var(--muted);cursor:pointer;background:0 0;border:0;align-items:center;gap:8px;padding:0 18px;font-size:12.5px;display:flex;position:relative}.etab:hover,.etab.on{color:var(--ink)}.etab.on:after{content:"";background:var(--accent);height:1.5px;position:absolute;bottom:-1px;left:0;right:0}.etab .tdot{background:var(--err);border-radius:50%;width:6px;height:6px}.etabs .sp{flex:1}.echk{color:var(--muted);letter-spacing:.03em;cursor:pointer;align-items:center;gap:6px;padding:0 6px;font-size:11.5px;display:flex}.echk input,.vtog input{appearance:none;border:1.5px solid var(--line);background:var(--paper);cursor:pointer;vertical-align:middle;flex-shrink:0;width:13px;height:13px;margin:0;padding:0;display:inline-block;position:relative}.echk input:checked,.vtog input:checked{border-color:var(--accent)}.echk input:checked:after,.vtog input:checked:after{content:"";background:var(--accent);position:absolute;inset:3px}.ebtn{border:0;border-left:1px solid var(--line);font:inherit;letter-spacing:.03em;color:var(--muted);cursor:pointer;background:0 0;padding:0 16px;font-size:12px}.ebtn:hover{color:var(--ink);background:var(--paper)}.ebtn.run{color:var(--accent)}.ebtn.run:hover{background:var(--accent-soft)}.code{background:var(--bg);flex:1;min-height:0;position:relative;overflow:hidden}.code .cm-theme,.code .cm-editor{height:100%}.err{border-top:1px solid var(--err);background:var(--bg);flex-shrink:0;max-height:34%;display:none;overflow:auto}.err.on{display:block}.err-h{letter-spacing:.1em;text-transform:uppercase;color:var(--err);justify-content:space-between;align-items:center;padding:10px 18px 4px;font-size:11px;display:flex}.err-b{font-family:var(--mono);color:var(--muted);white-space:pre-wrap;margin:0;padding:0 18px 14px;font-size:12px;line-height:1.6}.vtools{border-bottom:1px solid var(--line);background:var(--bg);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:0;min-height:42px;padding:0;display:flex}.vgroup{border-right:1px solid var(--line-soft);align-items:center;gap:8px;height:42px;padding:0 14px;display:flex}.vlbl{letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-size:10px}.vsel{font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line);cursor:pointer;border-radius:3px;padding:4px 8px;font-size:12.5px}.vsel:focus{border-color:var(--accent);outline:none}.vbtn{font:inherit;letter-spacing:.02em;color:var(--muted);background:var(--paper);border:1px solid var(--line);cursor:pointer;border-radius:3px;padding:4px 9px;font-size:11.5px}.vbtn:hover{color:var(--ink);border-color:var(--accent)}.vtog{color:var(--muted);letter-spacing:.02em;cursor:pointer;align-items:center;gap:6px;height:42px;padding:0 11px;font-size:11.5px;display:flex}.vtog:hover{color:var(--ink)}.vsp{flex:1}.vload-err{color:var(--err);padding:0 12px;font-size:11px}.swatches{align-items:center;gap:5px;height:42px;padding:0 14px;display:flex}.sw{border:1px solid var(--line);cursor:pointer;border-radius:2px;width:16px;height:16px;padding:0}.sw.on{box-shadow:0 0 0 2px var(--bg), 0 0 0 3px var(--accent)}.canvas-wrap{background:var(--bg);flex:1;min-height:0;position:relative}.readout{letter-spacing:.04em;color:var(--muted);pointer-events:none;font-variant-numeric:tabular-nums;gap:16px;font-size:11px;display:flex;position:absolute;bottom:12px;left:14px}.readout b{color:var(--ink);font-weight:500}.uniforms{letter-spacing:.04em;color:var(--faint);pointer-events:none;font-variant-numeric:tabular-nums;flex-direction:column;align-items:flex-end;gap:3px;font-size:10.5px;display:flex;position:absolute;top:12px;right:14px}.uniforms b{color:var(--muted);font-weight:400}@media (width<=820px){.head .hint{display:none}.body{grid-template-rows:1fr 1fr;grid-template-columns:1fr!important}.pane--editor{border-right:0;border-bottom:1px solid var(--ink)}.gutter-h{display:none}}