:root{--bg-base: #080C16;--bg-surface: #0D1220;--bg-card: #111A2E;--bg-card-hover: #162036;--bg-elevated: #1A2540;--bg-input: #0C1120;--bg-sidebar: #0A0F1C;--bg-hero: linear-gradient(145deg, #0F1A30 0%, #162240 50%, #111A2E 100%);--bg-stripe: rgba(255,255,255,.015);--border: #1A2642;--border-hover: #253660;--border-active: #10B981;--border-subtle: #141E35;--text-primary: #EFF4FC;--text-secondary: #A0B4D4;--text-muted: #5D7499;--text-placeholder: #2E3F5C;--accent: #10B981;--accent-dim: rgba(16, 185, 129, .12);--accent-glow: rgba(16, 185, 129, .3);--accent-bright: #34D399;--profit: #10B981;--profit-dim: rgba(16, 185, 129, .1);--profit-glow: rgba(16, 185, 129, .2);--loss: #EF4444;--loss-dim: rgba(239, 68, 68, .1);--loss-glow: rgba(239, 68, 68, .2);--warning: #F59E0B;--warning-dim: rgba(245, 158, 11, .1);--info: #3B82F6;--info-dim: rgba(59, 130, 246, .1);--purple: #8B5CF6;--purple-dim: rgba(139, 92, 246, .1);--grade-a: #10B981;--grade-b: #06B6D4;--grade-c: #F59E0B;--grade-d: #EF4444;--grade-f: #991B1B;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 22px;--shadow-sm: 0 2px 8px rgba(0,0,0,.25), 0 1px 3px rgba(0,0,0,.15);--shadow-md: 0 4px 20px rgba(0,0,0,.3), 0 2px 6px rgba(0,0,0,.2);--shadow-lg: 0 12px 40px rgba(0,0,0,.4), 0 4px 12px rgba(0,0,0,.25);--shadow-glow: 0 0 24px rgba(16, 185, 129, .15);--shadow-glow-red: 0 0 24px rgba(239, 68, 68, .12);--font-display: "Plus Jakarta Sans", -apple-system, sans-serif;--font-body: "DM Sans", -apple-system, sans-serif;--font-mono: "JetBrains Mono", "SF Mono", monospace;--transition-fast: .15s ease;--transition-med: .25s ease;color-scheme:dark}[data-theme=light]{--bg-base: #F0F2F8;--bg-surface: #E8EBF4;--bg-card: #FFFFFF;--bg-card-hover: #F8F9FD;--bg-elevated: #EFF1F9;--bg-input: #F4F6FC;--bg-sidebar: #FFFFFF;--bg-hero: linear-gradient(145deg, #F8FAFF 0%, #EEF2FD 50%, #FFFFFF 100%);--bg-stripe: rgba(0,0,0,.018);--border: #D8DFF0;--border-hover: #B8C4DD;--border-active: #059669;--border-subtle: #E5EAF4;--text-primary: #0C1629;--text-secondary: #2D3F60;--text-muted: #5E7090;--text-placeholder: #B4BED4;--accent: #059669;--accent-dim: rgba(5, 150, 105, .08);--accent-glow: rgba(5, 150, 105, .18);--accent-bright: #10B981;--profit: #059669;--profit-dim: rgba(5, 150, 105, .07);--profit-glow: rgba(5, 150, 105, .12);--loss: #DC2626;--loss-dim: rgba(220, 38, 38, .06);--loss-glow: rgba(220, 38, 38, .1);--warning: #D97706;--warning-dim: rgba(217, 119, 6, .07);--info: #2563EB;--info-dim: rgba(37, 99, 235, .07);--purple: #7C3AED;--purple-dim: rgba(124, 58, 237, .07);--grade-a: #059669;--grade-b: #0891B2;--grade-c: #D97706;--grade-d: #DC2626;--grade-f: #991B1B;--shadow-sm: 0 1px 4px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.04);--shadow-md: 0 4px 16px rgba(15,23,42,.08), 0 2px 4px rgba(15,23,42,.04);--shadow-lg: 0 12px 36px rgba(15,23,42,.1), 0 4px 10px rgba(15,23,42,.06);--shadow-glow: 0 0 24px rgba(5, 150, 105, .1);--shadow-glow-red: 0 0 24px rgba(220, 38, 38, .08);color-scheme:light}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg-base);color:var(--text-primary);font-family:var(--font-body);font-size:16px;line-height:1.6;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-family:var(--font-display);font-weight:800;letter-spacing:-.03em;line-height:1.1}h2{font-family:var(--font-display);font-weight:700;letter-spacing:-.02em;line-height:1.2}h3{font-family:var(--font-display);font-weight:700;letter-spacing:-.01em}.text-mono{font-family:var(--font-mono)}.text-display{font-family:var(--font-display)}.text-muted{color:var(--text-muted)!important}.text-secondary{color:var(--text-secondary)!important}.text-profit{color:var(--profit)!important}.text-loss{color:var(--loss)!important}.text-warning{color:var(--warning)!important}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes glow{0%,to{box-shadow:0 0 6px var(--accent)}50%{box-shadow:0 0 18px var(--accent-glow)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px;box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.card:hover{border-color:var(--border-hover)}.card-highlight{border-color:var(--accent)!important;box-shadow:var(--shadow-glow)!important}.card-danger{border-color:var(--loss)!important;box-shadow:var(--shadow-glow-red)!important}.card-flush{padding:0;overflow:hidden}.card-compact{padding:16px}.card-hero{background:var(--bg-hero);border:1px solid var(--border-hover);box-shadow:var(--shadow-md);position:relative;overflow:hidden}.card-hero:after{content:"";position:absolute;top:-50%;right:-20%;width:300px;height:300px;background:radial-gradient(circle,var(--accent-glow) 0%,transparent 70%);pointer-events:none;opacity:.15}button{font-family:inherit;cursor:pointer;transition:all var(--transition-fast)}button:active{transform:scale(.97)}.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;font-size:14px;font-weight:600;font-family:var(--font-body);border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-elevated);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.btn:hover{border-color:var(--border-hover);color:var(--text-primary);box-shadow:var(--shadow-sm)}.btn-primary{background:var(--accent);color:#fff;border:none;font-weight:700;box-shadow:0 2px 8px #10b98140}.btn-primary:hover{filter:brightness(1.1);box-shadow:0 4px 16px #10b98159}.btn-danger{background:var(--loss-dim);color:var(--loss);border:1px solid rgba(239,68,68,.2)}.btn-danger:hover{background:var(--loss);color:#fff}.btn-sm{padding:7px 14px;font-size:13px;border-radius:var(--radius-sm)}.btn-lg{padding:14px 28px;font-size:16px;font-weight:700;border-radius:var(--radius-lg)}input,select,textarea{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-md);padding:11px 16px;font-size:14px;font-family:var(--font-mono);color:var(--text-primary);outline:none;width:100%;transition:border var(--transition-fast),box-shadow var(--transition-fast)}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim),0 0 12px var(--accent-glow)}input::placeholder{color:var(--text-placeholder)}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath fill='%234A5E80' d='M3 5.5l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px!important;cursor:pointer}label{display:block;font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;font-family:var(--font-body)}.badge{display:inline-flex;align-items:center;padding:4px 10px;font-size:11px;font-weight:700;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.05em;border-radius:var(--radius-sm);white-space:nowrap}.badge-green{background:var(--profit-dim);color:var(--profit);border:1px solid rgba(16,185,129,.15)}.badge-red{background:var(--loss-dim);color:var(--loss);border:1px solid rgba(239,68,68,.15)}.badge-amber{background:var(--warning-dim);color:var(--warning);border:1px solid rgba(245,158,11,.15)}.badge-blue{background:var(--info-dim);color:var(--info);border:1px solid rgba(59,130,246,.15)}.badge-purple{background:var(--purple-dim);color:var(--purple);border:1px solid rgba(139,92,246,.15)}.badge-lg{padding:6px 14px;font-size:12px}.grade{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);font-size:20px;font-weight:900;font-family:var(--font-display)}.grade-lg{width:56px;height:56px;font-size:28px;border-radius:var(--radius-lg)}.grade-a{background:#10b98126;color:var(--grade-a);box-shadow:inset 0 0 16px #10b9811a}.grade-b{background:#06b6d426;color:var(--grade-b);box-shadow:inset 0 0 16px #06b6d41a}.grade-c{background:#f59e0b26;color:var(--grade-c);box-shadow:inset 0 0 16px #f59e0b1a}.grade-d{background:#ef444426;color:var(--grade-d);box-shadow:inset 0 0 16px #ef44441a}.grade-f{background:#991b1b26;color:var(--grade-f);box-shadow:inset 0 0 16px #991b1b1a}.dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0}.dot-lg{width:12px;height:12px}.dot-live{background:var(--profit);box-shadow:0 0 10px var(--profit-glow);animation:glow 2.5s ease-in-out infinite}.dot-offline{background:var(--loss);opacity:.6}.dot-warning{background:var(--warning);box-shadow:0 0 8px #f59e0b4d}.data-table{width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:15px}.data-table thead th{padding:14px 18px;font-size:11px;font-weight:700;font-family:var(--font-body);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;border-bottom:2px solid var(--border);position:sticky;top:0;background:var(--bg-elevated);z-index:2;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.data-table thead th:hover{color:var(--text-secondary)}.data-table tbody tr{border-bottom:1px solid var(--border-subtle);transition:background var(--transition-fast)}.data-table tbody tr:hover{background:var(--bg-card-hover)}.data-table tbody tr.selected{background:var(--accent-dim)}.data-table tbody tr:nth-child(2n){background:var(--bg-stripe)}.data-table td{padding:12px 18px;white-space:nowrap}.progress-track{height:8px;background:var(--bg-elevated);border-radius:99px;overflow:hidden}.progress-fill{height:100%;border-radius:99px;transition:width .6s ease}.kpi{text-align:center;padding:22px}.kpi-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;font-weight:700;margin-bottom:10px;font-family:var(--font-body)}.kpi-value{font-size:36px;font-weight:800;font-family:var(--font-mono);letter-spacing:-.03em;line-height:1}.kpi-sub{font-size:13px;color:var(--text-muted);margin-top:8px;font-family:var(--font-mono)}.tabs{display:flex;gap:4px;padding:5px;background:var(--bg-surface);border-radius:var(--radius-lg);margin-bottom:28px;border:1px solid var(--border)}.tab{padding:11px 22px;font-size:14px;font-weight:500;font-family:var(--font-display);border:none;border-radius:var(--radius-md);background:transparent;color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast)}.tab:hover{color:var(--text-secondary);background:var(--bg-elevated)}.tab-active{background:var(--bg-card)!important;color:var(--accent)!important;font-weight:700;box-shadow:var(--shadow-sm)}.section-title{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:700;font-family:var(--font-display);letter-spacing:-.01em}.section-title:before{content:"";display:block;width:4px;height:24px;background:var(--accent);border-radius:2px;flex-shrink:0}.flag{display:inline-flex;align-items:center;padding:5px 12px;font-size:13px;font-weight:600;font-family:var(--font-body);border-radius:var(--radius-sm)}.flag-good{background:var(--profit-dim);color:var(--profit)}.flag-warn{background:var(--warning-dim);color:var(--warning)}.dim-bar{display:flex;align-items:center;gap:12px}.dim-bar-label{font-size:13px;color:var(--text-secondary);min-width:80px}.dim-bar-track{flex:1;height:8px;background:var(--bg-elevated);border-radius:99px;overflow:hidden;min-width:60px}.dim-bar-fill{height:100%;border-radius:99px;transition:width .3s ease}.dim-bar-value{font-size:14px;font-weight:700;font-family:var(--font-mono);min-width:42px;text-align:right}.sidebar{background:var(--bg-sidebar);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;transition:width var(--transition-med)}.nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;margin-bottom:3px;border:none;border-radius:var(--radius-md);background:transparent;color:var(--text-muted);font-size:16px;font-family:var(--font-body);font-weight:500;cursor:pointer;transition:all var(--transition-fast);text-align:left;border-left:3px solid transparent}.nav-item:hover{background:var(--bg-elevated);color:var(--text-secondary)}.nav-item-active{background:var(--accent-dim)!important;color:var(--accent)!important;font-weight:700;border-left-color:var(--accent);box-shadow:inset 0 0 12px var(--accent-dim)}.alert{padding:18px 24px;border-radius:var(--radius-lg);border:1px solid}.alert-danger{background:var(--loss-dim);border-color:#ef444433;border-left:4px solid var(--loss)}.alert-success{background:var(--profit-dim);border-color:#10b98133;border-left:4px solid var(--profit)}.alert-warning{background:var(--warning-dim);border-color:#f59e0b33;border-left:4px solid var(--warning)}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.grid-6{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}.flex{display:flex}.flex-col{display:flex;flex-direction:column}.items-center{align-items:center}.justify-between{display:flex;justify-content:space-between;align-items:center}.gap-sm{gap:8px}.gap-md{gap:14px}.gap-lg{gap:22px}.mb-sm{margin-bottom:8px}.mb-md{margin-bottom:16px}.mb-lg{margin-bottom:24px}.mb-xl{margin-bottom:32px}.fw-bold{font-weight:700}.fw-black{font-weight:800}.empty-state{text-align:center;padding:48px 24px;color:var(--text-muted)}.empty-state-icon{font-size:40px;margin-bottom:14px;opacity:.3;filter:grayscale(.5)}.empty-state-text{font-size:16px;font-family:var(--font-body)}.empty-state-sub{font-size:13px;margin-top:6px;opacity:.7}@media (max-width: 768px){body{overflow:auto}.sidebar{width:100%!important;flex-direction:row!important;padding:8px!important;overflow-x:auto;border-right:none!important;border-bottom:1px solid var(--border)!important}.sidebar nav{display:flex!important;flex-direction:row!important;gap:4px;padding:4px!important}.main-content{max-height:none!important;padding:16px!important}.grid-3,.grid-4,.grid-6{grid-template-columns:1fr!important}}