:root {
  --fond: #11181B; --surface: #1A2428; --texte: #E7EEF0; --discret: #9DADB4;
  --trait: #2C3A40; --accent: #6DB4B5; --chaud: #E3A066;
  color-scheme: dark;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--fond); color: var(--texte);
  font: 18px/1.6 "Nunito", "Segoe UI", system-ui, sans-serif;
  padding: 32px max(18px, env(safe-area-inset-right)) 48px max(18px, env(safe-area-inset-left));
}
main { max-width: 720px; margin: 0 auto; }
header { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
header img { width: 56px; height: 56px; border-radius: 14px; }
header a { color: var(--texte); text-decoration: none; font-weight: 800; font-size: 22px; letter-spacing: .04em; }
h1 { font-family: "Young Serif", Georgia, serif; font-weight: 400; font-size: 34px; line-height: 1.2; margin: 0 0 8px; text-wrap: balance; }
h2 { font-family: "Young Serif", Georgia, serif; font-weight: 400; font-size: 24px; margin: 36px 0 8px; }
p, li { color: var(--texte); }
.maj { color: var(--discret); margin-bottom: 28px; }
a { color: var(--accent); }
.encadre { background: var(--surface); border: 1px solid var(--trait); border-radius: 16px; padding: 18px 20px; margin: 20px 0; }
.aide { border-color: var(--chaud); }
footer { margin-top: 48px; padding-top: 18px; border-top: 1px solid var(--trait); color: var(--discret); font-size: 15px; display: flex; gap: 18px; flex-wrap: wrap; }
.a-remplir { background: #3a2a14; color: var(--chaud); padding: 0 6px; border-radius: 6px; }