:root{--bg:#05070d;--bg2:#080b14;--panel:#0d111c;--panel2:#101827;--card:#0f1522;--line:#20283a;--text:#f4f7fb;--muted:#9fb0c5;--violet:#7c3cff;--violet2:#bf4cff;--green:#22e06f;--red:#ff4d5e;--yellow:#ffb020;--cyan:#44d7ff;--shadow:0 22px 55px rgba(0,0,0,.38);--glow:0 0 28px rgba(124,60,255,.28)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at 20% -10%,rgba(124,60,255,.26),transparent 35%),radial-gradient(circle at 90% 20%,rgba(34,224,111,.12),transparent 28%),var(--bg);color:var(--text)}a{text-decoration:none;color:inherit}.app-shell{display:flex;min-height:100vh}.sidebar{width:282px;background:linear-gradient(180deg,#070911,#080b15 68%,#100824);border-right:1px solid rgba(255,255,255,.08);padding:22px 18px;position:fixed;inset:0 auto 0 0;overflow:auto}.main{margin-left:282px;width:calc(100% - 282px);padding:28px}.brand{display:flex;align-items:center;gap:13px;margin-bottom:24px}.brand-mark,.login-logo{width:48px;height:48px;border-radius:15px;background:linear-gradient(135deg,var(--violet),var(--green));display:grid;place-items:center;font-weight:1000;font-size:25px;box-shadow:0 0 32px rgba(124,60,255,.55)}.brand strong{font-size:18px}.brand em{font-style:normal;color:var(--violet2)}.brand span,.user-card span{display:block;font-size:12px;color:var(--muted);margin-top:2px}.user-card{background:linear-gradient(135deg,rgba(124,60,255,.16),rgba(34,224,111,.06));border:1px solid rgba(255,255,255,.09);border-radius:18px;padding:15px;margin-bottom:18px}.nav{display:flex;flex-direction:column;gap:6px}.nav a{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:14px;color:#cbd6e6;font-weight:700}.nav a span{width:22px;text-align:center;color:#d8d4ff}.nav a.active,.nav a:hover{background:linear-gradient(135deg,rgba(124,60,255,.95),rgba(91,29,190,.9));color:#fff;box-shadow:var(--glow)}.nav a.logout{margin-top:8px;color:#ffd5d5}.side-promo{margin-top:22px;padding:18px;border-radius:20px;background:radial-gradient(circle at 90% 10%,rgba(124,60,255,.45),transparent 35%),linear-gradient(135deg,rgba(124,60,255,.18),rgba(34,224,111,.05));border:1px solid rgba(124,60,255,.45);box-shadow:var(--glow)}.side-promo p{color:var(--muted);font-size:13px;line-height:1.5}.rocket{font-size:28px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;border-bottom:1px solid rgba(255,255,255,.07);padding-bottom:18px}.topbar h1{margin:0;font-size:28px}.topbar p{margin:4px 0 0;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:12px}.search{min-width:320px;background:rgba(12,16,27,.92);border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:12px 14px;color:#9fb0c5}.search span{float:right;color:#d6def0}.chip,.avatar{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:9px 12px}.avatar{width:42px;height:42px;display:grid;place-items:center;background:linear-gradient(135deg,var(--violet),var(--green));font-weight:900}.grid{display:grid;gap:16px}.cols-4{grid-template-columns:repeat(4,1fr)}.cols-3{grid-template-columns:repeat(3,1fr)}.cols-2{grid-template-columns:repeat(2,1fr)}.cols-5{grid-template-columns:repeat(5,1fr)}.card{background:linear-gradient(180deg,rgba(17,24,39,.88),rgba(10,14,23,.96));border:1px solid rgba(255,255,255,.09);border-radius:20px;padding:20px;box-shadow:var(--shadow);position:relative;overflow:hidden}.card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(124,60,255,.08),transparent 45%,rgba(34,224,111,.05));pointer-events:none}.metric{min-height:135px}.metric .icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(124,60,255,.22);border:1px solid rgba(124,60,255,.45);box-shadow:0 0 18px rgba(124,60,255,.35);margin-bottom:12px}.metric.green .icon{background:rgba(34,224,111,.18);border-color:rgba(34,224,111,.45);box-shadow:0 0 18px rgba(34,224,111,.18)}.metric span{color:var(--muted);font-size:13px}.metric strong{display:block;font-size:28px;margin:8px 0 5px}.up{color:var(--green);font-size:13px;font-weight:800}.muted{color:var(--muted)}.btn,button{border:0;border-radius:12px;padding:11px 16px;background:linear-gradient(135deg,var(--violet),var(--violet2));color:white;font-weight:900;cursor:pointer;box-shadow:var(--glow)}.btn.secondary{background:rgba(255,255,255,.08);box-shadow:none;border:1px solid rgba(255,255,255,.12)}.btn.green{background:linear-gradient(135deg,#16c35c,#22e06f);box-shadow:0 0 20px rgba(34,224,111,.22)}.btn.red{background:linear-gradient(135deg,#d93045,#ff4d5e)}.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.form-row{display:grid;gap:10px;margin-bottom:14px}.form-row.cols-2{grid-template-columns:1fr 1fr}.form-row.cols-3{grid-template-columns:1fr 1fr 1fr}label{font-size:13px;color:#dbe4f5;font-weight:800}input,select,textarea{width:100%;padding:12px;background:#080d16;color:var(--text);border:1px solid rgba(255,255,255,.12);border-radius:12px}table{width:100%;border-collapse:collapse}th,td{padding:13px 10px;border-bottom:1px solid rgba(255,255,255,.07);font-size:14px;text-align:left}th{color:#aebcca;font-size:12px;text-transform:uppercase}.badge{display:inline-block;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:800;background:rgba(124,60,255,.22);color:#d8c4ff}.badge.green{background:rgba(34,224,111,.16);color:#9dffbd}.badge.yellow{background:rgba(255,176,32,.16);color:#ffd891}.badge.red{background:rgba(255,77,94,.16);color:#ffb5bd}.progress{height:8px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--violet),var(--green))}.chart-line{height:220px;border-radius:18px;background:linear-gradient(to bottom,transparent 0 42%,rgba(255,255,255,.06) 43%),linear-gradient(135deg,transparent 40%,rgba(124,60,255,.18));clip-path:polygon(0 76%,12% 62%,24% 66%,36% 44%,48% 50%,60% 36%,72% 42%,84% 18%,100% 10%)}.chart-bars{height:220px;display:flex;align-items:end;gap:18px;padding:20px;border-radius:18px;background:rgba(255,255,255,.035)}.bar{flex:1;border-radius:10px 10px 0 0;background:linear-gradient(180deg,var(--green),#0a763a);box-shadow:0 0 20px rgba(34,224,111,.2)}.donut{width:170px;height:170px;border-radius:50%;background:conic-gradient(var(--green) 0 72%,var(--violet) 72% 88%,var(--yellow) 88% 97%,#475569 97%);display:grid;place-items:center;margin:auto}.donut:after{content:"72%";width:98px;height:98px;background:#0b101a;border-radius:50%;display:grid;place-items:center;font-size:25px;font-weight:900}.login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 20% 20%,rgba(124,60,255,.34),transparent 30%),radial-gradient(circle at 80% 10%,rgba(34,224,111,.16),transparent 30%),var(--bg)}.login-card{width:min(460px,94vw);background:linear-gradient(180deg,rgba(17,24,39,.94),rgba(10,14,23,.98));border:1px solid rgba(255,255,255,.12);border-radius:28px;padding:30px;box-shadow:var(--shadow)}.login-card h1{font-size:28px;margin:18px 0 10px}.alert{padding:12px 14px;border-radius:12px;margin:12px 0}.alert.success{background:rgba(34,224,111,.12);border:1px solid rgba(34,224,111,.35);color:#b9ffd0}.alert.danger{background:rgba(255,77,94,.12);border:1px solid rgba(255,77,94,.35);color:#ffc0c6}.timer{font-size:34px;font-weight:1000;margin:12px 0}.activity-item{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.06)}.activity-icon{width:38px;height:38px;border-radius:13px;background:rgba(124,60,255,.22);display:grid;place-items:center}.footer-note{margin-top:18px;color:var(--muted);font-size:12px}@media(max-width:1100px){.sidebar{position:static;width:100%}.app-shell{display:block}.main{margin-left:0;width:100%;padding:18px}.cols-5,.cols-4,.cols-3{grid-template-columns:repeat(2,1fr)}.search{min-width:0}.topbar{align-items:flex-start;flex-direction:column}.top-actions{width:100%;justify-content:space-between}}@media(max-width:720px){.cols-5,.cols-4,.cols-3,.cols-2,.form-row.cols-2,.form-row.cols-3{grid-template-columns:1fr}.top-actions{flex-direction:column;align-items:stretch}.card{border-radius:18px}.table-wrap{overflow:auto}}
.progress-chart{height:220px;display:flex;align-items:end;gap:10px;padding:18px 8px 4px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.06);overflow:auto}.progress-point{min-width:48px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px}.progress-stick{width:18px;min-height:8px;border-radius:12px 12px 4px 4px;background:linear-gradient(180deg,var(--green),var(--violet));box-shadow:0 0 18px rgba(34,224,111,.22)}.progress-point small{font-size:10px;color:var(--muted);white-space:nowrap}.progress-point em{font-size:11px;color:var(--green);font-style:normal;font-weight:800}.table-wrap table td strong{line-height:1.35}.badge.red{background:rgba(255,77,94,.16);color:#ffb5bd}.badge.yellow{background:rgba(255,176,32,.16);color:#ffd891}
.clickable-card{display:block;transition:.18s transform ease,.18s border-color ease}.clickable-card:hover{transform:translateY(-2px);border-color:rgba(255,77,94,.45);box-shadow:0 0 24px rgba(255,77,94,.16),var(--shadow)}