/* ==============================================================
   K12 Advanced CSS — Practice, Badges, Leaderboard, Analytics,
   StudyPlanner, AI Mentor
   ============================================================== */

/* ── Keyframes ─────────────────────────────────────────────────── */
@keyframes fadeSlideUp   { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }
@keyframes popIn         { 0%{opacity:0;transform:scale(.85)} 80%{transform:scale(1.03)} 100%{opacity:1;transform:scale(1)} }
@keyframes shake         { 0%,100%{transform:translateX(0)} 20%{transform:translateX(-6px)} 40%{transform:translateX(6px)} 60%{transform:translateX(-4px)} 80%{transform:translateX(4px)} }
@keyframes comboPulse    { 0%{transform:scale(1)} 50%{transform:scale(1.08);box-shadow:0 0 20px rgba(99,102,241,.5)} 100%{transform:scale(1)} }
@keyframes glowRing      { 0%,100%{box-shadow:0 0 0 0 transparent} 50%{box-shadow:0 0 0 8px rgba(99,102,241,.2)} }
@keyframes badgePop      { 0%{opacity:0;transform:scale(0) rotate(-10deg)} 70%{transform:scale(1.1) rotate(3deg)} 100%{opacity:1;transform:scale(1) rotate(0)} }
@keyframes podiumRise    { from{opacity:0;transform:translateY(40px)} to{opacity:1;transform:translateY(0)} }
@keyframes streakPulse   { 0%,100%{transform:scale(1)} 50%{transform:scale(1.12)} }
@keyframes heatPop       { from{opacity:0;transform:scale(0)} to{opacity:1;transform:scale(1)} }

