:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;background:#f9fafb}:root{--bg-page: #f9fafb;--bg-card: #ffffff;--header-dark: #0A123B;--header-light: #111B4E;--accent-blue: #1E25A1;--accent-purple: #5D1685;--accent-magenta: #9D096F;--text-primary: #111827;--text-secondary: #4b5563;--text-muted: #9ca3af;--border: #e5e7eb;--status-healthy: #10B981;--status-degraded: #F59E0B;--status-down: #EF4444}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--bg-page);color:var(--text-primary);min-height:100vh}#root{max-width:none;margin:0;padding:0}.app{min-height:100vh;display:flex;flex-direction:column}.header{background:linear-gradient(0deg,var(--header-light),var(--header-dark));padding:.75rem 1.5rem;position:sticky;top:0;z-index:100}.header-content{display:flex;align-items:center;justify-content:space-between;max-width:1400px;margin:0 auto}.header-left{display:flex;align-items:center;gap:1rem}.header-left .logo{height:28px;width:auto}.title-group h1{font-size:1.125rem;font-weight:600;color:#fff}.title-group .subtitle{font-size:.7rem;color:#ffffffb3}.header-center{display:flex;align-items:center}.view-toggle{display:flex;background:#ffffff1a;border-radius:6px;padding:3px;gap:2px}.toggle-btn{display:flex;align-items:center;gap:5px;padding:6px 14px;border:none;border-radius:4px;background:transparent;color:#ffffffb3;font-size:.8rem;cursor:pointer;transition:all .15s}.toggle-btn:hover{color:#fff;background:#ffffff1a}.toggle-btn.active{background:#fff;color:var(--accent-blue)}.toggle-btn svg{width:16px;height:16px}.header-right{display:flex;align-items:center;gap:1rem}.refresh-time{font-size:.7rem;color:#fff9}.error-badge{padding:3px 8px;background:var(--status-down);color:#fff;border-radius:4px;font-size:.7rem;font-weight:500}.refresh-btn{display:flex;align-items:center;gap:5px;padding:6px 12px;border:1px solid rgba(255,255,255,.2);border-radius:5px;background:#ffffff1a;color:#fff;font-size:.8rem;cursor:pointer;transition:all .15s}.refresh-btn:hover:not(:disabled){background:#fff3}.refresh-btn:disabled{opacity:.5;cursor:not-allowed}.refresh-btn svg.spinning{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.main-content{flex:1;display:flex;padding:1.5rem 1.5rem 3rem;gap:1.5rem;max-width:1400px;margin:0 auto;width:100%}.visualization-container{flex:1;min-width:0;background:var(--bg-card);border-radius:8px;border:1px solid var(--border);overflow:hidden}.visualization-container svg{width:100%;height:calc(100vh - 140px);min-height:500px}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:calc(100vh - 140px);min-height:500px;gap:1rem}.loading-spinner{width:48px;height:48px;border:4px solid var(--border);border-top-color:var(--accent-purple);border-radius:50%;animation:spin 1s linear infinite}.loading-text{color:var(--text-muted);font-size:.9rem}.sidebar{width:300px;flex-shrink:0}.status-panel{background:var(--bg-card);border-radius:8px;border:1px solid var(--border);max-height:calc(100vh - 140px);overflow-y:auto}.main-status{padding:1rem;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.75rem}.status-indicator-large{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.status-icon{font-size:18px;color:#fff;font-weight:700}.status-info h2{font-size:1rem;font-weight:600;color:var(--text-primary)}.status-label{font-size:.75rem;font-weight:500}.visibility-percent{font-size:.7rem;color:var(--text-muted)}.status-section{padding:1rem;border-bottom:1px solid var(--border)}.status-section:last-child{border-bottom:none}.status-section h3{font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-bottom:.75rem;font-weight:600}.dc-grid{display:flex;flex-direction:column;gap:.5rem}.dc-card{display:flex;align-items:center;gap:.5rem;padding:.5rem 0}.dc-status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.dc-info{flex:1;display:flex;justify-content:space-between;align-items:center}.dc-name{font-size:.8rem;font-weight:500;color:var(--text-primary)}.dc-percent{font-size:.75rem;color:var(--text-muted);font-weight:500}.dc-bar{width:50px;height:4px;background:var(--border);border-radius:2px;overflow:hidden}.dc-bar-fill{height:100%;border-radius:2px;transition:width .3s ease}.collector-summary{display:flex;gap:.5rem}.collector-stat{flex:1;text-align:center;padding:.5rem;background:var(--bg-page);border-radius:6px}.stat-value{font-size:1.25rem;font-weight:600;display:block}.stat-label{font-size:.6rem;text-transform:uppercase;color:var(--text-muted);font-weight:500}.prefix-list{display:flex;flex-direction:column;gap:.25rem}.prefix-item{display:flex;align-items:center;gap:.5rem;padding:.375rem 0;font-size:.75rem;border-bottom:1px solid var(--border)}.prefix-item:last-child{border-bottom:none}.prefix-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.prefix-name{font-family:SF Mono,Monaco,Menlo,monospace;font-size:.7rem;flex:1;color:var(--text-primary)}.prefix-dc{color:var(--text-muted);font-size:.6rem}.prefix-visibility{color:var(--text-secondary);font-family:SF Mono,Monaco,Menlo,monospace;font-size:.65rem}.more-prefixes,.no-data,.loading{font-size:.75rem;color:var(--text-muted);text-align:center;padding:.75rem}.legend{display:flex;gap:.75rem;padding:.75rem 1rem;background:var(--bg-page);border-radius:0 0 8px 8px}.legend-item{display:flex;align-items:center;gap:.375rem;font-size:.6rem;color:var(--text-muted)}.legend-dot{width:6px;height:6px;border-radius:50%}.status-card{display:none}@keyframes pulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}}.pulse-ring{animation:pulse 2s ease-in-out infinite}.link-active{opacity:.9}.link-partial{animation:link-flash 1.5s ease-in-out infinite}.link-missing{animation:link-flash-fast .8s ease-in-out infinite}@keyframes link-flash{0%,to{opacity:.9}50%{opacity:.4}}@keyframes link-flash-fast{0%,to{opacity:.7}50%{opacity:.2}}@media (max-width: 1024px){.main-content{flex-direction:column}.sidebar{width:100%}.visualization-container svg{height:450px}.status-panel{max-height:none}}@media (max-width: 640px){.header-content{flex-wrap:wrap;gap:.5rem}.header-left{gap:.5rem}.header-left .logo{height:22px}.title-group h1{font-size:.85rem}.title-group .subtitle{font-size:.6rem}.header-center{order:3;width:100%;justify-content:center}.toggle-btn{padding:5px 10px;font-size:.7rem;gap:3px}.toggle-btn svg{width:14px;height:14px}.header-right{gap:.5rem}.refresh-btn{padding:5px 8px;font-size:.7rem}.refresh-time{font-size:.6rem}.visualization-container svg{height:350px;min-height:300px}}.status-panel::-webkit-scrollbar{width:4px}.status-panel::-webkit-scrollbar-track{background:transparent}.status-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.footer{padding:.5rem 1.5rem;text-align:center;font-size:.7rem;color:var(--text-muted);border-top:1px solid var(--border);background:var(--bg-card);position:fixed;bottom:0;left:0;right:0;z-index:50}.footer a{color:var(--accent-purple);text-decoration:none}.footer a:hover{text-decoration:underline}