/* ============================================================================
   Spelportalen — shared brand theme layer
   ----------------------------------------------------------------------------
   Lifts every game page AND the portal to the AI-Niklas brand typography:
   Inter for body/UI, Fredoka for the big titles (the playful display face used
   across the family/kids products and the portal UI kit).

   This file is loaded AFTER each page's own inline <style>, so it refines the
   look (fonts, tracking) without touching any game's board layout, colors,
   gradients or accent bars — those stay exactly as each game defines them.
   ============================================================================ */

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

/* Body / UI → Inter. Keeps each page's own background and colors; only swaps
   the generic system stack for the brand sans, with the brand's body tracking. */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  letter-spacing: -0.011em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Big titles → Fredoka. The gradient game titles ("Othello", "Spelportalen",
   "Fyra i rad" …) become rounder and friendlier — the portal/UI-kit signature.
   Fredoka is wider than the system font, so relax the tight negative tracking. */
h1 {
  font-family: 'Fredoka', 'Inter', sans-serif;
  letter-spacing: -0.01em;
}

/* Portal game-card titles also pick up Fredoka (matches the UI kit). */
.game-card h2 {
  font-family: 'Fredoka', 'Inter', sans-serif;
  letter-spacing: -0.005em;
}

/* In-game eyebrow/section labels (h2/h3) stay in Inter (inherited) — crisp and
   legible for the uppercase, wide-tracked labels the games use. */

/* Monospace stays as-is for join codes / timers (tabular feel is intentional). */