/* Les pages légales.
   Elles ne sont pas dans le jeu : elles doivent rester lisibles sans JavaScript, se
   charger seules, et survivre à un lecteur d'écran. Même famille visuelle que le jeu
   (docs/03), rien de plus. */

:root {
  --bg: #FFF6E9;
  --surface: #FFFFFF;
  --ink: #4F3A24;
  --ink-soft: #7A6449;
  --wood: #B97A45;
  --accent: #D97A12;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  padding: 28px 20px 72px;
  background: linear-gradient(170deg, #FFF6E9, #FBEAD7 70%);
  color: var(--ink);
  font: 400 17px/1.65 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  -webkit-text-size-adjust: 100%;
}

main {
  max-width: 44rem;
  margin: 0 auto;
  background: var(--surface);
  border-radius: 22px;
  padding: 28px 24px 32px;
  box-shadow: 0 10px 26px rgb(120 90 50 / 12%);
}

h1 { font-size: 27px; line-height: 1.2; margin: 0 0 6px; }
h2 { font-size: 20px; line-height: 1.3; margin: 32px 0 8px; }
h3 { font-size: 17px; margin: 20px 0 4px; }
p, li { margin: 8px 0; }
ul { padding-inline-start: 22px; }

a { color: var(--accent); }
a:focus-visible, .back:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }

.lede { color: var(--ink-soft); margin-bottom: 4px; }
.updated { color: var(--ink-soft); font-size: 15px; margin-top: 0; }

.back {
  display: inline-block;
  margin-bottom: 18px;
  color: var(--wood);
  font-weight: 700;
  text-decoration: none;
}
.back:hover { text-decoration: underline; }

/* Ce qui reste à compléter par un humain, impossible à rater. */
.todo {
  background: #FFF0D6;
  border-inline-start: 4px solid var(--accent);
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 700;
}

table { border-collapse: collapse; width: 100%; margin: 12px 0; font-size: 16px; }
th, td { text-align: start; padding: 9px 10px; border-bottom: 1px solid #EFE3D2; vertical-align: top; }
th { font-weight: 800; }

footer { max-width: 44rem; margin: 20px auto 0; color: var(--ink-soft); font-size: 15px; }
footer a { margin-inline-end: 14px; }