*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html {
  background: var(--page);
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: 96px;             
}
body {
  margin: 0;
  min-height: 100vh;
  background: var(--page);
  color: var(--ink);
  font-family: var(--police);
  font-size: var(--t-corps);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "cv05" 1, "ss03" 1, "cv11" 1;   
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
h1, h2, h3, h4, h5, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
h1, h2, h3, h4, h5 { font-weight: 650; letter-spacing: var(--suivi-titre); line-height: 1.06; text-wrap: balance; }
p { text-wrap: pretty; }
ul, ol { padding: 0; list-style: none; }
img, svg { display: block; max-width: 100%; }
a { color: var(--acc-fort); text-decoration: none; transition: color var(--tr) var(--doux); }
a:hover { color: var(--ink); }
button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; padding: 0; }
input, textarea, select { font: inherit; color: inherit; }
b, strong { font-weight: 650; color: var(--ink); }
:focus-visible { outline: 2px solid var(--acc); outline-offset: 3px; border-radius: var(--r-xs); }
::selection { background: var(--acc-clair); color: var(--ink); }
:root[data-theme="nuit"] ::selection { background: #3b3380; color: #fff; }
* { scrollbar-width: thin; scrollbar-color: var(--ligne-forte) transparent; }
.tab { font-variant-numeric: tabular-nums; }
.sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.nowrap { white-space: nowrap; }
.evitement {
  position: fixed; left: var(--e4); top: -80px; z-index: 200;
  padding: var(--e3) var(--e5); border-radius: var(--pill);
  background: var(--carte); color: var(--ink); box-shadow: var(--om-2);
  font-weight: 600; transition: top var(--tr) var(--doux);
}
.evitement:focus { top: var(--e4); }
.contenu {
  width: 100%;
  max-width: calc(var(--large) + 2 * var(--gouttiere));
  margin: 0 auto;
  padding: 0 var(--gouttiere);
}
.contenu-etroit { max-width: calc(880px + 2 * var(--gouttiere)); }
.zone { position: relative; padding: var(--zone-y) 0; }
.fond-page    { background: var(--page); }
.fond-panel   { background: var(--panel); }
.fond-soutenu { background: var(--soutenu); }
.fond-nuit    { background: var(--nuit-fond); color: #fff; }
.titre-hero { font-size: var(--t-hero); font-weight: 650; letter-spacing: -.045em; line-height: .98; }
.titre-sect { font-size: var(--t-sect); letter-spacing: -.04em; line-height: 1.02; }
.titre-3    { font-size: var(--t-titre); letter-spacing: -.025em; line-height: 1.2; font-weight: 600; }
.lead       { font-size: var(--t-lead); line-height: 1.6; color: var(--ink-2); max-width: var(--lecture); }
.texte      { font-size: var(--t-corps); line-height: 1.7; color: var(--ink-2); }
.note       { font-size: var(--t-donnee); line-height: 1.6; color: var(--ink-3); }
.etiquette  { font-size: var(--t-label); font-weight: 650; letter-spacing: var(--suivi-label); text-transform: uppercase; color: var(--ink-3); }
.fond-nuit .lead, .fond-nuit .texte { color: var(--ink-nuit); }
.fond-nuit .note { color: var(--ink-nuit); }
.fond-nuit .etiquette { color: var(--ink-nuit-2); }
.fond-nuit b:where(:not(.ecran *)), .fond-nuit strong:where(:not(.ecran *)) { color: #fff; }
.souligne {
  background-image: linear-gradient(var(--trait), var(--trait));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% .2em;
}
.fond-nuit .souligne { --trait: var(--trait-nuit); }
html.anim .souligne { background-size: 0% .2em; transition: background-size 1.1s var(--entree) .35s; }
html.anim .vu .souligne, html.anim .souligne.vu { background-size: 100% .2em; }
.chiffre { font-variant-numeric: tabular-nums; letter-spacing: -.03em; }
@media (prefers-reduced-motion: no-preference) { html:not(.lenis) { scroll-behavior: smooth; } }
@view-transition { navigation: auto; types: page; }
:root:active-view-transition-type(page) .entete { view-transition-name: entete; }
:root:active-view-transition-type(page)::view-transition-old(root),
:root:active-view-transition-type(page)::view-transition-new(root) { animation-duration: .24s; }
@media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }