:root{--bg:#0a0812;--bg2:#0f0d1a;--bg3:#151226;--card:#16132b;--card2:#1c1836;--border:#ffffff12;--border2:#8b2fc940;--primary:#8b2fc9;--primary-light:#a855f7;--primary-dim:#8b2fc926;--accent:#f5a623;--accent-dim:#f5a62326;--green:#22c55e;--green-dim:#22c55e26;--red:#ef4444;--red-dim:#ef444426;--yellow:#eab308;--yellow-dim:#eab30826;--cyan:#06b6d4;--cyan-dim:#06b6d426;--white:#f8f4ff;--muted:#8892a4;--muted2:#5a6272;--sidebar-w:240px;--topbar-h:60px;--radius:12px;--radius-sm:8px;--shadow:0 4px 24px #00000059;--font-body:"Inter", sans-serif;--font-head:"Space Grotesk", sans-serif}[data-theme=light]{--bg:#f0f2f5;--bg2:#fff;--bg3:#e8eaed;--card:#fff;--border:#d1d5db;--border2:#e5e7eb;--white:#111827;--muted:#6b7280;--muted2:#9ca3af;--text:#111827;--primary-dim:#6d28d914;--red-dim:#ef444414}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg);height:100%;color:var(--white);font-family:var(--font-body);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}button{font-family:var(--font-body);cursor:pointer}input,textarea,select{font-family:var(--font-body)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#8b2fc959;border-radius:99px}h1{font-family:var(--font-head);font-size:24px;font-weight:700}h2{font-family:var(--font-head);font-size:20px;font-weight:700}h3{font-family:var(--font-head);font-size:16px;font-weight:600}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px}.btn{border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;justify-content:center;align-items:center;gap:6px;padding:8px 18px;font-size:13px;font-weight:600;transition:opacity .15s,transform .1s;display:inline-flex}.btn:hover{opacity:.88}.btn:active{transform:scale(.97)}.btn-primary{background:linear-gradient(90deg, var(--primary), var(--primary-light));color:#fff;box-shadow:0 4px 16px #8b2fc94d}.btn-secondary{background:var(--card2);color:var(--white);border:1px solid var(--border)}.btn-danger{background:var(--red-dim);color:var(--red);border:1px solid #ef44444d}.btn-ghost{color:var(--muted);border:1px solid var(--border);background:0 0}.btn-sm{padding:5px 12px;font-size:12px}.btn-icon{border-radius:var(--radius-sm);background:var(--card2);border:1px solid var(--border);color:var(--muted);justify-content:center;align-items:center;padding:7px;display:inline-flex}.btn-icon:hover{color:var(--white);border-color:var(--primary)}.badge{white-space:nowrap;border-radius:999px;align-items:center;gap:4px;padding:3px 10px;font-size:11px;font-weight:600;display:inline-flex}.badge-purple{background:var(--primary-dim);color:var(--primary-light);border:1px solid #8b2fc94d}.badge-green{background:var(--green-dim);color:var(--green);border:1px solid #22c55e4d}.badge-red{background:var(--red-dim);color:var(--red);border:1px solid #ef44444d}.badge-yellow{background:var(--yellow-dim);color:var(--yellow);border:1px solid #eab3084d}.badge-cyan{background:var(--cyan-dim);color:var(--cyan);border:1px solid #06b6d44d}.badge-accent{background:var(--accent-dim);color:var(--accent);border:1px solid #f5a6234d}.badge-muted{color:var(--muted);border:1px solid var(--border);background:#ffffff0d}.field-group{flex-direction:column;gap:6px;display:flex}.field-label{color:var(--muted);letter-spacing:.5px;font-size:12px;font-weight:600}.field{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--white);outline:none;width:100%;padding:9px 12px;font-size:13px;transition:border-color .2s}.field:focus{border-color:var(--primary)}.field::placeholder{color:var(--muted2)}select.field{cursor:pointer}select.field option{background:var(--bg3)}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%}thead th{letter-spacing:.8px;text-transform:uppercase;color:var(--muted);background:var(--bg2);border-bottom:1px solid var(--border);text-align:left;white-space:nowrap;z-index:10;padding:10px 14px;font-size:11px;font-weight:700;position:sticky;top:0}tbody tr{border-bottom:1px solid var(--border);transition:background .12s}tbody tr:hover{background:#8b2fc90d}th.col-actions,td.col-actions{background:var(--card);position:sticky;right:0;box-shadow:-6px 0 8px -6px #00000073}thead th.col-actions{background:var(--bg2);z-index:11}tbody td.col-actions{z-index:5}tbody tr:hover td.col-actions{background:var(--card2)}tbody td{color:var(--white);padding:11px 14px;font-size:13px}tbody td.muted{color:var(--muted)}.table-card{flex-direction:column;flex:1;min-height:0;display:flex;padding:0!important;overflow:hidden!important}.table-card .table-wrap{flex:1;overflow:auto}@media (width<=768px){.table-card{flex:none;min-height:auto}.table-card .table-wrap{flex:none;overflow-y:visible}}.modal-overlay{z-index:500;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0a0812d1;justify-content:center;align-items:center;padding:24px;animation:.15s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--bg3);border:1px solid var(--border2);width:100%;max-width:520px;max-height:90vh;box-shadow:var(--shadow);border-radius:16px;padding:28px;animation:.18s slideUp;overflow-y:auto}.modal-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.modal-title{font-family:var(--font-head);font-size:18px;font-weight:700}.modal-close{background:var(--card2);border:1px solid var(--border);width:32px;height:32px;color:var(--muted);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex}.modal-close:hover{color:var(--white)}.toast-container{z-index:999;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:24px;right:24px}.toast{background:var(--card2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--white);box-shadow:var(--shadow);align-items:center;gap:10px;min-width:260px;padding:12px 16px;font-size:13px;animation:.2s slideUp;display:flex}.toast.success{border-left:3px solid var(--green)}.toast.error{border-left:3px solid var(--red)}.toast.info{border-left:3px solid var(--primary-light)}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px;display:flex}.page-title{font-family:var(--font-head);font-size:22px;font-weight:700}.page-subtitle{color:var(--muted);margin-top:2px;font-size:13px}.page-body{flex-direction:column;flex:1;gap:20px;min-height:0;padding:28px;display:flex;overflow:hidden}@media (width<=768px){.page-body{padding:16px;overflow-y:auto}}.empty-state{color:var(--muted);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:60px 24px;display:flex}.empty-state .icon{opacity:.5;font-size:40px}.empty-state p{max-width:280px;font-size:14px;line-height:1.6}.divider{background:var(--border);height:1px;margin:16px 0}.spinner{border:3px solid var(--border);border-top-color:var(--primary-light);border-radius:50%;width:36px;height:36px;animation:.7s linear infinite spin}.loading-center{justify-content:center;align-items:center;padding:60px;display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.animate-in{animation:.2s slideUp}.grad{background:linear-gradient(90deg, var(--primary-light), var(--accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.dot-live{background:var(--green);border-radius:50%;width:7px;height:7px;animation:2s infinite pulse;display:inline-block}.mobile-menu-btn{display:none!important}@media (width<=768px){:root{--sidebar-w:0px}aside{z-index:200;transition:left .25s;position:fixed;left:-280px;box-shadow:4px 0 24px #0006;width:260px!important}aside.open{left:0}.mobile-menu-btn{z-index:201;background:var(--card);border:1px solid var(--border);cursor:pointer;width:40px;height:40px;color:var(--white);border-radius:10px;justify-content:center;align-items:center;font-size:18px;position:fixed;top:12px;left:12px;display:flex!important}.container{padding:0 16px}table{font-size:12px}th,td{padding:8px 6px!important}}@media (width>=769px){.mobile-menu-btn{display:none!important}}@media (width<=768px){.table-wrap{-webkit-overflow-scrolling:touch;overflow-x:auto}.modal{max-height:90vh;overflow-y:auto;width:96vw!important;max-width:96vw!important;margin:8px!important}.btn{padding:10px 14px;font-size:12px}h1{font-size:18px}}