/* ============================================================
   MeraProfessor — brand override layer for re-skinned courses.
   Loaded AFTER each course's own stylesheet so it remaps the
   design tokens (terracotta/gold paper theme + navy-teal lab
   theme) onto the MeraProfessor teal-green + gold palette.
   Layouts are untouched — only colour tokens + a few high-use
   accents are nudged so every subject feels like one site.
   ============================================================ */
:root{
  /* ---- "paper" theme tokens (design.css) → MeraProfessor ---- */
  --paper:#fbf6ea;
  --paper-2:#f3ebd9;
  --line:#d8cbb0;
  --muted:#6c6353;
  --accent:#0e8042;        /* terracotta → deep teal            */
  --accent-deep:#0a5e30;   /* darker terracotta → darkest teal  */
  --gold:#2dd48a;          /* keep a warm gold (banner stars)   */
  --cool:#16a34a;          /* cool panel → teal                 */
  --cool-bg:#e3ece7;
  --warm:#0c8f56;
  --warm-bg:#e2f7ee;
  --result:#2f6b3d; --result-bg:#e6efe6;
}

/* CS hub uses hardcoded amber/terracotta hexes (not vars) — nudge the most
   visible ones toward the brand so the page reads as MeraProfessor. */
.hero{background:linear-gradient(135deg,#0a5e30 0%,#0e8042 60%,#16a34a 100%) !important;border-bottom-color:#2dd48a !important;}
.kicker{color:#2dd48a !important;}
.hero h1 em{color:#6ee7b0 !important;}
.topic-num{background:linear-gradient(135deg,#0e8042,#0a5e30) !important;}
.surface[data-status="ready"].lecture{border-left-color:#0e8042 !important;}
.surface[data-status="ready"].walkthrough{border-left-color:#16a34a !important;}
.surface[data-status="ready"].practical{border-left-color:#0c8f56 !important;}
.surface.lecture .icon{background:#dcebe5 !important;color:#0e8042 !important;}
.surface.walkthrough .icon{background:#cfe0d9 !important;color:#0a5e30 !important;}
.surface.practical .icon{background:#e2f7ee !important;color:#0c8f56 !important;}

/* Keep the sticky brand bar clear of any course's own fixed elements. */
body{scroll-padding-top:64px;}