:root{--font-mono: "Share Tech Mono", "Courier New", monospace;--font-display: "Rajdhani", "Segoe UI", sans-serif;--font-body: "Inter", "Segoe UI", sans-serif;--canvas-bg: #373737;--surface: rgba(71, 71, 71, .88);--surface-solid: #0a101c;--surface-hover: rgba(20, 32, 56, .9);--surface-active: rgba(30, 50, 80, .9);--border: rgba(0, 200, 255, .18);--border-bright: rgba(0, 200, 255, .45);--border-subtle: rgba(0, 200, 255, .08);--text-primary: #d6eeff;--text-secondary: #ffffffd0;--text-muted: #3a6080;--text-disabled: #1e3048;--accent: #00c8ff;--accent-dim: rgba(0, 200, 255, .12);--accent-hover: #40dfff;--accent-glow: 0 0 12px rgba(255, 0, 85, .5), 0 0 28px rgba(0, 200, 255, .2);--red: #ff3b5c;--shadow-sm: 0 1px 4px rgba(0, 0, 0, .6);--shadow-md: 0 4px 24px rgba(0, 0, 0, .7), 0 0 0 1px rgba(0, 200, 255, .06);--shadow-panel: 0 8px 32px rgba(0, 0, 0, .8), 0 0 0 1px rgba(0, 200, 255, .12);--radius: 3px;--radius-lg: 6px;--panel-width: 220px}[data-theme=light]{--canvas-bg: #f0f4f8;--surface: rgba(255, 255, 255, .92);--surface-solid: #ffffff;--surface-hover: #e8f4ff;--surface-active: #d0e8f8;--border: rgba(0, 120, 180, .28);--border-bright: rgba(0, 120, 180, .55);--border-subtle: rgba(0, 120, 180, .12);--text-primary: #0a1826;--text-secondary: #1a4a6e;--text-muted: #6090b0;--text-disabled: #b0ccd8;--accent: #0080b8;--accent-dim: rgba(0, 120, 180, .1);--accent-hover: #0060a0;--accent-glow: 0 0 8px rgba(0, 120, 180, .3);--red: #d4003a;--shadow-sm: 0 1px 4px rgba(0, 0, 0, .1);--shadow-md: 0 4px 16px rgba(0, 0, 0, .12);--shadow-panel: 0 8px 32px rgba(0, 0, 0, .15), 0 0 0 1px rgba(0, 120, 180, .14)}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;font-family:var(--font-body);font-size:13px;background:var(--canvas-bg);color:var(--text-primary);overflow:hidden}.scanlines{position:fixed;inset:0;pointer-events:none;z-index:999;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.04) 2px,rgba(0,0,0,.04) 4px)}[data-theme=light] .scanlines{display:none}#graph-container{position:absolute;inset:0;margin:0;overflow:hidden}.panel{position:absolute;top:20px;left:20px;width:var(--panel-width);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-panel);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.panel:before{content:"";display:block;height:2px;background:linear-gradient(90deg,var(--accent) 0%,transparent 100%);opacity:.8}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px 9px;border-bottom:1px solid var(--border-subtle)}.panel-title{font-family:var(--font-display);font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-primary)}.title-accent{color:var(--accent);margin-right:4px;font-weight:400}.divider{display:none}.icon-btn{background:none;border:1px solid var(--border);border-radius:var(--radius);padding:4px 7px;cursor:pointer;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s,border-color .15s,box-shadow .15s}.icon-btn:hover{background:var(--accent-dim);color:var(--accent);border-color:var(--border-bright);box-shadow:var(--accent-glow)}.panel .section{padding:4px 10px}.panel .section:first-of-type{padding-top:10px}.panel .section:last-of-type{padding-bottom:12px}.panel .section button{width:100%;padding:7px 10px;font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-secondary);background:transparent;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;display:flex;align-items:center;gap:7px;transition:background .15s,border-color .2s,color .15s,box-shadow .2s;position:relative;overflow:hidden}.panel .section button:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(0,200,255,.06) 100%);opacity:0;transition:opacity .2s}.panel .section button:hover:not([disabled]):after{opacity:1}.panel .section button:hover:not([disabled]){background:var(--accent-dim);border-color:var(--border-bright);color:var(--accent);box-shadow:0 0 8px #00c8ff26,inset 0 0 0 1px #00c8ff14}.panel .section button:active:not([disabled]){background:var(--surface-active)}.panel .section button[disabled]{color:var(--text-disabled);border-color:var(--border-subtle);background:transparent;cursor:not-allowed}.btn-icon{font-size:11px;color:var(--accent);opacity:.7;flex-shrink:0}button[disabled] .btn-icon{color:var(--text-disabled)}#legend{position:absolute;bottom:20px;left:20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:10px 14px 12px 12px;max-height:40vh;overflow-y:auto;box-shadow:var(--shadow-panel);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}#legend:before{content:"Clusters";display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--border-subtle);opacity:.8}#legend ul{list-style:none;margin:0;padding:0}#legend ul li{display:flex;align-items:center;gap:8px;padding:3px 0;font-family:var(--font-body);font-size:11.5px;color:var(--text-secondary)}#legend ul li .color{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0;box-shadow:0 0 6px currentColor}#detail-panel{position:absolute;top:20px;right:20px;width:260px;bottom:20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shadow-panel);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}#detail-panel:before{content:"";display:block;height:2px;background:linear-gradient(90deg,transparent 0%,var(--accent) 60%,transparent 100%);opacity:.7;flex-shrink:0}.tab-bar{display:flex;border-bottom:1px solid var(--border);flex-shrink:0}.tab-btn{flex:1;padding:9px 12px;font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:color .15s,border-color .15s,background .15s;margin-bottom:-1px}.tab-btn:hover{color:var(--text-secondary);background:var(--accent-dim)}.tab-btn.active{color:var(--accent);border-bottom-color:var(--accent);text-shadow:0 0 10px rgba(0,200,255,.4)}.tab-pane{display:none;flex-direction:column;flex:1;overflow-y:auto;padding:12px 14px}.tab-pane.active{display:flex}.detail-empty{color:var(--text-muted);font-family:var(--font-mono);font-size:11px;text-align:center;margin-top:32px;letter-spacing:.04em}.detail-empty:before{content:"[ "}.detail-empty:after{content:" ]"}.prop-list{margin:0;padding:0}.prop-row{display:flex;flex-direction:column;padding:8px 0;border-bottom:1px solid var(--border-subtle)}.prop-row:last-child{border-bottom:none}.prop-row dt{font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);opacity:.7;margin-bottom:3px}.prop-row dd{margin:0;font-size:13px;font-weight:400;color:var(--text-primary);word-break:break-word}.rel-list{list-style:none;margin:0;padding:0}.rel-item{display:flex;align-items:baseline;gap:6px;padding:7px 0;border-bottom:1px solid var(--border-subtle);font-size:12px}.rel-item:last-child{border-bottom:none}.rel-dir{color:var(--accent);flex-shrink:0;font-size:13px;font-weight:700;text-shadow:0 0 8px rgba(0,200,255,.5)}.rel-label{color:var(--text-primary);flex:1;word-break:break-word}.rel-type{font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);white-space:nowrap;background:var(--accent-dim);padding:1px 5px;border-radius:2px;border:1px solid var(--border-subtle)}.tab-pane::-webkit-scrollbar,#legend::-webkit-scrollbar{width:3px}.tab-pane::-webkit-scrollbar-track,#legend::-webkit-scrollbar-track{background:transparent}.tab-pane::-webkit-scrollbar-thumb,#legend::-webkit-scrollbar-thumb{background:var(--border-bright);border-radius:2px}
