/* ═══════════════════════════════════════════
   AbiLearn — Premium CBSE Class 10 Platform
   ═══════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&display=swap');

/* ── VARIABLES ── */
:root {
  --purple-900: #2E1065;
  --purple-800: #3B0764;
  --purple-700: #5B21B6;
  --purple-600: #7C3AED;
  --purple-500: #8B5CF6;
  --purple-400: #A78BFA;
  --purple-300: #C4B5FD;
  --purple-100: #EDE9FE;
  --purple-50:  #F5F3FF;
  --neon:       #A78BFA;
  --maths:      #EF4444;
  --maths-l:    #FEF2F2;
  --science:    #0EA5E9;
  --science-l:  #F0F9FF;
  --english:    #F59E0B;
  --english-l:  #FFFBEB;
  --social:     #10B981;
  --social-l:   #ECFDF5;
  --dark:       #0F0A1E;
  --text:       #1E1B4B;
  --muted:      #6B7280;
  --border:     #E5E7EB;
  --bg:         #F8F7FF;
  --white:      #FFFFFF;
  --card-bg:    #FFFFFF;
  --shadow-sm:  0 1px 3px rgba(91,33,182,0.08), 0 1px 2px rgba(0,0,0,0.04);
  --shadow:     0 4px 16px rgba(91,33,182,0.12), 0 2px 4px rgba(0,0,0,0.06);
  --shadow-lg:  0 10px 40px rgba(91,33,182,0.18), 0 4px 12px rgba(0,0,0,0.08);
  --shadow-glow:0 0 24px rgba(139,92,246,0.35);
  --radius-sm:  8px;
  --radius:     14px;
  --radius-lg:  20px;
  --radius-xl:  28px;
  --ease:       cubic-bezier(0.4,0,0.2,1);
  --transition: all 0.25s var(--ease);
}

/* ── RESET ── */
*,*::before,*::after { margin:0;padding:0;box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:'Poppins',system-ui,sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.65;
  min-height:100vh;
  font-size:15px;
}
a { text-decoration:none; }
img { display:block;max-width:100%; }
button { font-family:inherit;cursor:pointer; }

/* ══════════════════════════════════════════
   NAVBAR — Glassmorphism Premium
══════════════════════════════════════════ */
.navbar {
  height:72px;
  background:#FFFFFF;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 2rem;
  position:sticky;
  top:0;
  transition:transform 0.3s ease;
  z-index:1000;
  box-shadow:0 2px 16px rgba(91,33,182,0.08);
}

/* Logo */
.logo { display:flex;align-items:center;gap:0.6rem; }
.logo-img { width:40px;height:40px;object-fit:contain; }
.logo-text {
  font-size:1.35rem;
  font-weight:800;
  color:var(--text);
  letter-spacing:-0.5px;
}
.logo-text span { color:var(--purple-600); }

/* Nav links */
.nav-links { display:flex;gap:0.25rem;list-style:none;align-items:center; }
.nav-links > li { position:relative; }
.nav-links a {
  color:var(--muted);
  padding:0.5rem 0.9rem;
  border-radius:var(--radius-sm);
  font-size:0.88rem;
  font-weight:500;
  transition:var(--transition);
  display:flex;
  align-items:center;
  gap:0.3rem;
}
.nav-links a:hover {
  color:var(--purple-700);
  background:var(--purple-50);
}
.nav-links a.active {
  color:var(--purple-700);
  background:var(--purple-100);
  font-weight:600;
}

/* Dropdown */
.nav-dropdown { position:relative; }
.nav-dropdown-toggle {
  background:none;border:none;
  color:var(--muted);
  padding:0.5rem 0.9rem;
  border-radius:var(--radius-sm);
  font-size:0.88rem;
  font-weight:500;
  display:flex;align-items:center;gap:0.35rem;
  transition:var(--transition);
  cursor:pointer;
  font-family:inherit;
}
.nav-dropdown-toggle:hover,.nav-dropdown:hover .nav-dropdown-toggle {
  color:var(--purple-700);
  background:var(--purple-50);
}
.dropdown-arrow { font-size:0.65rem;transition:transform 0.25s; }
.nav-dropdown:hover .dropdown-arrow { transform:rotate(180deg); }

