:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f4f4f2;--surface:#fff;--line:#d9d9d4;--text:#222;--muted:#6b6b66;--accent:#2563eb;--accent-soft:#2563eb1f;--warn:#c2410c;--danger:#b91c1c;font-family:Hiragino Sans,Yu Gothic UI,Noto Sans JP,system-ui,sans-serif;font-size:14px}*{box-sizing:border-box}body{background:var(--bg);height:100vh;color:var(--text);flex-direction:column;margin:0;display:flex}header{border-bottom:1px solid var(--line);background:var(--surface);align-items:center;gap:16px;padding:8px 16px;display:flex}h1{letter-spacing:.05em;margin:0;font-size:18px}#toolbar{flex-wrap:wrap;gap:12px;display:flex}#toolbar .group{gap:4px;display:flex}button{font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;border-radius:6px;padding:4px 10px}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{color:var(--muted);cursor:default;opacity:.6}button.small{padding:1px 8px;font-size:12px}button.danger{color:var(--danger)}main{flex:1;grid-template-columns:minmax(260px,1fr) 2fr 280px;min-height:0;display:grid}.source{border-right:1px solid var(--line);flex-direction:column;min-height:0;display:flex}#source{resize:none;background:var(--surface);color:var(--text);tab-size:2;border:0;outline:none;flex:1;padding:12px;font-family:ui-monospace,Cascadia Mono,Consolas,Noto Sans Mono CJK JP,monospace;font-size:13px;line-height:1.6}#error{color:var(--warn);min-height:0;padding:0 12px;font-size:13px}#error:not(:empty){border-top:1px solid var(--line);padding:8px 12px}.canvas{min-height:0;position:relative;overflow:auto}#stage{touch-action:none;-webkit-user-select:none;user-select:none;padding:8px}#stage.stale{opacity:.4;pointer-events:none}#stage svg{max-width:100%;height:auto;display:block}#stage .extent{fill:none;stroke:var(--line);stroke-dasharray:4 4}#stage .shape{cursor:grab}#stage .shape .hit{fill:#0000;stroke:none}#stage .shape:hover .hit{fill:var(--accent-soft)}#stage .shape.selected .hit{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1.5px}#stage .line{cursor:pointer}#stage .line .hit{stroke:#0000;stroke-width:14px;stroke-linecap:round}#stage .line:hover .hit,#stage .line.selected .hit{stroke:var(--accent-soft)}#stage .line.selected .hit{stroke:#2563eb40}#stage .line.detached{opacity:.2}#stage .numeric{fill:var(--warn)}#stage .ghost{fill:none;stroke:var(--accent);stroke-width:2px;stroke-dasharray:6 4}#stage .guide{stroke:var(--accent);stroke-width:1px;stroke-dasharray:2 3}#stage .caption{fill:var(--accent);text-anchor:middle;font-size:13px}#status{margin:0 12px;display:inline-block;position:sticky;bottom:12px;left:12px}#status:not(:empty){color:#fff;background:#333;border-radius:6px;padding:6px 12px}#panel{border-left:1px solid var(--line);background:var(--surface);padding:12px 16px;overflow:auto}.field{color:var(--muted);flex-direction:column;gap:4px;margin-bottom:12px;font-size:12px;display:flex}.field .value{color:var(--text);font-size:14px}.field input,.field select,.field textarea{font:inherit;color:var(--text);border:1px solid var(--line);background:var(--surface);border-radius:4px;padding:4px 6px;font-size:14px}.field button{align-self:flex-start}.pair{gap:8px;display:flex}.pair .field{flex:1;min-width:0}.advanced{border-top:1px solid var(--line);margin:16px 0;padding-top:8px}.advanced summary{cursor:pointer;color:var(--muted);margin-bottom:8px}.row{flex-wrap:wrap;gap:8px;display:flex}.muted{color:var(--muted)}.help{color:var(--muted);padding-left:18px;line-height:1.8}@media (width<=900px){main{grid-template-rows:200px 1fr auto;grid-template-columns:1fr}}