/* ─────────────────────────────────────────────────────────────
   TOKENS
───────────────────────────────────────────────────────────── */
:root {
  --gm-dark:     #0F1A14;
  --gm-forest:   #216D39;
  --gm-accent:   #03A860;
  --gm-orange:   #F97316;
  --gm-gold:     #F5B100;
  --gm-white:    #FFFFFF;
  --gm-off:      #F7FAF8;
  --gm-text:     #1A2E22;
  --gm-muted:    #64748B;
  --gm-border:   #E2E8F0;
  --gm-surface:  #FFFFFF;
  --gm-shadow:   0 1px 3px rgba(0,0,0,0.07), 0 4px 16px rgba(0,0,0,0.05);
  --gm-shadow-md:0 4px 12px rgba(0,0,0,0.08), 0 1px 3px rgba(0,0,0,0.06);
  --gm-shadow-lg:0 8px 32px rgba(0,0,0,0.10), 0 2px 8px rgba(0,0,0,0.06);
  --gm-r-card:   16px;
  --gm-r-input:  12px;
  --gm-r-btn:    12px;
  --gm-transition: 0.2s ease;
  /* Subject colours */
  --bio-bg:#F0FDF4; --bio-border:#216D39; --bio-text:#216D39;
  --chem-bg:#FFF7ED; --chem-border:#EA580C; --chem-text:#EA580C;
  --phys-bg:#EFF6FF; --phys-border:#0284C7; --phys-text:#0284C7;
}

