/* RESET */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* BASE */
html {
  /* Gouttière de barre de défilement réservée en permanence : bloquer le scroll
     à l'ouverture de la lightbox ne décale alors plus la page d'un pixel.
     Sans effet sur macOS (barres flottantes). */
  scrollbar-gutter: stable;
}

html, body {
  width: 100%;
  min-height: 100%;
  background: #050505;
  font-family: "Rubik", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #ffffff;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-font-smoothing: antialiased;
}
/* <picture> ne doit générer aucune boîte : l'<img> reste l'enfant direct de son
   conteneur, toutes les règles de mise en page existantes continuent de porter. */
picture {
  display: contents;
}

/* Titre « Titre — Sous-titre » sur trois lignes (voir title_html dans build.py) */
.title-main,
.title-sub {
  display: block;
}

.title-sep {
  display: block;
  font-size: 0.42em;
  line-height: 1.9;
  /* Couleur semi-transparente plutôt qu'`opacity: 0.35`.

     Le rendu est identique au pixel près — l'élément ne contient que du texte,
     sans fond ni bordure — mais `opacity` sur un élément crée un contexte
     d'empilement et impose une passe de composition séparée. C'est un
     déclencheur connu du défaut de repeinture de Safari où un bloc de texte
     disparaît puis revient de lui-même.

     Les deux seuls projets à porter ce séparateur sont « Des instants qui
     comptent — Couple » et « — Grand-père », et ce sont précisément les deux
     titres où le défaut a été observé. */
  color: rgba(255, 255, 255, 0.35);
}