.dropdown-menu {
  position:absolute;
  top:calc(100% + 8px);
  left:50%;
  transform:translateX(-50%) translateY(-8px);
  background:rgba(20,12,40,0.96);
  backdrop-filter:blur(24px);
  border:1px solid rgba(167,139,250,0.2);
  border-radius:var(--radius);
  min-width:200px;
  padding:0.5rem;
  opacity:0;
  pointer-events:none;
  transition:all 0.2s var(--ease);
  box-shadow:var(--shadow-lg);
  z-index:200;
}
.nav-dropdown:hover .dropdown-menu {
  opacity:1;
  pointer-events:all;
  transform:translateX(-50%) translateY(0);
}
.nav-dropdown.dd-open .dropdown-menu {
  opacity:1;
  pointer-events:all;
  transform:translateX(-50%) translateY(0);
}
.dropdown-menu a {
  display:flex;align-items:center;gap:0.65rem;
  padding:0.65rem 1rem;
  border-radius:var(--radius-sm);
  color:rgba(255,255,255,0.8);
  font-size:0.88rem;
  transition:var(--transition);
}
.dropdown-menu a:hover { background:rgba(167,139,250,0.2);color:white; }
.dropdown-menu .sub-icon {
  width:28px;height:28px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:0.9rem;flex-shrink:0;
}
.sub-icon.maths { background:#FEF2F2; }
.sub-icon.science { background:#F0F9FF; }
.sub-icon.english { background:#FFFBEB; }
.sub-icon.social { background:#ECFDF5; }

/* Nav right */
.nav-right { display:flex;align-items:center;gap:0.75rem; }

.search-bar { position:relative; }
.search-bar input {
  background:var(--bg);
  border:1px solid var(--border);
  color:var(--text);
  padding:0.48rem 1rem 0.48rem 2.2rem;
  border-radius:50px;
  font-size:0.83rem;
  width:200px;
  transition:var(--transition);
  outline:none;
  font-family:inherit;
}
.search-bar input::placeholder { color:var(--muted); }
.search-bar input:focus {
  width:240px;
  background:white;
  border-color:var(--purple-400);
  box-shadow:0 0 0 3px rgba(167,139,250,0.15);
}
.search-icon { position:absolute;left:0.7rem;top:50%;transform:translateY(-50%);font-size:0.8rem;pointer-events:none; }
.search-results {
  position:absolute;top:calc(100% + 8px);left:0;right:0;
  background:rgba(20,12,40,0.97);
  backdrop-filter:blur(20px);
  border:1px solid rgba(167,139,250,0.2);
  border-radius:var(--radius);
  max-height:280px;overflow-y:auto;
  display:none;z-index:200;
  box-shadow:var(--shadow-lg);
}
.search-results.show { display:block; }
.search-result-item {
  padding:0.7rem 1rem;cursor:pointer;
  border-bottom:1px solid rgba(255,255,255,0.05);
  transition:var(--transition);
}
.search-result-item:last-child { border-bottom:none; }
.search-result-item:hover { background:rgba(167,139,250,0.15); }
.result-subject { font-size:0.68rem;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;color:var(--purple-400);margin-bottom:0.1rem; }
.result-title { font-size:0.85rem;color:rgba(255,255,255,0.85);font-weight:500; }

/* Login / Signup */
.btn-login {
  background:transparent;
  border:1px solid var(--border);
  color:var(--text);
  padding:0.45rem 1.1rem;
  border-radius:50px;
  font-size:0.83rem;
  font-weight:600;
  transition:var(--transition);
}
.btn-login:hover { border-color:var(--purple-400);color:var(--purple-700);background:var(--purple-50); }

.btn-signup {
  background:linear-gradient(135deg,var(--purple-600),var(--purple-500));
  border:none;
  color:white;
  padding:0.48rem 1.25rem;
  border-radius:50px;
  font-size:0.83rem;
  font-weight:700;
  transition:var(--transition);
  box-shadow:0 2px 12px rgba(124,58,237,0.4);
}
.btn-signup:hover { transform:translateY(-1px);box-shadow:0 4px 20px rgba(124,58,237,0.5); }

/* Hamburger */
.hamburger {
  display:none;background:none;border:none;
  padding:0.4rem;flex-direction:column;gap:5px;cursor:pointer;
  flex-shrink:0;
}
.hamburger span { display:block;width:22px;height:2px;background:var(--text);border-radius:2px;transition:0.25s ease; }
.hamburger.open span:nth-child(1) { transform:rotate(45deg) translate(4px,4px); }
.hamburger.open span:nth-child(2) { opacity:0;transform:scaleX(0); }
.hamburger.open span:nth-child(3) { transform:rotate(-45deg) translate(4px,-4px); }

/* Mobile slide-down menu */
.mobile-menu {
  display:none;position:fixed;inset:0;top:54px;z-index:998;
  background:rgba(0,0,0,0.45);backdrop-filter:blur(4px);
}
.mobile-menu.open { display:block; }
.mobile-menu-inner {
  background:white;max-width:300px;width:85%;height:100%;
  padding:1.25rem 1rem;overflow-y:auto;
  display:flex;flex-direction:column;gap:0.25rem;
  animation:mmSlideIn 0.22s ease;
}
@keyframes mmSlideIn { from{transform:translateX(-100%)} to{transform:translateX(0)} }
.mobile-nav-link {
  display:flex;align-items:center;gap:0.65rem;
  padding:0.85rem 1rem;font-size:0.92rem;font-weight:600;color:var(--text);
  text-decoration:none;border-radius:10px;border:none;
  background:none;width:100%;text-align:left;cursor:pointer;font-family:inherit;
  transition:background 0.15s;
}
.mobile-nav-link:hover { background:var(--surface); }
.mobile-sub-link { padding-left:2.5rem;font-size:0.85rem;font-weight:500;color:var(--muted); }
.mobile-nav-section {
  font-size:0.68rem;font-weight:700;color:var(--muted);text-transform:uppercase;
  letter-spacing:0.07em;padding:0.85rem 1rem 0.2rem;
}
.mobile-menu-actions {
  margin-top:auto;padding-top:1rem;
  border-top:1px solid var(--border);
  display:flex;flex-direction:column;gap:0.5rem;
}
.mobile-menu-actions .btn-login,
.mobile-menu-actions .btn-signup { width:100%;justify-content:center;text-align:center; }

/* ══════════════════════════════════════════
   HERO — Split Layout with Blobs
══════════════════════════════════════════ */
.hero {
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#0F0A1E 0%,#1E1040 50%,#0F0A1E 100%);
  padding:5rem 2rem 4rem;
  min-height:580px;
  display:flex;
  align-items:center;
}

/* Animated Blobs */
.hero-blobs { position:absolute;inset:0;pointer-events:none;overflow:hidden; }
.blob {
  position:absolute;border-radius:50%;
  filter:blur(80px);
  animation:blobFloat 8s ease-in-out infinite;
}
.blob-1 {
  width:500px;height:500px;
  background:radial-gradient(circle,rgba(124,58,237,0.35),transparent 70%);
  top:-150px;left:-100px;
  animation-delay:0s;
}
.blob-2 {
  width:400px;height:400px;
  background:radial-gradient(circle,rgba(167,139,250,0.25),transparent 70%);
  top:50px;right:200px;
  animation-delay:-3s;
}
.blob-3 {
  width:350px;height:350px;
  background:radial-gradient(circle,rgba(91,33,182,0.3),transparent 70%);
  bottom:-100px;right:-50px;
  animation-delay:-6s;
}
@keyframes blobFloat {
  0%,100% { transform:translate(0,0) scale(1); }
  33% { transform:translate(20px,-20px) scale(1.05); }
  66% { transform:translate(-15px,15px) scale(0.95); }
}

.hero-grid {
  max-width:1200px;margin:0 auto;width:100%;
  display:grid;grid-template-columns:1fr 1fr;
  gap:3rem;align-items:center;position:relative;z-index:1;
}

.hero-badge {
  display:inline-flex;align-items:center;gap:0.5rem;
  background:rgba(167,139,250,0.15);
  border:1px solid rgba(167,139,250,0.3);
  color:var(--purple-300);
  padding:0.35rem 1rem;border-radius:50px;
  font-size:0.8rem;font-weight:600;
  margin-bottom:1.25rem;
  width:fit-content;
}

.hero h1 {
  font-size:3rem;font-weight:800;line-height:1.15;
  color:white;margin-bottom:1.2rem;
  letter-spacing:-1px;
}
.hero h1 .highlight {
  background:linear-gradient(135deg,var(--purple-400),#F59E0B);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
}

.hero p {
  font-size:1rem;color:rgba(255,255,255,0.7);
  max-width:480px;margin-bottom:2rem;line-height:1.7;
}

.hero-cta { display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2rem; }

/* Hero right — mockup */
.hero-right { display:flex;justify-content:center;align-items:center; }

.mockup-card {
  background:rgba(255,255,255,0.06);
  backdrop-filter:blur(24px);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:var(--radius-xl);
  padding:1.5rem;
  width:100%;max-width:380px;
  box-shadow:0 20px 60px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.1);
  animation:mockupFloat 5s ease-in-out infinite;
}
@keyframes mockupFloat {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-10px); }
}
.mockup-header {
  display:flex;align-items:center;gap:0.6rem;
  margin-bottom:1rem;padding-bottom:0.75rem;
  border-bottom:1px solid rgba(255,255,255,0.1);
}
.mockup-avatar {
  width:34px;height:34px;border-radius:50%;
  background:linear-gradient(135deg,var(--purple-600),var(--purple-400));
  display:flex;align-items:center;justify-content:center;
  font-size:1rem;
}
.mockup-name { font-size:0.85rem;font-weight:700;color:white; }
.mockup-status { font-size:0.72rem;color:var(--purple-300); }
.online-dot { display:inline-block;width:7px;height:7px;background:#10B981;border-radius:50%;margin-right:4px; }

.mockup-msg {
  background:rgba(167,139,250,0.15);
  border-radius:12px 12px 12px 4px;
  padding:0.75rem 1rem;
  font-size:0.8rem;color:rgba(255,255,255,0.85);
  line-height:1.5;margin-bottom:0.75rem;
}
.mockup-msg strong { color:var(--purple-300); }

.mockup-chips { display:flex;gap:0.4rem;flex-wrap:wrap;margin-bottom:0.75rem; }
.mockup-chip {
  background:rgba(124,58,237,0.25);
  border:1px solid rgba(167,139,250,0.3);
  color:var(--purple-300);
  padding:0.25rem 0.7rem;
  border-radius:50px;font-size:0.72rem;font-weight:600;
  cursor:pointer;transition:var(--transition);
}
.mockup-chip:hover { background:rgba(124,58,237,0.4); }

.mockup-user-msg {
  background:linear-gradient(135deg,var(--purple-600),var(--purple-500));
  border-radius:12px 12px 4px 12px;
  padding:0.65rem 1rem;
  font-size:0.8rem;color:white;
  margin-left:auto;max-width:80%;
  line-height:1.5;margin-bottom:0.5rem;
}
.mockup-typing {
  display:flex;align-items:center;gap:0.35rem;
  padding:0.5rem 0.75rem;
  background:rgba(167,139,250,0.12);
  border-radius:12px 12px 12px 4px;
  width:fit-content;
}
.typing-dot { width:6px;height:6px;background:var(--purple-400);border-radius:50%;animation:td 1.4s infinite; }
.typing-dot:nth-child(2){animation-delay:.2s}
.typing-dot:nth-child(3){animation-delay:.4s}
@keyframes td{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-6px)}}

/* ══════════════════════════════════════════
   STATS STRIP
══════════════════════════════════════════ */
.stats-strip {
  background:white;
  border-bottom:1px solid var(--border);
  padding:1.25rem 2rem;
  display:flex;justify-content:center;gap:3rem;
  flex-wrap:wrap;
}
.stat-item { text-align:center; }
.stat-num { font-size:1.6rem;font-weight:800;color:var(--purple-700);display:block; }
.stat-lbl { font-size:0.75rem;color:var(--muted);font-weight:500;margin-top:0.1rem; }

/* ══════════════════════════════════════════
   CONTAINERS & SECTIONS
══════════════════════════════════════════ */
.container { max-width:1200px;margin:0 auto;padding:0 1.5rem; }
.section { padding:3.5rem 0; }
.section-head { margin-bottom:2rem; }
.section-label {
  font-size:0.75rem;font-weight:700;text-transform:uppercase;
  letter-spacing:1px;color:var(--purple-600);margin-bottom:0.4rem;
}
.section-title {
  font-size:1.55rem;font-weight:800;color:var(--text);letter-spacing:-0.3px;
  padding-left:0.85rem;
  border-left:4px solid var(--purple-500);
  line-height:1.25;
}
.section-sub { color:var(--muted);margin-top:0.4rem;font-size:0.92rem; }

/* ══════════════════════════════════════════
   SUBJECT CARDS — Premium
══════════════════════════════════════════ */
.subjects-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem; }

.subject-card {
  background:var(--card-bg);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
  transition:var(--transition);
  overflow:hidden;
  display:block;
  position:relative;
}
.subject-card::before {
  content:'';position:absolute;inset:0;
  opacity:0;transition:var(--transition);
  border-radius:var(--radius-xl);
}
.subject-card.maths::before { box-shadow:0 0 0 2px var(--maths) inset; }
.subject-card.science::before { box-shadow:0 0 0 2px var(--science) inset; }
.subject-card.english::before { box-shadow:0 0 0 2px var(--english) inset; }
.subject-card.social::before { box-shadow:0 0 0 2px var(--social) inset; }
.subject-card:hover { transform:translateY(-6px);box-shadow:var(--shadow-lg); }
.subject-card:hover::before { opacity:1; }

.card-top { padding:1.75rem 1.75rem 1rem; }
.card-icon-wrap {
  width:56px;height:56px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.75rem;margin-bottom:1rem;
  position:relative;
}
.subject-card.maths .card-icon-wrap { background:var(--maths-l); box-shadow:0 0 18px rgba(239,68,68,0.2); }
.subject-card.science .card-icon-wrap { background:var(--science-l); box-shadow:0 0 18px rgba(14,165,233,0.2); }
.subject-card.english .card-icon-wrap { background:var(--english-l); box-shadow:0 0 18px rgba(245,158,11,0.2); }
.subject-card.social .card-icon-wrap { background:var(--social-l); box-shadow:0 0 18px rgba(16,185,129,0.2); }
.subject-card:hover .card-icon-wrap { transform:scale(1.05); transition:var(--transition); }

.card-title { font-size:1.15rem;font-weight:700;color:var(--text);margin-bottom:0.2rem; }
.card-desc { font-size:0.8rem;color:var(--muted); }

.card-meta {
  padding:0 1.75rem 1rem;
  display:flex;gap:1rem;
}
.meta-pill {
  font-size:0.72rem;font-weight:600;
  padding:0.25rem 0.7rem;border-radius:50px;
  background:var(--purple-50);color:var(--purple-700);
}

.card-progress { padding:0 1.75rem 1rem; }
.progress-row { display:flex;justify-content:space-between;font-size:0.72rem;color:var(--muted);margin-bottom:0.35rem; }
.progress-track { height:5px;background:#F3F4F6;border-radius:3px;overflow:hidden; }
.progress-fill { height:100%;border-radius:3px;transition:width 1.2s var(--ease); }
.subject-card.maths .progress-fill { background:var(--maths); }
.subject-card.science .progress-fill { background:var(--science); }
.subject-card.english .progress-fill { background:var(--english); }
.subject-card.social .progress-fill { background:var(--social); }

.card-footer {
  padding:0.9rem 1.75rem;
  border-top:1px solid #F3F4F6;
  display:flex;justify-content:space-between;align-items:center;
}
.continue-btn {
  background:none;border:none;
  font-size:0.82rem;font-weight:700;
  transition:var(--transition);
  display:flex;align-items:center;gap:0.3rem;
  padding:0.4rem 0.8rem;border-radius:50px;
}
.subject-card.maths .continue-btn { color:var(--maths); }
.subject-card.science .continue-btn { color:var(--science); }
.subject-card.english .continue-btn { color:var(--english); }
.subject-card.social .continue-btn { color:var(--social); }
.subject-card:hover .continue-btn { transform:translateX(4px); }
.card-chapters { font-size:0.75rem;color:var(--muted); }

/* ══════════════════════════════════════════
   TRUST / TESTIMONIALS SECTION
══════════════════════════════════════════ */
.trust-section { background:white;border-top:1px solid var(--border);border-bottom:1px solid var(--border); }
.why-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.25rem; }
.why-card {
  display:flex;align-items:flex-start;gap:1rem;
  background:var(--bg);border:1px solid var(--border);border-radius:12px;
  padding:1.25rem 1.35rem;transition:box-shadow 0.18s,border-color 0.18s;
}
.why-card:hover { box-shadow:0 4px 18px rgba(124,58,237,0.08);border-color:rgba(124,58,237,0.25); }
.why-icon {
  width:42px;height:42px;border-radius:10px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:1.15rem;
}
.why-title { font-size:0.93rem;font-weight:700;color:var(--text);margin-bottom:0.35rem; }
.why-desc { font-size:0.8rem;color:var(--muted);line-height:1.6; }

