/* qg-theme.css — Apparence commune des pages du QG : mêmes polices et couleurs que l'Atelier.
   Chargé APRÈS le <style> de chaque page : il remplace ses couleurs et ses polices, sans toucher à sa mise en page ni à son fonctionnement. */
:root {
  --bg: #ECEFF2; --carte: #FFFFFF; --texte: #141B22; --doux: #5A6672; --bord: #D5DBE1; --accent: #2346A8;
  /* mêmes noms que l'Atelier, pour la barre de menu */
  --surface: #FFFFFF; --surface-2: #F5F7F9; --ink: #141B22; --muted: #5A6672; --line: #D5DBE1;
  --qg-display: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --qg-body: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --qg-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;
  --qg-ombre: 0 1px 2px rgba(20, 27, 34, .06), 0 8px 24px rgba(20, 27, 34, .06);
  color-scheme: light;
}
body { font-family: var(--qg-body); }
main { padding-top: 8px; }
main h1 { font: 800 clamp(24px, 3.2vw, 32px)/1.1 var(--qg-display); letter-spacing: -.01em; margin: 16px 0 16px; text-wrap: balance; }
main h1 small { font: 400 14px var(--qg-body); letter-spacing: 0; }
main h2 { font-family: var(--qg-display); font-weight: 600; letter-spacing: -.005em; }
.carte { border-radius: 12px; box-shadow: var(--qg-ombre); }
button, select, input, textarea { border-radius: 8px; }
code { font-family: var(--qg-mono); font-size: .92em; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }