html,body{overflow-x:clip}.viz-root{--bg: #0a0a0f;--surface: #12121a;--border: #2a2a3a;--text: #e0e0e8;--text-muted: #888898;--quality: #5b5ef0;--quality-light: #818cf8;--security: #10b981;--security-light: #34d399;--edge: #4b5563;--edge-highlight: #f59e0b}.viz-root *{box-sizing:border-box;margin:0;padding:0}.viz-root{width:100vw;margin-left:calc(50% - 50vw);background:var(--bg);overflow:hidden;color:var(--text)}.viz-root .container{display:flex;flex-direction:column;max-width:1800px;margin:0 auto;padding:1rem}.viz-root header{text-align:center;padding:.5rem 0 1rem;flex-shrink:0}.viz-root h1{font-size:1.8rem;font-weight:300;margin-bottom:.25rem}.viz-root h1 .quality{color:var(--quality-light)}.viz-root h1 .security{color:var(--security-light)}.viz-root .subtitle{color:var(--text-muted);font-size:.95rem}.viz-root .framework-selector{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 0;flex-wrap:wrap}.viz-root .selector-label{color:var(--text-muted);font-size:.85rem;margin-right:.5rem}.viz-root .framework-btn{background:var(--surface);border:1px solid var(--border);color:var(--text);padding:.4rem .75rem;border-radius:4px;cursor:pointer;font-size:.8rem;transition:all .2s}.viz-root .framework-btn:hover{border-color:var(--text-muted)}.viz-root .framework-btn.active{border-color:var(--edge-highlight);background:#f59e0b26;color:var(--edge-highlight)}.viz-root .framework-description{text-align:center;padding:.5rem 1rem;font-size:.85rem;color:var(--text-muted);max-width:800px;margin:0 auto;min-height:1.5rem}.viz-root .framework-description .fw-name{color:var(--edge-highlight);font-weight:500}.viz-root .framework-description .fw-version{color:var(--text-muted);font-size:.75rem}.viz-root .graph-container{position:relative;overflow-x:auto}.viz-root svg{display:block;min-width:100%}.viz-root .column-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;fill:var(--text-muted)}.viz-root .group-box{fill:none;stroke-width:1;stroke-dasharray:3,3}.viz-root .group-box.quality{stroke:var(--quality)}.viz-root .group-box.security{stroke:var(--security)}.viz-root .group-label{font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:.03em}.viz-root .group-label.quality{fill:var(--quality-light)}.viz-root .group-label.security{fill:var(--security-light)}.viz-root .group-box.framework{stroke:#f59e0b}.viz-root .group-label.framework{fill:#fbbf24}.viz-root .group-box.framework-depth-0{stroke:#f59e0b;stroke-width:2;stroke-dasharray:6,4}.viz-root .group-box.framework-depth-1{stroke:#fbbf24;stroke-width:1;stroke-dasharray:4,3}.viz-root .group-box.framework-depth-2{stroke:#fcd34d;stroke-width:1;stroke-dasharray:3,2}.viz-root .group-label.framework-depth-0{fill:#f59e0b;font-size:10px;font-weight:600}.viz-root .group-label.framework-depth-1{fill:#fbbf24;font-size:9px}.viz-root .group-label.framework-depth-2{fill:#fcd34d;font-size:8px}.viz-root .node{cursor:pointer;transition:opacity .2s}.viz-root .node rect{rx:4;ry:4;stroke-width:1}.viz-root .node.quality rect{fill:var(--quality);stroke:var(--quality-light)}.viz-root .node.quality.parent rect{fill:#4338ca}.viz-root .node.security rect{fill:var(--security);stroke:var(--security-light)}.viz-root .node.security.parent rect{fill:#059669}.viz-root .node.framework rect{fill:#d97706;stroke:#f59e0b}.viz-root .node.framework.parent rect{fill:#b45309}.viz-root .node.framework.ig1 rect{fill:#fbbf24;stroke:#fcd34d}.viz-root .node.framework.ig2 rect{fill:#d97706;stroke:#f59e0b}.viz-root .node.framework.ig3 rect{fill:#92400e;stroke:#b45309}.viz-root .node.organizational rect{fill:#7c3aed;stroke:#a78bfa}.viz-root .node text{fill:#fff;font-size:11px;pointer-events:none}.viz-root .node.security text,.viz-root .node.framework text{fill:#1a1400}.viz-root .node.framework.parent text,.viz-root .node.framework.ig3 text{fill:#fff}.viz-root .node.dimmed{opacity:.2}.viz-root .node.uncovered rect{fill:var(--border);stroke:var(--border)}.viz-root .node.uncovered text{fill:#9494a4}.viz-root .edge.uncovered{opacity:.1;stroke:var(--border)}.viz-root .edge{fill:none;stroke:var(--edge);stroke-width:1;opacity:.4;transition:all .2s}.viz-root .edge.framework-edge{stroke:#f59e0b;opacity:.6}.viz-root .edge.org-edge{stroke:#a78bfa;opacity:.5}.viz-root .edge.highlighted{stroke:var(--edge-highlight);stroke-width:2;opacity:1}.viz-root .edge.dimmed{opacity:.05}.viz-root .attribution{max-width:70ch;margin:.9rem auto 0;font-size:.72rem;line-height:1.5;text-align:center;color:var(--text-muted)}.viz-root .attribution a{color:inherit}.viz-root .load-error{padding:2rem 1rem;text-align:center;color:var(--text);line-height:1.6}.viz-root .load-error p{margin:0 0 .75rem}.viz-root .retry-btn{background:var(--surface);border:1px solid var(--edge-highlight);color:var(--edge-highlight);padding:.45rem .9rem;border-radius:4px;cursor:pointer;font:inherit;font-size:.85rem}.viz-root .legend{display:flex;flex-shrink:0;justify-content:center;flex-wrap:wrap;gap:1rem 2rem;padding-top:.85rem;font-size:.8rem;color:var(--text-muted)}.viz-root .legend-item{display:flex;align-items:center;gap:.5rem}.viz-root .legend-swatch{width:12px;height:12px;border-radius:2px}.viz-root .tooltip{position:fixed;background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:.75rem 1rem;font-size:.85rem;max-width:300px;pointer-events:auto;opacity:0;transition:opacity .15s;z-index:100;box-shadow:0 4px 12px #0000004d}.viz-root .tooltip.visible{opacity:1}.viz-root .tooltip-title{font-weight:600;margin-bottom:.25rem}.viz-root .tooltip-desc{color:var(--text-muted);font-size:.8rem}