/* ─────────────────────────────────────────────────────────────
   BASE
───────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
body {
  font-family: 'Inter', 'Nunito', sans-serif;
  background: var(--gm-off);
  color: var(--gm-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0; padding: 0;
}
h1,h2,h3,.gm-heading {
  font-family: 'Plus Jakarta Sans', 'Nunito', sans-serif;
  font-weight: 800; color: var(--gm-text); letter-spacing: -0.02em;
}

/* ─────────────────────────────────────────────────────────────
   AUTH — SPLIT PANEL (keep exactly as designed)
───────────────────────────────────────────────────────────── */
.v3-auth-wrap { display:flex; min-height:100vh; background:var(--gm-white); }
.v3-auth-left {
  flex:1; background:var(--gm-dark); display:flex; flex-direction:column;
  padding:36px; position:relative; overflow:hidden;
}
.v3-auth-left::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 30% 50%,rgba(3,168,96,0.18) 0%,transparent 70%);
  pointer-events:none;
}
.v3-auth-wordmark {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-weight:900;
  font-size:1.3rem; color:var(--gm-accent); letter-spacing:-0.02em; text-decoration:none;
}
.v3-auth-showcase {
  flex:1; display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:24px; padding:40px 0;
}
.v3-chat-bubble { border-radius:16px; padding:14px 18px; max-width:320px; line-height:1.6; }
.v3-chat-bubble.user {
  background:rgba(255,255,255,0.08); color:rgba(255,255,255,0.9);
  font-size:13px; font-weight:500; align-self:flex-end; border-bottom-right-radius:4px;
}
.v3-chat-bubble.ai {
  background:rgba(3,168,96,0.15); border:1px solid rgba(3,168,96,0.3);
  color:rgba(255,255,255,0.92); font-size:13px; font-weight:500; border-bottom-left-radius:4px;
}
.v3-auth-trust { display:flex; align-items:center; gap:8px; font-size:12px; color:rgba(255,255,255,0.45); font-weight:500; }
.v3-auth-stars { color:var(--gm-gold); font-size:13px; letter-spacing:1px; }
.v3-auth-right {
  width:480px; display:flex; flex-direction:column; align-items:center;
  justify-content:center; padding:48px; background:var(--gm-white); overflow-y:auto;
}
.v3-auth-form-wrap { width:100%; max-width:380px; }
.v3-auth-heading {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:2rem; font-weight:800;
  color:var(--gm-text); letter-spacing:-0.03em; margin-bottom:6px;
}
.v3-auth-sub { font-size:0.9rem; color:var(--gm-muted); font-weight:500; margin-bottom:28px; }
.v3-form-label { display:block; font-size:0.85rem; font-weight:600; color:var(--gm-text); margin-bottom:6px; }
.v3-form-input {
  width:100%; height:48px; padding:0 14px;
  border:1.5px solid var(--gm-border); border-radius:var(--gm-r-input);
  font-family:'Inter','Nunito',sans-serif; font-size:0.95rem; font-weight:500;
  color:var(--gm-text); background:var(--gm-white); outline:none;
  transition:border-color var(--gm-transition),box-shadow var(--gm-transition);
}
.v3-form-input:focus { border-color:var(--gm-accent); box-shadow:0 0 0 3px rgba(3,168,96,0.12); }
.v3-pw-wrap { position:relative; }
.v3-pw-wrap .v3-form-input { padding-right:44px; }
.v3-pw-toggle {
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  background:none; border:none; cursor:pointer; color:var(--gm-muted); font-size:16px; padding:4px; line-height:1;
}
.v3-form-group { margin-bottom:16px; }
.v3-form-group-row { display:flex; justify-content:flex-end; margin-bottom:4px; }
.v3-forgot { font-size:0.82rem; color:var(--gm-accent); font-weight:600; text-decoration:none; }
.v3-forgot:hover { text-decoration:underline; }
.v3-btn-primary {
  width:100%; height:48px; border:none; border-radius:var(--gm-r-btn);
  background:var(--gm-forest); color:#fff;
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:0.95rem; font-weight:700;
  cursor:pointer; transition:all var(--gm-transition); margin-top:4px;
}
.v3-btn-primary:hover { background:#1a5c2e; transform:translateY(-1px); box-shadow:0 4px 14px rgba(33,109,57,0.3); }
.v3-btn-primary:disabled { opacity:0.55; cursor:not-allowed; transform:none; box-shadow:none; }
.v3-btn-orange {
  width:100%; height:48px; border:none; border-radius:var(--gm-r-btn);
  background:var(--gm-orange); color:#fff;
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:0.95rem; font-weight:700;
  cursor:pointer; transition:all var(--gm-transition);
}
.v3-btn-orange:hover { background:#e56210; transform:translateY(-1px); box-shadow:0 4px 14px rgba(249,115,22,0.3); }
.v3-btn-ghost {
  width:100%; height:48px; border:1.5px solid var(--gm-border); border-radius:var(--gm-r-btn);
  background:transparent; color:var(--gm-text);
  font-family:'Inter','Nunito',sans-serif; font-size:0.9rem; font-weight:600;
  cursor:pointer; transition:all var(--gm-transition);
}
.v3-btn-ghost:hover { border-color:var(--gm-forest); color:var(--gm-forest); background:rgba(33,109,57,0.04); }
.v3-divider { display:flex; align-items:center; gap:12px; margin:20px 0; color:var(--gm-muted); font-size:0.82rem; font-weight:500; }
.v3-divider::before,.v3-divider::after { content:''; flex:1; height:1px; background:var(--gm-border); }
.v3-auth-switch { text-align:center; margin-top:24px; font-size:0.875rem; color:var(--gm-muted); font-weight:500; }
.v3-auth-switch a { color:var(--gm-forest); font-weight:600; text-decoration:none; cursor:pointer; }
.v3-auth-switch a:hover { text-decoration:underline; }
.v3-auth-terms { font-size:0.75rem; color:var(--gm-muted); text-align:center; margin-top:16px; line-height:1.6; }
.v3-auth-terms a { color:var(--gm-forest); }
.v3-role-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:18px; }
.v3-role-btn {
  padding:14px 8px; border:1.5px solid var(--gm-border); border-radius:var(--gm-r-card);
  background:var(--gm-white); cursor:pointer; text-align:center;
  transition:all var(--gm-transition); font-family:'Inter','Nunito',sans-serif;
}
.v3-role-btn:hover { border-color:var(--gm-forest); background:rgba(33,109,57,0.04); }
.v3-role-btn.active { border-color:var(--gm-forest); background:rgba(33,109,57,0.07); }
.v3-role-icon { font-size:1.5rem; margin-bottom:5px; }
.v3-role-label { font-size:0.8rem; font-weight:600; color:var(--gm-text); }
.v3-year-grid { display:flex; gap:6px; flex-wrap:wrap; }
.v3-year-pill {
  padding:6px 14px; border:1.5px solid var(--gm-border); border-radius:999px;
  font-size:0.82rem; font-weight:600; color:var(--gm-muted); cursor:pointer; background:var(--gm-white);
  transition:all var(--gm-transition);
}
.v3-year-pill:hover,.v3-year-pill.active { border-color:var(--gm-forest); color:var(--gm-forest); background:rgba(33,109,57,0.07); }
.v3-pw-strength { height:3px; border-radius:999px; background:var(--gm-border); margin-top:6px; overflow:hidden; }
.v3-pw-strength-bar { height:100%; border-radius:999px; transition:width 0.3s,background 0.3s; }
.v3-auth-error {
  background:#FEF2F2; border:1.5px solid #FCA5A5; border-radius:8px;
  padding:10px 14px; font-size:0.85rem; font-weight:600; color:#DC2626; margin-bottom:16px; display:none;
}
@media (max-width:767px) {
  .v3-auth-wrap { flex-direction:column; }
  .v3-auth-left { min-height:200px; padding:24px 20px 20px; flex:none; }
  .v3-auth-showcase { display:none; }
  .v3-auth-trust { display:none; }
  .v3-auth-right { width:100%; padding:28px 20px; }
}

/* ─────────────────────────────────────────────────────────────
   SIDEBAR (desktop 1024px+) — replaces top nav
───────────────────────────────────────────────────────────── */
.v3-sidebar {
  position:fixed; left:0; top:0; bottom:0; width:64px;
  background:var(--gm-forest); z-index:200;
  display:none; flex-direction:column; align-items:center;
  padding:0; box-shadow:2px 0 8px rgba(0,0,0,0.12);
}
@media (min-width:1024px) {
  .v3-sidebar { display:flex; }
  #app:has(.v3-sidebar) { padding-left:64px; }
}
.v3-sb-mono {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-weight:900;
  font-size:20px; color:#fff; margin-top:16px; margin-bottom:4px;
  text-align:center; width:100%;
}
/* Desktop-only counterpart to .v3-beta-pill -- the sidebar has no wordmark to attach
   the light-tint version to (icon-only rail, solid forest-green background), so this
   is a light-on-dark variant of the same small pill shape, always visible under the
   "G" monogram rather than hover-only, matching Part 1's "always visible at the
   primary brand-mark" intent. */
.v3-sb-beta-pill {
  display:block; width:fit-content; margin:0 auto 24px;
  font-size:0.55rem; font-weight:800; letter-spacing:0.06em; text-transform:uppercase;
  color:rgba(255,255,255,0.85); background:rgba(255,255,255,0.14);
  border-radius:999px; padding:2px 6px;
}
.v3-sb-nav { display:flex; flex-direction:column; gap:8px; flex:1; align-items:center; padding-top:4px; }
.v3-sb-item {
  width:40px; height:40px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  border:none; background:transparent; cursor:pointer; font-size:20px;
  transition:background var(--gm-transition), opacity var(--gm-transition);
  opacity:0.6;
}
.v3-sb-item:hover { background:rgba(255,255,255,0.14); opacity:0.85; }
.v3-sb-item.active { background:rgba(255,255,255,0.2); opacity:1; }
.v3-sb-streak {
  color:rgba(255,255,255,0.85); font-size:11px; font-weight:700;
  text-align:center; margin-bottom:16px; line-height:1.3;
}

/* Hide old top-nav on desktop when sidebar is present */
@media (min-width:1024px) { .v3-nav { display:none !important; } }

/* ─────────────────────────────────────────────────────────────
   OLD TOP NAV (mobile only)
───────────────────────────────────────────────────────────── */
.v3-nav {
  position:sticky; top:0; z-index:150;
  height:56px; background:var(--gm-white);
  border-bottom:1px solid var(--gm-border);
  display:flex; align-items:center; padding:0 16px; gap:0;
}
.v3-nav-logo {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-weight:900;
  font-size:1.1rem; color:var(--gm-forest); letter-spacing:-0.02em; flex-shrink:0;
}
/* Small, muted pill next to the primary GradeMastery wordmark only (auth screen + main
   nav logo) -- a soft tint of the brand's own forest green rather than a separate loud
   colour, echoing the same uppercase small-label treatment as the Founding Member badge. */
.v3-beta-pill {
  display:inline-flex; align-items:center; vertical-align:middle;
  background:rgba(33,109,57,0.08); border:1px solid rgba(33,109,57,0.18);
  color:var(--gm-forest); border-radius:999px; padding:2px 8px; margin-left:6px;
  font-size:0.62rem; font-weight:800; letter-spacing:0.06em; text-transform:uppercase;
}
.v3-nav-tabs { display:flex; align-items:center; gap:2px; flex:1; justify-content:center; }
.v3-nav-tab {
  display:flex; align-items:center; gap:5px; padding:7px 14px; border-radius:8px; border:none;
  background:transparent; font-family:'Inter','Nunito',sans-serif; font-size:0.85rem;
  font-weight:500; color:var(--gm-muted); cursor:pointer; transition:all var(--gm-transition);
}
.v3-nav-tab:hover { color:var(--gm-text); background:rgba(0,0,0,0.04); }
.v3-nav-tab.active { color:var(--gm-forest); font-weight:600; }
.v3-nav-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.v3-streak-pill {
  display:flex; align-items:center; gap:4px; background:#FFF7ED;
  border:1.5px solid var(--gm-orange); border-radius:999px; padding:5px 10px;
  font-size:0.78rem; font-weight:700; color:var(--gm-orange);
}
.v3-xp-pill {
  display:flex; align-items:center; gap:4px; background:#FFFBEB;
  border:1.5px solid var(--gm-gold); border-radius:999px; padding:5px 10px;
  font-size:0.78rem; font-weight:700; color:#92660A;
}
.v3-avatar {
  width:34px; height:34px; border-radius:50%; background:var(--gm-forest); color:#fff;
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:0.8rem; font-weight:700;
  display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0;
  border:none; transition:box-shadow var(--gm-transition);
}
.v3-avatar:hover { box-shadow:0 0 0 3px rgba(33,109,57,0.25); }
@media (max-width:767px) { .v3-nav-tabs { display:none; } .v3-xp-pill { display:none; } }

/* ─────────────────────────────────────────────────────────────
   BOTTOM NAV (mobile + tablet)
───────────────────────────────────────────────────────────── */
.v3-bottom-nav {
  display:none; position:fixed; bottom:0; left:0; right:0; z-index:200;
  height:calc(64px + env(safe-area-inset-bottom,0px));
  padding-bottom:env(safe-area-inset-bottom,0px);
  background:var(--gm-white); border-top:0.5px solid var(--gm-border);
  flex-direction:row; justify-content:space-around; align-items:stretch;
}
@media (max-width:1023px) { .v3-bottom-nav { display:flex; } }
.v3-bnav-item {
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; border:none; background:none; cursor:pointer; color:var(--gm-muted);
  transition:color var(--gm-transition); font-family:'Inter','Nunito',sans-serif; padding-top:8px;
}
.v3-bnav-item.active { color:var(--gm-forest); }
.v3-bnav-icon { font-size:20px; line-height:1; }
.v3-bnav-label { font-size:9px; font-weight:600; }

/* ─────────────────────────────────────────────────────────────
   CONTENT WRAPPER
───────────────────────────────────────────────────────────── */
.v3-screen {
  padding:16px; max-width:960px; margin:0 auto;
  padding-bottom:calc(80px + env(safe-area-inset-bottom,0px));
}
@media (min-width:768px) { .v3-screen { padding:24px 24px 32px; } }
@media (max-width:1023px) {
  .screen { padding-bottom:80px !important; }
  .v3-screen { padding-bottom:calc(80px + env(safe-area-inset-bottom,0px)); }
}

/* ─────────────────────────────────────────────────────────────
   SECTION LABEL (reuse everywhere)
───────────────────────────────────────────────────────────── */
.v3-section-label {
  font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; color:var(--gm-muted); margin:20px 0 10px;
}

/* ─────────────────────────────────────────────────────────────
   GREETING CARD
───────────────────────────────────────────────────────────── */
.v3-greeting-card {
  background:linear-gradient(135deg,#216D39,#03A860); border-radius:var(--gm-r-card);
  box-shadow:var(--gm-shadow-md); padding:20px; margin-bottom:12px;
}
.v3-greeting-name {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif;
  font-size:1.2rem; font-weight:800; color:#fff; margin-bottom:8px;
}
.v3-greeting-pills { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.v3-streak-pill-sm {
  display:inline-flex; align-items:center; gap:4px;
  background:rgba(255,255,255,0.18); color:#fff; border:1px solid rgba(255,255,255,0.5);
  border-radius:999px; padding:4px 12px; font-size:12px; font-weight:700;
}
.v3-xp-pill-sm {
  display:inline-flex; align-items:center; gap:4px;
  background:rgba(255,255,255,0.18); color:#fff; border:1px solid rgba(255,255,255,0.5);
  border-radius:999px; padding:4px 12px; font-size:12px; font-weight:700;
}
.v3-progress-bar-wrap { margin-top:12px; }
.v3-progress-bar-track {
  height:6px; border-radius:3px; background:rgba(255,255,255,0.3); overflow:hidden;
}
.v3-progress-bar-fill {
  height:100%; border-radius:3px; background:#fff;
  transition:width 0.6s cubic-bezier(0.4,0,0.2,1);
}
.v3-streak-motiv {
  font-size:13px; color:rgba(255,255,255,0.8); margin-top:8px; cursor:pointer;
  display:flex; align-items:center; gap:6px; user-select:none;
}
.v3-streak-motiv-body { display:none; font-size:12px; color:rgba(255,255,255,0.75); margin-top:6px; line-height:1.6; }
.v3-streak-motiv-body.open { display:block; }

/* ─────────────────────────────────────────────────────────────
   SUBJECT CARDS (pastel, bold borders)
───────────────────────────────────────────────────────────── */
.v3-subject-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media (max-width:640px) { .v3-subject-grid { grid-template-columns:1fr; } }
.v3-subject-card {
  border-radius:var(--gm-r-card); padding:16px;
  cursor:pointer; transition:transform var(--gm-transition), box-shadow var(--gm-transition);
  position:relative; display:flex; flex-direction:column; gap:4px;
}
.v3-subject-card:hover { transform:translateY(-2px); box-shadow:var(--gm-shadow-md); }
.v3-subject-card.bio  { background:var(--bio-bg);  border:2px solid var(--bio-border);  }
.v3-subject-card.chem { background:var(--chem-bg); border:2px solid var(--chem-border); }
.v3-subject-card.phys { background:var(--phys-bg); border:2px solid var(--phys-border); }
.v3-subj-row1 { display:flex; align-items:center; gap:8px; margin-bottom:4px; }
.v3-subj-emoji { font-size:1.25rem; }
.v3-subj-name { font-size:14px; font-weight:700; }
.v3-subj-name.bio  { color:var(--bio-text);  }
.v3-subj-name.chem { color:var(--chem-text); }
.v3-subj-name.phys { color:var(--phys-text); }
.v3-subj-count-row { display:flex; align-items:flex-end; gap:6px; margin:6px 0; }
.v3-subj-count {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif;
  font-size:32px; font-weight:900; line-height:1; font-variant-numeric:tabular-nums;
}
.v3-subj-count.bio  { color:var(--bio-text);  }
.v3-subj-count.chem { color:var(--chem-text); }
.v3-subj-count.phys { color:var(--phys-text); }
.v3-subj-count-lbl { font-size:12px; color:var(--gm-muted); font-weight:500; padding-bottom:4px; }
.v3-subj-bar-track {
  height:6px; border-radius:3px; overflow:hidden; margin:4px 0 10px;
  transition:width 0.6s cubic-bezier(0.4,0,0.2,1);
}
.v3-subj-bar-track.bio  { background:rgba(33,109,57,0.15);  }
.v3-subj-bar-track.chem { background:rgba(234,88,12,0.15);  }
.v3-subj-bar-track.phys { background:rgba(2,132,199,0.15);  }
.v3-subj-bar-fill { height:100%; border-radius:3px; }
.v3-subj-bar-fill.bio  { background:var(--bio-border);  }
.v3-subj-bar-fill.chem { background:var(--chem-border); }
.v3-subj-bar-fill.phys { background:var(--phys-border); }
.v3-subj-btn {
  width:100%; height:40px; border:none; border-radius:10px;
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:13px; font-weight:700;
  cursor:pointer; transition:filter var(--gm-transition); color:#fff;
}
.v3-subj-btn.bio  { background:var(--bio-border);  }
.v3-subj-btn.chem { background:var(--chem-border); }
.v3-subj-btn.phys { background:var(--phys-border); }
.v3-subj-btn:hover { filter:brightness(0.9); }
.v3-subj-btn:disabled { opacity:0.45; cursor:default; filter:none; }
.v3-subj-badge {
  position:absolute; top:10px; right:10px;
  width:26px; height:26px; border-radius:50%;
  background:#EF4444; color:#fff; font-size:11px; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 6px rgba(239,68,68,0.4);
}
.v3-subj-badge.pro { background:var(--gm-forest); border-radius:20px; width:auto; padding:0 8px; font-size:10px; }

/* ─────────────────────────────────────────────────────────────
   FEATURE CARDS
───────────────────────────────────────────────────────────── */
.v3-feature-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
@media (min-width:768px) { .v3-feature-grid { grid-template-columns:repeat(4,1fr); } }
.v3-feature-card {
  background:var(--gm-white); border-radius:var(--gm-r-card);
  border:0.5px solid var(--gm-border); padding:16px 14px;
  cursor:pointer; transition:all var(--gm-transition); box-shadow:var(--gm-shadow);
}
.v3-feature-card:hover {
  border-color:var(--gm-forest); box-shadow:0 4px 12px rgba(0,0,0,0.08);
  transform:translateY(-1px);
}
.v3-feature-icon { font-size:28px; margin-bottom:8px; display:block; }
.v3-feature-title {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif;
  font-size:14px; font-weight:700; color:var(--gm-text); margin-bottom:4px;
}
.v3-feature-desc { font-size:12px; color:var(--gm-muted); font-weight:500; line-height:1.5; }

/* ─────────────────────────────────────────────────────────────
   XP BAR
───────────────────────────────────────────────────────────── */
.v3-xp-bar-wrap {
  background:var(--gm-white); border-radius:var(--gm-r-card);
  border:1px solid var(--gm-border); padding:14px 16px; margin-bottom:4px;
  box-shadow:var(--gm-shadow);
}
.v3-xp-bar-top { display:flex; justify-content:space-between; margin-bottom:8px; }
.v3-xp-level { font-size:14px; font-weight:700; color:var(--gm-text); }
.v3-xp-pts { font-size:14px; font-weight:700; color:var(--gm-forest); font-variant-numeric:tabular-nums; }
.v3-xp-track { height:6px; background:var(--gm-border); border-radius:3px; overflow:hidden; }
.v3-xp-fill { height:100%; background:linear-gradient(90deg,var(--gm-accent),var(--gm-forest)); border-radius:3px; transition:width 0.6s cubic-bezier(.34,1.56,.64,1); }

/* ─────────────────────────────────────────────────────────────
   STREAK (7-day row)
───────────────────────────────────────────────────────────── */
.v3-streak-row { display:flex; gap:6px; }
.v3-streak-day {
  width:32px; display:flex; flex-direction:column; align-items:center; gap:3px;
}
.v3-streak-pip {
  width:32px; height:32px; border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700;
}
.v3-streak-pip.done { background:var(--gm-orange); color:#fff; }
.v3-streak-pip.today-done { background:var(--gm-forest); color:#fff; }
.v3-streak-pip.today-pending { border:2px dashed var(--gm-border); color:var(--gm-muted); background:transparent; }
.v3-streak-pip.future { background:var(--gm-off); border:1px solid var(--gm-border); color:rgba(100,116,139,0.4); }
.v3-streak-day-lbl { font-size:10px; color:var(--gm-muted); text-align:center; }

/* ─────────────────────────────────────────────────────────────
   FLASHCARD SCREEN
───────────────────────────────────────────────────────────── */
.v3-fc-header {
  display:flex; align-items:center; gap:10px; padding:12px 16px;
  background:var(--gm-white); border-bottom:1px solid var(--gm-border);
  position:sticky; top:0; z-index:100;
}
@media (min-width:1024px) { .v3-fc-header { top:0; } }
.v3-fc-progress-track { flex:1; height:6px; background:var(--gm-border); border-radius:3px; overflow:hidden; }
.v3-fc-progress-fill { height:100%; background:var(--gm-accent); border-radius:3px; transition:width 0.4s ease; }
.v3-fc-counter { font-size:13px; font-weight:600; color:var(--gm-muted); white-space:nowrap; font-variant-numeric:tabular-nums; }
.v3-card {
  background:var(--gm-white); border-radius:var(--gm-r-card);
  border:1px solid var(--gm-border); padding:24px;
  box-shadow:var(--gm-shadow); margin-bottom:12px;
}
.v3-card-meta { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; flex-wrap:wrap; gap:6px; }
.v3-card-tag { font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px; }
.v3-card-question {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:1.1rem; font-weight:700;
  color:var(--gm-text); line-height:1.5; text-align:center; padding:8px 0;
}
.v3-reveal-btn {
  width:100%; height:48px; border:1.5px solid var(--gm-forest); border-radius:var(--gm-r-btn);
  background:var(--gm-forest); color:#fff;
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:15px; font-weight:700;
  cursor:pointer; transition:all var(--gm-transition);
}
.v3-reveal-btn:hover { background:#1a5c2e; }
.v3-answer-sec { border-top:1px solid var(--gm-border); padding-top:16px; margin-top:4px; animation:fadeUp .28s ease; }
.v3-answer-label {
  font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; color:var(--gm-forest); margin-bottom:12px;
}
.v3-answer-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.v3-answer-list li {
  font-size:15px; font-weight:500; color:#334155; line-height:1.65;
  padding-left:14px; border-left:3px solid var(--gm-accent);
}
.v3-answer-list li strong { color:var(--gm-forest); font-weight:700; }
.v3-ai-toggle-card {
  background:var(--gm-white); border-radius:var(--gm-r-card); border:1px solid var(--gm-border);
  padding:12px 16px; display:flex; align-items:center; justify-content:space-between;
  box-shadow:var(--gm-shadow); margin-bottom:12px;
}
.v3-ai-toggle-name { font-size:14px; font-weight:700; color:var(--gm-text); }
.v3-ai-toggle-sub { font-size:12px; color:var(--gm-muted); font-weight:500; margin-top:2px; }
.v3-toggle {
  width:44px; height:24px; border-radius:999px; background:var(--gm-border);
  position:relative; cursor:pointer; transition:background var(--gm-transition); flex-shrink:0; border:none;
}
.v3-toggle.on { background:var(--gm-accent); }
.v3-toggle::after {
  content:''; position:absolute; top:3px; left:3px;
  width:18px; height:18px; border-radius:50%; background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,0.2); transition:left var(--gm-transition);
}
.v3-toggle.on::after { left:23px; }
.v3-self-grade-link { font-size:12px; color:var(--gm-muted); font-weight:500; text-align:center; margin-bottom:8px; }
.v3-self-grade-link span { text-decoration:underline; cursor:pointer; }
.v3-textarea {
  width:100%; min-height:100px; padding:12px 14px;
  border:1.5px solid var(--gm-border); border-radius:var(--gm-r-input);
  font-family:'Inter','Nunito',sans-serif; font-size:15px; font-weight:500;
  color:var(--gm-text); resize:vertical; outline:none;
  transition:border-color var(--gm-transition),box-shadow var(--gm-transition);
}
.v3-textarea:focus { border-color:var(--gm-accent); box-shadow:0 0 0 3px rgba(3,168,96,0.12); }
.v3-submit-btn {
  width:100%; height:48px; border:none; border-radius:var(--gm-r-btn);
  background:var(--gm-forest); color:#fff;
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:15px; font-weight:700;
  cursor:pointer; transition:all var(--gm-transition);
  display:flex; align-items:center; justify-content:center; gap:6px;
}
.v3-submit-btn:hover { background:#1a5c2e; transform:translateY(-1px); box-shadow:0 4px 12px rgba(33,109,57,0.3); }
.v3-submit-btn:disabled { opacity:0.55; cursor:not-allowed; transform:none; box-shadow:none; }
.v3-submit-btn.secondary {
  background:var(--gm-off); color:var(--gm-text); border:1.5px solid var(--gm-border);
}
.v3-submit-btn.secondary:hover { background:#eef3ee; transform:none; box-shadow:none; }
.v3-ai-counter { font-size:12px; color:var(--gm-muted); text-align:center; margin-top:6px; font-weight:500; font-variant-numeric:tabular-nums; }
.v3-marking-row { display:flex; justify-content:space-between; align-items:center; margin-top:8px; }
.v3-marking-pill {
  display:inline-flex; align-items:center; gap:4px;
  border-radius:999px; padding:4px 10px; font-size:12px; font-weight:600;
}
.v3-marking-pill.smart { background:var(--gm-forest); color:#fff; }
.v3-marking-pill.basic { background:var(--gm-off); color:var(--gm-muted); border:0.5px solid var(--gm-border); }
.v3-mark-self-link { font-size:12px; color:var(--gm-muted); text-decoration:underline; cursor:pointer; }
.v3-rating-prompt { text-align:center; font-size:13px; font-weight:600; color:var(--gm-muted); margin-bottom:10px; }
.v3-rating-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.v3-rate-btn {
  height:48px; border-radius:var(--gm-r-btn); font-family:'Plus Jakarta Sans','Nunito',sans-serif;
  font-weight:700; font-size:13px; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:3px; transition:all var(--gm-transition);
}
.v3-rate-btn:hover { transform:translateY(-2px); }
.v3-rate-btn .em { font-size:18px; }
.v3-rate-btn.again { background:#FEF2F2; color:#DC2626; border:1.5px solid #FECACA; }
.v3-rate-btn.hard  { background:#FFFBEB; color:#D97706; border:1.5px solid #FDE68A; }
.v3-rate-btn.good  { background:var(--gm-forest); color:#fff; border:1.5px solid var(--gm-forest); }
.v3-rate-btn.easy  { background:var(--gm-accent); color:#fff; border:1.5px solid var(--gm-accent); }

/* ─────────────────────────────────────────────────────────────
   PROFILE SCREEN
───────────────────────────────────────────────────────────── */
.v3-profile-card {
  background:var(--gm-white); border-radius:var(--gm-r-card);
  box-shadow:var(--gm-shadow); margin-bottom:12px; overflow:hidden;
}
.v3-profile-hero {
  background:linear-gradient(135deg,#B45309,#F5B100);
  border-radius:16px 16px 0 0; padding:24px; text-align:center;
}
.v3-profile-avatar {
  width:72px; height:72px; border-radius:50%; background:rgba(255,255,255,0.25); color:#fff;
  font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:24px; font-weight:800;
  display:flex; align-items:center; justify-content:center; margin:0 auto 12px;
}
.v3-profile-name {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif;
  font-size:1.2rem; font-weight:800; color:#fff;
}
.v3-profile-role-pill {
  display:inline-block; background:rgba(255,255,255,0.2); color:#fff;
  font-size:12px; font-weight:600; border-radius:999px; padding:4px 12px; margin-top:6px;
}
.v3-profile-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:0; background:var(--gm-white); border-radius:0 0 16px 16px; padding:16px 0; }
.v3-profile-stat { text-align:center; }
.v3-profile-stat:not(:last-child) { border-right:0.5px solid var(--gm-border); }
.v3-stat-num {
  font-family:'Plus Jakarta Sans','Nunito',sans-serif;
  font-size:20px; font-weight:800; color:var(--gm-text); font-variant-numeric:tabular-nums; display:block;
}
.v3-stat-lbl { font-size:11px; font-weight:500; color:var(--gm-muted); text-transform:uppercase; letter-spacing:0.06em; margin-top:2px; display:block; }
.v3-profile-section {
  background:var(--gm-white); border-radius:var(--gm-r-card);
  box-shadow:0 1px 3px rgba(0,0,0,0.06); padding:16px; margin-bottom:12px;
}
.v3-profile-section-lbl {
  font-size:11px; font-weight:700; color:var(--gm-muted); text-transform:uppercase;
  letter-spacing:0.08em; margin-bottom:12px;
}
.v3-accent-picker { display:flex; gap:8px; flex-wrap:wrap; }
.v3-accent-swatch {
  width:32px; height:32px; border-radius:50%; cursor:pointer;
  transition:box-shadow var(--gm-transition); border:none; flex-shrink:0;
}
.v3-accent-swatch.active { box-shadow:0 0 0 2px #fff, 0 0 0 4px currentColor; }

/* ─────────────────────────────────────────────────────────────
   PROGRESS / HISTORY SCREEN
───────────────────────────────────────────────────────────── */
.v3-topic-row {
  height:48px; display:flex; align-items:center; gap:0;
  background:var(--gm-white); border-bottom:0.5px solid var(--gm-border);
  transition:background var(--gm-transition); cursor:default;
}
.v3-topic-row:hover { background:var(--gm-off); }
.v3-topic-name { font-size:14px; font-weight:600; color:var(--gm-text); flex:1; padding-left:16px; }
.v3-topic-bar-wrap { flex:1; max-width:160px; margin:0 16px; }
.v3-topic-bar-track { height:6px; border-radius:3px; overflow:hidden; }
.v3-topic-pct { font-size:13px; font-weight:700; min-width:40px; text-align:right; font-variant-numeric:tabular-nums; padding-right:16px; }
.v3-history-section-hdr {
  font-size:11px; font-weight:700; color:var(--gm-muted); text-transform:uppercase;
  letter-spacing:0.1em; background:var(--gm-off); padding:8px 16px;
  position:sticky; top:0; z-index:10;
}

/* Mastery dots */
.v3-mastery-dot {
  width:8px; height:8px; border-radius:50%; border:1px solid #fff;
  display:inline-block; margin-left:4px; flex-shrink:0;
}
.v3-mastery-dot.bronze { background:#CD7F32; }
.v3-mastery-dot.silver { background:#C0C0C0; }
.v3-mastery-dot.gold   { background:var(--gm-gold); }

/* ─────────────────────────────────────────────────────────────
   TEACHER PORTAL
───────────────────────────────────────────────────────────── */
.v3-class-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:16px; }
.v3-class-stat-card {
  border-radius:var(--gm-r-card); padding:16px; text-align:center;
  border:1px solid transparent;
}
.v3-class-stat-card.bio  { background:var(--bio-bg);  border-color:#BBF7D0; }
.v3-class-stat-card.blue { background:#EFF6FF; border-color:#BFDBFE; }
.v3-class-stat-card.orng { background:var(--chem-bg); border-color:#FED7AA; }
.v3-class-stat-num { font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:24px; font-weight:800; font-variant-numeric:tabular-nums; display:block; margin-bottom:4px; }
.v3-class-stat-lbl { font-size:11px; font-weight:500; color:var(--gm-muted); text-transform:uppercase; letter-spacing:0.06em; }
.v3-student-card {
  background:var(--gm-white); border-radius:var(--gm-r-card); padding:16px;
  margin-bottom:8px; box-shadow:0 1px 3px rgba(0,0,0,0.06);
  border-left:3px solid var(--gm-forest); display:flex; align-items:center; gap:12px;
}
.v3-student-card.inactive { border-left-color:#E2E8F0; }
.v3-student-name { font-size:16px; font-weight:700; color:var(--gm-text); }
.v3-student-meta { font-size:13px; color:var(--gm-muted); display:flex; gap:12px; margin-top:2px; flex-wrap:wrap; }
.v3-student-status { font-size:16px; font-weight:700; flex-shrink:0; margin-left:auto; }
.v3-ping-btn {
  background:#FFFBEB; color:#D97706; border:1px solid #FDE68A;
  border-radius:var(--gm-r-btn); height:32px; padding:0 12px;
  font-size:11px; font-weight:700; cursor:pointer; font-family:inherit;
  transition:all var(--gm-transition); flex-shrink:0;
}
.v3-ping-btn:hover { background:#FEF3C7; }

/* ─────────────────────────────────────────────────────────────
   PARENT PORTAL
───────────────────────────────────────────────────────────── */
.v3-child-card {
  background:var(--gm-white); border-radius:20px;
  border:2px solid var(--gm-forest); padding:20px; margin-bottom:12px;
}
.v3-fortnightly-card {
  background:#FEFCE8; border:1.5px solid #FDE68A; border-radius:20px;
  padding:16px; margin-bottom:12px;
}
.v3-fortnightly-title { font-size:14px; font-weight:700; color:#B45309; margin-bottom:8px; }
.v3-convo-starter {
  font-style:italic; color:var(--gm-muted); border-left:3px solid var(--gm-gold);
  padding-left:12px; margin-top:12px; font-size:13px; line-height:1.6;
}

/* ─────────────────────────────────────────────────────────────
   GENERAL BUTTONS
───────────────────────────────────────────────────────────── */
.gm-btn {
  height:48px; border:none; border-radius:var(--gm-r-btn); font-family:'Plus Jakarta Sans','Nunito',sans-serif;
  font-size:15px; font-weight:700; cursor:pointer; transition:all var(--gm-transition);
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
}
.gm-btn:disabled { opacity:0.5; cursor:not-allowed; transform:none !important; box-shadow:none !important; }
.gm-btn-primary { background:var(--gm-forest); color:#fff; }
.gm-btn-primary:hover { background:#1a5c2e; transform:translateY(-1px); box-shadow:0 4px 14px rgba(33,109,57,0.3); }
.gm-btn-secondary { background:var(--gm-white); color:var(--gm-text); border:1.5px solid var(--gm-border); }
.gm-btn-secondary:hover { background:var(--gm-off); }
.gm-btn-ghost { background:transparent; color:var(--gm-forest); }
.gm-btn-ghost:hover { background:#F0FDF4; }
.gm-btn-full { width:100%; }

/* ─────────────────────────────────────────────────────────────
   INPUTS
───────────────────────────────────────────────────────────── */
.gm-input {
  height:48px; border-radius:var(--gm-r-input); border:1.5px solid var(--gm-border);
  padding:0 14px; font-family:'Inter','Nunito',sans-serif; font-size:15px;
  font-weight:500; color:var(--gm-text); background:var(--gm-white); outline:none; width:100%;
  transition:border-color var(--gm-transition),box-shadow var(--gm-transition);
}
.gm-input:focus { border-color:var(--gm-accent); box-shadow:0 0 0 3px rgba(3,168,96,0.12); }
.gm-label { display:block; font-size:13px; font-weight:600; color:var(--gm-text); margin-bottom:6px; }
.gm-error { font-size:12px; color:#DC2626; margin-top:4px; display:block; }

/* ─────────────────────────────────────────────────────────────
   TOAST
───────────────────────────────────────────────────────────── */
.v3-toast {
  position:fixed; top:16px; right:16px; z-index:9998;
  max-width:280px; min-width:200px; width:auto;
  background:var(--gm-white); color:var(--gm-text); border-radius:12px;
  padding:12px 16px; font-size:13px; font-weight:500;
  box-shadow:0 4px 16px rgba(0,0,0,0.12);
  display:flex; align-items:center; gap:10px;
  border-left:3px solid var(--gm-forest);
  animation:gmToastIn 0.3s ease forwards;
}
.v3-toast.error { border-left-color:#DC2626; }
.v3-toast.info  { border-left-color:var(--gm-forest); }
@keyframes gmToastIn { from { transform:translateX(120%); opacity:0; } to { transform:translateX(0); opacity:1; } }
@keyframes gmToastOut { from { transform:translateX(0); opacity:1; } to { transform:translateX(120%); opacity:0; } }
@media (max-width:767px) {
  .v3-toast { top:12px; right:12px; max-width:calc(100vw - 24px); }
}

@keyframes gmShake {
  10%, 90% { transform: translateX(-1px); }
  20%, 80% { transform: translateX(2px); }
  30%, 50%, 70% { transform: translateX(-4px); }
  40%, 60% { transform: translateX(4px); }
}
.gm-shake { animation: gmShake 0.4s; }

/* ─────────────────────────────────────────────────────────────
   UPGRADE MODAL
───────────────────────────────────────────────────────────── */
.v3-upgrade-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,0.5); backdrop-filter:blur(4px);
  z-index:5000; display:flex; align-items:center; justify-content:center;
  padding:16px; animation:fadeIn .2s ease;
}
.v3-upgrade-card {
  background:var(--gm-white); border-radius:20px; box-shadow:0 20px 60px rgba(0,0,0,0.2);
  width:100%; max-width:520px; max-height:90vh; overflow-y:auto; padding:28px;
  animation:slideUp .25s ease;
}
.v3-upgrade-billing-toggle { display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:20px; flex-wrap:wrap; }
.v3-billing-opt {
  padding:7px 20px; border-radius:999px; border:1.5px solid var(--gm-border);
  background:var(--gm-white); font-size:13px; font-weight:600; color:var(--gm-muted);
  cursor:pointer; transition:all var(--gm-transition);
}
.v3-billing-opt.active { border-color:var(--gm-forest); color:var(--gm-forest); background:rgba(33,109,57,0.07); }
.v3-tier-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-bottom:16px; }
@media (min-width:540px) { .v3-tier-grid { grid-template-columns:repeat(4,1fr); } }
.v3-tier-card { border:1.5px solid var(--gm-border); border-radius:var(--gm-r-card); padding:14px 10px; position:relative; transition:all var(--gm-transition); }
.v3-tier-card.popular { border-color:var(--gm-orange); }
.v3-tier-badge {
  position:absolute; top:-10px; left:50%; transform:translateX(-50%);
  background:var(--gm-orange); color:#fff; border-radius:999px;
  padding:2px 10px; font-size:11px; font-weight:700; white-space:nowrap;
}
.v3-tier-name { font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:13px; font-weight:800; color:var(--gm-text); margin-bottom:6px; text-align:center; }
.v3-tier-price { text-align:center; margin-bottom:10px; }
.v3-tier-price .amount { font-family:'Plus Jakarta Sans','Nunito',sans-serif; font-size:1.3rem; font-weight:800; color:var(--gm-text); }
.v3-tier-price .period { font-size:12px; color:var(--gm-muted); font-weight:500; }
.v3-tier-features { list-style:none; padding:0; margin:0 0 12px; display:flex; flex-direction:column; gap:5px; }
.v3-tier-features li { font-size:12px; color:var(--gm-text); font-weight:500; display:flex; gap:5px; }
.v3-tier-features li::before { content:'✓'; color:var(--gm-accent); font-weight:700; flex-shrink:0; }
.v3-tier-cta { width:100%; padding:8px 4px; border:none; border-radius:8px; font-family:'Inter','Nunito',sans-serif; font-size:12px; font-weight:700; cursor:pointer; transition:all var(--gm-transition); background:var(--gm-forest); color:#fff; }
.v3-tier-cta.trial { background:var(--gm-orange); }
.v3-tier-cta.current-plan { background:var(--gm-off); color:var(--gm-muted); cursor:default; }
.v3-tier-cta:hover:not(.current-plan) { filter:brightness(0.9); }
.v3-upgrade-footer { font-size:12px; color:var(--gm-muted); text-align:center; line-height:1.6; }

/* ─────────────────────────────────────────────────────────────
   LOADING SKELETONS
───────────────────────────────────────────────────────────── */
.v3-skeleton {
  background:linear-gradient(90deg,var(--gm-border) 25%,#F8FAFC 50%,var(--gm-border) 75%);
  background-size:200% 100%; animation:shimmer 1.4s infinite; border-radius:8px;
}
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* ─────────────────────────────────────────────────────────────
   ANIMATIONS
───────────────────────────────────────────────────────────── */
@keyframes fadeIn  { from{opacity:0}          to{opacity:1} }
@keyframes fadeUp  { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
@keyframes slideUp { from{transform:translateY(24px);opacity:0} to{transform:translateY(0);opacity:1} }
@keyframes cardRevealIn { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:translateY(0)} }
/* ─────────────────────────────────────────────────────────────
   KNOWLEDGE ORGANISERS (V3)
───────────────────────────────────────────────────────────── */
.v3-ko-sticky-bar {
  position:sticky; top:0; z-index:10;
  padding:8px 16px; font-size:13px; font-weight:700;
  border-bottom:1px solid var(--gm-border); flex-shrink:0;
}
.v3-ko-sticky-bio  { background:var(--bio-bg);  color:var(--bio-text); }
.v3-ko-sticky-chem { background:var(--chem-bg); color:var(--chem-text); }
.v3-ko-sticky-phys { background:var(--phys-bg); color:var(--phys-text); }
.v3-ko-subject-pill {
  display:inline-flex; align-items:center; justify-content:center;
  padding:3px 10px; border-radius:999px; font-size:11px; font-weight:700; white-space:nowrap;
}
.v3-ko-subj-bio  { background:var(--bio-bg);  color:var(--bio-text);  border:1px solid var(--bio-border); }
.v3-ko-subj-chem { background:var(--chem-bg); color:var(--chem-text); border:1px solid var(--chem-border); }
.v3-ko-subj-phys { background:var(--phys-bg); color:var(--phys-text); border:1px solid var(--phys-border); }
.v3-ko-search-wrap {
  position:relative; margin:12px 16px; display:flex; align-items:center;
}
.v3-ko-search-input {
  width:100%; height:40px; border-radius:20px;
  border:1.5px solid var(--gm-border); padding:0 36px 0 14px;
  font-family:'Inter','Nunito',sans-serif; font-size:14px;
  color:var(--gm-text); background:var(--gm-white); outline:none;
  transition:border-color var(--gm-transition),box-shadow var(--gm-transition);
}
.v3-ko-search-input:focus { border-color:var(--gm-accent); box-shadow:0 0 0 3px rgba(3,168,96,0.12); }
.v3-ko-search-clear {
  position:absolute; right:10px; top:50%; transform:translateY(-50%);
  background:none; border:none; font-size:14px; color:var(--gm-muted);
  cursor:pointer; padding:4px; line-height:1;
}
.v3-ko-content {
  position:relative; max-width:900px; margin:0 auto; padding:4px 16px 32px;
  user-select:none; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;
}
.v3-ko-watermark {
  position:absolute; top:0; left:0; width:100%; height:100%;
  pointer-events:none; z-index:0;
  background:repeating-linear-gradient(
    -45deg,
    transparent, transparent 120px,
    rgba(33,109,57,0.04) 120px, rgba(33,109,57,0.04) 121px
  );
}
.v3-ko-section { position:relative; z-index:1; margin-bottom:16px; }
.v3-ko-table {
  width:100%; border-collapse:collapse;
  border-radius:12px; overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,0.07);
}
.v3-ko-sechdr-cell {
  padding:0; border-top:2px solid;
}
.v3-ko-sechdr-inner {
  display:flex; align-items:center; justify-content:space-between;
  gap:8px; flex-wrap:wrap; padding:8px 12px;
}
.v3-ko-section-hdr-bio  .v3-ko-sechdr-cell { background:var(--bio-bg);  color:var(--bio-text);  border-color:var(--bio-border); }
.v3-ko-section-hdr-chem .v3-ko-sechdr-cell { background:var(--chem-bg); color:var(--chem-text); border-color:var(--chem-border); }
.v3-ko-section-hdr-phys .v3-ko-sechdr-cell { background:var(--phys-bg); color:var(--phys-text); border-color:var(--phys-border); }
.v3-ko-section-name { font-size:13px; font-weight:700; }
.v3-ko-rpa-badge {
  display:inline-block; background:#EDE9FE; color:#4338CA;
  font-size:10px; font-weight:700; border-radius:999px; padding:2px 7px;
  margin-left:6px; vertical-align:middle;
}
.v3-ko-watermark-stamp {
  font-size:10px; font-weight:400; opacity:0.4; color:var(--gm-muted);
  white-space:nowrap; margin-left:auto; flex-shrink:0;
}
.v3-ko-col-hdr-bio  td, .v3-ko-col-hdr-bio  th { background:var(--bio-bg);  color:var(--bio-text);  }
.v3-ko-col-hdr-chem td, .v3-ko-col-hdr-chem th { background:var(--chem-bg); color:var(--chem-text); }
.v3-ko-col-hdr-phys td, .v3-ko-col-hdr-phys th { background:var(--phys-bg); color:var(--phys-text); }
.v3-ko-col-hdr th {
  padding:6px 12px; text-align:left;
  font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:0.05em; border-bottom:1px solid var(--gm-border);
}
.v3-ko-q {
  width:40%; padding:10px 12px; font-weight:600; font-size:14px;
  color:var(--gm-text); border-bottom:0.5px solid var(--gm-border);
  vertical-align:top; border-right:0.5px solid var(--gm-border);
}
.v3-ko-a {
  padding:10px 12px; font-size:14px; color:var(--gm-text);
  border-bottom:0.5px solid var(--gm-border); vertical-align:top;
}
.v3-ko-bullets { list-style:disc; margin:0; padding-left:16px; display:flex; flex-direction:column; gap:4px; }
.v3-ko-no-results {
  text-align:center; padding:32px 16px; color:var(--gm-muted);
  font-size:14px; font-weight:500;
}
.v3-ko-highlight {
  background:#FEF08A; color:#1A2E22; border-radius:2px; padding:0 1px;
  /* Intentionally no user-select override — inherits user-select:none from .v3-ko-content */
}
/* Deep Dive Read & Learn KO answers: colour key bold terms the same as the standalone
   Knowledge Organiser view's forest-coloured <strong> terms, without touching bold()
   itself (shared with flashcards elsewhere). */
#ko-content strong { color: var(--gm-forest); }
@media print {
  #ko-content-wrapper { display:none !important; }
  .ko-print-block { display:block !important; }
}