/* ============================================================
   GEMS XL ACADEMY — Stage R4 "Export-is-Law" layer
   Load FOURTH (after academy-theme.css, stage-a-theme.css, stage-bc.css):
   <link rel="stylesheet" href="academy-r4.css">

   Source of truth: client's own full-res 2x Figma PNG exports
   (academy-redesign-notes.md §17.5). Real F37 Incise font + real
   bitmap logo assets (assets/gems-logo.png, assets/gems-mark.png) —
   no CSS/SVG logo reconstruction anywhere.

   This layer restyles EXISTING live markup/ids only — no markup
   rewrite to a new class-prefix scheme. Rollback: remove this one
   <link> line; every rule here is additive on top of Stage A/B/C.
   ============================================================ */

/* ---------- 0. Real F37 Incise font ---------- */
@font-face {
  font-family: 'F37 Incise';
  src: url('fonts/F37Incise-Medium.ttf') format('truetype');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
body, button, input, select, textarea {
  font-family: 'F37 Incise', 'Saira', system-ui, sans-serif !important;
}
:root {
  --font-head: 'F37 Incise', 'Saira', system-ui, sans-serif;
  --font-body: 'F37 Incise', 'Saira', system-ui, sans-serif;
}

/* ---------- 1. Real bitmap logo — mobile app bar ---------- */
/* .mnav-logo used to be a CSS gradient tile with a letter "G" glyph;
   it is now an <img src="assets/gems-mark.png">. Strip the tile styling. */
.mnav-logo {
  width: 24px; height: 22px; min-width: 24px; border-radius: 0;
  background: none; display: block; object-fit: contain;
}

/* ---------- 1b. Mobile app bar text contrast fix (pre-existing bug, caught during
   R4 verification pass) — academy-theme.css sets .mnav-appbar { color:#fff } for
   its original dark bar; Stage A/B/C repainted the bar light but never overrode
   the inherited white text, so #mTitle / small kicker were near-invisible on the
   light wash. Force dark ink text to match the rest of the light theme. */
@media (max-width: 768px) {
  .mnav-appbar { color: var(--teal); }
  .mnav-title { color: var(--teal); }
  .mnav-title small { color: var(--mint-dark); }
  .mnav-progress { color: var(--mint-dark); }
}

/* ---------- 2. Sidebar polish — exact R4 palette on top of Stage A/B/C ---------- */
aside .brand img { display: block; }

/* ---------- 3. Content-page polish: callouts / dividers already covered by
   stage-bc .fx-callout, .disclaimer etc. — no changes needed here. ---------- */

/* ---------- 4. Onboarding header logo sizing guard ---------- */
.fx-logo img { display: block; }