:root{--bg:#0f172a;--bg-soft:#020617;--sidebar-bg:radial-gradient(circle at top,#1e293b,#020617 70%);--main-bg:radial-gradient(circle at top left,#1f2937,#020617 70%);--card:#0f172ae6;--card-soft:#0f172acc;--border:#94a3b859;--border-subtle:#334155b3;--shadow-soft:0 18px 45px #0f172ab3;--text:#e5e7eb;--text-muted:#9ca3af;--text-softer:#6b7280;--primary:#60a5fa;--primary-soft:#2563eb2e;--primary-strong:#2563eb;--accent:#a855f7;--accent-soft:#a855f72e;--danger:#f97373;--danger-strong:#ef4444;--success:#4ade80;--warning:#facc15;--radius-lg:18px;--radius-md:12px;--radius-pill:999px;--ring:0 0 0 1px #94a3b8a6,0 0 0 8px #3b82f626;--blur:18px;--transition-fast:.15s ease-out;--transition-med:.22s ease}*,:before,:after{box-sizing:border-box}html,body{height:100%}body{color:var(--text);background:radial-gradient(circle at top,#1e293b 0,#020617 55%,#000 100%);margin:0;font:14px/1.5 system-ui,-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.app{min-height:100vh;color:var(--text);background:radial-gradient(circle at 0 0,#020617 0,#000 45%);grid-template-columns:260px minmax(0,1fr);display:grid}.sidebar{background:var(--sidebar-bg);height:100vh;color:var(--text-muted);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));border-right:1px solid #0f172af2;flex-direction:column;gap:18px;padding:18px 18px 16px;display:flex;position:sticky;top:0;box-shadow:16px 0 60px #0009}.brand{letter-spacing:.08em;text-transform:uppercase;color:#e5e7eb;align-items:center;gap:10px;font-size:12px;font-weight:700;display:flex}.brand .dot{background:conic-gradient(from 120deg,#60a5fa,#22c55e,#a855f7,#60a5fa);border-radius:999px;width:14px;height:14px;box-shadow:0 0 0 4px #2563eb40,0 0 20px #3b82f6cc}.nav{flex-direction:column;gap:4px;margin-top:8px;font-size:13px;display:flex}.nav a{color:var(--text-muted);transition:background var(--transition-med),color var(--transition-med),transform var(--transition-fast),box-shadow var(--transition-med);border:1px solid #0000;border-radius:10px;align-items:center;gap:10px;padding:9px 12px;text-decoration:none;display:flex;position:relative}.nav a:before{content:"";border-radius:inherit;opacity:0;pointer-events:none;transition:opacity var(--transition-fast),border-color var(--transition-fast);border:1px solid #0000;position:absolute;inset:1px}.nav a:hover{color:#f9fafb;background:#0f172ae6;border-color:#94a3b840;transform:translateY(-1px)}.nav a:hover:before{opacity:1;border-color:#3b82f661}.nav a.active{color:#eef2ff;background:linear-gradient(120deg,#2563eb2e,#1e40afe6);border-color:#3b82f68c;box-shadow:0 0 0 1px #3b82f666,0 12px 30px #0f172ae6}.nav a.active:before{opacity:1;border-color:#bfdbfeb3}.nav a.active:after{content:"";background:linear-gradient(#38bdf8,#a855f7);border-radius:999px;width:3px;height:18px;position:absolute;top:50%;left:-8px;transform:translateY(-50%)}.nav .sep{background:radial-gradient(circle,#1f2933,#020617 80%);height:1px;margin:10px 0}.sidebar-footer{color:var(--text-softer);opacity:.9;border-top:1px solid #0f172ae6;justify-content:space-between;align-items:center;gap:8px;margin-top:auto;padding-top:8px;font-size:11px;display:flex}.main{background:var(--main-bg);grid-template-rows:auto minmax(0,1fr);display:grid}.topbar{z-index:10;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:linear-gradient(120deg,#0f172aeb,#0f172ae0);border-bottom:1px solid #1f2937e6;justify-content:space-between;align-items:center;padding:10px 20px;display:flex;position:sticky;top:0;box-shadow:0 18px 40px #0f172ae6,0 1px #94a3b80d}#breadcrumb{letter-spacing:.12em;text-transform:uppercase;color:var(--text-softer);font-size:12px}.topbar .actions{align-items:center;gap:10px;display:flex}.avatar{background:radial-gradient(circle at 30% 20%,#e5e7eb,#4b5563);border:1px solid #94a3b8b3;border-radius:999px;width:28px;height:28px;box-shadow:0 0 0 3px #0f172ae6,0 0 24px #3b82f666}.content{width:100%;max-width:1320px;margin:0 auto;padding:22px 24px 26px}.card{background:var(--card);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur))}.panel{background:var(--card-soft);border-radius:var(--radius-md);border:1px solid var(--border-subtle);padding:16px 18px;box-shadow:0 12px 38px #0f172aa6}.grid{gap:16px;display:grid}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.kpi{padding:16px 18px 15px}.kpi h3{letter-spacing:.12em;text-transform:uppercase;color:var(--text-softer);margin:0 0 6px;font-size:11px}.kpi .num{font-size:22px;font-weight:700}.kpi .trend{color:var(--text-muted);font-size:12px}.btn{color:var(--text);cursor:pointer;transition:background var(--transition-med),border-color var(--transition-med),transform var(--transition-fast),box-shadow var(--transition-med),color var(--transition-fast);background:radial-gradient(circle at 0 0,#020617,#111827);border:1px solid #4b5563b3;border-radius:999px;justify-content:center;align-items:center;gap:7px;padding:8px 13px;font-size:13px;display:inline-flex}.btn:hover{transform:translateY(-1px)translateZ(0);box-shadow:0 12px 25px #0f172ae6,0 0 0 1px #94a3b873}.btn:focus-visible{box-shadow:var(--ring);outline:none}.btn.primary{color:#f9fafb;background:radial-gradient(circle at 20% 0,#60a5fa,#1d4ed8);border-color:#2563ebe6;box-shadow:0 16px 40px #2563ebb3,0 0 0 1px #bfdbfe8c}.btn.primary:hover{background:radial-gradient(circle at 25% 10%,#93c5fd,#1d4ed8)}.btn.ghost{color:var(--text-muted);background:0 0;border-color:#334155e6}.btn.ghost:hover{color:#f9fafb;background:#0f172af5}.btn.danger{color:#fef2f2;background:radial-gradient(circle at 10% 0,#fecaca,#7f1d1d);border-color:#f87171b3;box-shadow:0 14px 35px #f87171a6}.btn.danger:hover{background:radial-gradient(circle at 20% 10%,#fee2e2,#7f1d1d)}.btn.icon{width:30px;height:30px;padding:7px}.toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.filters{flex-wrap:wrap;align-items:center;gap:8px;display:flex}label{color:var(--text-muted);font-size:12px}.field{flex-direction:column;gap:5px;display:flex}input[type=text],input[type=email],input[type=password],input[type=date],select,textarea{color:var(--text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast),transform var(--transition-fast);background:radial-gradient(circle at top,#020617,#020617 60%);border:1px solid #374151e6;border-radius:10px;padding:9px 11px;font-size:13px;box-shadow:inset 0 1px #94a3b840}input::placeholder,textarea::placeholder{color:#94a3b8d9}input:focus,select:focus,textarea:focus{border-color:#3b82f6f2;outline:none;transform:translateY(-.5px);box-shadow:0 0 0 1px #3b82f6b3,0 0 0 7px #1e40af59}textarea{resize:vertical;min-height:122px}.help{color:var(--text-softer);font-size:11px}table{border-collapse:collapse;border-radius:var(--radius-lg);width:100%;box-shadow:var(--shadow-soft);background:radial-gradient(circle at top,#020617,#020617 72%);border:1px solid #374151e6;overflow:hidden}th,td{text-align:left;border-bottom:1px solid #1e293be6;padding:11px 12px;font-size:13px}thead th{letter-spacing:.14em;text-transform:uppercase;color:var(--text-softer);background:radial-gradient(circle at top,#020617,#020617 80%);font-size:11px}tbody tr:nth-child(2n) td{background:linear-gradient(90deg,#0f172ae6,#0f172af5)}tbody tr:nth-child(odd) td{background:linear-gradient(90deg,#0f172af5,#0f172afa)}tbody tr:hover td{background:radial-gradient(circle at 0,#020617,#1f2937)}.status{border-radius:var(--radius-pill);border:1px solid #0000;align-items:center;gap:6px;padding:4px 9px;font-size:11px;display:inline-flex}.status:before{content:"";border-radius:999px;width:6px;height:6px}.status.pending{color:#fbbf24;background:#fef3c70a;border-color:#fbbf2480}.status.pending:before{background:#fbbf24}.status.active{color:#38bdf8;background:#bfdbfe0a;border-color:#38bdf899}.status.active:before{background:#38bdf8}.status.approved{color:#4ade80;background:#bbf7d00d;border-color:#4ade8099}.status.approved:before{background:#4ade80}.status.rejected{color:#fb7185;background:#fecaca0d;border-color:#f8717199}.status.rejected:before{background:#fb7185}.status.disabled{color:#94a3b8;background:#94a3b80d;border-color:#94a3b8b3}.status.disabled:before{background:#94a3b8}.tag{border-radius:var(--radius-pill);color:#c7d2fe;background:#818cf829;border:1px solid #818cf8bf;padding:4px 9px;font-size:11px}.muted{color:var(--text-muted)}.pagination{justify-content:flex-end;gap:6px;padding:12px 4px 4px;display:flex}.backdrop{z-index:40;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:radial-gradient(circle at top,#0f172acc,#000000f2);justify-content:center;align-items:flex-end;display:none;position:fixed;inset:0}.modal{background:radial-gradient(circle at top,#020617,#020617 80%);border:1px solid #94a3b899;border-radius:20px;width:min(680px,92vw);margin-bottom:7vh;overflow:hidden;box-shadow:0 28px 70px #0f172a}.modal header{border-bottom:1px solid #1e293bf2;justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.modal .body{padding:16px 18px 18px}.drawer{width:560px;height:100vh;transition:right var(--transition-med);z-index:45;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:radial-gradient(circle at top,#020617,#020617 80%);border-left:1px solid #1e293bf2;position:fixed;top:0;right:-560px;box-shadow:-24px 0 60px #000000f2}.drawer .head{border-bottom:1px solid #1e293bf2;justify-content:space-between;align-items:center;padding:16px 18px;display:flex}.drawer .content{height:calc(100vh - 56px);padding:16px 18px 18px;overflow:auto}.toast{color:#e5e7eb;z-index:50;background:radial-gradient(circle at top,#020617,#020617 80%);border:1px solid #3b82f6b3;border-radius:999px;padding:10px 14px;display:none;position:fixed;bottom:20px;right:20px;box-shadow:0 18px 55px #0f172a,0 0 0 1px #94a3b8b3}.hidden{display:none!important}.center{background:radial-gradient(circle at 30% 20%,#0f172a 0%,#020617 60%,#000 100%);justify-content:center;align-items:center;width:100vw;height:100vh;padding:24px;display:flex}.auth{width:min(420px,92vw)}.auth .logo{color:var(--text);align-items:center;gap:8px;margin-bottom:8px;font-size:17px;font-weight:700;display:flex}.auth .logo .dot{background:conic-gradient(from 120deg,#22c55e,#60a5fa,#a855f7,#22c55e);border-radius:999px;width:14px;height:14px;box-shadow:0 0 0 4px #2563eb47,0 0 20px #2563eba6}@media (max-width:920px){.grid-4,.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:680px){.app{grid-template-columns:1fr}.sidebar{border-bottom:1px solid #0f172ae6;border-right:none;height:auto;position:relative;box-shadow:0 12px 40px #0f172af2}.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.content{padding-inline:16px}}.auth h2{letter-spacing:.02em;margin:0;font-size:22px}.auth-subtitle{color:var(--text-softer);margin:2px 0 0;font-size:12px}.auth .field{margin-top:4px}.auth-error{color:var(--danger);margin-top:6px;font-size:12px}.auth-meta{color:var(--text-softer);justify-content:space-between;align-items:center;margin-top:6px;font-size:11px;display:flex}.bottom-link{text-align:right;margin-top:12px;font-size:12px}.bottom-link a{color:var(--primary);text-decoration:none}.bottom-link a:hover{text-decoration:underline}.btn[disabled]{opacity:.6;cursor:not-allowed;box-shadow:none;transform:none}