:root {
  --bg: #05070f; --bg2: #0b1020; --card: rgba(255,255,255,.075); --border: rgba(255,255,255,.14);
  --text: #eff6ff; --muted: #9fb3c8; --cyan: #22d3ee; --blue:#3b82f6; --purple:#8b5cf6; --pink:#ec4899;
  --shadow: 0 24px 80px rgba(0,0,0,.35);
}
[data-theme="light"] { --bg:#eef5ff; --bg2:#ffffff; --card:rgba(255,255,255,.72); --border:rgba(15,23,42,.13); --text:#07111f; --muted:#526070; --shadow:0 20px 60px rgba(30,64,175,.12); }
*{box-sizing:border-box} html{scroll-behavior:smooth} body{font-family:'Inter','Poppins',sans-serif;background:radial-gradient(circle at top left,rgba(59,130,246,.22),transparent 35%),radial-gradient(circle at top right,rgba(139,92,246,.25),transparent 32%),var(--bg);color:var(--text);overflow-x:hidden}.muted{color:var(--muted)}.text-cyan{color:var(--cyan)!important}.scroll-progress{height:3px;background:linear-gradient(90deg,var(--cyan),var(--purple),var(--pink));position:fixed;top:0;left:0;z-index:9999;width:0}.navbar{backdrop-filter:blur(18px);background:rgba(5,7,15,.72)!important;border-bottom:1px solid var(--border)}[data-theme="light"] .navbar{background:rgba(255,255,255,.7)!important}.navbar-brand,.nav-link{color:var(--text)!important}.nav-link{opacity:.82}.nav-link:hover{opacity:1;color:var(--cyan)!important}.hero{min-height:100vh;display:flex;align-items:center;position:relative;padding-top:90px}.hero h1{font-size:clamp(2.5rem,6vw,5.8rem);font-weight:900;line-height:.96;letter-spacing:-.06em}.gradient-text{background:linear-gradient(90deg,var(--cyan),var(--blue),var(--purple));-webkit-background-clip:text;color:transparent}.glass-card{background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.045));border:1px solid var(--border);box-shadow:var(--shadow);backdrop-filter:blur(22px);border-radius:28px;padding:28px;transition:.35s ease}.glass-card:hover{border-color:rgba(34,211,238,.38);box-shadow:0 28px 90px rgba(34,211,238,.13);transform:translateY(-5px)}.btn-neon{border:1px solid rgba(34,211,238,.55);background:linear-gradient(135deg,rgba(34,211,238,.18),rgba(139,92,246,.2));color:var(--text);border-radius:999px;padding:.78rem 1.2rem;box-shadow:0 0 28px rgba(34,211,238,.16)}.btn-neon:hover{color:white;transform:translateY(-2px);box-shadow:0 0 38px rgba(34,211,238,.32)}.btn-ghost{border:1px solid var(--border);color:var(--text);border-radius:999px;padding:.78rem 1.2rem}.btn-ghost:hover{background:var(--card);color:var(--cyan)}.float-shape{position:absolute;border-radius:999px;filter:blur(.2px);opacity:.55}.shape-1{width:180px;height:180px;background:linear-gradient(var(--cyan),transparent);right:8%;top:16%}.shape-2{width:90px;height:90px;background:linear-gradient(var(--purple),transparent);left:8%;bottom:18%}.shape-3{width:130px;height:130px;border:1px solid var(--cyan);right:36%;bottom:12%}.hero-card{min-height:180px}.stat{font-size:2rem;font-weight:800}.section{padding:90px 0}.section-title{font-weight:850;letter-spacing:-.035em;font-size:clamp(2rem,4vw,3.5rem)}.icon-glow{font-size:2.2rem;color:var(--cyan);filter:drop-shadow(0 0 15px rgba(34,211,238,.65))}.service-card h3,.course-card h3,.blog-card h3{font-size:1.3rem;font-weight:800;margin-top:18px}.tag{display:inline-flex;padding:.35rem .72rem;border-radius:999px;background:rgba(34,211,238,.12);color:var(--cyan);border:1px solid rgba(34,211,238,.25);font-size:.78rem;margin-bottom:12px}.course-thumb{height:170px;border-radius:22px;background:linear-gradient(135deg,rgba(34,211,238,.18),rgba(139,92,246,.25)),radial-gradient(circle at 70% 20%,rgba(236,72,153,.3),transparent 30%);display:grid;place-items:center;margin-bottom:20px}.course-thumb i{font-size:3.3rem;color:white}.progress{height:8px;background:rgba(255,255,255,.1);border-radius:999px}.progress-bar{background:linear-gradient(90deg,var(--cyan),var(--purple));border-radius:999px}.dashboard-shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.sidebar{background:rgba(5,7,15,.8);border-right:1px solid var(--border);padding:24px;position:sticky;top:0;height:100vh}.sidebar a{display:flex;gap:12px;color:var(--muted);padding:12px 14px;border-radius:16px;text-decoration:none;margin-bottom:8px}.sidebar a:hover,.sidebar a.active{background:var(--card);color:var(--cyan)}.dash-main{padding:28px}.stat-mini{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:22px}.stat-mini b{font-size:2rem;display:block}.learning-layout{display:grid;grid-template-columns:310px 1fr;gap:24px}.lesson-list button{width:100%;text-align:left;background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:14px;padding:12px;margin-bottom:10px}.lesson-list button:hover{color:var(--cyan);background:var(--card)}.video-player{aspect-ratio:16/9;border-radius:28px;background:radial-gradient(circle,rgba(34,211,238,.2),rgba(139,92,246,.2),rgba(0,0,0,.55));display:grid;place-items:center}.footer{border-top:1px solid var(--border);padding:55px 0;background:rgba(0,0,0,.18)}.form-control,.form-select{background:rgba(255,255,255,.07);border:1px solid var(--border);color:var(--text);border-radius:16px;padding:.85rem 1rem}.form-control:focus{background:rgba(255,255,255,.09);color:var(--text);border-color:var(--cyan);box-shadow:0 0 0 .25rem rgba(34,211,238,.12)}.toast-holder{position:fixed;right:18px;bottom:18px;z-index:9999;display:grid;gap:10px}.app-toast{display:flex;gap:18px;align-items:center;justify-content:space-between;background:#081122;border:1px solid var(--border);color:white;border-radius:16px;padding:14px 16px;min-width:280px;box-shadow:var(--shadow)}.app-toast-success{border-color:rgba(34,197,94,.5)}.app-toast-danger{border-color:rgba(239,68,68,.55)}.app-toast button{background:transparent;border:0;color:white;font-size:1.2rem}.skeleton{position:relative;overflow:hidden;background:rgba(255,255,255,.07)}.skeleton::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);animation:shine 1.4s infinite}@keyframes shine{to{transform:translateX(100%)}}@media(max-width:991px){.dashboard-shell,.learning-layout{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.hero{padding-top:120px}.navbar-collapse{background:rgba(5,7,15,.94);border:1px solid var(--border);border-radius:20px;padding:16px;margin-top:12px}}


/* Advanced LMS course player upgrade */
.sticky-side{position:sticky;top:100px;max-height:calc(100vh - 120px);overflow:auto}.unit-list{display:grid;gap:.75rem}.unit-list-item{width:100%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.045);border-radius:18px;color:var(--text);padding:1rem;text-align:left;display:flex;gap:.85rem;transition:.25s}.unit-list-item:hover,.unit-list-item.active{border-color:rgba(0,229,255,.8);box-shadow:0 0 24px rgba(0,229,255,.18);transform:translateY(-2px)}.unit-list-item span{height:36px;width:36px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(0,229,255,.22),rgba(124,58,237,.22));color:#67e8f9}.unit-list-item small{display:block;color:var(--muted);margin-top:.25rem}.video-shell{border-radius:22px;overflow:hidden;background:#050816;border:1px solid rgba(255,255,255,.1)}.notes-viewer{line-height:1.8;color:var(--text)}.notes-viewer h3,.notes-viewer h4{margin-top:1.35rem;color:#fff}.notes-viewer li{margin:.35rem 0}.mini-card{border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.04);padding:1rem;margin:.75rem 0}.neon-progress{height:10px;background:rgba(255,255,255,.08);border-radius:99px}.neon-progress .progress-bar{background:linear-gradient(90deg,#06b6d4,#7c3aed)}

