:root{--bg:#0a0e1a;--c1:#111827;--c2:#1f2937;--c3:#374151;--t1:#f9fafb;--t2:#f9fafbb3;--t3:#f9fafb66;--t4:#f9fafb33;--ac:#8b5cf6;--ac2:#a78bfa;--ac3:#c4b5fd;--gn:#10b981;--rd:#ef4444;--or:#f59e0b;--bl:#3b82f6;--R:12px;--Rlg:16px;--sidebar-w:260px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--t1);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.6}a{color:var(--ac2);text-decoration:none;transition:color .2s}a:hover{color:var(--ac3)}.loading{min-height:100vh;color:var(--t3);justify-content:center;align-items:center;font-size:14px;display:flex}.card{background:var(--c1);border-radius:var(--Rlg);border:1px solid #ffffff0f;margin-bottom:16px;padding:24px}.card-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.card-title{align-items:center;gap:8px;font-size:15px;font-weight:700;display:flex}.card-title i,.card-title svg{color:var(--ac2)}.btn{border-radius:var(--R);cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-family:inherit;font-size:14px;font-weight:600;text-decoration:none;transition:all .15s;display:inline-flex}.btn:active{transform:scale(.98)}.btn-primary{color:#fff;background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.btn-primary:hover{filter:brightness(1.1);color:#fff;transform:translateY(-1px)}.btn-secondary{color:var(--t2);background:#ffffff0f;border:1px solid #ffffff1a}.btn-secondary:hover{color:var(--t1);background:#ffffff1a}.btn-danger{color:var(--rd);background:#ef44441a;border:1px solid #ef444433}.btn-danger:hover{background:#ef444433}.btn-sm{padding:8px 16px;font-size:13px}.btn-full{width:100%}.form-group{margin-bottom:16px}.form-group label{color:var(--t2);margin-bottom:6px;font-size:13px;font-weight:600;display:block}.form-input{background:var(--c2);border-radius:var(--R);width:100%;color:var(--t1);border:1px solid #ffffff1a;outline:none;padding:12px 16px;font-family:inherit;font-size:14px;transition:border-color .2s}.form-input:focus{border-color:var(--ac)}.form-input::placeholder{color:var(--t4)}.status-badge{border-radius:6px;align-items:center;gap:6px;padding:4px 12px;font-size:12px;font-weight:600;display:inline-flex}.status-active{color:var(--gn);background:#10b98126}.status-inactive{color:var(--rd);background:#ef444426}.status-pending{color:var(--or);background:#f59e0b26}.progress-bar{background:#ffffff0d;border-radius:3px;height:6px;overflow:hidden}.progress-fill{border-radius:3px;height:100%;transition:width .5s}.toast{background:var(--c2);color:var(--t1);z-index:9999;border:1px solid #ffffff14;border-radius:8px;padding:10px 20px;font-size:13px;font-weight:600;animation:.2s slideUp;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0006}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}.fade-in{animation:.3s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.online-dot{border-radius:50%;width:8px;height:8px;display:inline-block}.online-dot.on{background:var(--gn);box-shadow:0 0 8px #10b98180}.online-dot.off{background:#6b7280}.empty{text-align:center;color:var(--t3);padding:32px 16px}.empty svg{color:var(--t4);margin-bottom:12px;font-size:32px}.empty p{font-size:13px}