/* ── Color keys ─────────────────────────────────────────────────── */
.ck-indigo  { --ck-color:#6366f1; --ck-light:rgba(99,102,241,.12); }
.ck-blue    { --ck-color:#3b82f6; --ck-light:rgba(59,130,246,.12); }
.ck-green   { --ck-color:#22c55e; --ck-light:rgba(34,197,94,.12); }
.ck-amber,.ck-yellow { --ck-color:#f59e0b; --ck-light:rgba(245,158,11,.12); }
.ck-gold    { --ck-color:#d97706; --ck-light:rgba(217,119,6,.12); }
.ck-purple  { --ck-color:#a855f7; --ck-light:rgba(168,85,247,.12); }
.ck-violet  { --ck-color:#7c3aed; --ck-light:rgba(124,58,237,.12); }
.ck-teal    { --ck-color:#14b8a6; --ck-light:rgba(20,184,166,.12); }
.ck-red,.ck-rose { --ck-color:#ef4444; --ck-light:rgba(239,68,68,.12); }
.ck-pink    { --ck-color:#ec4899; --ck-light:rgba(236,72,153,.12); }
.ck-cyan    { --ck-color:#06b6d4; --ck-light:rgba(6,182,212,.12); }
.ck-orange  { --ck-color:#f97316; --ck-light:rgba(249,115,22,.12); }

/* Background variants */
.ck-bg-indigo  { background:linear-gradient(90deg,#6366f1,#818cf8); }
.ck-bg-blue    { background:linear-gradient(90deg,#3b82f6,#60a5fa); }
.ck-bg-green   { background:linear-gradient(90deg,#22c55e,#4ade80); }
.ck-bg-amber,.ck-bg-yellow { background:linear-gradient(90deg,#f59e0b,#fcd34d); }
.ck-bg-purple  { background:linear-gradient(90deg,#a855f7,#c084fc); }
.ck-bg-teal    { background:linear-gradient(90deg,#14b8a6,#2dd4bf); }
.ck-bg-red     { background:linear-gradient(90deg,#ef4444,#f87171); }
.ck-bg-pink    { background:linear-gradient(90deg,#ec4899,#f472b6); }

/* ── XP Combo Toast ─────────────────────────────────────────────── */
.k12-xp-combo {
  font-size:1.1rem !important;
  font-weight:800 !important;
  background:linear-gradient(135deg,#6366f1,#a855f7) !important;
  padding:.6rem 1.2rem !important;
  border-radius:2rem !important;
}

/* ╔══════════════════════════════════════════════════════════════╗
   ║  PRACTICE ENGINE                                             ║
   ╚══════════════════════════════════════════════════════════════╝ */

/* Scoreboard */
.practice-scoreboard {
  display:flex;gap:1rem;
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.2);
  border-radius:1rem;
  padding:.75rem 1.25rem;
}
.psc-item { text-align:center;min-width:55px; }
.psc-num  { font-size:1.5rem;font-weight:900;color:#fff;line-height:1; }
.psc-lbl  { font-size:.7rem;font-weight:600;color:rgba(255,255,255,.7);margin-top:.15rem; }

/* Progress strip */
.pq-progress-strip { animation:fadeSlideUp .4s ease both; }
.pq-strip-bg       { background:#e2e8f0;border-radius:8px;height:8px;overflow:hidden; }
.pq-strip-fill     { height:100%;background:linear-gradient(90deg,#6366f1,#a855f7);border-radius:8px;transition:width .5s ease; }

/* Question card */
.pq-card {
  display:none;
  background:#fff;
  border-radius:1.25rem;
  padding:2rem;
  box-shadow:0 4px 24px rgba(0,0,0,.07);
  position:relative;
  overflow:hidden;
}
.pq-card::before {
  content:'';position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,#6366f1,#a855f7,#ec4899);
}
.pq-card.active { display:block;animation:popIn .4s ease both; }
.pq-card.exit   { display:none; }

/* Difficulty badge */
.pq-diff-badge {
  display:inline-flex;align-items:center;
  padding:.2rem .7rem;border-radius:2rem;font-size:.72rem;font-weight:700;
  margin-bottom:1rem;
}
.diff-1 { background:rgba(34,197,94,.12);color:#16a34a; }
.diff-2 { background:rgba(245,158,11,.12);color:#d97706; }
.diff-3 { background:rgba(239,68,68,.12);color:#dc2626; }

/* Question text */
.pq-question {
  font-size:1.15rem;font-weight:700;color:#1e293b;
  line-height:1.55;margin-bottom:1.5rem;
}

/* Options */
.pq-options { display:flex;flex-direction:column;gap:.75rem; }
.pq-opt {
  display:flex;align-items:center;gap:1rem;
  padding:.85rem 1.25rem;border-radius:.75rem;
  background:#f8fafc;border:2px solid #e2e8f0;
  cursor:pointer;text-align:left;transition:all .2s;font-size:.95rem;
  font-weight:500;color:#334155;
}
.pq-opt:hover:not(:disabled) {
  background:#eef2ff;border-color:#6366f1;color:#4338ca;
  transform:translateX(4px);
}
.pq-opt-letter {
  width:2rem;height:2rem;min-width:2rem;border-radius:.5rem;
  background:#e2e8f0;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.85rem;color:#475569;transition:all .2s;
}
.pq-opt.pq-opt-correct {
  background:rgba(34,197,94,.1);border-color:#22c55e;color:#15803d;
  animation:popIn .3s ease both;
}
.pq-opt.pq-opt-correct .pq-opt-letter { background:#22c55e;color:#fff; }
.pq-opt.pq-opt-wrong   { background:rgba(239,68,68,.08);border-color:#ef4444;color:#b91c1c; }
.pq-opt.pq-opt-wrong   .pq-opt-letter { background:#ef4444;color:#fff; }
.pq-opt:disabled { cursor:not-allowed;opacity:.85; }

/* Explanation */
.pq-explain {
  margin-top:1.25rem;border-top:1px solid #e2e8f0;padding-top:1.25rem;
}
.pq-explain-inner {
  background:linear-gradient(135deg,rgba(245,158,11,.06),rgba(245,158,11,.12));
  border:1px solid rgba(245,158,11,.25);
  border-radius:.75rem;padding:1rem 1.25rem;
  font-size:.9rem;color:#78350f;line-height:1.6;margin-bottom:1rem;
}
.pq-next-btn {
  display:inline-flex;align-items:center;gap:.5rem;
  background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;
  border:none;border-radius:.75rem;padding:.75rem 1.5rem;
  font-weight:700;font-size:.9rem;cursor:pointer;transition:transform .2s,box-shadow .2s;
  animation:fadeSlideUp .35s ease both;
}
.pq-next-btn:hover { transform:translateY(-2px);box-shadow:0 6px 20px rgba(99,102,241,.35); }

/* Results screen */
.pq-results { animation:popIn .5s ease both; }
.pq-results-inner {
  background:#fff;border-radius:1.5rem;padding:2.5rem 2rem;
  box-shadow:0 8px 32px rgba(0,0,0,.08);max-width:580px;margin:0 auto;
}
.pq-result-stats {
  display:flex;justify-content:center;gap:2rem;flex-wrap:wrap;
  background:#f8fafc;border-radius:1rem;padding:1.5rem;margin:1.5rem 0;
}
.pqr-stat { text-align:center; }
.pqr-num  { font-size:2rem;font-weight:900;color:#1e293b;line-height:1; }
.pqr-lbl  { font-size:.75rem;font-weight:600;color:#94a3b8;margin-top:.25rem; }
.pq-badge-notif {
  background:linear-gradient(135deg,rgba(245,158,11,.08),rgba(245,158,11,.15));
  border:1px solid rgba(245,158,11,.3);border-radius:.75rem;
  padding:1rem 1.25rem;text-align:center;color:#78350f;font-weight:700;
  margin:.5rem 0 1rem;animation:popIn .5s ease both;
}

/* ╔══════════════════════════════════════════════════════════════╗
   ║  BADGES                                                      ║
   ╚══════════════════════════════════════════════════════════════╝ */

.badge-cat-tabs {
  display:flex;gap:.5rem;flex-wrap:wrap;
}
.bct-tab {
  padding:.45rem 1rem;border-radius:2rem;font-size:.8rem;font-weight:700;
  background:#fff;border:1.5px solid #e2e8f0;color:#64748b;cursor:pointer;
  transition:all .2s;
}
.bct-tab.active,
.bct-tab:hover {
  background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;border-color:transparent;
  box-shadow:0 3px 10px rgba(99,102,241,.3);
}

.badge-section { margin-bottom:2.5rem; }
.badge-section-title {
  font-size:1rem;font-weight:800;color:#1e293b;margin-bottom:1rem;
  display:flex;align-items:center;gap:.5rem;
}

.badge-grid {
  display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1rem;
}

.badge-card {
  background:#fff;border-radius:1.25rem;padding:1.25rem 1rem;
  text-align:center;border:2px solid #e2e8f0;
  transition:all .25s;position:relative;overflow:hidden;
  animation:popIn .45s ease both;
}
.badge-card.earned {
  border-color:var(--ck-color,#6366f1);
  box-shadow:0 4px 16px rgba(0,0,0,.06);
}
.badge-card.earned:hover { transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,.1); }
.badge-card.locked { opacity:.6;filter:grayscale(.5); }

.badge-glow {
  position:absolute;top:-20px;left:50%;transform:translateX(-50%);
  width:80px;height:80px;border-radius:50%;
  background:radial-gradient(circle,var(--ck-light,rgba(99,102,241,.1)) 0%,transparent 70%);
}

.badge-icon-wrap {
  width:64px;height:64px;border-radius:50%;margin:0 auto 1rem;
  display:flex;align-items:center;justify-content:center;
  background:var(--ck-light,rgba(99,102,241,.1));font-size:1.5rem;
  color:var(--ck-color,#6366f1);position:relative;
  transition:all .3s;
}
.badge-card.earned .badge-icon-wrap { animation:glowRing 2s ease infinite; }

.badge-lock-overlay {
  position:absolute;inset:0;border-radius:50%;background:rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;
}
.badge-name  { font-size:.85rem;font-weight:800;color:#1e293b;margin-bottom:.25rem; }
.badge-desc  { font-size:.72rem;color:#64748b;line-height:1.4;margin-bottom:.5rem; }
.badge-earned-date { font-size:.7rem;color:#22c55e;font-weight:600; }
.badge-xp-bonus    { font-size:.72rem;color:#f59e0b;font-weight:700;margin-top:.25rem; }

/* ╔══════════════════════════════════════════════════════════════╗
   ║  LEADERBOARD                                                 ║
   ╚══════════════════════════════════════════════════════════════╝ */

.lb-tab {
  padding:.5rem 1.25rem;border-radius:2rem;font-size:.85rem;font-weight:700;
  background:transparent;border:2px solid #e2e8f0;color:#64748b;cursor:pointer;
  transition:all .2s;
}
.lb-tab.active {
  background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border-color:transparent;
  box-shadow:0 3px 10px rgba(245,158,11,.3);
}

/* Podium */
.lb-podium {
  display:flex;justify-content:center;align-items:flex-end;gap:1rem;
  margin-bottom:2rem;padding:2rem 1rem 0;
}
.lb-podium-col { text-align:center;animation:podiumRise .6s ease both; }
.lb-podium-avatar {
  width:64px;height:64px;border-radius:50%;margin:0 auto .5rem;
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;font-weight:900;color:#fff;
  background:var(--ck-color,#6366f1);
  box-shadow:0 4px 16px rgba(0,0,0,.15);
}
.ck-gold { --ck-color:#d97706; }
.lb-glow { animation:glowRing 2s ease infinite !important; box-shadow:0 0 20px rgba(245,158,11,.5) !important; }
.lb-crown { font-size:1.5rem;text-align:center;margin-bottom:.25rem;animation:streakPulse 1.5s ease infinite; }
.lb-podium-name  { font-size:.85rem;font-weight:700;color:#1e293b;margin-bottom:.25rem; }
.lb-champ        { font-size:1rem;font-weight:900; }
.lb-podium-xp    { font-size:.8rem;font-weight:700;color:#6366f1; }
.lb-podium-stand {
  margin-top:.75rem;font-weight:900;color:#fff;
  border-radius:.5rem .5rem 0 0;padding:.4rem 1rem;font-size:.9rem;
}
.lb-stand-1 { background:linear-gradient(180deg,#d97706,#b45309);min-height:80px;display:flex;align-items:flex-start;justify-content:center;padding-top:.4rem; }
.lb-stand-2 { background:linear-gradient(180deg,#94a3b8,#64748b);min-height:60px;display:flex;align-items:flex-start;justify-content:center;padding-top:.4rem; }
.lb-stand-3 { background:linear-gradient(180deg,#b45309,#92400e);min-height:45px;display:flex;align-items:flex-start;justify-content:center;padding-top:.4rem; }
.lb-1st { order:2; }
.lb-2nd { order:1; }
.lb-3rd { order:3; }

/* Leaderboard list */
.lb-list { display:flex;flex-direction:column;gap:.5rem; }
.lb-row {
  display:flex;align-items:center;gap:1rem;
  background:#fff;border-radius:.75rem;padding:.75rem 1rem;
  border:1.5px solid #f1f5f9;transition:all .2s;
  animation:fadeSlideUp .4s ease both;
}
.lb-row:hover { border-color:#e0e7ff;transform:translateX(3px);box-shadow:0 2px 10px rgba(0,0,0,.05); }
.lb-row.lb-me { border-color:#6366f1;background:rgba(99,102,241,.04);box-shadow:0 2px 12px rgba(99,102,241,.15); }
.lb-rank { width:2.5rem;text-align:center;font-weight:800;font-size:.9rem;color:#64748b; }
.lb-avatar {
  width:42px;height:42px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-weight:900;color:#fff;font-size:1rem;flex-shrink:0;
  background:var(--ck-color,#6366f1);
}
.lb-info   { flex:1;min-width:0; }
.lb-username { font-size:.9rem;font-weight:700;color:#1e293b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.lb-username .lb-you { display:inline-block;background:#6366f1;color:#fff;font-size:.65rem;padding:.1rem .4rem;border-radius:2rem;margin-left:.4rem;vertical-align:middle;font-weight:700; }
.lb-meta   { font-size:.72rem;color:#94a3b8;margin-top:.1rem; }
.lb-xp-col { text-align:right;min-width:55px; }
.lb-xp-num { font-size:1.1rem;font-weight:900;color:#6366f1; }
.lb-xp-lbl { font-size:.65rem;color:#94a3b8;font-weight:600; }

/* ╔══════════════════════════════════════════════════════════════╗
   ║  ANALYTICS                                                   ║
   ╚══════════════════════════════════════════════════════════════╝ */

.analytics-stat-card {
  background:rgba(255,255,255,.12);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.15);border-radius:1rem;
  padding:1rem;text-align:center;
}
.asc-num { font-size:1.6rem;font-weight:900;color:#fff;line-height:1; }
.asc-lbl { font-size:.75rem;color:rgba(255,255,255,.7);margin-top:.25rem;font-weight:600; }

.analytics-card {
  background:#fff;border-radius:1.25rem;padding:1.5rem;
  box-shadow:0 2px 16px rgba(0,0,0,.05);border:1px solid #f1f5f9;
}
.analytics-card-header {
  display:flex;align-items:center;gap:.5rem;
  font-size:.95rem;font-weight:800;color:#1e293b;margin-bottom:1.25rem;
  padding-bottom:.75rem;border-bottom:1px solid #f1f5f9;
}

/* Heatmap */
.heatmap-wrap { overflow-x:auto;padding:.5rem 0; }
.heatmap-grid {
  display:grid;grid-template-columns:repeat(84,1fr);gap:3px;
  min-width:600px;
}
.hm-cell {
  width:12px;height:12px;border-radius:2px;
  animation:heatPop .3s ease both;cursor:default;
}
.hm-0 { background:#f1f5f9; }
.hm-1 { background:#bfdbfe; }
.hm-2 { background:#6366f1; opacity:.5; }
.hm-3 { background:#6366f1; opacity:.75; }
.hm-4 { background:#6366f1; }
.heatmap-legend {
  display:flex;align-items:center;gap:.4rem;margin-top:.75rem;font-size:.75rem;
}
.heatmap-legend .hm-cell { animation:none; }

/* Weak topic card */
.weak-topic-card {
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:#fff;border:1.5px solid #fee2e2;border-radius:.75rem;
  padding:.75rem 1rem;
}
.weak-topic-info { flex:1;min-width:0; }
.weak-topic-stats { display:flex;align-items:center;gap:.75rem;flex-shrink:0; }
.wt-acc { font-size:1.1rem;font-weight:900; }
.acc-low { color:#dc2626; }
.acc-med { color:#d97706; }

/* Analytics quick links */
.analytics-quick-link {
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;
  padding:1.25rem;background:#fff;border:1.5px solid #e2e8f0;border-radius:1rem;
  text-decoration:none;color:#1e293b;font-weight:700;font-size:.85rem;
  transition:all .25s;
}
.analytics-quick-link i { font-size:1.5rem;color:var(--qlc,#6366f1); }
.analytics-quick-link:hover {
  border-color:var(--qlc,#6366f1);
  box-shadow:0 4px 14px rgba(0,0,0,.08);
  transform:translateY(-3px);color:#1e293b;
}

/* ╔══════════════════════════════════════════════════════════════╗
   ║  STUDY PLANNER                                               ║
   ╚══════════════════════════════════════════════════════════════╝ */

/* Exam countdown */
.exam-countdown-card {
  background:rgba(255,255,255,.1);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.2);border-radius:1.25rem;
  padding:1.5rem;text-align:center;
}
.ecc-label { font-size:.75rem;font-weight:700;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.25rem; }
.ecc-days  { font-size:3.5rem;font-weight:900;color:#fff;line-height:1;animation:streakPulse 3s ease infinite; }
.ecc-days-label { font-size:.9rem;color:rgba(255,255,255,.8);margin-bottom:.5rem; }
.ecc-date  { font-size:.8rem;color:rgba(255,255,255,.65);margin-bottom:.75rem; }
.ecc-pace { font-size:.8rem;font-weight:700;padding:.4rem .8rem;border-radius:2rem;display:inline-block; }
.pace-ok      { background:rgba(34,197,94,.2);color:#4ade80; }
.pace-warning { background:rgba(239,68,68,.2);color:#f87171; }

/* Week calendar */
.week-calendar {
  display:flex;gap:.5rem;overflow-x:auto;padding:.25rem 0;
}
.wc-day {
  min-width:70px;flex:1;background:#fff;border-radius:.75rem;
  border:1.5px solid #e2e8f0;padding:.75rem .5rem;text-align:center;
  transition:all .2s;
}
.wc-day.wc-today { border-color:#6366f1;background:rgba(99,102,241,.04); }
.wc-day.wc-studied { border-color:#22c55e; }
.wc-day-name { font-size:.7rem;font-weight:700;color:#94a3b8;text-transform:uppercase; }
.wc-day-date { font-size:1.1rem;font-weight:900;color:#1e293b;margin:.2rem 0; }
.wc-topics { font-size:.72rem;font-weight:700;color:#22c55e; }
.wc-xp     { font-size:.68rem;color:#f59e0b;font-weight:700; }
.wc-missed { font-size:.9rem;color:#e2e8f0; }
.wc-future { font-size:.8rem;color:#cbd5e1; }
.wc-today .wc-day-date { color:#6366f1; }

/* Planner subject card */
.planner-subject-card {
  background:#fff;border-radius:1.25rem;overflow:hidden;
  box-shadow:0 2px 16px rgba(0,0,0,.05);border:1px solid #f1f5f9;
  transition:transform .25s,box-shadow .25s;
}
.planner-subject-card:hover { transform:translateY(-3px);box-shadow:0 6px 24px rgba(0,0,0,.08); }
.planner-sub-header {
  display:flex;align-items:center;gap:.75rem;padding:1rem 1rem .75rem;
  border-bottom:1px solid #f1f5f9;
  --ck-color:#6366f1;
}
.planner-sub-icon {
  width:44px;height:44px;min-width:44px;border-radius:.6rem;
  display:flex;align-items:center;justify-content:center;font-size:1.1rem;
  background:var(--ck-light,rgba(99,102,241,.1));color:var(--ck-color,#6366f1);
}
.planner-sub-name { font-size:.95rem;font-weight:800;color:#1e293b; }
.planner-sub-meta { font-size:.75rem;color:#94a3b8;margin-top:.1rem; }

.planner-topic-pill {
  display:flex;align-items:center;justify-content:space-between;
  background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:.6rem;
  padding:.5rem .75rem;margin-bottom:.4rem;font-size:.82rem;font-weight:600;
  color:#475569;text-decoration:none;transition:all .2s;
}
.planner-topic-pill:hover {
  border-color:#6366f1;background:#eef2ff;color:#4338ca;
  transform:translateX(3px);
}
.planner-xp { font-size:.72rem;color:#f59e0b;font-weight:700;flex-shrink:0;margin-left:.5rem; }

/* ╔══════════════════════════════════════════════════════════════╗
   ║  AI MENTOR CHAT                                              ║
   ╚══════════════════════════════════════════════════════════════╝ */

.mentor-chat-panel {
  background:#fff;border-radius:1.25rem;
  box-shadow:0 4px 24px rgba(0,0,0,.08);
  overflow:hidden;display:flex;flex-direction:column;
  height:520px;border:1px solid #e2e8f0;
}
.mentor-chat-header {
  background:linear-gradient(135deg,#1e293b,#0f172a);
  padding:1rem 1.25rem;display:flex;align-items:center;gap:.75rem;
}
.mentor-avatar {
  width:40px;height:40px;border-radius:50%;
  background:linear-gradient(135deg,#6366f1,#a855f7);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;flex-shrink:0;
}
.mentor-name  { font-size:.95rem;font-weight:800;color:#fff; }
.mentor-status { font-size:.72rem;color:#4ade80;margin-top:.1rem; }
.mentor-messages {
  flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.75rem;
  background:#f8fafc;
}
.mentor-msg { max-width:85%;animation:fadeSlideUp .35s ease both; }
.mentor-msg.user {
  align-self:flex-end;
  background:linear-gradient(135deg,#6366f1,#8b5cf6);
  color:#fff;border-radius:1.25rem 1.25rem 0 1.25rem;
  padding:.65rem 1rem;font-size:.9rem;
}
.mentor-msg.bot {
  align-self:flex-start;
  background:#fff;color:#1e293b;
  border-radius:1.25rem 1.25rem 1.25rem 0;
  padding:.75rem 1rem;font-size:.9rem;
  border:1.5px solid #e2e8f0;line-height:1.55;
}
.mentor-typing {
  align-self:flex-start;
  background:#fff;border:1.5px solid #e2e8f0;border-radius:1.25rem;
  padding:.65rem 1rem;font-size:.8rem;color:#94a3b8;
  display:none;
}
.typing-dots span {
  display:inline-block;width:7px;height:7px;border-radius:50%;
  background:#94a3b8;margin:0 2px;
  animation:streakPulse .8s ease infinite;
}
.typing-dots span:nth-child(2) { animation-delay:.15s; }
.typing-dots span:nth-child(3) { animation-delay:.3s; }
.mentor-input-wrap {
  padding:.75rem;background:#fff;border-top:1px solid #e2e8f0;
  display:flex;gap:.5rem;
}
.mentor-input {
  flex:1;border:1.5px solid #e2e8f0;border-radius:.75rem;
  padding:.6rem .9rem;font-size:.9rem;outline:none;
  transition:border-color .2s;resize:none;
}
.mentor-input:focus { border-color:#6366f1; }
.mentor-send-btn {
  background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;
  border:none;border-radius:.75rem;width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:transform .2s,box-shadow .2s;flex-shrink:0;
}
.mentor-send-btn:hover { transform:scale(1.05);box-shadow:0 4px 14px rgba(99,102,241,.35); }
.mentor-quick-starters { padding:.5rem .75rem;border-top:1px solid #f1f5f9;background:#f8fafc;display:flex;gap:.4rem;flex-wrap:wrap; }
.mentor-quick-btn {
  font-size:.72rem;font-weight:600;padding:.25rem .6rem;border-radius:2rem;
  background:#eef2ff;border:1px solid #c7d2fe;color:#4338ca;cursor:pointer;transition:all .2s;
}
.mentor-quick-btn:hover { background:#6366f1;color:#fff;border-color:#6366f1; }

/* ╔══════════════════════════════════════════════════════════════╗
   ║  ENHANCED CLASS HUB — Feature bar                           ║
   ╚══════════════════════════════════════════════════════════════╝ */

.k12-feature-bar {
  background:#fff;border-bottom:1px solid #e2e8f0;padding:.6rem 0;
}
.k12-feature-btn {
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.4rem .9rem;border-radius:2rem;font-size:.78rem;font-weight:700;
  color:#64748b;border:1.5px solid #e2e8f0;text-decoration:none;
  transition:all .2s;background:#fff;
}
.k12-feature-btn:hover,.k12-feature-btn.active {
  color:#fff;border-color:transparent;
}
.kfb-practice:hover,.kfb-practice.active { background:linear-gradient(135deg,#22c55e,#16a34a); }
.kfb-leaderboard:hover,.kfb-leaderboard.active { background:linear-gradient(135deg,#f59e0b,#d97706); }
.kfb-badges:hover,.kfb-badges.active { background:linear-gradient(135deg,#a855f7,#7c3aed); }
.kfb-analytics:hover,.kfb-analytics.active { background:linear-gradient(135deg,#3b82f6,#2563eb); }
.kfb-planner:hover,.kfb-planner.active { background:linear-gradient(135deg,#14b8a6,#0d9488); }

/* ── Topics list enhancements ───────────────────────────────────── */
.k12-topic-row .topic-action-row {
  display:flex;gap:.5rem;margin-top:.4rem;
}
.topic-practice-btn {
  font-size:.7rem;font-weight:700;padding:.2rem .55rem;border-radius:2rem;
  background:#f0fdf4;border:1px solid #bbf7d0;color:#15803d;
  text-decoration:none;transition:all .2s;display:inline-flex;align-items:center;gap:.25rem;
}
.topic-practice-btn:hover { background:#22c55e;color:#fff;border-color:#22c55e; }
.topic-accuracy-pill {
  font-size:.7rem;font-weight:700;padding:.2rem .55rem;border-radius:2rem;
  display:inline-flex;align-items:center;gap:.25rem;
}
.acc-good { background:#f0fdf4;border:1px solid #bbf7d0;color:#15803d; }
.acc-fair { background:#fffbeb;border:1px solid #fde68a;color:#92400e; }
.acc-poor { background:#fef2f2;border:1px solid #fecaca;color:#991b1b; }

@media (max-width:600px) {
  .badge-grid { grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); }
  .lb-podium { gap:.5rem; }
  .lb-podium-avatar { width:50px;height:50px;font-size:1.2rem; }
  .pq-card { padding:1.25rem; }
  .pq-question { font-size:1rem; }
  .analytics-stat-card { padding:.75rem; }
  .asc-num { font-size:1.3rem; }
}