:root {
  --bg: #110b09;
  --glow: rgba(214, 160, 82, 0.16);
  --parch: #2a221e;
  --parch-rim: #4b3e35;
  --ink: #ebe3d6;
  --ink-strong: #f7efe3;
  --ink-soft: #cfc4b4;
  --gold: #c7b28b;
  --gold-line: rgba(199, 178, 139, 0.28);
  --gold-bright: #eab04c;
  --font: "Lora", Georgia, "Times New Roman", serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background-color: var(--bg);
  background-image:
    radial-gradient(ellipse 70% 420px at 50% 0%, var(--glow), transparent 75%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .9 0 0 0 0 .8 .07 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  color: var(--ink);
  font-family: var(--font);
  font-size: 1.125rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
::selection { background: rgba(234, 176, 76, 0.35); color: var(--ink-strong); }
a:focus-visible, summary:focus-visible { outline: 2px solid var(--gold-bright); outline-offset: 3px; border-radius: 2px; }

.wrap {
  width: 100%;
  max-width: 880px;
  margin: 0 auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
}

/* Logo */
.brand { padding-top: max(20px, calc(env(safe-area-inset-top, 0px) + 14px)); }
.brand a { display: inline-block; border-radius: 4px; }
.brand__logo { display: block; width: auto; height: clamp(28px, 4.2vw, 36px); color: var(--ink-strong); }

main { flex: 1 0 auto; }

/* ---------- Page de maintenance ---------- */
.maintenance { display: flex; align-items: center; padding-block: clamp(40px, 8vh, 96px); }
.parchment { position: relative; width: 100%; filter: drop-shadow(0 18px 34px rgba(0, 0, 0, 0.55)); }
.parchment::before {
  content: "";
  position: absolute;
  inset: 0;
  clip-path: var(--edge);
  background: linear-gradient(180deg, #5c4c40 0%, var(--parch-rim) 18%, #3a302a 60%, #342b26 100%);
}
.parchment__paper {
    position: relative;
    margin: 2px;
    clip-path: var(--edge);
    background-color: var(--parch);
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .92 0 0 0 0 .82 .085 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
      linear-gradient(90deg, rgba(0,0,0,.10) 0%, rgba(255,236,214,.025) 14%, rgba(0,0,0,.035) 27%, rgba(255,236,214,.03) 41%, rgba(0,0,0,.025) 55%, rgba(255,236,214,.03) 70%, rgba(0,0,0,.03) 84%, rgba(0,0,0,.12) 100%),
      radial-gradient(ellipse 80% 260px at 50% 0%, rgba(255, 230, 200, 0.045), transparent 70%);
    padding-block: clamp(72px, 10vw, 104px) clamp(64px, 9vw, 92px);
    padding-inline: clamp(22px, 7vw, 84px);
  }
.parchment--a { --edge: polygon(0% 13.6px, 1.96% 8.1px, 3.98% 9.3px, 6.39% 3.9px, 8.82% 12.8px, 11.56% 4.6px, 12.49% 4.9px, 13.85% 8.2px, 14.17% 23.6px, 14.65% 9.1px, 16.77% 7.6px, 18.20% 16.2px, 20.44% 5.9px, 21.48% 11.5px, 23.11% 12.0px, 24.41% 12.8px, 26.07% 5.3px, 26.48% 25.6px, 27.11% 6.5px, 28.64% 4.2px, 30.01% 11.0px, 31.25% 4.9px, 33.54% 4.2px, 35.24% 12.7px, 37.66% 13.1px, 39.31% 4.0px, 42.09% 10.7px, 43.62% 3.9px, 45.63% 6.7px, 47.39% 8.7px, 49.93% 12.1px, 52.39% 10.4px, 55.07% 16.4px, 57.12% 3.4px, 59.85% 5.6px, 62.31% 4.8px, 64.58% 8.3px, 64.94% 20.7px, 65.47% 9.7px, 66.91% 3.2px, 68.32% 4.8px, 69.92% 6.6px, 72.51% 9.9px, 74.52% 3.2px, 77.15% 12.1px, 79.26% 6.2px, 82.06% 8.5px, 82.47% 24.6px, 83.08% 10.4px, 85.31% 13.8px, 87.51% 14.1px, 89.92% 9.2px, 91.54% 3.8px, 93.66% 15.6px, 95.30% 7.4px, 97.79% 3.3px, 99.83% 10.0px, 100% 14.9px, calc(100% - 1.5px) 10.5%, calc(100% - 1.8px) 15.6%, calc(100% - 1.2px) 24.7%, calc(100% - 5.4px) 30.7%, calc(100% - 2.7px) 39.6%, calc(100% - 2.0px) 50.0%, calc(100% - 1.2px) 59.0%, calc(100% - 4.8px) 66.6%, calc(100% - 5.3px) 77.1%, calc(100% - 3.5px) 84.4%, calc(100% - 0.8px) 91.3%, 100% calc(100% - 13.0px), 96.93% calc(100% - 9.6px), 95.12% calc(100% - 5.1px), 93.32% calc(100% - 4.7px), 90.74% calc(100% - 3.8px), 87.70% calc(100% - 5.1px), 86.33% calc(100% - 6.5px), 86.12% calc(100% - 21.0px), 85.81% calc(100% - 6.9px), 83.93% calc(100% - 1.2px), 82.43% calc(100% - 1.2px), 79.40% calc(100% - 2.3px), 78.10% calc(100% - 5.0px), 75.51% calc(100% - 8.3px), 72.20% calc(100% - 2.8px), 69.96% calc(100% - 1.1px), 67.72% calc(100% - 2.6px), 65.92% calc(100% - 7.3px), 63.58% calc(100% - 7.8px), 61.51% calc(100% - 9.2px), 60.12% calc(100% - 7.5px), 58.63% calc(100% - 6.6px), 55.43% calc(100% - 6.1px), 52.30% calc(100% - 9.5px), 50.08% calc(100% - 2.8px), 47.29% calc(100% - 6.8px), 44.51% calc(100% - 9.1px), 41.15% calc(100% - 5.8px), 38.21% calc(100% - 9.2px), 35.13% calc(100% - 1.7px), 32.96% calc(100% - 7.9px), 30.69% calc(100% - 7.0px), 30.47% calc(100% - 20.5px), 30.15% calc(100% - 4.9px), 28.21% calc(100% - 2.3px), 26.68% calc(100% - 7.5px), 23.64% calc(100% - 9.5px), 21.35% calc(100% - 1.8px), 19.67% calc(100% - 3.6px), 16.86% calc(100% - 5.7px), 13.81% calc(100% - 3.8px), 11.77% calc(100% - 9.1px), 10.11% calc(100% - 9.7px), 7.76% calc(100% - 2.8px), 5.38% calc(100% - 6.4px), 4.12% calc(100% - 5.6px), 2.04% calc(100% - 6.1px), 0% calc(100% - 12.1px), 3.2px 94.6%, 5.7px 87.1%, 1.6px 76.6%, 0.8px 68.7%, 4.9px 61.1%, 2.9px 50.7%, 1.1px 43.8%, 5.6px 35.1%, 4.7px 29.3%, 1.2px 24.2%, 4.1px 17.8%, 2.1px 10.9%); }
.maintenance .parchment__paper { text-align: center; }
.maintenance h1 {
  margin: 0;
  font-size: clamp(1.5rem, 5vw, 2.4rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  text-wrap: balance;
  color: var(--ink-strong);
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.6);
}
.maintenance p {
  max-width: 46ch;
  margin: 0 auto;
  font-size: clamp(1.05rem, 2.4vw, 1.2rem);
  text-wrap: pretty;
  color: var(--ink);
}

/* Losange — barre — losange — barre — losange */
.rule { display: flex; align-items: center; justify-content: center; gap: clamp(10px, 2vw, 18px); margin: clamp(24px, 4vw, 34px) 0; }
.rule__bar { width: clamp(40px, 12vw, 140px); height: 1px; background: var(--gold); opacity: .85; }
.rule__gem { flex: none; width: 11px; height: 11px; border: 1.5px solid var(--gold); transform: rotate(45deg); }

/* ---------- Pages légales ---------- */
.legal { padding-block: clamp(40px, 7vw, 72px) clamp(48px, 8vw, 80px); }
.legal h1 {
  margin: 0;
  text-align: center;
  font-size: clamp(1.5rem, 5vw, 2.4rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  text-wrap: balance;
  color: var(--ink-strong);
}
.legal .updated { margin: 10px 0 clamp(28px, 5vw, 44px); text-align: center; font-size: .95rem; color: var(--ink-soft); }
.accordion { border-top: 1px solid var(--gold-line); }
.accordion details { border-bottom: 1px solid var(--gold-line); }
.accordion summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 4px;
  cursor: pointer;
  list-style: none;
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--ink-strong);
}
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary::after {
  content: "";
  flex: none;
  width: 9px;
  height: 9px;
  margin-right: 6px;
  border: 1.5px solid var(--gold);
  transform: rotate(45deg);
  transition: background-color .2s ease, border-color .2s ease;
}
.accordion details[open] summary::after { background: var(--gold-bright); border-color: var(--gold-bright); }
@media (hover: hover) { .accordion summary:hover { color: var(--gold-bright); } }
.accordion__body { padding: 0 4px 24px; color: var(--ink); }
.accordion__body > * { margin: 0; }
.accordion__body > * + * { margin-top: 1em; }
.accordion__body p:empty { display: none; }
.accordion__body pre {
  overflow-x: auto;
  padding: 14px 16px;
  border: 1px solid var(--gold-line);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.28);
  font-family: var(--mono);
  font-size: .85rem;
  line-height: 1.6;
  color: var(--ink-strong);
}
.accordion__body a { color: var(--gold-bright); text-underline-offset: 3px; overflow-wrap: anywhere; }

/* ---------- Pied de page ---------- */
.site-footer {
  flex: none;
  padding-block: 22px max(22px, env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--gold-line);
  font-size: .9rem;
  color: var(--ink-soft);
}
.site-footer .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; }
.site-footer p { margin: 0; }
.site-footer nav ul { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; padding: 0; list-style: none; }
.site-footer a { color: var(--ink-soft); text-decoration: none; }
.site-footer a[aria-current="page"] { color: var(--ink-strong); }
@media (hover: hover) { .site-footer a:hover { color: var(--gold-bright); } }
@media (max-width: 560px) { .site-footer .wrap { flex-direction: column-reverse; text-align: center; } .site-footer nav ul { justify-content: center; } }