@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-gradient: linear-gradient(135deg, #0f172a 0%, #1e1b4b 100%);--card-bg: rgba(30, 41, 59, .7);--card-border: rgba(255, 255, 255, .1);--text-primary: #f8fafc;--text-secondary: #94a3b8;--accent-color: #6366f1;--accent-hover: #4f46e5;--success-color: #10b981;--success-bg: rgba(16, 185, 129, .15);--offline-color: #ef4444;--offline-bg: rgba(239, 68, 68, .15)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,sans-serif;background:var(--bg-gradient);color:var(--text-primary);min-height:100vh;padding:2rem 1.5rem}.container{max-width:1200px;margin:0 auto}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--card-border)}.logo-section{display:flex;align-items:center;gap:1rem}.logo-icon{width:44px;height:44px;background:linear-gradient(135deg,#6366f1,#a855f7);border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.4rem;box-shadow:0 4px 14px #6366f166}h1{font-size:1.6rem;font-weight:700;letter-spacing:-.02em}.subtitle{font-size:.875rem;color:var(--text-secondary)}.live-indicator{display:flex;align-items:center;gap:.5rem;font-size:.85rem;background:#ffffff0d;padding:.4rem .8rem;border-radius:20px;border:1px solid var(--card-border)}.dot{width:8px;height:8px;background-color:var(--success-color);border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%{transform:scale(.95);box-shadow:0 0 #10b981b3}70%{transform:scale(1);box-shadow:0 0 0 8px #10b98100}to{transform:scale(.95);box-shadow:0 0 #10b98100}}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin-bottom:2rem}.metric-card{background:var(--card-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--card-border);border-radius:16px;padding:1.25rem}.metric-title{font-size:.8rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.metric-value{font-size:2rem;font-weight:700}.card{background:var(--card-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--card-border);border-radius:16px;overflow:hidden;box-shadow:0 10px 30px #0003}.card-header{padding:1.25rem 1.5rem;border-bottom:1px solid var(--card-border);display:flex;justify-content:space-between;align-items:center}.card-title{font-size:1.1rem;font-weight:600}table{width:100%;border-collapse:collapse;text-align:left}th{background:#0f172a66;padding:1rem 1.5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);font-weight:600}td{padding:1.1rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.05);font-size:.9rem}tr:last-child td{border-bottom:none}tr:hover td{background:#ffffff05;transition:background .15s ease}.status-badge{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .75rem;border-radius:20px;font-size:.8rem;font-weight:500}.status-online{background:var(--success-bg);color:var(--success-color);border:1px solid rgba(16,185,129,.3)}.status-offline{background:var(--offline-bg);color:var(--offline-color);border:1px solid rgba(239,68,68,.3)}.badge-dot{width:6px;height:6px;border-radius:50%;background-color:currentColor}.empty-state{padding:3rem;text-align:center;color:var(--text-secondary)}.empty-icon{font-size:2.5rem;margin-bottom:1rem}.error-banner{background:#ef444426;border:1px solid rgba(239,68,68,.3);color:var(--offline-color);padding:.75rem 1rem;border-radius:8px;margin-bottom:1.5rem;font-size:.875rem}
