*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--blue: #002fa7;--blue-hover: #0038cc;--blue-light: #e8eeff;--blue-xlight: #f0f4ff;--orange: #ff9702;--orange-light: #fff6e0;--orange-dark: #e07800;--bg: #eef1f8;--bg2: #ffffff;--bg3: #f5f7fc;--border: #dde3f0;--border2: #c5cfea;--text: #0b1328;--text2: #4a5578;--text3: #8e9bbf;--success: #059669;--success-bg: #ecfdf5;--error: #dc2626;--error-bg: #fef2f2;--warn: #d97706;--warn-bg: #fffbeb;--info: #2563eb;--info-bg: #eff6ff;--running: #7c3aed;--teal: #0d9488;--running-bg: #f5f3ff;--font: "Inter", system-ui, sans-serif;--mono: "JetBrains Mono", monospace;--sidebar: 240px;--radius: 8px;--radius-lg: 12px;--shadow: 0 1px 3px rgba(0,47,167,.06), 0 1px 2px rgba(0,0,0,.04);--shadow-md: 0 4px 20px rgba(0,47,167,.1), 0 1px 4px rgba(0,0,0,.06);--shadow-lg: 0 12px 40px rgba(0,47,167,.14), 0 4px 8px rgba(0,0,0,.08);--surface: #ffffff;--accent: #ff9702}[data-theme=dark]{--bg: #0b0d16;--bg2: #10131e;--bg3: #161929;--surface: #181c2d;--border: #1e2238;--border2: #272d4a;--text: #e6eaf6;--text2: #8f9bc8;--text3: #7880b4;--blue: #4d78ff;--blue-hover: #6690ff;--blue-xlight: rgba(77,120,255,.12);--blue-light: rgba(77,120,255,.18);--orange-dark: #00d4b4;--orange-light: rgba(0,212,180,.1);--success: #10b981;--success-bg: #042b1a;--error: #f87171;--error-bg: #2a0909;--warn: #fbbf24;--warn-bg: #1e1204;--info: #60a5fa;--info-bg: #091535;--running: #a78bfa;--running-bg: #180c30;--shadow: 0 1px 4px rgba(0,0,0,.45), 0 1px 2px rgba(0,0,0,.35);--shadow-md: 0 4px 24px rgba(0,0,0,.55), 0 1px 6px rgba(0,0,0,.35);--shadow-lg: 0 12px 48px rgba(0,0,0,.65), 0 4px 12px rgba(0,0,0,.45)}[data-theme=dark] .sidebar{background:#080a12;border-right:1px solid rgba(255,255,255,.04)}[data-theme=dark] .sidebar:before{background:linear-gradient(160deg,rgba(255,255,255,.025) 0%,transparent 55%)}[data-theme=dark] .sidebar-logo{border-bottom-color:#ffffff0d}[data-theme=dark] .sidebar-footer{border-top-color:#ffffff0d}[data-theme=dark] .topbar{background:#10131e;border-bottom:3px solid var(--orange);box-shadow:0 1px #00000080,0 4px 16px #00000047}[data-theme=dark] .topbar-chip{background:#0000001f;color:#00d4b4;border-color:#00d4b433}[data-theme=dark] .topbar-chip-admin{background:#00000026;color:#00d4b4;border-color:#00d4b442}[data-theme=dark] .card{box-shadow:0 1px 4px #00000059,0 1px 2px #00000040;border-color:#1e2238}[data-theme=dark] .card:hover{box-shadow:0 6px 24px #00000073,0 1px 4px #0000004d;border-color:#272d4a}[data-theme=dark] .stat-card{border-color:#1e2238}[data-theme=dark] thead tr{background:#0b0d16}[data-theme=dark] tbody tr:hover td{background:#4d78ff0d;color:var(--text);transition:background .12s}[data-theme=dark] .table-wrap{box-shadow:0 2px 16px #0006,0 1px 3px #0000004d;border-color:#1e2238}[data-theme=dark] input,[data-theme=dark] select,[data-theme=dark] textarea{background:#0b0d16;border-color:#272d4a;color:var(--text)}[data-theme=dark] input:focus,[data-theme=dark] select:focus,[data-theme=dark] textarea:focus{border-color:var(--orange);background:#0b0d16;box-shadow:0 0 0 3px #00d4b41f}[data-theme=dark] input::placeholder,[data-theme=dark] textarea::placeholder{color:#6878b0}[data-theme=dark] .btn-ghost{color:var(--text2);border-color:#272d4a}[data-theme=dark] .btn-ghost:hover:not(:disabled){background:#161929;color:var(--text);border-color:#363c60}[data-theme=dark] .btn-danger{color:var(--error);border-color:#f8717140}[data-theme=dark] .btn-danger:hover:not(:disabled){background:#2a0909;border-color:#f8717173}[data-theme=dark] .modal{background:#10131e;border-color:#1e2238}[data-theme=dark] .modal-header{border-bottom-color:#1e2238}[data-theme=dark] .modal-footer{background:#0b0d16;border-top-color:#1e2238}[data-theme=dark] .modal-backdrop{background:#000000bf}[data-theme=dark] .error-msg{background:#2a0909;border-color:#f8717133;color:var(--error)}[data-theme=dark] .info-box{background:#4d78ff17;border-color:#4d78ff38;color:var(--blue)}[data-theme=dark] .token-box{background:#0b0d16;border-color:#272d4a;color:var(--blue)}[data-theme=dark] .token-box:hover{border-color:var(--blue);background:#4d78ff14}[data-theme=dark] .table-premium thead tr{background:#0b0d16;border-bottom-color:#00d4b424}[data-theme=dark] .table-premium tbody tr:hover td{background:#00d4b408}html,body,#root{height:100%;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text3)}h1{font-size:20px;font-weight:700;color:var(--text);letter-spacing:-.3px}h2{font-size:13px;font-weight:600;color:var(--text2);letter-spacing:.2px}h3{font-size:15px;font-weight:600;color:var(--text)}.app-layout{display:flex;height:100vh;overflow:hidden}.sidebar{width:var(--sidebar);flex-shrink:0;background:var(--blue);display:flex;flex-direction:column;overflow:hidden;position:relative}.sidebar:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(160deg,rgba(255,255,255,.06) 0%,transparent 50%);pointer-events:none;z-index:0}.sidebar-logo{padding:24px 20px 20px;border-bottom:1px solid rgba(255,255,255,.1);position:relative;z-index:1}.sidebar-logo .wordmark{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:3px;color:#fff;display:flex;align-items:center;gap:6px}.sidebar-logo .wordmark-dot{width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 8px #ff970299;flex-shrink:0}.sidebar-logo .tagline{font-size:9px;color:#ffffff59;letter-spacing:2px;text-transform:uppercase;margin-top:4px}.sidebar-nav{flex:1;padding:8px 0;overflow-y:auto;position:relative;z-index:1}.nav-section-label{padding:14px 20px 5px;font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#ffffff40}.nav-item{display:flex;align-items:center;gap:10px;padding:10px 18px 10px 20px;color:#fff9;text-decoration:none;font-size:13px;font-weight:500;transition:all .15s;border-left:3px solid transparent;cursor:pointer;position:relative}.nav-item:hover{color:#fff;background:#00000024;border-left-color:#fff3}.nav-item.active{color:#fff;background:#0003;border-left-color:var(--orange);font-weight:600}.nav-icon{width:16px;height:16px;opacity:.7;flex-shrink:0;transition:opacity .15s}.nav-item:hover .nav-icon,.nav-item.active .nav-icon{opacity:1}.sidebar-footer{padding:14px 16px;border-top:1px solid rgba(255,255,255,.1);position:relative;z-index:1}.main{flex:1;overflow-y:auto;display:flex;flex-direction:column;background:var(--bg)}.topbar{height:56px;background:var(--bg2);border-bottom:3px solid var(--orange);display:flex;align-items:center;padding:0 28px;gap:12px;flex-shrink:0;box-shadow:0 2px 10px #0000000f,0 1px #ff97021a}.topbar-title{font-size:15px;font-weight:700;color:var(--text);letter-spacing:-.25px}.topbar-actions{margin-left:auto;display:flex;gap:8px;align-items:center}.topbar-chip{height:26px;padding:0 10px;border-radius:20px;background:#ff970214;color:var(--orange-dark);font-size:11px;font-weight:600;display:inline-flex;align-items:center;gap:5px;border:1px solid rgba(255,151,2,.18)}.page-content{padding:24px 28px;flex:1}.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px}.page-header h1{font-size:20px}.page-header-sub{font-size:12px;color:var(--text3);margin-top:2px}.card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;box-shadow:0 1px 4px #002fa70f,0 1px 2px #0000000a}.card:hover{box-shadow:0 4px 18px #002fa717,0 1px 4px #0000000d;transition:box-shadow .18s ease}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.card-title{font-size:14px;font-weight:600;color:var(--text)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;margin-bottom:24px}.stat-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px 22px;box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s;display:flex;flex-direction:column}.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.stat-card-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}.stat-icon{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-card.green .stat-icon{background:#05966914;color:var(--success)}.stat-card.amber .stat-icon{background:#d9770614;color:var(--warn)}.stat-card.red .stat-icon{background:#dc262614;color:var(--error)}.stat-card.blue .stat-icon{background:#002fa714;color:var(--blue)}.stat-card.purple .stat-icon{background:#7c3aed14;color:var(--running)}.stat-card.orange .stat-icon{background:#ff97021a;color:var(--orange)}.stat-label{font-size:12px;font-weight:500;color:var(--text3);margin-bottom:4px}.stat-value{font-size:34px;font-weight:700;line-height:1;letter-spacing:-1px;font-variant-numeric:tabular-nums}.stat-card.green .stat-value{color:var(--success)}.stat-card.amber .stat-value{color:var(--warn)}.stat-card.red .stat-value{color:var(--error)}.stat-card.blue .stat-value{color:var(--blue)}.stat-card.purple .stat-value{color:var(--running)}.stat-card.orange .stat-value{color:var(--orange-dark)}.stat-trend{font-size:11px;color:var(--text3);margin-top:6px;display:flex;align-items:center;gap:4px}.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg2);box-shadow:0 2px 16px #002fa714,0 1px 3px #0000000a}table{width:100%;border-collapse:collapse;font-size:13px}thead tr{background:var(--bg3);border-bottom:1px solid var(--border)}th{padding:11px 16px;text-align:left;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--text3);white-space:nowrap}td{padding:12px 16px;border-bottom:1px solid var(--border);color:var(--text2);vertical-align:middle}tr:last-child td{border-bottom:none}tbody tr:hover td{background:var(--blue-xlight);color:var(--text);transition:background .12s}.mono{font-family:var(--mono);font-size:11px}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:600;letter-spacing:.2px}.badge-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.badge.success{background:var(--success-bg);color:var(--success)}.badge.success .badge-dot{background:var(--success)}.badge.error{background:var(--error-bg);color:var(--error)}.badge.error .badge-dot{background:var(--error)}.badge.running{background:var(--running-bg);color:var(--running)}.badge.running .badge-dot{background:var(--running);animation:pulse 1.5s infinite}.badge.pending{background:var(--bg3);color:var(--text3);border:1px solid var(--border)}.badge.pending .badge-dot{background:var(--text3)}.badge.zombie{background:var(--warn-bg);color:var(--warn)}.badge.zombie .badge-dot{background:var(--warn)}.badge.online{background:var(--success-bg);color:var(--success)}.badge.online .badge-dot{background:var(--success);box-shadow:0 0 5px var(--success);animation:pulse 2s infinite}.badge.offline{background:var(--bg3);color:var(--text3);border:1px solid var(--border)}.badge.offline .badge-dot{background:var(--text3)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.btn{display:inline-flex;align-items:center;gap:7px;padding:8px 16px;border-radius:var(--radius);font-size:13px;font-weight:600;font-family:var(--font);cursor:pointer;transition:all .15s;border:1px solid transparent;white-space:nowrap;text-decoration:none}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue);box-shadow:0 2px 8px #002fa738}.btn-primary:hover:not(:disabled){background:var(--blue-hover);box-shadow:0 4px 16px #002fa752;transform:translateY(-1px)}.btn-orange{background:var(--orange);color:#fff;border-color:var(--orange);box-shadow:0 2px 8px #ff97024d}.btn-orange:hover:not(:disabled){background:var(--orange-dark);box-shadow:0 4px 12px #ff970266}.btn-ghost{background:transparent;color:var(--text2);border-color:var(--border)}.btn-ghost:hover:not(:disabled){background:var(--bg3);color:var(--text);border-color:var(--border2)}.btn-danger{background:transparent;color:var(--error);border-color:#dc262640}.btn-danger:hover:not(:disabled){background:var(--error-bg);border-color:#dc262680}.btn-sm{padding:5px 11px;font-size:12px}.btn-icon{padding:7px}.form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.form-label{font-size:12px;font-weight:600;color:var(--text2);letter-spacing:.2px}input,select,textarea{background:var(--bg2);border:1px solid var(--border2);border-radius:var(--radius);color:var(--text);padding:9px 12px;font-family:var(--font);font-size:13px;transition:all .15s;outline:none;width:100%}input:focus,select:focus,textarea:focus{border-color:var(--orange);background:var(--bg2);box-shadow:0 0 0 3px #ff97021f}input::placeholder,textarea::placeholder{color:var(--text3)}textarea{font-family:var(--mono);font-size:12px;resize:vertical;min-height:200px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0b132880;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .15s}.modal{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);width:500px;max-width:calc(100vw - 40px);max-height:calc(100vh - 80px);overflow-y:auto;animation:slideUp .18s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-lg)}.modal-header{padding:22px 24px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.modal-header h3{font-size:15px;font-weight:600;color:var(--text)}.modal-body{padding:20px 24px}.modal-footer{padding:16px 24px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px;background:var(--bg3);border-radius:0 0 var(--radius-lg) var(--radius-lg)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(14px) scale(.98);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.log-terminal{background:#0b1328;border:1px solid var(--border);border-radius:var(--radius);padding:14px;font-family:var(--mono);font-size:11.5px;line-height:1.75;overflow-y:auto}.log-line{display:flex;gap:12px}.log-time{color:#6e88a4;flex-shrink:0}.log-msg.info{color:#86efac}.log-msg.warn{color:#fcd34d}.log-msg.error{color:#fca5a5}.token-box{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;font-family:var(--mono);font-size:11px;color:var(--blue);word-break:break-all;cursor:pointer;transition:all .15s}.token-box:hover{border-color:var(--blue);background:var(--blue-xlight)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-header h2{font-size:14px;font-weight:600;color:var(--text);text-transform:none;letter-spacing:0}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}.text-muted{color:var(--text3)}.text-mono{font-family:var(--mono);font-size:11px}.text-accent{color:var(--blue)}.text-orange{color:var(--orange-dark)}.divider{border:none;border-top:1px solid var(--border);margin:20px 0}.flex{display:flex}.flex-center{display:flex;align-items:center}.gap-2{gap:8px}.gap-3{gap:12px}.ml-auto{margin-left:auto}.empty-state{padding:48px 24px;text-align:center;color:var(--text3);font-size:13px}.login-page{min-height:100vh;display:flex;background:var(--bg)}.login-left{width:420px;background:var(--blue);flex-shrink:0;display:flex;flex-direction:column;justify-content:space-between;padding:52px 48px;position:relative;overflow:hidden}.login-left:before{content:"";position:absolute;bottom:-100px;right:-80px;width:360px;height:360px;border-radius:50%;background:#ff97021a}.login-left:after{content:"";position:absolute;top:-80px;left:-80px;width:280px;height:280px;border-radius:50%;background:#ffffff0a}.login-right{flex:1;display:flex;align-items:center;justify-content:center;padding:40px}.login-card{width:100%;max-width:400px;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:36px 40px;box-shadow:var(--shadow-md)}.login-logo{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:3px;color:#fff}.login-sub{font-size:12px;color:#ffffff73;margin-top:4px}.error-msg{background:var(--error-bg);border:1px solid rgba(220,38,38,.2);border-radius:var(--radius);padding:9px 13px;font-size:12px;color:var(--error);margin-bottom:16px}.spinner{width:15px;height:15px;border:2px solid rgba(0,47,167,.15);border-top-color:var(--blue);border-radius:50%;animation:spin .6s linear infinite;display:inline-block;flex-shrink:0}.btn-primary .spinner,.btn-orange .spinner{border-color:#ffffff40;border-top-color:#fff}@keyframes spin{to{transform:rotate(360deg)}}.info-box{background:var(--blue-xlight);border:1px solid rgba(0,47,167,.12);border-radius:var(--radius);padding:10px 14px;font-size:12px;color:var(--blue)}.divider-label{display:flex;align-items:center;gap:12px;margin:20px 0;color:var(--text3);font-size:11px}.divider-label:before,.divider-label:after{content:"";flex:1;height:1px;background:var(--border)}.table-premium thead tr{background:var(--bg2);border-bottom:2px solid rgba(255,151,2,.18)}.table-premium th{font-size:10px;font-weight:700;letter-spacing:.7px;color:var(--text2);padding:12px 16px}.table-premium td{padding:13px 16px}.table-premium tbody tr:hover td{background:#ff97020b;color:var(--text);transition:background .12s}.topbar-chip-admin{background:#ff97021a;color:var(--orange-dark);border:1px solid rgba(255,151,2,.24);font-weight:700}.stat-card.teal{border-top:2px solid rgba(13,148,136,.45)}.stat-card.teal .stat-icon{background:#0d948814;color:var(--teal)}.stat-card.teal .stat-value{color:var(--teal)}.stat-card.teal:hover{box-shadow:var(--shadow-md),0 10px 32px #0d94881c}.stat-card.green:hover{box-shadow:var(--shadow-md),0 10px 32px #0596691c}.stat-card.amber:hover{box-shadow:var(--shadow-md),0 10px 32px #d977061a}.stat-card.red:hover{box-shadow:var(--shadow-md),0 10px 32px #dc26261a}.stat-card.blue:hover{box-shadow:var(--shadow-md),0 10px 32px #002fa721}.stat-card.purple:hover{box-shadow:var(--shadow-md),0 10px 32px #7c3aed1a}.stat-card.orange:hover{box-shadow:var(--shadow-md),0 10px 32px #ff970224}
