*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-base:#0a0d14;--bg-surface:#0f1320;--bg-card:#141928;--bg-card-hover:#1a2035;--bg-glass:#141928b3;--border-subtle:#ffffff0f;--border-default:#ffffff1a;--border-accent:#63b3ed4d;--text-primary:#e2e8f0;--text-secondary:#8892a4;--text-muted:#4a5568;--text-accent:#63b3ed;--color-verified:#3b82f6;--color-alive:#63b3ed;--color-degraded:#f59e0b;--color-dead:#fc8181;--color-pre-live:#9f7aea;--color-pending:#a0aec0;--gradient-primary:linear-gradient(135deg, #667eea 0%, #764ba2 100%);--gradient-accent:linear-gradient(135deg, #63b3ed 0%, #4299e1 100%);--gradient-success:linear-gradient(135deg, #48bb78 0%, #38a169 100%);--gradient-danger:linear-gradient(135deg, #fc8181 0%, #e53e3e 100%);--shadow-card:0 4px 24px #0000004d, 0 1px 4px #0003;--shadow-glow:0 0 30px #63b3ed26;--shadow-button:0 4px 15px #63b3ed4d;--shadow-sm:0 4px 6px -1px #00000080;--shadow-md:0 10px 15px -3px #00000080}[data-theme=light]{--bg-dark:#f8fafc;--bg-primary:#fff;--bg-secondary:#f1f5f9;--bg-tertiary:#e2e8f0;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--color-alive:#16a34a;--color-dead:#dc2626;--color-degraded:#d97706;--color-pre-live:#9333ea;--color-verified:#2563eb;--shadow-sm:0 4px 6px -1px #0000001a;--shadow-md:0 10px 15px -3px #0000001a}*{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.4s ease}html{font-size:14px}body{font-family:var(--font-sans);background-color:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;line-height:1.6}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(60% 50% at 20% 20%,#6366f114 0%,#0000 60%),radial-gradient(50% 40% at 80% 80%,#764ba214 0%,#0000 60%),radial-gradient(40% 30%,#63b3ed0a 0%,#0000 70%);position:fixed;inset:0}#root{z-index:1;position:relative}.app-layout{min-height:100vh;display:flex}.sidebar{background:var(--bg-surface);border-right:1px solid var(--border-subtle);z-index:100;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);flex-direction:column;flex-shrink:0;width:240px;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-logo{border-bottom:1px solid var(--border-subtle);padding:24px 20px}.sidebar-logo h1{background:var(--gradient-accent);-webkit-text-fill-color:transparent;letter-spacing:-.02em;-webkit-background-clip:text;background-clip:text;font-size:1.1rem;font-weight:700}.sidebar-logo .logo-sub{color:var(--text-muted);font-size:.75rem;font-family:var(--font-mono);margin-top:2px}.sidebar-nav{flex-direction:column;flex:1;gap:4px;padding:16px 12px;display:flex}.nav-link{border-radius:var(--radius-md);color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer;border:1px solid #0000;align-items:center;gap:10px;padding:10px 12px;font-size:.875rem;font-weight:500;text-decoration:none;display:flex}.nav-link:hover{color:var(--text-primary);background:var(--bg-card);border-color:var(--border-subtle)}.nav-link.active{color:var(--text-accent);background:#63b3ed14;border-color:#63b3ed33}.nav-link svg{flex-shrink:0;width:16px;height:16px}.sidebar-footer{border-top:1px solid var(--border-subtle);padding:16px}.ws-indicator{color:var(--text-muted);align-items:center;gap:8px;font-size:.75rem;display:flex}.ws-dot{background:var(--color-dead);border-radius:50%;width:6px;height:6px}.ws-dot.connected{background:var(--color-verified);box-shadow:0 0 6px var(--color-verified);animation:2s infinite pulse}.main-content{flex:1;min-height:100vh;margin-left:240px;padding:32px}.page-header{margin-bottom:28px}.page-title{color:var(--text-primary);letter-spacing:-.02em;font-size:1.5rem;font-weight:700}.page-subtitle{color:var(--text-secondary);margin-top:4px;font-size:.875rem}.card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);transition:border-color var(--transition-normal)}.card:hover{border-color:var(--border-default)}.card-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:20px 24px 16px;display:flex}.card-title{color:var(--text-primary);align-items:center;gap:8px;font-size:.9rem;font-weight:600;display:flex}.card-body{padding:20px 24px}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:28px;display:grid}.stat-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);transition:all var(--transition-normal);padding:20px;position:relative;overflow:hidden}.stat-card:before{content:"";background:var(--gradient-accent);opacity:0;height:2px;transition:opacity var(--transition-normal);position:absolute;top:0;left:0;right:0}.stat-card:hover:before{opacity:1}.stat-card:hover{border-color:var(--border-accent);box-shadow:var(--shadow-glow);transform:translateY(-2px)}.stat-icon{border-radius:var(--radius-md);justify-content:center;align-items:center;width:36px;height:36px;margin-bottom:12px;display:flex}.stat-icon.verified{color:var(--color-verified);background:#48bb7826}.stat-icon.alive{color:var(--color-alive);background:#63b3ed26}.stat-icon.dead{color:var(--color-dead);background:#fc818126}.stat-icon.pre-live{color:var(--color-pre-live);background:#9f7aea26}.stat-icon.pending{color:var(--color-pending);background:#a0aec026}.stat-icon.total{color:#b794f4;background:#764ba226}.stat-icon.sources{color:var(--color-degraded);background:#f6ad5526}.stat-value{letter-spacing:-.03em;font-size:2rem;font-weight:700;line-height:1;font-family:var(--font-mono);color:var(--text-primary)}.stat-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-top:4px;font-size:.75rem;font-weight:500}.status-badge{text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;border-radius:20px;align-items:center;gap:5px;padding:3px 8px;font-size:.7rem;font-weight:600;display:inline-flex}.status-badge:before{content:"";border-radius:50%;flex-shrink:0;width:5px;height:5px}.status-badge.verified{color:var(--color-verified);background:#48bb781f;border:1px solid #48bb7840}.status-badge.verified:before{background:var(--color-verified);box-shadow:0 0 4px var(--color-verified)}.status-badge.alive{color:var(--color-alive);background:#63b3ed1f;border:1px solid #63b3ed40}.status-badge.alive:before{background:var(--color-alive)}.status-badge.degraded{color:var(--color-degraded);background:#f6ad551f;border:1px solid #f6ad5540}.status-badge.degraded:before{background:var(--color-degraded)}.status-badge.dead{color:var(--color-dead);background:#fc81811a;border:1px solid #fc818133}.status-badge.dead:before{background:var(--color-dead)}.status-badge.pre-live{color:var(--color-pre-live);background:#9f7aea1a;border:1px solid #9f7aea33}.status-badge.pre-live:before{background:var(--color-pre-live)}.status-badge.pending{color:var(--color-pending);background:#a0aec01a;border:1px solid #a0aec033}.status-badge.pending:before{background:var(--color-pending)}.secret-badge{font-size:.65rem;font-weight:700;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.04em;border-radius:4px;padding:2px 6px;display:inline-block}.secret-badge.dd{color:var(--color-alive);background:#63b3ed1a;border:1px solid #63b3ed33}.secret-badge.ee{color:#b794f4;background:#764ba226;border:1px solid #764ba24d}.secret-badge.plain{color:var(--color-pending);background:#a0aec01a;border:1px solid #a0aec033}.table-container{border-radius:var(--radius-lg);overflow-x:auto}table{border-collapse:collapse;width:100%}thead th{text-align:left;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);border-bottom:1px solid var(--border-subtle);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color var(--transition-fast);padding:12px 16px;font-size:.7rem;font-weight:600}thead th:hover{color:var(--text-secondary)}tbody tr{border-bottom:1px solid var(--border-subtle);transition:background var(--transition-fast)}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:var(--bg-card-hover)}tbody td{color:var(--text-primary);white-space:nowrap;padding:12px 16px;font-size:.825rem}.td-mono{font-family:var(--font-mono);color:var(--text-secondary);font-size:.78rem}.latency-value{font-family:var(--font-mono);font-size:.8rem}.latency-fast{color:var(--color-verified)}.latency-ok{color:var(--color-alive)}.latency-slow{color:var(--color-degraded)}.latency-none{color:var(--text-muted)}.reliability-bar{align-items:center;gap:8px;display:flex}.reliability-track{background:var(--border-subtle);border-radius:2px;flex:1;min-width:60px;height:4px;overflow:hidden}.reliability-fill{border-radius:2px;height:100%;transition:width .5s}.reliability-text{font-size:.72rem;font-family:var(--font-mono);color:var(--text-secondary);min-width:32px}.btn{border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;font-size:.825rem;font-weight:500;font-family:var(--font-sans);border:none;align-items:center;gap:6px;padding:8px 14px;display:inline-flex}.btn svg{width:14px;height:14px}.btn-primary{background:var(--gradient-accent);color:#fff;box-shadow:var(--shadow-button)}.btn-primary:hover{opacity:.9;transform:translateY(-1px)}.btn-secondary{background:var(--bg-card);color:var(--text-secondary);border:1px solid var(--border-default)}.btn-secondary:hover{color:var(--text-primary);border-color:var(--border-accent)}.btn-danger{color:var(--color-dead);background:#fc81811a;border:1px solid #fc818133}.btn-danger:hover{background:#fc818133}.btn-icon{justify-content:center;width:30px;height:30px;padding:6px}.btn-sm{padding:5px 10px;font-size:.775rem}.input{background:var(--bg-base);border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-primary);font-size:.825rem;font-family:var(--font-sans);width:100%;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:8px 12px}.input:focus{border-color:var(--text-accent);box-shadow:0 0 0 3px #63b3ed1a}.input::placeholder{color:var(--text-muted)}.select{appearance:none;background:var(--bg-base);border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-primary);font-size:.825rem;font-family:var(--font-sans);cursor:pointer;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%238892a4' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 8px center;background-repeat:no-repeat;background-size:16px;outline:none;padding:8px 32px 8px 12px}.select:focus{border-color:var(--text-accent)}.form-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;font-size:.775rem;font-weight:500;display:block}.form-group{margin-bottom:16px}.filter-bar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}.filter-bar .input{width:auto;min-width:220px}.pagination{border-top:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.pagination-info{color:var(--text-muted);font-size:.775rem}.pagination-controls{align-items:center;gap:4px;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;animation:fadeIn var(--transition-normal);background:#0009;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);width:100%;max-width:500px;animation:slideUp var(--transition-normal);box-shadow:0 20px 60px #00000080}.modal-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:24px 24px 16px;display:flex}.modal-title{color:var(--text-primary);font-size:1rem;font-weight:600}.modal-body{padding:20px 24px}.modal-footer{border-top:1px solid var(--border-subtle);justify-content:flex-end;gap:10px;padding:16px 24px;display:flex}.toast-container{z-index:9999;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:24px;right:24px}.toast{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-primary);box-shadow:var(--shadow-card);align-items:center;gap:10px;min-width:280px;padding:12px 16px;font-size:.825rem;animation:.3s slideUp;display:flex}.toast.success{border-left:3px solid var(--color-verified)}.toast.error{border-left:3px solid var(--color-dead)}.toast.info{border-left:3px solid var(--color-alive)}.spinner{border:2px solid var(--border-default);border-top-color:var(--text-accent);border-radius:50%;width:20px;height:20px;animation:.6s linear infinite spin}.skeleton{background:linear-gradient(90deg, var(--bg-card) 25%, var(--bg-card-hover) 50%, var(--bg-card) 75%);border-radius:var(--radius-sm);background-size:200% 100%;animation:1.5s infinite shimmer}.copy-btn{color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;border-radius:3px;padding:2px;display:inline-flex}.copy-btn:hover{color:var(--text-accent)}.empty-state{text-align:center;color:var(--text-muted);padding:64px 24px}.empty-state svg{opacity:.4;width:48px;height:48px;margin-bottom:16px}.empty-state h3{color:var(--text-secondary);margin-bottom:6px;font-size:1rem;font-weight:600}.empty-state p{font-size:.825rem}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@media (width<=768px){.sidebar{display:none}.main-content{margin-left:0;padding:16px}.stats-grid{grid-template-columns:repeat(2,1fr)}}