@charset "UTF-8";:root{--brand: #414e74;--bg: #f5f5f7;--bg-darker: #eaeaee;--bg-surface: #ffffff;--bg-elevated: #ffffff;--border: #d8d8de;--border-subtle: #e2e2e8;--text: #1d1d1f;--text-dim: #6e6e73;--text-muted: #aeaeb2;--accent: #6850d8;--accent-soft: rgba(104, 80, 216, .08);--green: #34a853;--red: #c0392b;--shadow: 0 1px 3px rgba(0, 0, 0, .08)}body.dark{--bg: #1e1f26;--bg-darker: #181920;--bg-surface: #252630;--bg-elevated: #2c2d3a;--border: #363744;--border-subtle: #2e2f3c;--text: #d8d6e0;--text-dim: #8a889a;--text-muted: #555466;--accent: #7c6ff7;--accent-soft: rgba(124, 111, 247, .12);--green: #4caf7c;--red: #c0392b;--shadow: 0 2px 8px rgba(0, 0, 0, .3)}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:"Source Sans 3",Source Sans Pro,sans-serif;overflow:hidden;height:100vh;width:100vw;user-select:none;-webkit-user-select:none;transition:background .25s,color .25s}.toolbar{position:fixed;left:0;right:0;z-index:20;background:var(--bg-darker);transition:background .25s,border-color .25s;top:0;height:42px;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 12px;gap:2px}.toolbar .brand{font-family:Fira Code,monospace;font-size:13px;font-weight:500;color:var(--text);letter-spacing:-.3px;margin-right:16px;display:flex;align-items:center;gap:7px}.toolbar .brand .dot{width:9px;height:9px;border-radius:50%;background:var(--brand);box-shadow:0 0 6px var(--brand);animation:pulse 2s ease-in-out infinite}.toolbar .sep{width:1px;height:20px;background:var(--border);margin:0 8px}.toolbar .btn{font-family:"Source Sans 3",Source Sans Pro,sans-serif;font-size:12px;font-weight:500;padding:4px 10px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--text-dim);cursor:pointer;transition:all .12s;display:flex;align-items:center;gap:5px;white-space:nowrap}.toolbar .btn i{font-size:14px}.toolbar .btn:hover{background:var(--bg-elevated);color:var(--text);border-color:var(--border)}.toolbar .btn.active{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}.toolbar .spacer{flex:1}.toolbar .stats{font-family:Fira Code,monospace;font-size:11px;color:var(--text-muted)}.toolbar .stats b{color:var(--text-dim);font-weight:500}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.canvas-container{position:fixed;top:42px;left:0;right:0;height:calc(100vh - 76px)}#graph-canvas{width:100%;height:100%;cursor:grab;display:block}#graph-canvas:active{cursor:grabbing}.context-panel{position:fixed;top:54px;right:12px;z-index:15;display:flex;flex-direction:column;gap:6px;transition:opacity .2s,transform .2s}.context-panel.hidden{opacity:0;transform:translate(20px);pointer-events:none}.ctx-btn{width:36px;height:36px;border-radius:50%;border:2px solid var(--border);background:var(--bg-surface);color:var(--text-dim);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px;transition:all .15s;box-shadow:var(--shadow)}.ctx-btn:hover{border-color:var(--text-dim);color:var(--text);background:var(--bg-elevated)}.ctx-btn.green:hover{border-color:var(--green);color:var(--green)}.ctx-btn.red:hover{border-color:var(--red);color:var(--red)}.ctx-sep{width:18px;height:0;border-top:2px dotted var(--border);margin:2px auto}.palette-bar{position:fixed;top:50%;left:12px;transform:translateY(-50%);z-index:15;display:flex;flex-direction:column;gap:4px}.palette-swatch{width:18px;height:18px;border-radius:4px;border:2px solid transparent;cursor:pointer;transition:all .12s;opacity:.4}.palette-swatch:hover{opacity:.9;transform:scale(1.15)}.palette-swatch.active{border-color:var(--text);opacity:1}.statusbar{position:fixed;left:0;right:0;z-index:20;background:var(--bg-darker);transition:background .25s,border-color .25s;bottom:0;height:34px;border-top:1px solid var(--border);display:flex;align-items:center;padding:0 14px;font-size:12px;color:var(--text-dim);gap:6px;overflow:hidden}.statusbar .tag{font-family:Fira Code,monospace;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:1px 7px;border-radius:3px;color:#fff;flex-shrink:0}.statusbar .props{display:flex;gap:4px;overflow:hidden;flex:1}.statusbar .prop{display:flex;gap:3px;white-space:nowrap;align-items:center}.statusbar .prop:before{content:"⁞";color:var(--text-muted);margin-right:2px}.statusbar .prop:first-child:before{display:none}.statusbar .prop b{font-weight:600;font-size:11px;color:var(--text-dim)}.statusbar .prop span{color:var(--text)}.statusbar .idle-text{color:var(--text-muted)}.statusbar .spacer{flex:1}.statusbar .badge{font-family:Fira Code,monospace;font-size:10px;padding:1px 6px;border-radius:3px;background:var(--bg-elevated);border:1px solid var(--border);color:var(--accent);flex-shrink:0}.statusbar .github-badge{display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:inherit;background:#ffffff1a;padding:4px 8px;border-radius:4px;transition:background .2s,transform .1s}.statusbar .github-badge:hover{background:#fff3;transform:translateY(-1px)}.statusbar .github-badge:active{transform:translateY(0)}.statusbar .github-badge i{font-size:1.1em}.legend{position:fixed;bottom:44px;left:14px;z-index:15;display:flex;flex-wrap:wrap;gap:6px 12px;pointer-events:none}.legend-item{display:flex;align-items:center;gap:5px;font-size:11px;font-family:Fira Code,monospace;color:var(--text-dim)}.legend-dot{width:7px;height:7px;border-radius:50%}.tooltip{position:fixed;z-index:100;background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;padding:8px 12px;font-size:12px;pointer-events:none;opacity:0;transition:opacity .1s;max-width:240px;box-shadow:var(--shadow)}.tooltip.visible{opacity:1}.tooltip .tt-tag{font-family:Fira Code,monospace;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;letter-spacing:.8px;margin-bottom:2px}.tooltip .tt-name{font-weight:600;font-size:13px;color:var(--text)}.tooltip .tt-props{margin-top:4px;font-size:11px;color:var(--text-dim);line-height:1.5;white-space:pre-line}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;z-index:200;display:flex;align-items:center;justify-content:center}body.dark .modal-overlay{background:#0000008c}.modal-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;width:380px;box-shadow:0 16px 48px #00000026;overflow:hidden}body.dark .modal-card{box-shadow:0 16px 48px #00000080}.modal-head{padding:12px 16px;background:var(--bg-darker);border-bottom:1px solid var(--border);font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:space-between}.modal-head .close{background:none;border:none;color:var(--text-muted);font-size:18px;cursor:pointer;padding:2px;line-height:1}.modal-head .close:hover{color:var(--text)}.modal-body{padding:16px;display:flex;flex-direction:column;gap:10px}.modal-body label{font-family:Fira Code,monospace;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-dim)}.modal-body input,.modal-body select{font-family:"Source Sans 3",Source Sans Pro,sans-serif;font-size:13px;padding:7px 10px;border:1px solid var(--border);border-radius:6px;background:var(--bg-darker);color:var(--text);outline:none;transition:border-color .15s}.modal-body input:focus,.modal-body select:focus{border-color:var(--accent)}.confirm-text{font-size:13px;color:var(--text-dim);line-height:1.5}.confirm-text b{color:var(--text)}.modal-foot{padding:10px 16px;background:var(--bg-darker);border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px}.modal-foot button{font-family:"Source Sans 3",Source Sans Pro,sans-serif;font-size:12px;font-weight:500;padding:6px 16px;border-radius:6px;cursor:pointer;transition:all .12s}.btn-cancel{background:transparent;border:1px solid var(--border);color:var(--text-dim)}.btn-cancel:hover{color:var(--text);border-color:var(--text-dim)}.btn-save{background:var(--green);border:1px solid var(--green);color:#fff}.btn-save:hover{filter:brightness(1.1)}.btn-danger{background:var(--red);border:1px solid var(--red);color:#fff}.btn-danger:hover{filter:brightness(1.1)}.field-row{display:flex;flex-direction:column;gap:3px}.settings-card{width:420px}.settings-card .modal-body{padding:12px 16px 16px;gap:16px;max-height:70vh;overflow-y:auto}.settings-section{display:flex;flex-direction:column;gap:10px}.settings-section-title{font-family:Fira Code,monospace;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--accent);padding-bottom:4px;border-bottom:1px solid var(--border-subtle)}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.setting-row label{font-size:12px;font-weight:500;color:var(--text-dim);white-space:nowrap;min-width:130px}.slider-group{display:flex;align-items:center;gap:8px;flex:1}.slider-group input[type=range]{flex:1;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--border);border-radius:2px;outline:none;cursor:pointer}.slider-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);border:2px solid var(--bg-surface);box-shadow:0 0 0 1px var(--border);cursor:pointer;transition:transform .1s}.slider-group input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}.slider-group input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent);border:2px solid var(--bg-surface);box-shadow:0 0 0 1px var(--border);cursor:pointer}.slider-val{font-family:Fira Code,monospace;font-size:11px;color:var(--text-muted);min-width:38px;text-align:right}.toggle-group{flex:1;display:flex}.toggle-btn{font-family:"Source Sans 3",Source Sans Pro,sans-serif;font-size:11px;font-weight:500;padding:3px 14px;border-radius:6px;border:1px solid var(--border);background:var(--bg-darker);color:var(--text-muted);cursor:pointer;transition:all .12s}.toggle-btn:hover{border-color:var(--text-dim);color:var(--text-dim)}.toggle-btn.active{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}.fallback{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:var(--bg);flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px}.fallback.visible{display:flex}.fallback h2{font-family:Fira Code,monospace;font-size:18px;color:var(--red);margin-bottom:10px}.fallback p{color:var(--text-dim);max-width:380px;line-height:1.6;font-size:14px}