.feature-list{list-style:none;padding-left:0;margin:0}.feature-list li{padding:.55rem 0;border-bottom:1px solid rgba(255,255,255,.08)}.article-content p{font-size:1.05rem;line-height:1.9}.auth-hidden{display:none!important}

/* Pro student portal upgrade */
.student-pro-shell .glass-card:hover{transform:none}.student-main{max-width:1500px}.download-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.portal-section{animation:fadePortal .22s ease}.stat-mini i{float:right;font-size:1.35rem;color:var(--cyan);opacity:.85}.student-sidebar .badge{border-radius:999px}.alert-secondary{background:rgba(255,255,255,.075);color:var(--text)}.alert-warning{background:rgba(245,158,11,.12);color:#fef3c7}.border-info{border-color:rgba(34,211,238,.55)!important}@keyframes fadePortal{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}@media(max-width:768px){.download-row{align-items:flex-start;flex-direction:column}.student-main{padding:18px}.glass-card{padding:20px}}

.student-id-card{border:1px solid rgba(255,255,255,.18);border-radius:24px;padding:28px;text-align:center;background:linear-gradient(135deg,rgba(0,245,255,.16),rgba(124,58,237,.14));box-shadow:0 20px 50px rgba(0,0,0,.25)}
.student-id-card .id-logo{width:78px;height:78px;border-radius:22px;margin:0 auto 14px;display:grid;place-items:center;font-weight:900;font-size:28px;background:rgba(255,255,255,.12)}
.admin-pro-shell .table{--bs-table-bg:transparent}.admin-pro-shell select.form-control{background:#101827;color:#e8f3ff;border-color:rgba(255,255,255,.16)}

.tutor-pro-shell .sidebar{border-right:1px solid rgba(34,211,238,.25)}
.student-id-card{background:linear-gradient(135deg,rgba(34,211,238,.15),rgba(124,58,237,.16));border:1px solid rgba(255,255,255,.15);border-radius:22px;padding:26px;text-align:center;min-height:220px}.id-logo{font-size:38px;font-weight:900;letter-spacing:2px}.text-cyan{color:#22d3ee!important}.toast-holder{position:fixed;right:20px;bottom:20px;z-index:9999}


/* Super multi-role login cards */
.portal-role-card{width:100%;min-height:150px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:inherit;border-radius:22px;padding:18px;text-align:left;display:flex;flex-direction:column;gap:8px;transition:.25s ease;box-shadow:0 10px 30px rgba(0,0,0,.12)}
.portal-role-card i{font-size:30px;color:#44d9ff}.portal-role-card b{font-size:1rem}.portal-role-card span{font-size:.86rem;color:#9fb3c8}.portal-role-card:hover,.portal-role-card.active{transform:translateY(-4px);border-color:#44d9ff;background:linear-gradient(135deg,rgba(68,217,255,.20),rgba(124,92,255,.18));box-shadow:0 16px 42px rgba(68,217,255,.18)}