.cbse-badge {
  display:inline-flex;align-items:center;gap:0.5rem;
  background:linear-gradient(135deg,var(--purple-600),var(--purple-500));
  color:white;padding:0.5rem 1.25rem;
  border-radius:50px;font-size:0.82rem;font-weight:700;
  box-shadow:0 4px 16px rgba(124,58,237,0.3);
}

/* ══════════════════════════════════════════
   BUTTONS
══════════════════════════════════════════ */
.btn {
  display:inline-flex;align-items:center;gap:0.5rem;
  border:none;border-radius:50px;cursor:pointer;
  font-family:inherit;font-weight:700;transition:var(--transition);
  text-decoration:none;
}
.btn-sm { padding:0.45rem 1.1rem;font-size:0.82rem; }
.btn-md { padding:0.65rem 1.5rem;font-size:0.9rem; }
.btn-lg { padding:0.8rem 2rem;font-size:0.95rem; }
.btn-xl { padding:0.9rem 2.4rem;font-size:1rem; }

.btn-primary {
  background:linear-gradient(135deg,var(--purple-700),var(--purple-500));
  color:white;
  box-shadow:0 4px 20px rgba(124,58,237,0.4);
}
.btn-primary:hover { transform:translateY(-2px);box-shadow:0 6px 28px rgba(124,58,237,0.5); }

.btn-glass {
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.2);
  color:white;
  backdrop-filter:blur(10px);
}
.btn-glass:hover { background:rgba(255,255,255,0.18);border-color:rgba(255,255,255,0.35); }

.btn-outline-purple {
  background:transparent;
  border:2px solid var(--purple-600);
  color:var(--purple-600);
}
.btn-outline-purple:hover { background:var(--purple-600);color:white; }

.btn-white {
  background:white;color:var(--purple-700);
}
.btn-white:hover { background:var(--purple-50);transform:translateY(-2px); }

.btn:disabled { opacity:0.45;cursor:not-allowed;transform:none;box-shadow:none; }

