:root{--bg-primary:#0a0e1a;--bg-secondary:#111827;--bg-card:#111827cc;--bg-glass:#ffffff0d;--border-glass:#ffffff1a;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-primary:#8b5cf6;--accent-secondary:#6366f1;--color-match:#10b981;--color-missing:#ef4444;--color-extension:#06b6d4;--color-conflict:#f59e0b;--color-compliance:#a78bfa;--radius:12px;--radius-sm:8px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-primary);color:var(--text-primary);background-image:radial-gradient(at 20%,#8b5cf614 0%,#0000 50%),radial-gradient(at 80% 20%,#6366f10f 0%,#0000 50%),radial-gradient(at 50% 80%,#06b6d40d 0%,#0000 50%);min-height:100vh;font-family:Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif}.app-container{max-width:1600px;margin:0 auto;padding:20px}.tab-nav{border-bottom:1px solid var(--border-glass);gap:4px;margin-bottom:16px;padding-bottom:0;display:flex}.tab-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:10px 22px;font-size:14px;font-weight:500;transition:all .2s}.tab-btn:hover{color:var(--text-primary)}.tab-btn.active{color:var(--accent-primary);border-bottom-color:var(--accent-primary)}.tab-content{display:block}.search-chip{color:var(--color-extension);text-overflow:ellipsis;white-space:nowrap;background:#06b6d41a;border:1px solid #06b6d44d;border-radius:20px;align-items:center;gap:6px;max-width:280px;padding:4px 10px;font-size:12px;text-decoration:none;display:inline-flex;overflow:hidden}.search-chip:hover{background:#06b6d433}.app-header{text-align:center;padding:20px 0 10px}.app-header h1{background:linear-gradient(135deg,#8b5cf6,#6366f1,#06b6d4);-webkit-text-fill-color:transparent;background-clip:text;font-size:2rem}.app-header .subtitle{color:var(--text-secondary);margin-top:4px;font-size:.95rem}.control-panel{background:var(--bg-glass);backdrop-filter:blur(20px);border:1px solid var(--border-glass);border-radius:var(--radius);margin:16px 0;padding:20px}.control-row{flex-wrap:wrap;align-items:end;gap:12px;margin-bottom:12px;display:flex}.control-row:last-child{margin-bottom:0}.control-group{flex-direction:column;flex:1;gap:4px;min-width:150px;display:flex}.control-group label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:.75rem}.control-group input,.control-group select{background:var(--bg-secondary);border:1px solid var(--border-glass);border-radius:var(--radius-sm);color:var(--text-primary);outline:none;padding:8px 12px;font-size:.9rem;transition:border-color .2s}.control-group input:focus,.control-group select:focus{border-color:var(--accent-primary)}.btn{border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;padding:8px 20px;font-size:.9rem;font-weight:500;transition:all .2s}.btn-primary{background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));color:#fff}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 15px #8b5cf666}.btn-secondary{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-glass)}.btn-secondary:hover{border-color:var(--accent-primary)}.btn-small{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-glass);padding:4px 12px;font-size:.8rem}.mock-toggle{align-items:center;margin-left:auto;display:flex}.toggle-label{cursor:pointer;color:var(--text-secondary);align-items:center;gap:8px;font-size:.85rem;display:flex}.toggle-label input[type=checkbox]{display:none}.toggle-slider{background:var(--bg-secondary);border:1px solid var(--border-glass);border-radius:11px;width:40px;height:22px;transition:all .3s;position:relative}.toggle-slider:after{content:"";background:var(--text-muted);border-radius:50%;width:16px;height:16px;transition:all .3s;position:absolute;top:2px;left:2px}.toggle-label input:checked+.toggle-slider{background:var(--accent-primary);border-color:var(--accent-primary)}.toggle-label input:checked+.toggle-slider:after{background:#fff;left:20px}.upload-section{margin-top:12px}.drop-zone{border:2px dashed var(--border-glass);border-radius:var(--radius);text-align:center;cursor:pointer;background:var(--bg-glass);padding:24px;transition:all .3s}.drop-zone:hover{border-color:var(--accent-primary);background:#8b5cf60d}.drop-zone.drag-over{border-color:var(--accent-primary);background:#8b5cf61a}.drop-zone p{color:var(--text-secondary);margin-bottom:12px}.upload-meta{justify-content:center;gap:12px;margin-top:12px;display:flex}.upload-meta input{background:var(--bg-secondary);border:1px solid var(--border-glass);border-radius:var(--radius-sm);color:var(--text-primary);outline:none;width:200px;padding:6px 12px;font-size:.85rem}.graph-area{background:var(--bg-glass);backdrop-filter:blur(20px);border:1px solid var(--border-glass);border-radius:var(--radius);margin-top:16px;padding:16px}.stats-bar{background:var(--bg-secondary);border-radius:var(--radius-sm);flex-wrap:wrap;gap:20px;margin-bottom:12px;padding:12px 16px;display:flex}.stat{color:var(--text-secondary);font-size:.9rem}.stat.match strong{color:var(--color-match)}.stat.missing strong{color:var(--color-missing)}.stat.extension strong{color:var(--color-extension)}.stat.conflict strong{color:var(--color-conflict)}.stat.compliance strong{color:var(--color-compliance)}.view-controls{align-items:center;gap:10px;margin-bottom:12px;display:flex}.view-controls label{color:var(--text-muted);font-size:.85rem}.view-controls select{background:var(--bg-secondary);border:1px solid var(--border-glass);border-radius:var(--radius-sm);color:var(--text-primary);padding:4px 10px;font-size:.85rem}#graphContainer{border-radius:var(--radius-sm);background:var(--bg-primary);border:1px solid var(--border-glass);width:100%;height:600px}.inspector{background:var(--bg-card);backdrop-filter:blur(20px);border:1px solid var(--border-glass);border-radius:var(--radius);z-index:100;width:380px;max-height:70vh;padding:16px;position:fixed;top:100px;right:20px;overflow-y:auto;box-shadow:0 8px 32px #0006}.inspector-header{border-bottom:1px solid var(--border-glass);justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:8px;display:flex}.inspector-header h3{color:var(--accent-primary);font-size:1rem}.inspector-header button{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1.2rem}#inspectorContent{font-size:.85rem;line-height:1.6}#inspectorContent .detail-row{border-bottom:1px solid #ffffff08;padding:6px 0}#inspectorContent .detail-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:.75rem}#inspectorContent .detail-value{color:var(--text-primary);margin-top:2px}#inspectorContent .conflict-diff{border-radius:var(--radius-sm);background:#f59e0b1a;border:1px solid #f59e0b4d;margin-top:8px;padding:10px}#inspectorContent .conflict-diff h4{color:var(--color-conflict);margin-bottom:6px;font-size:.85rem}#inspectorContent .diff-item{padding:4px 0;font-size:.8rem}#inspectorContent .diff-base{color:var(--color-missing)}#inspectorContent .diff-variant{color:var(--color-match)}.status-bar{text-align:center;color:var(--text-muted);min-height:30px;padding:8px;font-size:.8rem}.status-bar.loading{color:var(--accent-primary)}.status-bar.error{color:var(--color-missing)}.status-bar.success{color:var(--color-match)}@media (width<=768px){.control-row{flex-direction:column}.control-group{min-width:100%}.stats-bar{flex-direction:column;gap:8px}.inspector{width:calc(100% - 40px);left:20px;right:20px}.upload-meta{flex-direction:column;align-items:center}}