/* ══════════════════════════════════════════
   SUBJECT PAGE HEADER
══════════════════════════════════════════ */
.subject-header { padding:2.5rem 2rem;color:white;position:relative;overflow:hidden; }
.subject-header::before {
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 80% 50%,rgba(255,255,255,0.07),transparent 60%);
}
.subject-header.maths { background:linear-gradient(135deg,#BE123C,#EF4444); }
.subject-header.science { background:linear-gradient(135deg,#0369A1,#0EA5E9); }
.subject-header.english { background:linear-gradient(135deg,#B45309,#F59E0B);color:#1A0A00; }
.subject-header.social { background:linear-gradient(135deg,#065F46,#10B981); }

.subject-header-inner {
  max-width:1200px;margin:0 auto;
  display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;
  position:relative;z-index:1;
}
.subject-header-icon {
  width:64px;height:64px;
  background:rgba(255,255,255,0.2);
  border-radius:var(--radius-lg);
  display:flex;align-items:center;justify-content:center;
  font-size:2.2rem;flex-shrink:0;
  border:1px solid rgba(255,255,255,0.25);
}
.subject-breadcrumb {
  font-size:0.8rem;opacity:0.7;
  display:flex;align-items:center;gap:0.4rem;margin-bottom:0.4rem;
}
.subject-breadcrumb a { color:inherit;transition:var(--transition); }
.subject-breadcrumb a:hover { opacity:1; }
.subject-header h1 { font-size:2rem;font-weight:800;letter-spacing:-0.5px; }
.subject-header p { font-size:0.9rem;opacity:0.8;margin-top:0.2rem; }

/* ══════════════════════════════════════════
   TABS — Scrollable, Premium
══════════════════════════════════════════ */
.tabs-bar {
  background:white;
  border-bottom:2px solid var(--border);
  position:sticky;top:72px;z-index:99;
  box-shadow:var(--shadow-sm);
  transition:top 0.3s ease;
}
.tabs-scroll {
  max-width:1200px;margin:0 auto;
  padding:0 1.5rem;
  display:flex;gap:0;
  overflow-x:auto;
  scrollbar-width:none;
}
.tabs-scroll::-webkit-scrollbar { display:none; }

.tab-btn {
  background:none;border:none;
  padding:0.9rem 1.1rem;
  font-size:0.85rem;font-weight:600;
  color:var(--muted);
  cursor:pointer;
  border-bottom:2px solid transparent;
  transition:color 0.2s,border-color 0.2s;
  white-space:nowrap;
  font-family:inherit;
  letter-spacing:0.01em;
}
.tab-btn:hover { color:var(--text); }
.tab-btn.active { color:var(--purple-700);border-bottom-color:var(--purple-600); }
.tab-btn.active.maths-t { color:var(--maths);border-bottom-color:var(--maths); }
.tab-btn.active.science-t { color:var(--science);border-bottom-color:var(--science); }
.tab-btn.active.english-t { color:var(--english);border-bottom-color:var(--english); }
.tab-btn.active.social-t { color:var(--social);border-bottom-color:var(--social); }

.tab-panel { display:none; }
.tab-panel.active { display:block; }

/* ══════════════════════════════════════════
   FORMULA SHEET
══════════════════════════════════════════ */
.formula-sheet { display:flex;flex-direction:column;gap:1.5rem; }
.formula-chapter-block {
  background:white;border-radius:var(--radius-lg);
  padding:1.5rem;box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
}
.formula-chapter-title {
  font-size:1rem;font-weight:700;color:var(--text);
  margin-bottom:1rem;display:flex;align-items:center;gap:0.65rem;
}
.formula-num {
  width:28px;height:28px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:0.75rem;font-weight:800;color:white;flex-shrink:0;
}
.formula-grid { display:flex;flex-direction:column;gap:0.5rem; }
.formula-pill {
  background:linear-gradient(135deg,var(--purple-50),#F8F7FF);
  border-left:3px solid var(--purple-500);
  padding:0.6rem 1rem;
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  font-family:'Courier New',monospace;
  font-size:0.85rem;color:var(--text);
  border-top:1px solid rgba(124,58,237,0.08);
  border-bottom:1px solid rgba(124,58,237,0.08);
  border-right:1px solid rgba(124,58,237,0.08);
}

/* ══════════════════════════════════════════
   IMPORTANT NOTES / KEY POINTS
══════════════════════════════════════════ */
.notes-grid { display:flex;flex-direction:column;gap:1.5rem; }
.notes-block {
  background:white;border-radius:var(--radius-lg);
  padding:1.5rem;box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
}
.notes-chapter-title {
  font-size:0.95rem;font-weight:700;color:var(--text);
  margin-bottom:1rem;display:flex;align-items:center;gap:0.6rem;
}
.notes-list { list-style:none;display:flex;flex-direction:column;gap:0.45rem; }
.notes-list li {
  padding:0.55rem 1rem 0.55rem 1.5rem;
  background:var(--bg);border-radius:var(--radius-sm);
  font-size:0.86rem;line-height:1.6;position:relative;
  border-left:3px solid var(--purple-400);
}

/* ══════════════════════════════════════════
   PRACTICE QUESTIONS / MCQ
══════════════════════════════════════════ */
.mcq-grid { display:flex;flex-direction:column;gap:1.25rem; }
.mcq-card {
  background:white;border-radius:var(--radius-lg);
  padding:1.5rem;box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
}
.mcq-chapter-label {
  font-size:0.72rem;font-weight:700;text-transform:uppercase;
  letter-spacing:0.5px;color:var(--muted);margin-bottom:0.5rem;
}
.mcq-q { font-size:0.93rem;font-weight:600;color:var(--text);margin-bottom:1rem;line-height:1.5; }
.mcq-opts { display:flex;flex-direction:column;gap:0.4rem; }
.mcq-opt {
  padding:0.55rem 1rem;
  border:1.5px solid var(--border);border-radius:var(--radius-sm);
  cursor:pointer;font-size:0.86rem;
  transition:var(--transition);
  background:white;display:flex;align-items:center;gap:0.65rem;
  font-family:inherit;text-align:left;width:100%;
}
.mcq-opt:hover:not(.disabled) { border-color:var(--purple-500);background:var(--purple-50); }
.mcq-opt.correct { border-color:#10B981;background:#ECFDF5;color:#065F46; }
.mcq-opt.wrong { border-color:#EF4444;background:#FEF2F2;color:#991B1B; }
.mcq-opt.disabled { cursor:default;pointer-events:none; }
.opt-letter {
  width:24px;height:24px;border-radius:50%;
  background:#F3F4F6;display:flex;align-items:center;justify-content:center;
  font-size:0.72rem;font-weight:800;flex-shrink:0;
}
.mcq-opt.correct .opt-letter { background:#10B981;color:white; }
.mcq-opt.wrong .opt-letter { background:#EF4444;color:white; }
.mcq-feedback {
  margin-top:0.65rem;padding:0.55rem 0.9rem;
  border-radius:var(--radius-sm);font-size:0.82rem;display:none;font-weight:500;
}
.mcq-feedback.show { display:block; }
.mcq-feedback.correct { background:#ECFDF5;color:#065F46;border:1px solid #10B981; }
.mcq-feedback.wrong { background:#FEF2F2;color:#991B1B;border:1px solid #EF4444; }

/* ══════════════════════════════════════════
   CHAPTER ACCORDION (for English tabs)
══════════════════════════════════════════ */
.chapters-list { display:flex;flex-direction:column;gap:0.85rem; }
.chapter-item {
  background:white;border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);border:1px solid var(--border);overflow:hidden;
  transition:var(--transition);
}
.chapter-item:hover { box-shadow:var(--shadow); }
.chapter-header {
  display:flex;align-items:center;padding:1.15rem 1.5rem;
  cursor:pointer;gap:1rem;transition:var(--transition);
  user-select:none;
}
.chapter-header:hover { background:var(--bg); }
.chapter-num {
  width:34px;height:34px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:0.82rem;color:white;flex-shrink:0;
}
.nm-maths,.nm-ff { background:var(--maths); }
.nm-fp { background:var(--purple-600); }
.nm-science { background:var(--science); }
.nm-english { background:var(--english);color:#333; }
.nm-social { background:var(--social);color:#333; }

.chapter-info { flex:1;min-width:0; }
.chapter-title { font-size:0.92rem;font-weight:700;color:var(--text); }
.chapter-sub { font-size:0.75rem;color:var(--muted);margin-top:0.1rem; }

.chapter-done-btn {
  background:none;border:2px solid var(--border);border-radius:50%;
  width:28px;height:28px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:0.75rem;color:transparent;
  transition:var(--transition);flex-shrink:0;
}
.chapter-done-btn.done { background:#10B981;border-color:#10B981;color:white; }
.chapter-toggle { color:var(--muted);font-size:0.8rem;transition:transform 0.25s;flex-shrink:0; }
.chapter-item.open .chapter-toggle { transform:rotate(180deg); }

.chapter-body {
  max-height:0;overflow:hidden;
  transition:max-height 0.45s var(--ease), padding 0.3s;
  padding:0 1.5rem;
}
.chapter-item.open .chapter-body { max-height:3000px;padding:0 1.5rem 1.5rem; }
.chapter-content { border-top:1px solid var(--border);padding-top:1.25rem; }

.kp-section,.fm-section,.mcq-section { margin-bottom:1.25rem; }
.kp-section h4,.fm-section h4,.mcq-section h4 {
  font-size:0.7rem;text-transform:uppercase;letter-spacing:0.7px;
  color:var(--muted);margin-bottom:0.6rem;font-weight:700;
}
.kp-list { list-style:none;display:flex;flex-direction:column;gap:0.35rem; }
.kp-list li {
  padding:0.5rem 1rem 0.5rem 1.4rem;
  background:var(--bg);border-radius:var(--radius-sm);
  font-size:0.84rem;position:relative;line-height:1.55;
  border-left:2px solid var(--purple-400);
}
.fm-pill {
  background:var(--purple-50);border-left:3px solid var(--purple-500);
  padding:0.55rem 1rem;
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  font-family:'Courier New',monospace;font-size:0.83rem;
  margin-bottom:0.35rem;color:var(--text);
}

/* ══════════════════════════════════════════
   COMING SOON PLACEHOLDER
══════════════════════════════════════════ */
.coming-soon {
  background:white;border-radius:var(--radius-xl);
  padding:4rem 2rem;text-align:center;
  border:2px dashed var(--purple-300);
  box-shadow:var(--shadow-sm);
}
.coming-soon .cs-icon { font-size:3.5rem;margin-bottom:1rem; }
.coming-soon h3 { font-size:1.3rem;font-weight:700;color:var(--text);margin-bottom:0.5rem; }
.coming-soon p { color:var(--muted);font-size:0.9rem;max-width:400px;margin:0 auto 1.25rem; }

/* Most Important Topics */
/* Most Important — chapter-by-chapter */
.mi-chapter-block {
  background:white;border:1px solid var(--border);border-radius:10px;
  overflow:hidden;
}
.mi-chapter-hdr {
  display:flex;align-items:center;gap:0.7rem;
  padding:0.75rem 1rem;
  background:var(--bg);border-bottom:1px solid var(--border);
}
.mi-ch-num {
  width:26px;height:26px;border-radius:7px;
  background:var(--science);color:white;
  display:flex;align-items:center;justify-content:center;
  font-size:0.72rem;font-weight:800;flex-shrink:0;
}
.mi-ch-title { font-size:0.92rem;font-weight:700;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
.mi-items { display:flex;flex-direction:column;gap:0; }
.mi-item {
  display:flex;align-items:flex-start;gap:0.65rem;
  padding:0.75rem 1rem;border-bottom:1px solid var(--border);
  font-size:0.875rem;line-height:1.65;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
.mi-item:last-child { border-bottom:none; }
.mi-tag {
  font-size:0.65rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  padding:0.2rem 0.5rem;border-radius:4px;white-space:nowrap;flex-shrink:0;margin-top:3px;
}
.mi-text { color:var(--text);flex:1; }
.mi-text strong { font-weight:700;color:var(--text); }

/* Legacy topic card (kept for other uses) */
.important-topics { display:flex;flex-direction:column;gap:1rem; }
.topic-card {
  background:white;border-radius:var(--radius-lg);
  padding:1.25rem 1.5rem;
  box-shadow:var(--shadow-sm);border:1px solid var(--border);
  display:flex;align-items:flex-start;gap:1rem;
}
.topic-badge {
  background:linear-gradient(135deg,var(--purple-600),var(--purple-400));
  color:white;border-radius:var(--radius-sm);
  padding:0.3rem 0.65rem;font-size:0.7rem;font-weight:700;
  white-space:nowrap;flex-shrink:0;
}
.topic-text { font-size:0.88rem;color:var(--text);line-height:1.6; }

/* Maps placeholder */
.maps-section {
  background:white;border-radius:var(--radius-xl);
  overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--border);
}
.maps-header {
  background:linear-gradient(135deg,var(--social),#065F46);
  padding:2rem;color:white;text-align:center;
}
.maps-header h3 { font-size:1.5rem;font-weight:800; }
.maps-header p { opacity:0.8;margin-top:0.4rem; }
.maps-list { padding:1.5rem;display:flex;flex-direction:column;gap:0.75rem; }
.map-item {
  padding:1rem 1.25rem;
  border:1px solid var(--border);border-radius:var(--radius);
  display:flex;align-items:center;gap:0.85rem;
  transition:var(--transition);
}
.map-item:hover { background:var(--bg);border-color:var(--social); }
.map-icon { font-size:1.5rem; }
.map-name { font-size:0.9rem;font-weight:600;color:var(--text); }
.map-sub { font-size:0.75rem;color:var(--muted);margin-top:0.1rem; }

/* Summary */
.summary-grid { display:flex;flex-direction:column;gap:0.85rem; }
.summary-card {
  background:white;border-radius:var(--radius-lg);
  padding:1.25rem 1.5rem;
  box-shadow:var(--shadow-sm);border:1px solid var(--border);
}
.summary-card-title {
  font-size:0.92rem;font-weight:700;color:var(--text);
  margin-bottom:0.75rem;display:flex;align-items:center;gap:0.6rem;
}
.summary-points { display:flex;flex-direction:column;gap:0.35rem; }
.summary-point {
  font-size:0.82rem;color:var(--muted);
  padding-left:1rem;position:relative;line-height:1.5;
}
.summary-point::before { content:'•';position:absolute;left:0;color:var(--purple-500);font-weight:700; }

/* English specific sections */
.english-reader-tabs {
  display:flex;gap:0.5rem;margin-bottom:1.5rem;
}
.reader-tab-btn {
  padding:0.5rem 1.25rem;border-radius:50px;
  border:2px solid var(--border);background:white;
  font-size:0.82rem;font-weight:700;color:var(--muted);
  cursor:pointer;transition:var(--transition);font-family:inherit;
}
.reader-tab-btn.active { border-color:var(--english);color:var(--english);background:#FFFBEB; }

/* Grammar/Reading/Writing */
.skill-card {
  background:white;border-radius:var(--radius-lg);
  padding:1.75rem;box-shadow:var(--shadow-sm);border:1px solid var(--border);
  margin-bottom:1rem;
}
.skill-card h3 { font-size:1.05rem;font-weight:700;margin-bottom:0.75rem;color:var(--text); }
.skill-card p { font-size:0.88rem;color:var(--muted);line-height:1.65; }

/* ══════════════════════════════════════════
   OWLIX CHATBOT — Premium
══════════════════════════════════════════ */
.owlix-toggle {
  position:fixed;bottom:2rem;right:2rem;
  width:58px;height:58px;border-radius:50%;
  background:linear-gradient(135deg,var(--purple-700),var(--purple-500));
  border:none;cursor:pointer;
  box-shadow:0 6px 24px rgba(124,58,237,0.5);
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;z-index:10000;transition:var(--transition);
}
.owlix-toggle:hover { transform:scale(1.1) rotate(-5deg);box-shadow:var(--shadow-glow); }
.owlix-badge {
  position:absolute;top:-3px;right:-3px;
  width:20px;height:20px;background:#EF4444;
  border-radius:50%;border:2px solid white;
  display:flex;align-items:center;justify-content:center;
  font-size:0.58rem;font-weight:800;color:white;
  animation:pulse 2s infinite;
}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}

.owlix-window {
  position:fixed;bottom:6.5rem;right:2rem;
  width:380px;height:520px;
  background:white;border-radius:var(--radius-xl);
  box-shadow:0 20px 60px rgba(0,0,0,0.2),0 0 0 1px rgba(124,58,237,0.12);
  display:flex;flex-direction:column;z-index:9999;overflow:hidden;
  transform:scale(0) translateY(30px);transform-origin:bottom right;
  transition:transform 0.3s cubic-bezier(0.34,1.56,0.64,1),opacity 0.25s;
  opacity:0;pointer-events:none;
}
.owlix-window.open { transform:scale(1) translateY(0);opacity:1;pointer-events:all; }

.owlix-header {
  background:linear-gradient(135deg,var(--purple-800),var(--purple-600));
  padding:1rem 1.25rem;
  display:flex;align-items:center;gap:0.75rem;flex-shrink:0;
}
.owlix-avatar {
  width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,0.18);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;flex-shrink:0;border:2px solid rgba(255,255,255,0.25);
}
.owlix-info h3 { color:white;font-size:0.92rem;font-weight:800; }
.owlix-status { display:flex;align-items:center;gap:0.35rem;margin-top:0.1rem; }
.status-dot { width:7px;height:7px;background:#10B981;border-radius:50%;animation:pulse 2s infinite; }
.owlix-info p { color:rgba(255,255,255,0.65);font-size:0.72rem; }
.owlix-close { margin-left:auto;background:none;border:none;color:rgba(255,255,255,0.6);cursor:pointer;font-size:1rem;padding:0.3rem;transition:var(--transition);line-height:1; }
.owlix-close:hover { color:white; }

.owlix-messages {
  flex:1;overflow-y:auto;padding:1rem;
  display:flex;flex-direction:column;gap:0.7rem;
  background:#FAFAFA;
}
.owlix-messages::-webkit-scrollbar { width:3px; }
.owlix-messages::-webkit-scrollbar-thumb { background:#E5E7EB;border-radius:2px; }

.chat-msg { display:flex;gap:0.4rem;max-width:90%; }
.chat-msg.user { flex-direction:row-reverse;align-self:flex-end; }
.msg-av {
  width:28px;height:28px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:0.8rem;flex-shrink:0;align-self:flex-end;
}
.chat-msg.bot .msg-av { background:linear-gradient(135deg,var(--purple-700),var(--purple-500)); }
.chat-msg.user .msg-av { background:#E5E7EB; }
.msg-bbl {
  padding:0.65rem 1rem;border-radius:18px;
  font-size:0.84rem;line-height:1.6;
}
.chat-msg.bot .msg-bbl {
  background:white;color:var(--text);
  border-bottom-left-radius:4px;
  box-shadow:var(--shadow-sm);
  border:1px solid var(--border);
}
.chat-msg.user .msg-bbl {
  background:linear-gradient(135deg,var(--purple-700),var(--purple-500));
  color:white;border-bottom-right-radius:4px;
}
.msg-time { font-size:0.65rem;color:#9CA3AF;margin-top:0.2rem; }
.chat-msg.user .msg-time { text-align:right; }

.typing-bbl {
  background:white;border:1px solid var(--border);
  border-radius:18px 18px 18px 4px;
  padding:0.65rem 1rem;display:flex;gap:0.3rem;align-items:center;
  box-shadow:var(--shadow-sm);
}

.owlix-qr { padding:0 1rem 0.5rem;display:flex;gap:0.4rem;flex-wrap:wrap;flex-shrink:0; }
.qr-btn {
  padding:0.28rem 0.7rem;
  background:var(--purple-50);
  border:1px solid rgba(124,58,237,0.2);
  border-radius:50px;font-size:0.75rem;
  cursor:pointer;transition:var(--transition);
  color:var(--purple-700);font-family:inherit;font-weight:600;
}
.qr-btn:hover { background:var(--purple-600);color:white;border-color:var(--purple-600); }

.owlix-input-row {
  padding:0.65rem 1rem;border-top:1px solid var(--border);
  display:flex;gap:0.5rem;align-items:center;flex-shrink:0;
  background:white;
}
.owlix-input {
  flex:1;border:1.5px solid var(--border);border-radius:50px;
  padding:0.55rem 1rem;font-size:0.84rem;outline:none;
  transition:var(--transition);font-family:inherit;background:var(--bg);
}
.owlix-input:focus { border-color:var(--purple-500);background:white;box-shadow:0 0 0 3px rgba(124,58,237,0.1); }
.owlix-send-btn {
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg,var(--purple-700),var(--purple-500));
  border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:white;font-size:0.85rem;transition:var(--transition);flex-shrink:0;
}
.owlix-send-btn:hover { transform:scale(1.1);box-shadow:0 3px 12px rgba(124,58,237,0.4); }

/* ══════════════════════════════════════════
   TIPS GRID
══════════════════════════════════════════ */
.tips-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem; }
.tip-card {
  background:white;border-radius:var(--radius-lg);padding:1.4rem;
  box-shadow:var(--shadow-sm);border:1px solid var(--border);
  transition:var(--transition);
}
.tip-card:hover { transform:translateY(-3px);box-shadow:var(--shadow); }
.tip-icon { font-size:1.75rem;margin-bottom:0.6rem; }
.tip-card h4 { font-size:0.92rem;font-weight:700;color:var(--text);margin-bottom:0.3rem; }
.tip-card p { font-size:0.8rem;color:var(--muted);line-height:1.55; }

/* ══════════════════════════════════════════
   FOOTER
══════════════════════════════════════════ */
footer {
  background:var(--dark);
  color:rgba(255,255,255,0.55);
  padding:3rem 2rem 2rem;
  margin-top:4rem;
}
.footer-grid {
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr;
  gap:2rem;margin-bottom:2.5rem;
}
.footer-brand .logo-text { font-size:1.3rem;color:#FFFFFF; }
.footer-brand .logo-text span { color:var(--purple-400); }
.footer-brand p {
  font-size:0.82rem;color:rgba(255,255,255,0.45);
  margin:0.75rem 0 1.25rem;line-height:1.6;max-width:240px;
}
.social-links { display:flex;gap:0.6rem; }
.social-link {
  width:34px;height:34px;border-radius:var(--radius-sm);
  background:rgba(255,255,255,0.08);
  display:flex;align-items:center;justify-content:center;
  font-size:0.9rem;transition:var(--transition);color:rgba(255,255,255,0.6);
  text-decoration:none;
}
.social-link:hover { background:var(--purple-600);color:white; }
.footer-col h4 { font-size:0.82rem;font-weight:700;color:white;margin-bottom:1rem;letter-spacing:0.3px; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:0.55rem; }
.footer-col ul li a {
  font-size:0.8rem;color:rgba(255,255,255,0.45);
  transition:var(--transition);text-decoration:none;
}
.footer-col ul li a:hover { color:var(--purple-300); }
.footer-bottom {
  max-width:1200px;margin:0 auto;
  border-top:1px solid rgba(255,255,255,0.08);
  padding-top:1.5rem;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;
  font-size:0.78rem;
}
.footer-badge {
  background:rgba(124,58,237,0.3);border:1px solid rgba(167,139,250,0.3);
  color:var(--purple-300);padding:0.3rem 0.8rem;border-radius:50px;
  font-size:0.72rem;font-weight:700;
}

/* ══════════════════════════════════════════
   PDF CARDS & VIEWER MODAL
══════════════════════════════════════════ */
.pdf-empty-state {
  text-align:center;padding:2.5rem 1rem;background:var(--purple-50);
  border-radius:14px;border:2px dashed rgba(124,58,237,0.2);margin-bottom:2rem;
}

/* PDF Cards */
.pdf-cards-grid { display:flex;flex-direction:column;gap:0.75rem;margin-bottom:2rem; }
.pdf-card {
  display:flex;align-items:center;gap:0.85rem;
  background:white;border:1px solid var(--border);border-radius:10px;
  padding:0.85rem 1rem;transition:border-color 0.2s,box-shadow 0.2s;
  border-left:3px solid transparent;
}
.pdf-card:hover { border-color:var(--border);border-left-color:var(--purple-400);box-shadow:0 2px 8px rgba(0,0,0,0.06); }
.pdf-card-icon { display:none; }
.pdf-card-info { flex:1;min-width:0; }
.pdf-card-title { font-weight:600;font-size:0.92rem;color:var(--text);margin-bottom:0.12rem; }
.pdf-card-desc { font-size:0.76rem;color:var(--muted); }
.pdf-open-btn {
  background:transparent;color:var(--purple-600);
  border:1.5px solid var(--purple-400);
  padding:0.4rem 0.9rem;border-radius:7px;font-size:0.8rem;font-weight:600;
  cursor:pointer;white-space:nowrap;transition:background 0.15s,color 0.15s;flex-shrink:0;
}
.pdf-open-btn:hover { background:var(--purple-600);color:white; }
.pdf-tick { font-size:0.85rem;opacity:0.85; }

/* MCQ Modal Popup */
#mcqModal {
  display:none;position:fixed;inset:0;z-index:9998;
}
#mcqModal.open { display:block; }
.mcq-modal-box {
  position:fixed;inset:0;display:flex;flex-direction:column;
  background:var(--bg);overflow:hidden;
}
.mcq-modal-hdr {
  display:flex;align-items:center;justify-content:space-between;
  gap:0.75rem;padding:0.75rem 1rem;
  background:var(--card-bg);border-bottom:1px solid var(--border);
  flex-shrink:0;
}
.mcq-modal-title-wrap { display:flex;flex-direction:column;min-width:0; }
.mcq-modal-title {
  font-weight:700;font-size:1rem;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.mcq-modal-meta { font-size:0.78rem;color:var(--muted); }
.mcq-score-pill {
  background:var(--purple-600);color:white;
  font-size:0.78rem;font-weight:700;
  padding:0.25rem 0.65rem;border-radius:50px;white-space:nowrap;
}
.mcq-modal-close {
  background:transparent;border:1px solid var(--border);color:var(--text);
  width:32px;height:32px;border-radius:50%;font-size:0.9rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:var(--transition);flex-shrink:0;
}
.mcq-modal-close:hover { background:var(--border); }
.mcq-modal-body {
  flex:1;overflow-y:auto;padding:1rem;
}

/* Question Bank Modal */
#qbankModal,#mathsQBankModal,#socialQBankModal { display:none;position:fixed;inset:0;z-index:9998; }
#qbankModal.open,#mathsQBankModal.open,#socialQBankModal.open { display:block; }
.qbank-section { margin-bottom:1.75rem; }
.qbank-section-hdr {
  display:flex;align-items:center;gap:0.6rem;
  margin-bottom:0.85rem;padding-bottom:0.55rem;
  border-bottom:2px solid var(--border);
}
.qbank-badge {
  font-size:0.72rem;font-weight:800;letter-spacing:.04em;
  padding:0.25rem 0.65rem;border-radius:50px;text-transform:uppercase;
}
.qbank-badge-2m { background:#dcfce7;color:#16a34a; }
.qbank-badge-3m { background:#fef3c7;color:#d97706; }
.qbank-badge-5m { background:#fee2e2;color:#dc2626; }
.qbank-count { font-size:0.78rem;color:var(--muted);font-weight:600; }
.qbank-list { list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:0.55rem; }
.qbank-list li {
  padding:0.75rem 1rem;
  background:var(--card-bg);border:1px solid var(--border);border-radius:8px;
  font-size:0.88rem;line-height:1.6;color:var(--text);
  counter-increment:qbank-counter;
}
.qbank-list { counter-reset:qbank-counter; }
.qbank-list li::before {
  content:counter(qbank-counter) ". ";
  font-weight:700;color:var(--purple-500);margin-right:0.25rem;
}
/* Dark mode qbank badges */
[data-theme="dark"] .qbank-badge-2m { background:#14532d;color:#86efac; }
[data-theme="dark"] .qbank-badge-3m { background:#451a03;color:#fde68a; }
[data-theme="dark"] .qbank-badge-5m { background:#450a0a;color:#fca5a5; }

/* Qbank mark-picker cards */
.qbank-pick-grid { display:grid;grid-template-columns:1fr;gap:0.75rem;padding:0.25rem 0; }
.qbank-pick-card {
  display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem 1.25rem;border-radius:10px;border:1.5px solid transparent;
  cursor:pointer;font-family:inherit;transition:opacity .15s,box-shadow .15s;
  text-align:left;
}
.qbank-pick-card:hover { opacity:0.88;box-shadow:0 3px 10px rgba(0,0,0,.1); }
.qbank-pick-label { font-size:1.05rem;font-weight:700; }
.qbank-pick-count { font-size:0.8rem;font-weight:600;opacity:.7; }
.qbank-pick-2m { background:#dcfce7;color:#15803d;border-color:#bbf7d0; }
.qbank-pick-3m { background:#fef3c7;color:#b45309;border-color:#fde68a; }
.qbank-pick-5m { background:#fee2e2;color:#b91c1c;border-color:#fecaca; }
[data-theme="dark"] .qbank-pick-2m { background:#14532d;color:#86efac;border-color:#166534; }
[data-theme="dark"] .qbank-pick-3m { background:#451a03;color:#fde68a;border-color:#78350f; }
[data-theme="dark"] .qbank-pick-5m { background:#450a0a;color:#fca5a5;border-color:#7f1d1d; }

/* Qbank back button */
.qbank-back-btn {
  display:inline-flex;align-items:center;gap:0.3rem;
  background:none;border:1px solid var(--border);border-radius:8px;
  padding:0.4rem 0.9rem;margin-bottom:1.25rem;
  font-size:0.85rem;font-weight:600;color:var(--muted);cursor:pointer;
  transition:background .15s,color .15s;
}
.qbank-back-btn:hover { background:var(--card-bg);color:var(--text); }

/* PDF Modal Popup — fullscreen, no header */
#pdfModal {
  display:none;position:fixed;inset:0;z-index:9999;
}
#pdfModal.open { display:block; }
.pdf-modal-box {
  position:fixed;inset:0;
  width:100vw;height:100dvh;
  background:#525659;
  overflow:hidden;
}
.pdf-modal-body {
  width:100%;height:100%;overflow:auto;padding:0.5rem;box-sizing:border-box;
}
.pdf-modal-body canvas { border-radius:4px; }
.pdf-img-view { border-radius:0; display:block; margin:0 auto; transition:height 0.15s ease; }

/* Floating close button */
.pdf-float-close {
  position:fixed;top:0.75rem;right:0.75rem;z-index:10;
  width:36px;height:36px;border-radius:50%;border:none;cursor:pointer;
  background:rgba(0,0,0,0.45);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  color:white;font-size:1rem;
  display:flex;align-items:center;justify-content:center;
  transition:var(--transition);
}
.pdf-float-close:hover { background:rgba(0,0,0,0.7); }

/* Floating zoom pill */
.pdf-float-zoom {
  position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);z-index:10;
  display:flex;align-items:center;gap:0.35rem;
  background:rgba(0,0,0,0.45);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border-radius:50px;padding:0.35rem 0.6rem;
}
.pdf-zoom-btn {
  background:transparent;border:none;color:white;
  width:28px;height:28px;border-radius:50%;cursor:pointer;
  font-size:1.2rem;font-weight:700;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:var(--transition);font-family:inherit;
}
.pdf-zoom-btn:hover { background:rgba(255,255,255,0.2); }
#pdfZoomLevel {
  color:rgba(255,255,255,0.9);font-size:0.78rem;font-weight:600;
  min-width:36px;text-align:center;
}

/* PDF card completion circle */
.pdf-done-circle {
  background:none;border:2px solid var(--border);border-radius:50%;
  width:28px;height:28px;cursor:pointer;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:0.75rem;color:transparent;
  transition:var(--transition);
}
.pdf-done-circle.done { background:#10B981;border-color:#10B981;color:white; }
.pdf-loading {
  display:flex;align-items:center;justify-content:center;
  height:100%;color:rgba(255,255,255,0.7);font-size:1rem;
}
.pdf-error {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  height:100%;color:rgba(255,255,255,0.8);text-align:center;gap:1rem;font-size:0.95rem;
}
.pdf-error a { color:#a78bfa;text-decoration:underline; }

/* ══════════════════════════════════════════
   OWLIX PROMO SECTION (home page)
══════════════════════════════════════════ */
.owlix-promo {
  background:linear-gradient(135deg,var(--purple-900),var(--purple-700));
  border-radius:var(--radius-xl);
  padding:3rem 2.5rem;
  margin:0 0 1rem;
}
.owlix-promo-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2.5rem;
  align-items:center;
  max-width:900px;
  margin:0 auto;
}
.owlix-label { color:var(--purple-300) !important; }
.owlix-promo-title {
  font-size:1.8rem;
  font-weight:800;
  color:white;
  letter-spacing:-0.5px;
  line-height:1.2;
  margin:0.5rem 0 0;
}
.owlix-promo-desc {
  color:rgba(255,255,255,0.65);
  margin:1rem 0 1.5rem;
  font-size:0.9rem;
  line-height:1.7;
}
.owlix-promo-cta { display:flex;gap:0.75rem;flex-wrap:wrap; }
.owlix-promo-right { display:flex;flex-direction:column;gap:0.6rem; }
.owlix-example-card {
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:12px;
  padding:0.85rem 1.1rem;
  font-size:0.82rem;
  color:rgba(255,255,255,0.75);
}

/* ══════════════════════════════════════════
   SCROLL ANIMATIONS
══════════════════════════════════════════ */
.reveal {
  opacity:0;transform:translateY(24px);
  transition:opacity 0.6s var(--ease),transform 0.6s var(--ease);
}
.reveal.visible { opacity:1;transform:translateY(0); }
.reveal-d1 { transition-delay:0.1s; }
.reveal-d2 { transition-delay:0.2s; }
.reveal-d3 { transition-delay:0.3s; }
.reveal-d4 { transition-delay:0.4s; }

/* ══════════════════════════════════════════
   RESPONSIVE — PC · Tablet · Phone
══════════════════════════════════════════ */

/* ── Large desktop (1400px+) ── */
@media(min-width:1400px){
  .hero h1{font-size:3.5rem}
  .subjects-grid{grid-template-columns:repeat(4,1fr)}
  .tips-grid{grid-template-columns:repeat(4,1fr)}
}

/* ── Desktop / wide tablet (1025px–1280px) — no changes needed, defaults look great ── */

/* ── Tablet landscape / small desktop (769px–1024px) ── */
@media(max-width:1024px){
  .hero-grid{grid-template-columns:1fr;gap:2rem}
  .hero-right{display:none}
  .footer-grid{grid-template-columns:2fr 1fr 1fr;gap:1.5rem}
  .footer-brand{grid-column:1/-1}
  .pdf-cards-grid{grid-template-columns:1fr 1fr}
  /* hide search bar on tablets to prevent navbar overflow */
  .search-bar{display:none}
}

/* ── Phone landscape / large phone (769px+) — PDF cards as 2-col grid on all non-mobile ── */
@media(min-width:769px){
  .pdf-cards-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem}
}

/* ── Mobile (≤768px) ── */
@media(max-width:768px){
  /* Navbar — hamburger on mobile */
  .navbar{padding:0 1rem;height:54px;overflow:visible;flex-wrap:nowrap;gap:0;justify-content:space-between}
  .logo{flex-shrink:0}
  .logo-text{display:none}
  .nav-links{display:none !important}
  .nav-right{display:none !important}
  .hamburger{display:flex !important}
  .search-bar{display:none}

  /* Tabs — pill grid so ALL tabs are visible */
  .tabs-bar{top:54px;border-bottom:1px solid var(--border)}
  .tabs-scroll{
    flex-wrap:wrap;padding:0.55rem 0.75rem;
    gap:0.35rem;overflow:visible;
  }
  .tab-btn{
    flex:1 1 calc(50% - 0.35rem);min-width:0;max-width:calc(50% - 0.35rem);
    padding:0.45rem 0.35rem;font-size:0.68rem;
    border-radius:8px;border-bottom:2px solid transparent;
    background:rgba(0,0,0,0.04);
    justify-content:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .tab-btn.active{border-bottom-color:var(--purple-600);background:rgba(124,58,237,0.08)}
  .tab-btn.active.maths-t{background:rgba(239,68,68,0.07);border-bottom-color:var(--maths)}
  .tab-btn.active.science-t{background:rgba(56,189,248,0.09);border-bottom-color:var(--science)}
  .tab-btn.active.english-t{background:rgba(251,191,36,0.09);border-bottom-color:var(--english)}
  .tab-btn.active.social-t{background:rgba(52,211,153,0.09);border-bottom-color:var(--social)}

  /* Hero */
  .hero{padding:3rem 1.25rem 2.5rem;min-height:unset}
  .hero h1{font-size:1.9rem;letter-spacing:-0.5px}
  .hero p{font-size:0.9rem;margin-bottom:1.5rem}
  .hero-cta{gap:0.65rem}
  .stats-strip{padding:1rem 1.25rem;gap:2rem}

  /* Sections */
  .section-title{font-size:1.55rem}
  .section{padding:2.5rem 0}
  .container{padding:0 1.1rem}

  /* Subject cards */
  .subjects-grid{grid-template-columns:1fr}

  /* Subject page header */
  .subject-header{padding:1.5rem 1.1rem}
  .subject-header h1{font-size:1.5rem}
  .subject-header p{font-size:0.82rem}
  .subject-header-icon{width:50px;height:50px;font-size:1.75rem}

  /* Tabs */
  .tabs-bar{top:0}
  .tabs-bar{position:sticky}

  /* PDF cards — single col on mobile */
  .pdf-cards-grid{display:flex;flex-direction:column;gap:0.65rem;margin-bottom:1.5rem}

  /* Coming soon */
  .coming-soon{padding:2.5rem 1.25rem}

  /* Owlix */
  .owlix-window{width:calc(100vw - 1.5rem);right:0.75rem;bottom:5rem;height:70vh;max-height:480px}

  /* Footer */
  footer{padding:2rem 1rem 1.25rem}
  .footer-grid{grid-template-columns:1fr 1fr;gap:1.25rem}
  .footer-brand{
    grid-column:1/-1;display:flex;flex-wrap:wrap;
    align-items:center;gap:0.85rem;
    padding-bottom:0.75rem;border-bottom:1px solid rgba(255,255,255,0.08)
  }
  .footer-brand p{display:none}
  .footer-brand .social-links{margin-left:auto}
  .footer-col h4{font-size:0.78rem;margin-bottom:0.55rem}
  .footer-col ul li{margin-bottom:0.35rem}
  .footer-col ul li a{font-size:0.75rem}
  .footer-bottom{flex-direction:row;flex-wrap:wrap;gap:0.4rem;font-size:0.7rem;justify-content:center}
  .footer-badge{font-size:0.68rem;padding:0.2rem 0.65rem}

  /* Owlix promo — single column on mobile */
  .owlix-promo{padding:2rem 1.25rem;border-radius:var(--radius-lg)}
  .owlix-promo-grid{grid-template-columns:1fr;gap:1.5rem}
  .owlix-promo-title{font-size:1.5rem}
}

/* ── Small phone (≤480px) ── */
@media(max-width:480px){
  .hero h1{font-size:1.65rem}
  .hero-cta{flex-direction:column}
  .hero-cta .btn{justify-content:center;text-align:center;width:100%}
  .stats-strip{gap:1.25rem;justify-content:space-around}
  .stat-num{font-size:1.3rem}
  .section{padding:2rem 0}
  .container{padding:0 0.85rem}
  .section-title{font-size:1.35rem}

  /* PDF card — stack on tiny screens */
  .pdf-card{flex-wrap:wrap;gap:0.65rem;padding:0.75rem}
  .pdf-card-icon{font-size:1.4rem}
  .pdf-card-info{flex:1}
  .pdf-card-title{font-size:0.88rem}
  .pdf-open-btn{font-size:0.78rem;padding:0.4rem 0.75rem}
  .pdf-done-circle{width:26px;height:26px}

  /* Footer — full single column */
  .footer-grid{grid-template-columns:1fr}
  .footer-brand .social-links{margin-left:0}

  /* Subject header */
  .subject-header{padding:1.25rem 0.85rem}
  .subject-header h1{font-size:1.3rem}
  .subject-header-icon{width:44px;height:44px;font-size:1.5rem}
  .subject-header-inner{gap:0.85rem}

  /* Coming soon */
  .coming-soon{padding:2rem 1rem}
  .coming-soon .cs-icon{font-size:2.5rem}
  .coming-soon h3{font-size:1.1rem}

  /* Chapter items */
  .chapter-header{padding:0.9rem 1rem;gap:0.65rem}
  .chapter-title{font-size:0.85rem}
  .chapter-sub{font-size:0.68rem}

  /* Tip cards */
  .tips-grid{grid-template-columns:1fr 1fr}
}

/* ── Very small phone (≤360px) ── */
@media(max-width:360px){
  .hero h1{font-size:1.45rem}
  .hero{padding:2.5rem 1rem 2rem}
  .btn-login{display:none}
  .tips-grid{grid-template-columns:1fr}
  .pdf-modal-title{max-width:120px}
}

/* ══════════════════════════════════════════
   SECURE PDF VIEWER
══════════════════════════════════════════ */
.secure-pdf-viewer {
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  overflow:hidden;
  margin-bottom:1.5rem;
  box-shadow:var(--shadow-sm);
}
.pdf-viewer-topbar {
  background:linear-gradient(135deg,#1E1040,#3B0764);
  padding:0.75rem 1.25rem;
  display:flex;
  align-items:center;
  gap:0.75rem;
  flex-wrap:wrap;
}
.pdf-viewer-info {
  display:flex;align-items:center;gap:0.6rem;flex:1;
}
.pdf-lock-badge {
  background:rgba(255,255,255,0.15);
  border:1px solid rgba(255,255,255,0.25);
  color:white;
  padding:0.2rem 0.6rem;
  border-radius:50px;
  font-size:0.72rem;
  font-weight:700;
  white-space:nowrap;
}
.pdf-doc-title {
  color:white;font-weight:600;font-size:0.9rem;
}
.pdf-viewer-desc {
  color:rgba(255,255,255,0.6);font-size:0.78rem;
  width:100%;
}
.pdf-canvas-wrap {
  background:#F0F0F0;
  min-height:400px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  user-select:none;
  -webkit-user-select:none;
  position:relative;
}
.pdf-canvas {
  display:block;
  max-width:100%;
  pointer-events:none;
}
.pdf-loading-msg {
  position:absolute;
  color:var(--muted);
  font-size:0.9rem;
  display:flex;align-items:center;gap:0.5rem;
}
.pdf-spinner { animation:spin 1.2s linear infinite;display:inline-block; }
@keyframes spin { to { transform:rotate(360deg); } }
.pdf-nav-bar {
  background:var(--bg);
  border-top:1px solid var(--border);
  padding:0.6rem 1.25rem;
  display:flex;align-items:center;gap:0.75rem;
}
.pdf-nav-btn {
  background:var(--purple-600);
  color:white;border:none;
  padding:0.35rem 0.9rem;
  border-radius:var(--radius-sm);
  font-size:0.8rem;
  font-weight:600;
  cursor:pointer;
  transition:var(--transition);
  font-family:inherit;
}
.pdf-nav-btn:hover { background:var(--purple-700);transform:translateY(-1px); }
.pdf-page-info {
  font-size:0.82rem;font-weight:600;color:var(--text);flex:1;
}
.pdf-protected-note {
  font-size:0.72rem;color:var(--muted);
  display:flex;align-items:center;gap:0.25rem;
  margin-left:auto;
}

/* PDF placeholder when no PDFs uploaded */
.pdf-upload-placeholder {
  background:linear-gradient(135deg,rgba(91,33,182,0.04),rgba(124,58,237,0.08));
  border:2px dashed rgba(124,58,237,0.25);
  border-radius:var(--radius-lg);
  padding:2rem;
  text-align:center;
  margin-bottom:1.5rem;
}
.pdf-placeholder-icon { font-size:2.5rem;margin-bottom:0.75rem; }
.pdf-placeholder-title {
  font-size:1rem;font-weight:700;color:var(--text);margin-bottom:0.5rem;
}
.pdf-placeholder-desc { color:var(--muted);font-size:0.88rem;max-width:360px;margin:0 auto; }

/* Print protection — hide PDF canvas when printing */
@media print {
  .secure-pdf-viewer { display:none !important; }
}

/* ══════════════════════════════════════════
   AUTH MODAL
══════════════════════════════════════════ */
.auth-modal-overlay {
  position:fixed;inset:0;z-index:2000;
  background:rgba(15,10,30,0.6);
  backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity 0.3s var(--ease);
  padding:1rem;
}
.auth-modal-overlay.open { opacity:1;pointer-events:all; }

.auth-modal {
  background:white;
  border-radius:var(--radius-xl);
  padding:2rem;
  width:100%;max-width:420px;
  position:relative;
  box-shadow:0 24px 80px rgba(0,0,0,0.25);
  transform:translateY(20px) scale(0.97);
  transition:transform 0.3s var(--ease);
  max-height:90vh;overflow-y:auto;
}
.auth-modal-overlay.open .auth-modal { transform:translateY(0) scale(1); }

.auth-close {
  position:absolute;top:1rem;right:1rem;
  background:var(--bg);border:none;
  width:32px;height:32px;border-radius:50%;
  font-size:0.85rem;cursor:pointer;
  color:var(--muted);transition:var(--transition);
  display:flex;align-items:center;justify-content:center;
}
.auth-close:hover { background:var(--border);color:var(--text); }

.auth-brand {
  display:flex;align-items:center;gap:0.5rem;
  margin-bottom:1.5rem;
}
.auth-logo { width:36px;height:36px;object-fit:contain; }
.auth-brand-text {
  font-size:1.25rem;font-weight:800;color:var(--text);letter-spacing:-0.5px;
}
.auth-brand-text span { color:var(--purple-600); }

.auth-tabs {
  display:flex;background:var(--bg);border-radius:var(--radius-sm);
  padding:0.25rem;margin-bottom:1.25rem;
}
.auth-tab {
  flex:1;padding:0.5rem;border:none;background:none;
  font-size:0.85rem;font-weight:600;color:var(--muted);
  border-radius:calc(var(--radius-sm) - 2px);
  cursor:pointer;transition:var(--transition);font-family:inherit;
}
.auth-tab.active { background:white;color:var(--purple-700);box-shadow:var(--shadow-sm); }

.auth-google-btn {
  width:100%;display:flex;align-items:center;justify-content:center;gap:0.65rem;
  padding:0.7rem 1rem;
  background:white;border:1.5px solid var(--border);border-radius:var(--radius);
  font-size:0.88rem;font-weight:600;color:var(--text);
  cursor:pointer;transition:var(--transition);margin-bottom:1rem;
  font-family:inherit;
}
.auth-google-btn:hover { border-color:#4285F4;background:#F8FBFF;transform:translateY(-1px); }

.auth-divider {
  display:flex;align-items:center;gap:0.75rem;
  margin-bottom:1rem;color:var(--muted);font-size:0.8rem;
}
.auth-divider::before,.auth-divider::after {
  content:'';flex:1;height:1px;background:var(--border);
}

.auth-form { display:flex;flex-direction:column;gap:0.85rem; }
.auth-form.hidden { display:none; }

.auth-field { display:flex;flex-direction:column;gap:0.35rem; }
.auth-field label { font-size:0.82rem;font-weight:600;color:var(--text); }
.auth-field input,.auth-field select {
  padding:0.6rem 0.85rem;
  border:1.5px solid var(--border);
  border-radius:var(--radius-sm);
  font-size:0.88rem;font-family:inherit;
  color:var(--text);background:white;
  outline:none;transition:var(--transition);
}
.auth-field input:focus,.auth-field select:focus {
  border-color:var(--purple-500);
  box-shadow:0 0 0 3px rgba(139,92,246,0.12);
}

.auth-pw-wrap { position:relative; }
.auth-pw-wrap input { width:100%;padding-right:2.5rem; }
.auth-pw-toggle {
  position:absolute;right:0.6rem;top:50%;transform:translateY(-50%);
  background:none;border:none;cursor:pointer;font-size:0.9rem;
  padding:0.2rem;opacity:0.6;transition:var(--transition);
}
.auth-pw-toggle:hover { opacity:1; }

.auth-error {
  font-size:0.8rem;color:#EF4444;font-weight:500;
  min-height:1.2rem;
}

.auth-submit-btn {
  background:linear-gradient(135deg,var(--purple-600),var(--purple-500));
  color:white;border:none;
  padding:0.7rem;border-radius:var(--radius);
  font-size:0.9rem;font-weight:700;
  cursor:pointer;transition:var(--transition);
  font-family:inherit;
  box-shadow:0 4px 16px rgba(124,58,237,0.35);
}
.auth-submit-btn:hover:not(:disabled) { transform:translateY(-1px);box-shadow:0 6px 24px rgba(124,58,237,0.45); }
.auth-submit-btn:disabled { opacity:0.65;cursor:not-allowed;transform:none; }

.auth-switch-link {
  text-align:center;font-size:0.82rem;color:var(--muted);margin-top:0.25rem;
}
.auth-switch-link button {
  background:none;border:none;color:var(--purple-600);
  font-weight:600;cursor:pointer;font-size:inherit;font-family:inherit;
}
.auth-switch-link button:hover { text-decoration:underline; }

/* ══════════════════════════════════════════
   NAV USER WIDGET
══════════════════════════════════════════ */
.nav-user-widget { position:relative; }

.nav-avatar {
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg,var(--purple-600),var(--purple-400));
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;overflow:hidden;
  border:2px solid var(--purple-200);
  transition:var(--transition);
}
.nav-avatar:hover { border-color:var(--purple-400);transform:scale(1.05); }
.nav-avatar img { width:100%;height:100%;object-fit:cover; }
.nav-avatar-initials { font-size:0.75rem;font-weight:800;color:white; }

.user-dropdown {
  position:absolute;top:calc(100% + 10px);right:0;
  background:white;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  min-width:220px;
  box-shadow:var(--shadow-lg);
  opacity:0;pointer-events:none;
  transform:translateY(-8px) scale(0.97);
  transition:all 0.2s var(--ease);
  z-index:200;overflow:hidden;
}
.user-dropdown.open { opacity:1;pointer-events:all;transform:translateY(0) scale(1); }

.user-dropdown-header {
  padding:1rem 1.1rem;
  border-bottom:1px solid var(--border);
  background:var(--purple-50);
}
.ud-name { font-size:0.9rem;font-weight:700;color:var(--text); }
.ud-email { font-size:0.75rem;color:var(--muted);margin-top:0.1rem; }
.ud-grade {
  display:inline-block;margin-top:0.4rem;
  background:var(--purple-100);color:var(--purple-700);
  padding:0.15rem 0.5rem;border-radius:50px;
  font-size:0.7rem;font-weight:700;
}

.user-dropdown-links { padding:0.4rem; }
.user-dropdown-links a {
  display:flex;align-items:center;gap:0.5rem;
  padding:0.55rem 0.75rem;
  border-radius:var(--radius-sm);
  font-size:0.84rem;color:var(--text);font-weight:500;
  transition:var(--transition);
}
.user-dropdown-links a:hover { background:var(--bg); }
.ud-logout { color:#EF4444 !important; }
.ud-logout:hover { background:#FEF2F2 !important; }

/* ══════════════════════════════════════════
   AUTH TOAST
══════════════════════════════════════════ */
.auth-toast {
  position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(20px);
  background:#1E1040;color:white;
  padding:0.75rem 1.5rem;border-radius:50px;
  font-size:0.88rem;font-weight:600;
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
  z-index:3000;opacity:0;
  transition:all 0.35s var(--ease);
  white-space:nowrap;
}
.auth-toast.show { opacity:1;transform:translateX(-50%) translateY(0); }

/* ══════════════════════════════════════════
   DASHBOARD & SETTINGS PANELS
══════════════════════════════════════════ */
.panel-overlay {
  position:fixed;inset:0;z-index:9998;
  background:rgba(0,0,0,0.55);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity 0.25s ease;
}
.panel-overlay.open { opacity:1;pointer-events:all; }
.panel-box {
  background:white;border-radius:20px;
  width:min(95vw,480px);max-height:90vh;overflow-y:auto;
  box-shadow:0 24px 60px rgba(0,0,0,0.3);
  transform:translateY(20px) scale(0.97);transition:transform 0.25s ease;
}
.panel-overlay.open .panel-box { transform:translateY(0) scale(1); }
.panel-top {
  display:flex;align-items:center;justify-content:space-between;
  padding:1.25rem 1.5rem;border-bottom:1px solid var(--border);position:sticky;top:0;background:white;z-index:1;
}
.panel-title { font-size:1.05rem;font-weight:800;color:var(--text); }
.panel-close {
  width:32px;height:32px;border-radius:50%;border:none;background:var(--bg);
  font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:var(--transition);
}
.panel-close:hover { background:var(--border); }
.panel-body { padding:1.25rem 1.5rem; }
.panel-section { margin-bottom:1.5rem; }
.panel-section-title { font-size:0.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:0.75rem; }
.dash-user-row {
  display:flex;align-items:center;gap:1rem;
  background:var(--purple-50);border-radius:14px;padding:1rem;margin-bottom:1.25rem;
}
.dash-avatar {
  width:52px;height:52px;border-radius:50%;
  background:var(--purple-600);color:white;
  display:flex;align-items:center;justify-content:center;
  font-size:1.3rem;font-weight:800;flex-shrink:0;
}
.dash-user-info .dash-name { font-weight:800;font-size:1rem;color:var(--text); }
.dash-user-info .dash-grade { font-size:0.78rem;color:var(--muted);margin-top:0.15rem; }
.dash-progress-row {
  display:flex;align-items:center;justify-content:space-between;
  padding:0.6rem 0;border-bottom:1px solid var(--border);
}
.dash-progress-row:last-child { border-bottom:none; }
.dash-subject-name { font-size:0.88rem;font-weight:600;color:var(--text); }
.dash-count { font-size:0.78rem;color:var(--muted); }
.dash-bar-wrap { width:90px;height:6px;background:var(--border);border-radius:99px;overflow:hidden; }
.dash-bar-fill { height:100%;border-radius:99px;background:var(--purple-600);transition:width 0.6s ease; }
.settings-row {
  display:flex;align-items:center;justify-content:space-between;
  padding:0.75rem 0;border-bottom:1px solid var(--border);
}
.settings-row:last-child { border-bottom:none; }
.settings-row-label { font-size:0.88rem;font-weight:600;color:var(--text); }
.settings-row-value { font-size:0.82rem;color:var(--muted); }
.settings-btn {
  background:none;border:1px solid var(--border);border-radius:8px;
  padding:0.35rem 0.85rem;font-size:0.8rem;font-weight:600;cursor:pointer;
  transition:var(--transition);color:var(--text);
}
.settings-btn:hover { background:var(--bg); }
.settings-btn.danger { border-color:#FCA5A5;color:#DC2626; }
.settings-btn.danger:hover { background:#FEF2F2; }

/* ── QUESTION GENERATOR ── */
.qgen-wrap { max-width:800px;margin:0 auto; }
.qgen-controls { background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:1.25rem 1.5rem; }
.qgen-filters { display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap; }
.qgen-filter { background:var(--surface);border:1.5px solid var(--border);color:var(--muted);padding:0.3rem 0.85rem;border-radius:50px;font-size:0.82rem;font-weight:600;cursor:pointer;transition:var(--transition); }
.qgen-filter.active { background:var(--purple-600);border-color:var(--purple-600);color:white; }
.qgen-ch-sel { background:var(--surface);border:1.5px solid var(--border);border-radius:8px;color:var(--text);padding:0.3rem 0.6rem;font-size:0.82rem;cursor:pointer; }
.qgen-card { background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1.25rem 1.5rem;margin-bottom:1rem;transition:var(--transition); }
.qgen-card:hover { border-color:var(--purple-400); }
.qgen-card-top { display:flex;align-items:center;gap:0.6rem;margin-bottom:0.75rem;flex-wrap:wrap; }
.qgen-mark-badge { font-size:0.75rem;font-weight:700;padding:0.2rem 0.65rem;border-radius:50px; }
.qgen-ch-badge { font-size:0.75rem;color:var(--muted);background:var(--surface);padding:0.2rem 0.65rem;border-radius:50px;border:1px solid var(--border); }
.qgen-q { font-size:0.95rem;font-weight:600;color:var(--text);line-height:1.6;margin-bottom:0.75rem; }
.qgen-ans-btn { background:transparent;border:1.5px solid var(--purple-400);color:var(--purple-400);padding:0.3rem 0.9rem;border-radius:8px;font-size:0.82rem;font-weight:600;cursor:pointer;transition:var(--transition); }
.qgen-ans-btn:hover { background:var(--purple-600);border-color:var(--purple-600);color:white; }
.qgen-ans { background:var(--surface);border-left:3px solid var(--purple-400);padding:0.9rem 1rem;border-radius:0 8px 8px 0;margin-top:0.75rem;font-size:0.88rem;color:var(--text);line-height:1.7;white-space:pre-wrap; }