/* Charte « Affiche » : noir, blanc, jaune ; Archivo (condensé pour les titres), JetBrains Mono pour
   les dates, les nombres et les badges courts. Les couleurs de vote se distinguent aussi par la
   clarté, pas seulement par la teinte. Un groupe politique n'a que la couleur publiée par
   l'Assemblée nationale (`couleurAssociee`), toujours avec son sigle en texte (pastille
   `.group-badge`) ; un groupe du Sénat, qui n'en publie pas, prend celle du groupe du même parti
   à l'Assemblée, rapprochement écrit sur la page Groupes ; aucune n'est choisie ici.

   Couleurs sémantiques (variante B) : une couleur, un sens, toujours doublée d'un mot et d'un
   symbole. Jaune : maintenant. Bleu : ce qui fait la loi, et les tampons de procédure. Vert :
   contrôle et débats, et ce qui est adopté. Violet : résolutions. Orange : négatif pour le texte.
   Gris : abandonné ou neutre. Pointillé : à venir, et rien d'autre. Ces teintes voisinent celles de
   groupes (AD et UDR pour le bleu, EPR pour le violet, EcoS pour le vert) : c'est la forme qui les
   sépare. Pastille ronde : un groupe ; filet à gauche : la nature d'un texte ; cadre bleu en
   casse normale : un tampon de procédure ; badge mono en capitales : un statut.

   Contrastes WCAG mesurés (clair / sombre), vérifiés par `apps/pages/tests/test_palette.py` :
   4,5:1 au moins pour un texte, 3:1 pour un filet ou un cadre. */

@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo-latin-wdth-normal.de2f1fe81758.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("../fonts/jetbrains-mono-latin-wght-normal.b058178d7f30.woff2") format("woff2-variations");
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  --ink: #000000;
  --paper: #ffffff;
  --muted: #555555;
  --highlight: #ffe600;
  --on-highlight: #000000;
  --vote-pour: #000000;
  --vote-contre: #ff4f00;
  --vote-contre-text: #c23a00;
  --vote-abst: #bdbdbd;
  --vote-absent: #ffffff;
  /* Statuts : l'orange du rejet et le gris du retrait reprennent ceux des votes. Texte noir sur
     l'orange 6,4:1 / 7,4:1 ; texte orange sur le fond 5,4:1 / 8,5:1 ; noir sur le gris 11,2:1,
     blanc sur le gris sombre 5,1:1. */
  --status-negative: var(--vote-contre);
  --status-negative-text: var(--vote-contre-text);
  --status-neutral: var(--vote-abst);
  /* Maintenant : le jaune plein (texte noir 16,6:1 dans les deux modes) ; la bande d'une ligne de
     la semaine, plus douce (texte 19:1 / 12,6:1). */
  --now-soft: #fff6a8;
  /* Ce qui fait la loi, tampons : filet et cadre 7,0:1 / 7,3:1 ; texte 9,8:1 / 10,6:1 ; texte sur
     le fond du tampon 7,9:1 / 8,3:1. */
  --law: #2449d8;
  --law-text: #1b37a6;
  --law-soft: #dde6ff;
  /* Contrôle, débats, adopté : filet 4,9:1 / 8,4:1 ; texte 6,6:1 / 11,1:1 ; texte du badge plein
     (`--on-control`) 4,9:1 / 8,9:1 ; texte sur le fond doux 18,7:1 / 15,3:1. */
  --control: #12805c;
  --control-text: #0b6a4b;
  --control-soft: #e8f5ee;
  --on-control: #ffffff;
  /* Résolutions : filet 5,4:1 / 8,5:1 ; texte 8,0:1 / 11,0:1 ; sur son fond 6,7:1 / 9,2:1. */
  --resolution: #7a4fd6;
  --resolution-text: #5b35b5;
  --resolution-soft: #efe8fc;
  --lane: #f4f4f4;
  --soft: #dddddd;
  /* Nuances d'encre de la matrice de proximité, de la plus forte (5) à la plus faible (1) :
     l'encre mêlée au papier, donc inversées en sombre. Texte papier sur 5 et 4 (21:1 et 8,5:1
     en clair ; 19:1 et 9,7:1 en sombre), texte encre sur 3, 2 et 1 (7,4:1 au moins / 5,2:1). */
  --shade-5: var(--ink);
  --shade-4: color-mix(in srgb, var(--ink) 70%, var(--paper));
  --shade-3: color-mix(in srgb, var(--ink) 40%, var(--paper));
  --shade-2: color-mix(in srgb, var(--ink) 22%, var(--paper));
  --shade-1: color-mix(in srgb, var(--ink) 6%, var(--paper));
  --rule: 3px solid var(--ink);
  --hairline: 1px solid var(--ink);
  /* Texte d'une pastille de groupe, posé sur la couleur du groupe dans les deux modes. */
  --on-group-dark: #000000;
  --on-group-light: #ffffff;
  --font-body: "Archivo", "Helvetica Neue", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --container: 77.5rem;
}

@media (prefers-color-scheme: dark) {
  :root {
    --ink: #ffffff;
    --paper: #0b0b0b;
    --muted: #b5b5b5;
    --vote-pour: #ffffff;
    --vote-contre: #ff6a2b;
    --vote-contre-text: #ff8a57;
    --vote-abst: #6e6e6e;
    --vote-absent: #0b0b0b;
    --now-soft: #3a3400;
    --law: #7d98ff;
    --law-text: #a9bcff;
    --law-soft: #17224a;
    --control: #3dbe8b;
    --control-text: #6fd6aa;
    --control-soft: #0e2a1f;
    --on-control: #000000;
    --resolution: #b39bff;
    --resolution-text: #c9b8ff;
    --resolution-soft: #221a3b;
    --lane: #1c1c1c;
    --soft: #3a3a3a;
  }
}

*,
*::before,
*::after { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.45;
  color: var(--ink);
  background: var(--paper);
}

a { color: var(--ink); }
a:hover,
a:focus-visible { background: var(--highlight); color: var(--on-highlight); }
:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Un identifiant de la source ne se coupe pas en fin de ligne. */
.nowrap { white-space: nowrap; }

.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 1.5rem;
}

main.container { padding-top: 2.5rem; }

/* En-tête, navigation, pied de page */

/* En-tête : le nom du site, les cinq rubriques, le champ « Chercher », puis les outils, sur
   une ligne au bureau ; les rubriques passent sur une deuxième ligne quand la place manque.
   Au téléphone : le nom, « Chercher » et « Menu », puis quatre rubriques sur une ligne qui ne
   défile pas (« Semaine » pour « Cette semaine ») ; la cinquième et les outils sont dans
   « Menu ». Dessous, les sous-rubriques d'une liste ou le fil d'Ariane d'une fiche. */
.site-header { position: relative; border-bottom: var(--rule); }
.site-header__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 1.25rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.site-name {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  flex: none;
  font-weight: 900;
  font-stretch: 70%;
  font-size: 1.75rem;
  line-height: 1;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}

.site-nav {
  display: flex;
  flex-wrap: wrap;
  order: 5;
  flex: 1 1 100%;
  font-weight: 700;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.site-nav a,
.site-tools a,
.site-header__phone > summary {
  display: inline-flex;
  flex: none;
  align-items: center;
  min-height: 44px;
  padding: 0 0.5625rem;
  text-decoration: none;
  white-space: nowrap;
}

.site-nav a[aria-current],
.site-tools a[aria-current],
.site-subnav a[aria-current],
a.site-header__phone[aria-current] { background: var(--highlight); color: var(--on-highlight); }
.site-nav__short { display: none; }

.site-search { display: flex; flex: 1 1 9rem; min-width: 0; }
.site-search input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 44px;
  padding: 0 0.75rem;
  border: var(--rule);
  border-right: 0;
  background: var(--paper);
  color: var(--ink);
  font: inherit;
  font-size: 0.9375rem;
}
.site-search input::placeholder { font-size: 0.875rem; }
.site-search__button {
  min-height: 44px;
  padding: 0 0.75rem;
  border: var(--rule);
  background: var(--ink);
  color: var(--paper);
  font: inherit;
  font-weight: 800;
  font-size: 0.8125rem;
  text-transform: uppercase;
  cursor: pointer;
}

.site-tools { display: flex; flex: none; font-size: 0.8125rem; font-weight: 600; }
.site-header__phone { display: none; }

/* Sur une seule ligne, dès 1 280 px, rubriques, outils et bouton se resserrent : le texte
   d'aide du champ tient en entier. */
@media (min-width: 80rem) {
  .site-header__bar { gap: 0 0.5rem; }
  .site-nav { order: 0; flex: 0 1 auto; letter-spacing: 0.01em; }
  .site-nav a { padding: 0 0.375rem; }
  .site-tools a { padding: 0 0.375rem; }
  .site-search input,
  .site-search__button { padding: 0 0.5rem; }
}

/* Au téléphone, le menu s'ouvre sous l'en-tête, en une seule liste. */
@media (max-width: 40rem) {
  .site-header__bar { gap: 0 0.5rem; }
  .site-name { flex: 1 1 auto; font-size: 1.5rem; }
  .site-search,
  .site-tools,
  .site-nav .site-nav__rubric--menu { display: none; }
  .site-header__phone { display: inline-flex; align-items: center; min-height: 44px; padding: 0 0.5625rem; font-weight: 800; font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.03em; text-decoration: none; white-space: nowrap; }
  .site-menu.site-header__phone { display: block; }
  .site-header__phone > summary { border: var(--hairline); }
  .site-menu > summary::before,
  .site-menu[open] > summary::before { content: none; }
  .site-menu[open] > summary { background: var(--ink); color: var(--paper); }
  .site-menu__panel {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 10;
    max-height: 80vh;
    overflow-y: auto;
    padding: 1rem 1.5rem 1.5rem;
    border-bottom: var(--rule);
    background: var(--paper);
    font-weight: 400;
    font-size: 1rem;
    text-transform: none;
    letter-spacing: 0;
    white-space: normal;
  }
  .site-menu__panel .plan { grid-template-columns: 1fr; gap: 0.5rem; }
  .site-menu__panel .plan a { display: inline-flex; align-items: center; min-height: 44px; }
  .site-nav { justify-content: space-between; }
  .site-nav a { padding: 0 0.5rem; }
  .site-nav__long {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }
  .site-nav__short { display: inline; }
}

.site-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.25rem;
  padding-top: 0.125rem;
  padding-bottom: 0.25rem;
  border-top: var(--hairline);
  font-size: 0.875rem;
}
.site-subnav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 0.5rem; text-decoration: none; }
.site-subnav--subs a:first-child { padding-left: 0; }

@media (max-width: 40rem) {
  .site-subnav--subs { display: none; }
}

/* Fil d'Ariane : « Élus › Députés › Nadège Abomangoli » ; au téléphone, « ← Députés ». */
.breadcrumb__list { display: flex; flex-wrap: wrap; align-items: center; margin: 0; padding: 0; list-style: none; }
.breadcrumb__item + .breadcrumb__item::before { content: "›" / ""; padding: 0 0.5rem; }
.breadcrumb__item > span { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.breadcrumb__item a { padding: 0; }

@media (max-width: 40rem) {
  .breadcrumb__item:not(.breadcrumb__item--parent) { display: none; }
  .breadcrumb__item--parent::before,
  .breadcrumb__item + .breadcrumb__item--parent::before { content: "← " / ""; padding: 0 0.25rem 0 0; }
}

/* Le pied ne porte ni date ni nombre : police de texte, le mono leur est réservé. */
.site-footer {
  margin-top: 4rem;
  background: var(--ink);
  color: var(--paper);
  font-size: 0.8125rem;
}

.site-footer .container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.625rem;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.site-footer a { display: inline-flex; align-items: center; min-height: 44px; color: var(--paper); }
.site-footer p { display: flex; align-items: center; margin: 0; }
.site-footer__plan { flex: 1 1 100%; font-size: 0.9375rem; }
.site-footer__mentions { display: flex; flex: 1 1 100%; flex-wrap: wrap; justify-content: space-between; gap: 0.625rem; padding-top: 1rem; border-top: 1px solid var(--paper); }
/* Liens et séparateurs d'une même ligne : en flex, l'espace autour d'un lien disparaît. */
.site-footer__mentions p { flex-wrap: wrap; column-gap: 0.375rem; }
.site-footer__mentions a[aria-current] { padding: 0 0.375rem; }

/* Le plan du site : une colonne par rubrique, les outils en dernier ; une seule liste dans le
   menu du téléphone. Une entrée à venir est dite, en pointillé, sans lien. */
.plan { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 9rem), 1fr)); gap: 1rem 1.5rem; margin: 0; padding: 0; list-style: none; }
.plan__subs { margin: 0; padding: 0; list-style: none; }
.plan__title { display: inline-flex; align-items: center; min-height: 44px; font-weight: 800; text-transform: uppercase; }
.plan a[aria-current], .site-footer__mentions a[aria-current] { background: var(--highlight); color: var(--on-highlight); }
.plan--inline { margin-top: 0.5rem; font-family: var(--font-body); text-transform: none; }
.plan--inline .plan__title { font-family: var(--font-body); }

/* Typographie */

/* Échelle des titres : le titre de la page est le plus grand, un titre de section plus petit,
   et aucun titre d'élément ne les dépasse. Titre de rubrique (H1) sur une ligne. Un titre de
   section reste sous le plus petit titre de page (`.title--long`) à toute largeur : vérifié par
   test_typescale. */
.display {
  margin: 0;
  font-weight: 900;
  font-stretch: 62%;
  font-size: clamp(2.5rem, 7vw, 3.5rem);
  line-height: 0.95;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

/* Titre de section (H2) : Archivo condensé, jamais le mono des métadonnées. */
.heading,
h2.label {
  margin: 0 0 1rem;
  font-family: var(--font-body);
  font-weight: 900;
  font-stretch: 70%;
  font-size: clamp(1.375rem, 2.5vw, 1.75rem);
  line-height: 1;
  letter-spacing: 0;
  text-transform: uppercase;
}

h2.label { font-size: 1.25rem; }

/* Sous-section (H3) : Archivo en casse normale, sous le plus petit titre de section. */
.subheading { margin: 0 0 0.5rem; font-weight: 800; font-size: 1.125rem; line-height: 1.2; }

/* Titre de fiche (dossier, scrutin, personne, groupe) : casse normale ; un titre long est
   réduit (filtre `title_size`), un titre court n'est jamais agrandi. */
/* Un mot plus large que l'écran se coupe au lieu de faire défiler la page (téléphone de
   375 px). */
.title { margin: 0.75rem 0 1.25rem; font-weight: 800; font-stretch: 75%; font-size: clamp(1.75rem, 4vw, 3rem); line-height: 1.1; overflow-wrap: anywhere; }
.title--long { font-size: clamp(1.5rem, 3vw, 2.25rem); line-height: 1.15; }
/* Sous-titre d'une page : ce dont elle parle (l'objet d'un vote, le texte suivi), en casse
   normale ; un titre de page qui est un lien ne se souligne qu'au survol. */
.title-sub { max-width: 48rem; margin: -0.5rem 0 1rem; font-weight: 600; font-size: 1.25rem; line-height: 1.3; }
.title__link { text-decoration: none; }
.title__link:hover { text-decoration: underline; }
@media (max-width: 40rem) { .title-sub { font-size: 1.0625rem; } }

/* Un seul marqueur pour tous les dépliants : « + » fermé, « − » ouvert, avant le résumé. */
summary { cursor: pointer; list-style: none; }
summary::-webkit-details-marker { display: none; }
summary::before { content: "+" / ""; display: inline-block; flex: none; width: 1.25em; font-family: var(--font-mono); font-weight: 700; }
details[open] > summary::before { content: "−" / ""; }

.label {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  text-transform: uppercase;
}

.kicker {
  display: inline-block;
  margin: 0;
  padding: 0.375rem 0.625rem;
  /* Noir dans les deux modes : le jaune sur l'encre blanche du mode sombre est illisible. */
  background: var(--on-highlight);
  color: var(--highlight);
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 0.9375rem;
}

.number {
  font-weight: 900;
  font-stretch: 70%;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.muted { color: var(--muted); }

.section {
  margin-top: 2.5rem;
  padding-top: 1.75rem;
  border-top: var(--rule);
}

/* Boutons et badges */

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 48px;
  padding: 0 1.125rem;
  border: var(--rule);
  background: var(--ink);
  color: var(--paper);
  font: inherit;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  text-decoration: none;
  cursor: pointer;
}

.button--highlight { background: var(--highlight); color: var(--on-highlight); border-color: var(--on-highlight); }

.badge {
  display: inline-block;
  padding: 0.125rem 0.5rem;
  border: var(--hairline);
  font-family: var(--font-mono);
  font-size: 0.75rem;
  text-transform: uppercase;
}


/* Statuts : toujours un libellé et un symbole (tag `status_badge`), la couleur ne fait que
   doubler le sens. */
.status {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.125rem 0.5rem;
  border: 2px solid transparent;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.4;
  text-transform: uppercase;
}

/* Maintenant : jaune plein (en discussion). */
.status--now { background: var(--highlight); color: var(--on-highlight); border-color: var(--on-highlight); }
/* État neutre : cadre noir (en cours, confirmé, tenu, ajouté, déplacé). */
.status--progress,
.status--scheduled,
.status--held,
.status--added,
.status--moved { border-color: currentColor; }
/* Adopté : vert plein. La loi : noir plein. */
.status--adopted { background: var(--control); color: var(--on-control); border-color: var(--control); }
.status--promulgated,
.status--law { background: var(--ink); color: var(--paper); border-color: var(--ink); }
/* Négatif pour le texte : orange plein ; négatif partiel ou anomalie : cadre orange de 3 px. */
.status--rejected { background: var(--status-negative); color: var(--on-highlight); border-color: var(--status-negative); }
.status--disagreement,
.status--partial,
.status--vanished { border: 3px solid var(--status-negative); padding: 0.0625rem 0.4375rem; }
/* Abandonné : gris plein. En attente ou inconnu : cadre gris foncé. */
.status--withdrawn,
.status--merged { background: var(--status-neutral); color: var(--ink); border-color: var(--status-neutral); }
.status--waiting,
.status--open,
.status--postponed,
.status--void { border-color: var(--muted); }
/* À venir : pointillé, et rien d'autre ne l'est. */
.status--upcoming { border: 2px dashed currentColor; }

/* Position d'un élu dans un scrutin : pastille pleine, noir pour, orange contre, gris
   abstention, cadre seul s'il n'a pas pris part. L'issue du scrutin, sur la même ligne, reste
   en texte neutre : une seule dimension en couleur par ligne. */
.position {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.125rem 0.5rem;
  border: 2px solid var(--muted);
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.4;
  text-transform: uppercase;
}

/* Position d'un groupe dans un scrutin : carré du symbole, ou un point par scrutin dans une case
   d'une chambre. */
.stance-marks { display: flex; flex-wrap: wrap; gap: 3px; margin: 0.5rem 0 0; }
.stance-mark { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 1.125rem; height: 1.125rem; border: 1px solid var(--ink); background: var(--paper); color: var(--ink); font-family: var(--font-mono); font-size: 0.6875rem; font-weight: 700; line-height: 1; }
.stance-dot { flex: none; width: 0.5rem; height: 0.5rem; border: 1px solid var(--ink); background: var(--paper); }

/* Couleur d'une position de vote, une seule famille pour la pastille d'un élu, le carré et le
   point d'un groupe ; une égalité entre positions d'un groupe est hachurée. */
.position--pour { background: var(--vote-pour); color: var(--paper); border-color: var(--vote-pour); }
.position--contre { background: var(--vote-contre); color: var(--on-highlight); border-color: var(--vote-contre); }
.position--abst { background: var(--vote-abst); color: var(--ink); border-color: var(--vote-abst); }
.position--partage { background: repeating-linear-gradient(45deg, var(--muted) 0 1.5px, var(--paper) 1.5px 5px); }
.position--none { color: var(--muted); }

/* Terme technique défini par une source officielle (`{% term %}`) : un lien vers le lexique,
   souligné en pointillé dans le texte courant, et rien d'autre sur le site ne l'est. Un tampon ou
   un badge qui ouvre la bulle n'est souligné qu'au survol et au focus. */
.term {
  text-decoration: underline dotted;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  cursor: help;
}

.term:hover,
.term:focus-visible { text-decoration-style: solid; }
.term.stamp,
.term.status-link,
.term--repeat { text-decoration: none; }
.term.stamp:hover,
.term.stamp:focus-visible,
.term--repeat:hover,
.term--repeat:focus-visible { text-decoration: underline; }

/* Bulle de définition (`static/js/terms.js`) : citation exacte, source et lien. Au toucher, un
   panneau en bas de l'écran. La position vient du script (`--term-x`, `--term-y`). */
.term-bubble {
  position: fixed;
  inset: auto;
  top: var(--term-y, 1rem);
  left: var(--term-x, 1rem);
  z-index: 100;
  width: max-content;
  max-width: min(27.5rem, calc(100vw - 1rem));
  margin: 0;
  padding: 0.875rem 1rem;
  border: 3px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
  box-shadow: 6px 6px 0 var(--highlight);
  font-size: 0.9375rem;
  line-height: 1.4;
}

.term-bubble[hidden] { display: none; }
.term-bubble a { color: var(--paper); }
.term-bubble a:hover,
.term-bubble a:focus-visible { color: var(--on-highlight); }
.term-bubble p { margin: 0; }
.term-bubble blockquote { margin: 0.5rem 0 0; }

.term-bubble--panel {
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  width: auto;
  max-width: none;
  max-height: 50vh;
  overflow-y: auto;
  padding-bottom: calc(1rem + env(safe-area-inset-bottom));
  box-shadow: 0 -6px 0 var(--highlight);
}

.term-def__kicker {
  display: inline-block;
  padding: 0 0.375rem;
  background: var(--highlight);
  color: var(--on-highlight);
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
}

.term-def__term { margin-top: 0.375rem; font-weight: 800; font-size: 1rem; }
.term-def__source { margin-top: 0.5rem; font-size: 0.8125rem; }
.term-def__links { display: flex; flex-wrap: wrap; gap: 0 1rem; margin-top: 0.25rem; font-size: 0.875rem; }
.term-def__links a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }

.term-bubble__close {
  display: block;
  min-width: 44px;
  min-height: 44px;
  margin-top: 0.5rem;
  padding: 0 1rem;
  border: 2px solid var(--paper);
  background: var(--ink);
  color: var(--paper);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

/* Tampons de procédure : cadre bleu, Archivo en casse normale, sans symbole, pour ne pas se
   confondre avec un statut (mono en capitales) ; posés après le titre, ils ouvrent la définition
   officielle de la procédure (`{% stamp %}`). */
.stamp {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.5rem;
  border: 2px solid var(--law);
  background: var(--law-soft);
  color: var(--law-text);
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.4;
  text-transform: none;
  text-decoration: none;
}

a.stamp:hover,
a.stamp:focus-visible { background: var(--law-soft); color: var(--law-text); }

/* Nature d'un texte ou d'un point (`apps/pages/natures.py`) : un filet à gauche de sa ligne et
   un mot en minuscules. Fait la loi : bleu ; résolution : violet ; contrôle et débat : vert,
   sur fond doux. */
.nature { border-left: 6px solid transparent; padding-left: 0.75rem; }
.nature--loi { border-left-color: var(--law); }
.nature--resolution { border-left-color: var(--resolution); }
.nature--controle { border-left-color: var(--control); background: var(--control-soft); }

.nature-word { margin: 0 0 0.125rem; font-size: 0.875rem; font-weight: 700; line-height: 1.6; }
.nature-word--loi { color: var(--law-text); }
.nature-word--resolution { color: var(--resolution-text); }
.nature-word--controle { color: var(--control-text); }
.nature-word--autre { color: var(--muted); }
.nature-word a.term { color: inherit; }
.nature-word a.term:hover,
.nature-word a.term:focus-visible { color: var(--on-highlight); }
.nature-word .group-badge { vertical-align: 0.0625rem; }

/* Auteur d'un projet : le Gouvernement, en cadre noir ; jamais une pastille ronde, réservée aux
   groupes. */
.author-badge {
  display: inline-flex;
  align-items: center;
  padding: 0 0.5rem;
  border: 2px solid var(--ink);
  color: var(--ink);
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.5;
  vertical-align: 0.0625rem;
  text-decoration: none;
}

.nature-word a.author-badge,
a.author-badge { color: var(--ink); }
.nature-word a.author-badge:hover,
.nature-word a.author-badge:focus-visible { border-color: var(--on-highlight); color: var(--on-highlight); }

/* Listes datées (ordre du jour, votes récents) */

.day {
  display: grid;
  grid-template-columns: 6.875rem minmax(0, 1fr);
  column-gap: 0.75rem;
  border-top: var(--rule);
}

.day__label {
  margin: 0;
  padding: 0.875rem 0;
  font-weight: 900;
  font-stretch: 70%;
  font-size: 1.625rem;
  line-height: 1;
  text-transform: uppercase;
}

/* Accueil « Cette semaine » : surtitre et suivi RSS, titre sur une ligne,
   phrase et chiffres ; « Toute la semaine », puis « Jour par jour » ; à côté (après, sur
   téléphone), les derniers votes solennels et les commissions ; une légende. */

/* Surtitre d'une page et « Suivre en RSS » à son bout : le surtitre se replie plutôt que de
   laisser le lien seul sur sa ligne. */
.page-kicker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0 1rem;
  min-height: 44px;
}

.page-kicker > :first-child { min-width: 0; }
/* Seuls, les liens « Suivre » et « S'abonner » restent à droite, comme à côté d'un surtitre. */
.page-kicker > :only-child { margin-left: auto; }
.page-kicker .label { margin: 0; }
.page-kicker .follow { flex: none; }
/* Un surtitre suivi de deux liens (« Suivre en RSS », « S'abonner au calendrier ») les passe
   sous lui sur téléphone plutôt que de l'écraser. */
.page-kicker__links { display: flex; flex: none; flex-wrap: wrap; justify-content: flex-end; gap: 0 1rem; }
@media (max-width: 40rem) {
  .page-kicker--links { flex-wrap: wrap; }
  .page-kicker--links .page-kicker__links { justify-content: flex-start; }
}
.page-kicker__when { white-space: nowrap; }
/* Surtitre de plus de trois mots (« Sénat · mandats depuis octobre 2006 ») : en Archivo, le
   mono étant réservé aux dates, aux nombres et aux badges courts (R5). */
.kicker-text { margin: 0; color: var(--muted); font-weight: 600; font-size: 0.9375rem; }

/* Plus précis que `.lead`, déclaré plus bas, qui l'emporterait sinon. */
.lead.week-lead,
.lead.page-lead { max-width: 60ch; margin: 0.75rem 0 0; font-weight: 400; font-size: 1.25rem; line-height: 1.35; }

.week-figures {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  margin: 1rem 0 0;
  border-top: var(--rule);
  border-bottom: var(--hairline);
}

.week-figures > div { padding: 0.625rem 0.875rem 0.625rem 0; }
.week-figures dt { font-size: 0.8125rem; }
.week-figures dd { margin: 0; }
.week-figures__value { font-size: 1.875rem; }

.week-layout { display: flex; flex-wrap: wrap; gap: 2.25rem; margin-top: 1.75rem; }
.week-main { flex: 999 1 40rem; min-width: 0; }
.week-aside { display: flex; flex: 1 1 20rem; flex-direction: column; gap: 1.75rem; min-width: 0; }
.week-section + .week-section { margin-top: 2rem; }
.week-aside__title { margin-bottom: 0.5rem; font-size: 1.5rem; }
.week-aside__lead { margin: 0 0 0.5rem; }
.week-aside__more { margin: 0.25rem 0 0; }
.week-aside__more a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }

.section-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0 1rem; }
.section-head .heading { margin-bottom: 0.25rem; }
.section-head__link { display: inline-flex; align-items: center; min-height: 44px; font-size: 0.875rem; }
.week-note { max-width: 60ch; margin: 0 0 0.75rem; color: var(--muted); font-size: 0.875rem; }

/* Un texte inscrit toute la semaine : une fois, en tête, avec ses jours et ses heures. */
.recurring { display: flex; flex-direction: column; gap: 0.375rem; padding: 0.75rem 1rem; border: var(--hairline); border-left-width: 6px; }
.recurring + .recurring { margin-top: 0.75rem; }
.recurring p { margin: 0; }
.recurring__title { font-weight: 800; font-size: 1.3125rem; line-height: 1.2; }
.recurring__title a,
.agenda-item__title a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.recurring__title a:hover,
.agenda-item__title a:hover { text-decoration: underline; }
.agenda-item__title a.term { text-decoration: underline dotted 1px; text-underline-offset: 0.2em; }
.recurring__days { display: flex; flex-wrap: wrap; gap: 0.375rem; margin: 0; padding: 0; list-style: none; font-family: var(--font-mono); font-size: 0.8125rem; text-transform: uppercase; }
.recurring__days li { padding: 0.25rem 0.5rem; border: var(--hairline); }
.recurring__count { font-size: 0.9375rem; }

/* Un jour de séance : ses points, puis le rappel des textes de toute la semaine. Un jour passé
   est dit terminé, en gris. */
.agenda-day { padding-top: 0.375rem; border-top: var(--rule); }
.agenda-day + .agenda-day { margin-top: 1.25rem; }
.agenda-day__title { margin: 0 0 0.5rem; font-weight: 900; font-stretch: 70%; font-size: 1.375rem; line-height: 1.1; text-transform: uppercase; }
.agenda-day--ended .agenda-day__title { color: var(--muted); }
.agenda-day__ended { font-family: var(--font-mono); font-weight: 600; font-size: 0.8125rem; }
.agenda-day__also { margin: 0.5rem 0 0; font-size: 0.9375rem; }
.agenda-day__also a { font-weight: 700; }

.agenda-item { display: grid; grid-template-columns: 4.625rem minmax(0, 1fr); gap: 0.75rem; padding: 0.625rem 0.75rem; }
.agenda-item + .agenda-item { margin-top: 0.5rem; }
.agenda-item p { margin: 0; }
.agenda-item__time { display: flex; flex-direction: column; padding-top: 0.125rem; font-family: var(--font-mono); font-size: 0.875rem; text-transform: uppercase; }
.agenda-item__title { font-weight: 800; font-size: 1.1875rem; line-height: 1.2; }
.agenda-item__title--point { font-weight: 700; }
.agenda-item__note { color: var(--muted); font-weight: 500; font-size: 0.9375rem; }
.agenda-item .agenda-item__stamps,
.agenda-item .agenda-item__vote,
.agenda-item .agenda-item__also { margin-top: 0.375rem; }
.agenda-item__stamps { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
/* Cible tactile de 44 px d'un tampon, sans le grossir. */
.agenda-item__stamps .stamp { position: relative; }
.agenda-item__stamps a.stamp::after { content: ""; position: absolute; inset: calc(-0.5rem - 2px) -2px; }
.agenda-item__vote { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.5rem; }
.agenda-item__vote a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.agenda-item__also { font-size: 0.9375rem; }
.agenda-item__also a { display: inline-block; padding: 0.75rem 0; font-weight: 700; }
/* Vote solennel de la semaine : la ligne surlignée (jaune doux, maintenant). */
.agenda-item--solemn { background: var(--now-soft); }
.agenda-item--withdrawn .agenda-item__title { color: var(--muted); text-decoration: line-through; }

/* Semaines suivantes repliées : le résumé donne la période et le nombre de séances. */
.week-later { margin-top: 1.5rem; border-top: var(--rule); }
.week-later__summary { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; min-height: 44px; padding: 0.5rem 0; }
.week-later__title { font-weight: 900; font-stretch: 70%; font-size: 1.25rem; text-transform: uppercase; }
.week-later__when { color: var(--muted); }
.week-later[open] > .week-later__summary { margin-bottom: 0.5rem; }
.week-later__recurring { margin-bottom: 1.25rem; }
.week-agenda__empty { margin: 0; padding: 0.875rem 0; border-top: var(--rule); }

.week-committees { border-top: var(--hairline); }
.week-committees > summary { display: flex; align-items: center; min-height: 44px; font-weight: 700; }
.week-committees__title { margin: 0.75rem 0 0; font-weight: 800; font-size: 1rem; }
.week-committees__note { margin: 0.25rem 0 0; color: var(--muted); font-size: 0.875rem; }

.solemn-list { margin: 0; padding: 0; list-style: none; }
.solemn-list__item { display: flex; flex-direction: column; gap: 0.375rem; padding: 0.75rem 0; border-top: var(--hairline); }
.solemn-list__item p { margin: 0; }
.solemn-list__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
/* Le titre d'une ligne de liste : scrutins solennels, votes d'un texte, changements. */
.solemn-list__title,
.vote-group__title,
.changes__title { margin: 0; font-weight: 800; font-size: 1.125rem; line-height: 1.25; }
.solemn-list__title.title--long,
.vote-group__title.title--long,
.changes__title.title--long { font-weight: 700; font-size: 1rem; line-height: 1.3; }
.solemn-list__title a { display: inline-block; padding: 0.375rem 0; text-decoration: none; }
.solemn-list__title a:hover { text-decoration: underline; }
/* Un titre long tient en trois lignes ; le titre entier reste sur la page du scrutin. */
.solemn-list__title.title--long a { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }
.solemn-list__object { color: var(--muted); font-size: 0.875rem; }
.solemn-list__count { font-size: 0.875rem; }

/* Légende d'une page : natures, surlignage, tampon, pastille. */
.legend-strip { margin-top: 2.5rem; padding-top: 0.875rem; border-top: var(--rule); }
.legend-strip__list { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; margin: 0; padding: 0; list-style: none; font-size: 0.875rem; }
.legend-strip__list li { display: inline-flex; align-items: center; gap: 0.5rem; }
.legend-strip__key { display: inline-block; width: 1.375rem; height: 1.375rem; }
.legend-strip__key.nature { padding: 0; border-left-width: 6px; }
.legend-strip__key--solemn { border: var(--hairline); background: var(--now-soft); }
.legend-strip__list a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }

.day__head { display: flex; flex-direction: column; align-items: flex-start; }

/* Statut d'un passage et tampon menant à leur définition : cible tactile de 44 px sans les
   grossir. La zone part du bord du badge, ou de l'intérieur du cadre (2 px) du tampon. */
.status-link { position: relative; display: inline-flex; vertical-align: middle; text-decoration: none; }
.status-link::after { content: ""; position: absolute; inset: -0.625rem 0; }
.status-link:hover .status { text-decoration: underline; }
.status-link:hover,
.status-link:focus-visible { background: none; }

.works { margin: 0; padding: 0; list-style: none; }
.work { padding: 0.75rem 0; border-top: var(--hairline); }
.work p { margin: 0; }
.work__title { font-weight: 800; font-size: 1rem; line-height: 1.25; }
.work__title a { display: inline-block; padding: 0.75rem 0; text-decoration: none; }
.work__title a:hover { text-decoration: underline; }
/* Un titre long tient en trois lignes, assez hautes pour la cible tactile : sans remplissage,
   que la coupe ne laisse pas voir la quatrième. Le titre complet reste dans la page. */
.work__title.title--long { font-weight: 700; font-size: 0.9375rem; }
.work__title.title--long a { display: -webkit-box; overflow: hidden; margin: 0.5rem 0; padding: 0; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }
.work__meta { margin-top: 0.25rem; }
.work__statuses { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem; margin-top: 0.375rem; }
.work__share { color: var(--muted); font-size: 0.875rem; }


@media (max-width: 40rem) {
  .lead.week-lead,
  .lead.page-lead { font-size: 1.125rem; }
  .week-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .agenda-item { grid-template-columns: 3.75rem minmax(0, 1fr); gap: 0.5rem; padding: 0.5rem; }
  .agenda-item__title { font-size: 1.0625rem; }
  .recurring__title { font-size: 1.125rem; }
  .day { display: block; }
  .day__head { flex-direction: row; align-items: center; justify-content: space-between; gap: 0.75rem; }
  .day__label { font-size: 1.375rem; }
  .day__label br { display: none; }
}

/* Votes : barres empilées, légende, hémicycle */

/* Barre de votes en SVG : les largeurs, en pour cent, sont des attributs, jamais du style en
   ligne ; le fond blanc est la part qui n'a pas voté. */
.vote-bar {
  display: block;
  width: 100%;
  height: 22px;
  border: 2px solid var(--ink);
  background: var(--vote-absent);
}

.vote-bar--small { height: 16px; min-width: 6rem; }
.vote-bar__pour { fill: var(--vote-pour); }
.vote-bar__contre { fill: var(--vote-contre); }
.vote-bar__abst { fill: var(--vote-abst); }
/* Un repère jaune porte un liseré noir de chaque côté : seul, il ne se verrait pas sur le
   blanc (contraste 1,27:1). */
.vote-bar__mark { stroke: var(--highlight); stroke-width: 4px; }
.vote-bar__mark-edge { stroke: var(--on-highlight); stroke-width: 8px; }

.vote-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.875rem;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  text-transform: uppercase;
}

.vote-legend li,
.stance-legend li { display: inline-flex; align-items: center; gap: 0.375rem; }
.vote-legend__swatch { width: 14px; height: 14px; border: 2px solid var(--ink); background: var(--vote-absent); }
.vote-legend__swatch--pour { background: var(--vote-pour); }
.vote-legend__swatch--contre { background: var(--vote-contre); border-color: var(--vote-contre); }
.vote-legend__swatch--abst { background: var(--vote-abst); border-color: var(--vote-abst); }
.vote-legend__swatch--vacant { background: none; border: 2px solid var(--muted); }

.vote-contre-text { color: var(--vote-contre-text); }

/* Un point par siège ; un siège vide de titulaire n'a qu'un contour gris, le pointillé ne
   disant que ce qui est à venir. */
.hemicycle { display: block; width: 100%; max-width: 42.5rem; height: auto; }
.hemicycle .seat { stroke: var(--ink); stroke-width: 1.5; }
.hemicycle .seat--pour { fill: var(--vote-pour); stroke: var(--vote-pour); }
.hemicycle .seat--contre { fill: var(--vote-contre); stroke: var(--vote-contre); }
.hemicycle .seat--abst { fill: var(--vote-abst); stroke: var(--vote-abst); }
.hemicycle .seat--absent { fill: var(--vote-absent); }
.hemicycle .seat--vacant { fill: none; stroke: var(--muted); stroke-width: 1; }
/* Contour d'encre : un groupe pâle sur le blanc (LIOT, HOR) ou foncé sur le noir (RN, GDR)
   reste visible. */
.hemicycle .seat--groupe { fill: var(--group, var(--paper)); stroke: var(--ink); stroke-width: 1; }
/* Groupe sans couleur publiée (Sénat) : noir, en alternance avec le blanc de son voisin. */
.hemicycle .seat--groupe-alt { fill: var(--ink); stroke: var(--ink); stroke-width: 1; }
.hemicycle__value { fill: var(--ink); font-weight: 900; font-stretch: 62%; font-size: 64px; text-anchor: middle; }
.hemicycle__caption { max-width: 42.5rem; margin: 0.25rem 0 0; text-align: center; }

/* Repli de l'intitulé officiel */

.official-title { max-width: 48rem; margin: 0 0 1.25rem; }
/* Cible tactile de 44 px sans retirer le triangle de repli. */
.official-title > summary { padding: 0.8125rem 0; cursor: pointer; }
.official-title > p { margin: 0.5rem 0 0; }

/* Tableaux */

/* `position` retient dans le cadre un texte masqué (`.sr-only`, en position absolue). */
.table-wrap { position: relative; overflow-x: auto; }

.table {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}

.table th {
  padding: 0.5rem 0.75rem 0.5rem 0;
  border-bottom: var(--rule);
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  font-weight: 600;
  text-align: left;
  text-transform: uppercase;
}

.table td,
.table tbody th {
  padding: 0.5rem 0.75rem 0.5rem 0;
  border-bottom: var(--hairline);
  vertical-align: top;
}

.table__number { text-align: right; white-space: nowrap; }

/* Un nom dans un tableau ou une liste de fonctions est une cible tactile de 44 px. */
.table td a,
.responsibilities dd a { display: inline-flex; align-items: center; min-height: 44px; }
/* Une pastille de groupe garde sa taille dans un tableau : sa zone tactile vient de son
   `::after`. */
.table td a.group-badge { min-height: 0; }

/* Fiche : l'essentiel en clair sous le titre, une phrase puis les chiffres clés */

.statuses {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 0.5rem;
  margin: 0 0 1rem;
}

.lead {
  max-width: 48rem;
  margin: 0;
  font-size: 1.3125rem;
  font-weight: 600;
  line-height: 1.4;
}

/* « En clair » : la phrase à gauche, les chiffres clés en grille à droite */
.clear {
  display: flex;
  flex-wrap: wrap;
  margin: 1.75rem 0 0;
  border: var(--rule);
}

.clear__text {
  flex: 999 1 28.75rem;
  padding: 1.25rem 1.375rem;
}

.clear__title { margin: 0 0 0.5rem; font-weight: 600; }

/* Sur téléphone, « En clair » tient en cinq lignes environ : corps réduit, cadre resserré. */
@media (max-width: 40rem) {
  .clear__text { padding: 1rem; }
  .clear .lead { font-size: 1.125rem; font-weight: 500; }
}

/* Filets haut et gauche rentrés sous le cadre : seul celui qui sépare la grille de la
   phrase se voit, qu'elle soit à côté (bureau) ou dessous (téléphone). */
.clear__figures {
  display: grid;
  flex: 1 1 21.25rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: -3px 0 0 -3px;
  border-top: var(--rule);
  border-left: var(--rule);
}

.clear__figures > div {
  padding: 0.875rem 1.125rem;
  border-bottom: var(--hairline);
}

.clear__figures > div:nth-child(odd) { border-right: var(--hairline); }
.clear__figures > div:nth-last-child(-n + 2):nth-child(odd),
.clear__figures > div:last-child { border-bottom: 0; }
/* Un nombre impair de chiffres : le dernier prend la ligne, jamais de case vide. */
.clear__figures > div:last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0; }
/* Libellé et précision d'un chiffre : des mots, en Archivo, pas en mono. */
.clear__figures dt.label,
.clear__detail.label { font-family: var(--font-body); font-size: 0.8125rem; text-transform: none; }
.clear__figures dd { margin: 0; }
.clear__value { font-size: clamp(2rem, 5vw, 2.5rem); }
/* Assez petit pour qu'un mot comme « partiellement » tienne dans sa case (~8,3rem). */
.clear__value--text { font-size: clamp(1rem, 4.8vw, 1.125rem); text-transform: uppercase; }
.clear__value--negative { color: var(--vote-contre-text); }
.clear__unit { font-weight: 800; font-size: 1rem; text-transform: uppercase; }
.clear__detail { display: block; margin-top: 0.25rem; color: var(--muted); }

/* En-tête d'une fiche : fil d'Ariane, statut et tampons, ligne d'auteurs */
.breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; }

/* Titre du dossier au-dessus du titre court d'un scrutin. */
.overtitle { max-width: 48rem; margin: 0 0 0.25rem; font-weight: 700; font-size: 1.0625rem; line-height: 1.3; }
.overtitle a { padding: 0.75rem 0; }
.byline { max-width: 48rem; margin: 0.875rem 0 0; font-size: 1rem; }
/* Le remplissage d'un lien en ligne agrandit sa cible (44 px) sans espacer les lignes. */
.byline a { padding: 0.875rem 0; font-weight: 700; }
/* Une pastille garde sa taille : sa zone tactile vient de son `::after`. */
.byline a.group-badge { padding: 0.125rem 0.375rem; }

.statuses .status,
.statuses .stamp { font-size: 0.875rem; padding: 0.3125rem 0.75rem; }
/* Statut et tampons mènent à leur définition : cible tactile de 44 px sans les grossir. */
.statuses .stamp,
.statuses__link { position: relative; text-decoration: none; }
.statuses .stamp::after,
.statuses__link::after { content: ""; position: absolute; inset: -0.5rem 0; }
/* La zone d'un tampon part du bord de son cadre (2 px), pas de l'intérieur ; l'écart entre
   deux rangées repliées (1rem) évite que les zones se chevauchent. */
.statuses .stamp::after { inset: calc(-0.5rem - 2px) -2px; }
.statuses__link:hover,
.statuses__link:focus-visible { background: none; }
.statuses__link:hover .status { text-decoration: underline; }

@media (max-width: 40rem) {
  .statuses .status,
  .statuses .stamp { font-size: 0.75rem; padding: 0.25rem 0.5rem; }
}

/* Prochaine étape d'un dossier, tirée de l'agenda, puis la frise de ses passages à venir */
.next-step {
  max-width: 48rem;
  margin: 1rem 0 0;
  padding: 0.75rem 1rem;
  border: var(--rule);
}

.next-step__main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem 0.75rem;
  margin: 0;
}

.next-step__more { margin: 0.5rem 0 0; font-size: 0.9375rem; }

/* Un jour par case, du premier au dernier passage : plein pour une séance publique,
   cadre pour une réunion de commission seulement. */
.schedule-strip { margin-top: 0.5rem; }
.schedule-strip__days { display: flex; gap: 2px; height: 1.25rem; margin: 0; padding: 0; list-style: none; }
.schedule-strip__day { flex: 1 1 0; min-width: 0; border-bottom: var(--hairline); }
.schedule-strip__day--sitting { background: var(--ink); }
.schedule-strip__day--committee { border: var(--hairline); }
.schedule-strip__axis { display: flex; justify-content: space-between; gap: 0.75rem; margin: 0.25rem 0 0; }
.schedule-strip__legend { margin: 0.25rem 0 0; font-size: 0.875rem; }
.schedule-strip__key { display: inline-block; width: 0.625rem; height: 0.625rem; vertical-align: -0.0625rem; }
.schedule-strip__key--sitting { background: var(--ink); }
.schedule-strip__key--committee { border: var(--hairline); }

.schedule { margin-top: 0.25rem; }
.schedule > summary { padding: 0.8125rem 0; font-weight: 600; cursor: pointer; }
.schedule__days { margin: 0; padding: 0; list-style: none; }
.schedule__day { display: grid; grid-template-columns: 6rem minmax(0, 1fr); gap: 0.25rem 0.5rem; padding: 0.375rem 0; border-top: var(--hairline); }
.schedule__meetings { margin: 0; padding: 0; list-style: none; font-size: 0.9375rem; }
.schedule__meetings li { padding: 0.125rem 0; }

@media (max-width: 40rem) {
  .schedule__day { grid-template-columns: minmax(0, 1fr); }
}

.next-step__when { font-weight: 600; }
.next-step__what { font-weight: 700; }
.next-step__source { display: inline-flex; align-items: center; min-height: 44px; margin: 0; font-size: 0.875rem; }

.navette__vote { display: block; margin-top: 0.25rem; }

.notice {
  max-width: 48rem;
  margin: 1rem 0 0;
  padding: 0.75rem 1rem;
  border: var(--rule);
  font-weight: 600;
}

/* Formulaires */

.search {
  display: flex;
  align-items: stretch;
  border: var(--rule);
}

.search input {
  min-height: 40px;
  padding: 0 0.75rem;
  border: 0;
  background: var(--paper);
  color: var(--ink);
  font: inherit;
  font-weight: 600;
}

.search button {
  min-width: 44px;
  border: 0;
  border-left: var(--rule);
  background: var(--ink);
  color: var(--paper);
  font: inherit;
  font-weight: 800;
  text-transform: uppercase;
  cursor: pointer;
}

.filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 1rem;
  margin-top: 2rem;
}

.field {
  display: flex;
  flex: 1 1 14rem;
  flex-direction: column;
  gap: 0.375rem;
  min-width: 0;
}

.field input,
.field select {
  width: 100%;
  min-height: 48px;
  padding: 0 0.75rem;
  border: var(--rule);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  font: inherit;
  font-weight: 600;
}

.errorlist {
  margin: 0.375rem 0 0;
  padding: 0;
  list-style: none;
  font-weight: 700;
}

/* Liste : en-tête, barre de répartition par statut, filtres, recherche */

.page-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
}

.filters-block { margin-top: 1.375rem; }

/* Largeurs en pour cent dans le SVG (attributs) : aucune mise en forme en ligne. */
.distribution { display: block; width: 100%; height: 1.75rem; border: var(--rule); }
.distribution__segment--now { fill: var(--highlight); }
.distribution__segment--progress { fill: var(--paper); }
.distribution__segment--waiting { fill: var(--soft); }
.distribution__segment--promulgated { fill: var(--ink); }
.distribution__segment--adopted { fill: var(--control); }
.distribution__segment--rejected { fill: var(--status-negative); }
.distribution__segment--withdrawn,
.distribution__segment--merged { fill: var(--status-neutral); }
.distribution__segment--void { fill: var(--lane); }
.distribution__rule { stroke: var(--ink); stroke-width: 3px; }
.distribution--small { height: 1.125rem; border-width: 2px; }
.distribution--small .distribution__rule { stroke-width: 2px; }
/* Nombre d'un segment assez large (`labelled`) ; un filtre actif estompe les autres segments. */
.distribution__count { font-family: var(--font-mono); font-weight: 600; font-size: 0.8125rem; text-anchor: middle; dominant-baseline: central; fill: var(--ink); }
.distribution__count--now { fill: var(--on-highlight); }
.distribution__count--promulgated { fill: var(--paper); }
.distribution__count--adopted { fill: var(--on-control); }
.distribution__count--rejected { fill: var(--on-highlight); }
.distribution--filtered .distribution__segment:not(.distribution__segment--active) { opacity: 0.3; }

.chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }

.chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  padding: 0 0.75rem;
  border: var(--rule);
  font-weight: 700;
  text-decoration: none;
}

/* Puces sur une ligne qui défile sur téléphone, comme la navigation, au lieu de trois rangées. */
@media (max-width: 40rem) {
  .chips--scroll { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; mask-image: linear-gradient(to right, #000 calc(100% - 2rem), transparent); }
  .chips--scroll::-webkit-scrollbar { display: none; }
  .chips--scroll .chip { flex: none; }
}
.chip--active { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.chip__count { font-family: var(--font-mono); font-weight: 400; font-size: 0.8125rem; }
/* Carré de 12 px à la couleur d'un statut : la puce reste blanche, seule l'active est noire. */
.chip__key { flex: none; width: 0.75rem; height: 0.75rem; border: 1px solid currentColor; }
.chip__key--now { background: var(--highlight); }
.chip__key--progress { background: var(--paper); }
.chip__key--waiting { background: var(--soft); }
.chip__key--promulgated { background: var(--ink); }
.chip--active .chip__key--promulgated { background: var(--paper); }
.chip__key--adopted { background: var(--control); }
.chip__key--rejected { background: var(--status-negative); }
.chip__key--withdrawn,
.chip__key--merged { background: var(--status-neutral); }
.chip__key--open { background: var(--lane); }

.search-bar { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }
/* Recherche repliée sous les puces : dépliée quand un de ses champs est en usage. */
.search-fold { margin-top: 0.5rem; }
.search-fold__summary { display: flex; align-items: center; min-height: 44px; font-weight: 700; }
.search-fold .search-bar { align-items: flex-end; gap: 0.75rem; }
.search-fold .field label { font-size: 0.875rem; font-weight: 600; }
.search-fold__submit { flex: none; }
.search-fold .field { flex: 1 1 16rem; }
.search-fold .field input,
.search-fold .field select { flex: none; width: 100%; }
.period { flex: 1 1 100%; order: 3; }
/* `display: inline-flex` retire le triangle natif : un ▸ / ▾ dit que la période se déplie. */
.period > summary { display: inline-flex; gap: 0.375rem; align-items: center; min-height: 44px; cursor: pointer; list-style: none; }
.period__fields { display: flex; flex-wrap: wrap; gap: 0.75rem; }
/* Dans un champ en colonne, la base de 20 rem d'un champ de recherche en ferait la hauteur ;
   dans une barre de recherche, la période prend sa propre ligne. */
.period__fields .field input { flex: none; }
.search-bar .period__fields { flex: 1 1 100%; }
.period-form { margin-top: 0.75rem; }
.period__submit { align-self: flex-end; }

.search-bar input,
.search-bar select {
  min-height: 48px;
  padding: 0 0.875rem;
  border: var(--rule);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  font: inherit;
  font-weight: 600;
}

.search-bar input { flex: 1 1 20rem; min-width: 0; }
.search-bar select { flex: 0 1 16rem; width: 16rem; min-width: 0; }

.section-plain { margin-top: 1.75rem; }
.results-title { margin: 0 0 0.75rem; }

/* Cartes de dossiers */

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 22.5rem), 1fr));
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1rem;
  border: var(--rule);
}

.card > p { margin: 0; }
.card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.card .stamps { margin: 0; }
/* Un tampon, la pastille d'un groupe et un terme défini restent cliquables au-dessus du lien
   qui couvre la carte. */
.card .stamps .term,
.card .nature-word a { position: relative; z-index: 2; }

.card__title { margin: 0; font-weight: 700; font-size: 1.25rem; line-height: 1.2; }
/* Filet de la nature du texte (`natures`) sur le bord gauche de la carte. */
.card.nature { border-left-width: 6px; padding-left: 1rem; }
.card.nature--loi { border-left-color: var(--law); }
.card.nature--resolution { border-left-color: var(--resolution); }
/* Sur une carte, le contrôle n'a que son filet : le fond doux est celui d'une ligne d'agenda. */
.card.nature--controle { border-left-color: var(--control); background: none; }
.card__host { color: var(--muted); font-size: 0.9375rem; }
.card .nature-word { margin: 0; }
.card__title.title--long { font-weight: 700; font-size: 1.0625rem; line-height: 1.3; }
.card__title a { text-decoration: none; }
/* Toute la carte mène au dossier, par un seul lien. */
.card__title a::after,
.deputy-card__name a::after { content: ""; position: absolute; z-index: 1; inset: 0; }
.card:hover,
.deputy-card:hover { outline: 3px solid var(--highlight); outline-offset: -6px; }
.card__title a:hover,
.deputy-card__name a:hover { background: none; color: inherit; text-decoration: underline; }

.card__steps { margin: auto 0 0; padding-top: 0.625rem; border-top: var(--hairline); font-size: 0.9375rem; }
.card__steps > div + div { margin-top: 0.375rem; }
.card__steps dt { display: inline; color: var(--muted); font-weight: 600; font-size: 0.875rem; }
.card__steps dt::after { content: " · "; }
.card__when { color: var(--muted); white-space: nowrap; }
.card__steps dd { display: inline; margin: 0; }
/* Sur téléphone, une carte vise 260 px au plus (R6) : marges resserrées, titre d'élément à
   1,125 rem (R5) sur trois lignes au plus ; les thèmes et la commission, que redit la fiche,
   n'y figurent pas, et la prochaine étape, quand elle est connue, y remplace la dernière. */
@media (max-width: 40rem) {
  .card { gap: 0.5rem; padding: 0.75rem; }
  .card.nature { padding-left: 0.75rem; }
  .card .theme-tags { display: none; }
  .card__title,
  .card__title.title--long { font-size: 1.125rem; line-height: 1.25; }
  /* Un titre de plus de trois lignes s'arrête là ; il est entier sur la fiche et pour le
     lecteur d'écran. */
  .card__title a { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }
  .card__steps { padding-top: 0.5rem; }
  .card__steps--dossier > div:first-child:not(:last-child) { display: none; }
}

.cards__empty { padding: 1rem 0; }

/* Mini-navette d'une carte : une case par étape, reliées par un trait. */
.mini-navette { display: flex; align-items: flex-start; margin: 0; padding: 0; list-style: none; }

.mini-navette__step {
  position: relative;
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  min-width: 0;
}

.mini-navette__step--continues::before {
  content: "";
  position: absolute;
  top: calc(0.6875rem - 1.5px);
  left: 50%;
  width: 100%;
  height: 3px;
  background: var(--ink);
}

.mini-navette__step--before-ahead::before { background: var(--status-neutral); }
.mini-navette .box { position: relative; width: 1.375rem; height: 1.375rem; font-size: 0.8125rem; }
.mini-navette__name { font-weight: 700; font-stretch: 75%; font-size: 0.8125rem; text-transform: uppercase; }

/* Légende des statuts d'une liste */
.status-legend { display: flex; flex-wrap: wrap; gap: 0 1.25rem; margin: 0.75rem 0 0; padding: 0; list-style: none; font-size: 0.9375rem; }
.status-legend a { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; text-decoration: none; }

/* En-tête d'une fiche et de ses sous-pages, le même pour toutes (élu, groupe) : la marque de
   l'entité (initiales d'un élu, jamais de photo officielle ; pastille d'un groupe), puis son
   identité. */
.sheet-head { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1.5rem; padding-bottom: 1.5rem; border-bottom: var(--rule); }
.sheet-head__id { flex: 999 1 26.25rem; min-width: 0; }
.sheet-head__id .title { margin-bottom: 0; }
/* Sur téléphone, une sous-page ne répète pas la marque de la fiche. */
@media (max-width: 40rem) {
  .sheet-head--sub { padding-bottom: 1rem; }
  .sheet-head--sub .initials { display: none; }
  .sheet-head--sub .title { margin-top: 0.25rem; }
}

.initials {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 8.25rem;
  height: 8.25rem;
  border: var(--rule);
  border-color: var(--on-highlight);
  background: var(--highlight);
  color: var(--on-highlight);
  font-weight: 900;
  font-stretch: 62%;
  font-size: 4.5rem;
  line-height: 1;
}

.deputy-head .label { margin-bottom: 0.375rem; }

/* Nom d'un parlementaire : un titre de fiche (`.title`), en casse normale. */
.deputy-head__name {
  margin: 0;
  font-weight: 800;
  font-stretch: 75%;
  font-size: clamp(1.75rem, 4vw, 3rem);
  line-height: 1.1;
}

.deputy-head__place { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0.625rem 0 0; font-size: 1.1875rem; font-weight: 600; }
/* L'âge renvoie à sa méthode : le remplissage d'un lien en ligne agrandit sa cible (44 px)
   sans hausser la ligne. */
.deputy-head__age { padding-block: 0.75rem; }

.button--outline { min-height: 44px; background: var(--paper); color: var(--ink); font-size: 0.875rem; }

@media (max-width: 40rem) {
  .initials { width: 5rem; height: 5rem; font-size: 2.75rem; }
}


/* Son parcours : frise à tiroirs. Un couloir par nature d'organe ; sur un écran large, les
   libellés à gauche et la piste à droite, les fonctions listées sous la piste ; au téléphone,
   pas de colonne de libellés, une piste sur toute la largeur. */
.career__sentence { margin: 0 0 0.75rem; max-width: 48rem; }
.legend li,
.group-split__legend li { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 44px; }
.legend.career__legend { gap: 0.25rem 1rem; margin-bottom: 0.75rem; font-family: var(--font-body); font-size: 0.875rem; text-transform: none; }
.career__legend li { min-height: 0; }
.career-key { display: inline-block; flex: none; width: 1.125rem; height: 4px; background: var(--ink); }
.career-key--function { height: 0.875rem; }
.career-key--tick { width: 2px; height: 0.875rem; background: var(--muted); }
.career-key--cmp { width: 0.625rem; height: 0.625rem; margin: 0 0.25rem; transform: rotate(45deg); }
.career-key--away {
  height: 0.875rem;
  background: repeating-linear-gradient(-45deg, var(--muted) 0 1.5px, transparent 1.5px 5px);
}

.hatch-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.hatch__line { fill: var(--ink); }
.hatch__line--muted { fill: var(--muted); }

.career__board { border-top: var(--rule); }

.career__row {
  display: grid;
  grid-template-columns: 16.25rem minmax(0, 1fr);
  grid-template-areas: "label track" "label functions";
  grid-template-rows: auto 1fr;
  column-gap: 1rem;
  align-items: start;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--soft);
}

.career__label { grid-area: label; min-width: 0; line-height: 1.25; }
.career__label p { margin: 0; }
.career__heading { color: var(--muted); font-size: 0.75rem; font-weight: 600; }
/* Le nom d'une ligne du parcours, et celui d'un tiroir qui en replie plusieurs. */
.career__name,
.career__drawer-title { font-weight: 800; font-size: 0.9375rem; }
.career__label .career__detail,
.career__label .career__note,
.career__label .career__when { margin-top: 0.125rem; font-size: 0.8125rem; }

.career__track { grid-area: track; display: block; width: 100%; height: 1.5rem; overflow: visible; }
.career__track--group { height: 1.5rem; }
.career__silhouette,
.career__ticks { height: auto; min-height: 1rem; }
.career__ticks { height: 1.125rem; }

.career__grid { stroke: var(--soft); stroke-width: 1px; }
.career__away { fill: url(#hatch-muted); }
.career__member { fill: var(--ink); }
.career__line { fill: var(--ink); }
.career__tick { fill: var(--muted); }
.career__cmp rect { fill: var(--ink); }
/* Barre rentrée sous son cadre de 2 px : deux périodes qui se suivent restent distinctes. */
.career__box rect { x: 1px; y: 1px; width: calc(100% - 2px); height: calc(100% - 2px); stroke-width: 2px; }
.career__box text { font-size: 0.75rem; font-weight: 700; }
.career__function rect { fill: var(--ink); stroke: var(--ink); }
.career__function text { fill: var(--paper); }
.career__mandate rect { fill: none; stroke: var(--ink); }
.career__group rect { fill: var(--group); stroke: var(--group); }
.career__group--strong rect { stroke: var(--ink); }
.career__group--dark-text text { fill: var(--on-group-dark); }
.career__group--light-text text { fill: var(--on-group-light); }
.career__group--plain rect { fill: var(--paper); stroke: var(--ink); }
.career__group--plain text { fill: var(--ink); }

.career__functions { grid-area: functions; margin: 0.25rem 0 0; padding: 0; list-style: none; font-size: 0.8125rem; line-height: 1.35; }
.career__functions li + li { margin-top: 0.125rem; }

.career__row--axis { padding: 0.25rem 0 0; border-bottom: var(--hairline); }
.career__axis { grid-area: track; min-width: 0; }
.career__ends { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; margin: 0 0 0.125rem; font-size: 0.8125rem; }
.career__today { padding: 0 0.375rem; background: var(--highlight); color: var(--on-highlight); font-family: var(--font-mono); font-size: 0.75rem; font-weight: 600; text-transform: uppercase; }
.career__years { display: block; width: 100%; height: 1.5rem; overflow: visible; }
.career__years line { stroke: var(--ink); stroke-width: 1px; }
.career__years text { fill: var(--ink); font-family: var(--font-mono); font-size: 0.75rem; font-weight: 600; }

/* Tiroir : fermé, une silhouette (un trait par organe) et un compte ; le signe + ou − sort
   du flux pour que la silhouette reste alignée sur l'axe. */
.career__summary { position: relative; min-height: 44px; }
.career__summary::before { position: absolute; top: 0.5rem; left: 0; }
.career__summary .career__label { display: flex; flex-direction: column; padding-left: 1.25em; }
.career__count { color: var(--muted); font-size: 0.8125rem; }
.career__drawer[open] > .career__summary .career__silhouette { display: none; }
.career__row--nested .career__label { padding-left: 1.25em; }

.career__row--ticks { padding-top: 0; }
.career__replacements { grid-area: functions; font-size: 0.875rem; }
.career__replacements > summary { display: flex; align-items: center; min-height: 44px; font-weight: 600; }
.career__replacements ul { margin: 0 0 0.5rem; padding: 0; list-style: none; }
.career__replacements li { padding: 0.25rem 0; border-top: 1px solid var(--soft); }
.career__replaced { font-weight: 700; }
.career__outside { margin: 0.75rem 0 0; font-size: 0.9375rem; }

@media (max-width: 40rem) {
  .career__row {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "label" "track" "functions";
    grid-template-rows: auto auto auto;
  }
  /* Nature (ou nom) et période sur une ligne quand elles y tiennent, le reste dessous. */
  .career__label { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 0.75rem; }
  .career__label .career__when { order: 1; margin: 0 0 0 auto; text-align: right; }
  .career__name { order: 2; flex-basis: 100%; }
  .career__name--first { order: 0; flex-basis: auto; }
  .career__detail,
  .career__note { order: 3; flex-basis: 100%; }
  .career__name--wide { display: none; }
  .career__text--wide { display: none; }
  .career__year--minor { display: none; }
  .career__track { margin-top: 0.25rem; }
  .career__summary .career__label { display: flex; }
}

/* Responsabilités, groupes d'amitié et d'études */
.heading--small { font-size: clamp(1.25rem, 2vw, 1.5rem); margin-bottom: 0.875rem; }
.heading--spaced { margin-top: 2rem; }
.heading__count { font-family: var(--font-mono); font-size: 1.125rem; font-stretch: 100%; font-weight: 600; }

.responsibilities { margin: 0; border-top: var(--hairline); }

.responsibilities > div {
  display: grid;
  grid-template-columns: 9.375rem minmax(0, 1fr);
  gap: 0.75rem;
  padding: 0.625rem 0;
  border-bottom: var(--hairline);
}

.responsibilities dt { font-weight: 600; }
/* Sur téléphone, le libellé au-dessus de sa valeur (R6). */
@media (max-width: 37.5rem) {
  .responsibilities > div { grid-template-columns: minmax(0, 1fr); gap: 0.125rem; }
}
.responsibilities dd { margin: 0; }
.responsibilities__list { margin: 0; padding: 0; list-style: none; }

.chips-small { display: flex; flex-wrap: wrap; gap: 0.375rem; margin: 0; padding: 0; list-style: none; }

.chip-small {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.5rem;
  border: 2px solid var(--ink);
  font-size: 0.875rem;
}

.chip-small abbr { text-decoration: none; font-weight: 700; }
.chip-small--lead { background: var(--highlight); color: var(--on-highlight); border-color: var(--on-highlight); font-weight: 700; }


/* Liste des députés : répartition par groupe en texte (jamais de couleur de parti), cartes */

/* Répartition par groupe, repliée sous la recherche : sigle et nom complet. */
.groups { margin-top: 0.75rem; border-top: var(--hairline); border-bottom: var(--hairline); }
.groups > summary { display: flex; align-items: center; min-height: 44px; font-weight: 600; }
.groups__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); gap: 0.25rem 1.25rem; margin: 0; padding: 0 0 0.5rem; list-style: none; }
.groups__list li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.5rem; min-height: 44px; }
.groups__name { font-size: 0.9375rem; }
.groups__count { font-family: var(--font-mono); font-size: 0.875rem; }

.deputy-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 18.75rem), 1fr));
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.deputy-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0.75rem;
  border: var(--rule);
}

.deputy-card__former { margin: 0.25rem 0 0; color: var(--muted); font-size: 0.875rem; }
/* Sur téléphone, une ligne par personne, sans carré d'initiales (R6). */
@media (max-width: 40rem) {
  .deputy-cards { gap: 0; }
  .deputy-card { padding: 0.375rem 0; border-width: 0 0 1px; }
  .deputy-card .initials { display: none; }
}
.initials--small { width: 3.5rem; height: 3.5rem; border-width: 2px; font-size: 1.875rem; }
.deputy-card__body { min-width: 0; }
.deputy-card__name { margin: 0; font-weight: 800; font-size: 1.125rem; line-height: 1.2; }
.deputy-card__name a { text-decoration: none; }
.deputy-card__meta { margin: 0.25rem 0 0; font-size: 0.9375rem; }
.deputy-card__group { margin-right: 0.375rem; font-family: var(--font-mono); font-weight: 600; text-decoration: none; }
/* La pastille reste cliquable au-dessus du lien qui couvre toute la carte. */
.deputy-card .group-badge { position: relative; z-index: 2; margin-right: 0.25rem; }
.deputy-card .badge { margin: 0.375rem 0 0; }

/* Pagination */

.pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin-top: 1.5rem;
}
/* Les numéros : la page lue en noir plein, chaque numéro une cible de 44 px ; le saut direct
   garde les filtres. */
.pagination__pages { display: flex; flex-wrap: wrap; gap: 0.25rem; margin: 0; padding: 0; list-style: none; }
.pagination__page { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 0.5rem; border: 2px solid var(--ink); font-family: var(--font-mono); font-weight: 700; text-decoration: none; }
.pagination__page--current { background: var(--ink); color: var(--paper); }
.pagination__gap { display: inline-flex; align-items: center; min-height: 44px; padding: 0 0.25rem; }
.pagination__jump { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0; }
.pagination__jump input { width: 5.5rem; min-height: 44px; padding: 0 0.5rem; border: var(--rule); border-radius: 0; background: var(--paper); color: var(--ink); font: inherit; font-weight: 600; }

/* Résultats de recherche : une ligne par résultat. */
.roster.roster--single { grid-template-columns: minmax(0, 1fr); }
.search-page__form input { font-size: 1.25rem; }

/* Semaine voisine et saut direct à une semaine d'agenda, sous les chiffres de la semaine. */
.week-nav__jump { flex: 1 1 18rem; margin: 0; }

/* Notes sous un titre de section */

.glossary__note { max-width: 48rem; margin: -0.5rem 0 1.25rem; }

/* Lexique : chaque définition officielle, citée entre guillemets avec sa source, puis la
   légende des codes du site. Une entrée visée par une ancre, ou par une ancienne ancre qui y
   mène (`.lexicon__alias`), est surlignée. */

.lexicon__intro { margin-top: 1rem; }

.lexicon-toc ol { display: flex; flex-wrap: wrap; gap: 0 1.25rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
.lexicon-toc a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
/* Chiffres : une définition courte par indicateur, sa méthode repliée ; des filets plus
   serrés que ceux d'une fiche, pour que la page se parcoure d'un coup d'œil. */
.indicator { margin-top: 1.5rem; padding-top: 1rem; }
.indicator > p { max-width: 48rem; margin: 0.25rem 0 0; }

.lexicon {
  display: grid;
  margin: 0;
  border-top: var(--hairline);
}

.lexicon__entry {
  display: grid;
  grid-template-columns: minmax(0, 15rem) minmax(0, 1fr);
  gap: 0.5rem 1.5rem;
  padding: 0.875rem 0;
  border-bottom: var(--hairline);
  scroll-margin-top: 1rem;
}

.lexicon__entry:target,
.lexicon__entry:has(> .lexicon__alias:target),
.lexicon-codes__entry:target { background: var(--now-soft); box-shadow: -0.75rem 0 0 var(--now-soft), 0.75rem 0 0 var(--now-soft); }
.lexicon__alias { position: absolute; }
.lexicon__term { margin: 0; font-weight: 800; font-size: 1.125rem; line-height: 1.3; }
.lexicon__definition { margin: 0; max-width: 48rem; }
.lexicon__quote { margin: 0; }
.lexicon__quote p { margin: 0; }
.lexicon__source { margin: 0.375rem 0 0; color: var(--muted); font-size: 0.875rem; }
.lexicon__source a { color: inherit; }
.lexicon__top { margin: 0.75rem 0 0; }
.lexicon__top a { display: inline-flex; align-items: center; min-height: 44px; }

.lexicon-codes__title { margin: 1.5rem 0 0.5rem; font-weight: 800; font-size: 1.25rem; }
.lexicon-codes { margin: 0; padding: 0; list-style: none; border-top: var(--hairline); }
.lexicon-codes__entry { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 1rem; min-height: 44px; padding: 0.375rem 0; border-bottom: var(--hairline); scroll-margin-top: 1rem; }
.lexicon-codes__entry a { display: inline-flex; align-items: center; min-height: 44px; font-size: 0.9375rem; }

/* Le repli d'une section du lexique ne sert que sur téléphone (static/js/lexicon.js) : au-delà,
   son résumé ne s'affiche pas et la section reste ouverte. */
.lexicon-fold > summary { display: none; }

@media (max-width: 40rem) {
  .lexicon__entry { grid-template-columns: minmax(0, 1fr); }
  .lexicon__intro.lead { font-size: 1.125rem; font-weight: 500; }
  .lexicon-fold > summary { display: flex; align-items: center; min-height: 44px; font-weight: 700; }
}

/* Sources en pied de page de fiche */

/* Les sources, en Archivo : des mots et des liens, jamais le mono des métadonnées (R9). Le
   remplissage d'un lien en ligne agrandit sa cible (44 px) sans espacer les lignes. */
.sources { margin-top: 2rem; font-family: var(--font-body); font-size: 0.875rem; line-height: 1.9; text-transform: none; }
.sources a { padding: 0.75rem 0; }

/* Navette en couloirs : Assemblée, accord et contrôle (CMP, Conseil, JO), Sénat.
   Chaque case porte son morceau de ligne : l'arrivée depuis le couloir de la case
   précédente (équerre, `::before`) et le départ vers la suivante (`::after`). Bureau :
   couloirs horizontaux, cases en colonnes ; téléphone : couloirs verticaux, cases en lignes. */

.navette-frame { overflow-x: auto; border-top: var(--rule); border-bottom: var(--rule); }

.navette {
  --lane-size: 5.625rem;
  --node: 2.5rem;
  --line: 4px;
  display: grid;
  grid-template-columns: 9.375rem minmax(0, 1fr);
  min-width: 56rem;
}

.navette__lanes { display: grid; grid-template-rows: repeat(3, var(--lane-size)) auto; }

.navette__lane {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-weight: 900;
  font-stretch: 70%;
  font-size: 1.5rem;
  line-height: 1;
  text-transform: uppercase;
  border-bottom: var(--hairline);
}

.navette__lane--mid { background: var(--lane); font-size: 1.125rem; }
.navette__lane-detail { display: block; margin-top: 0.25rem; font-size: 0.8125rem; font-stretch: 100%; font-weight: 600; text-transform: none; }
.navette__lane--senat { border-bottom: 0; }
.navette__lane--caption, .navette__lane-short { display: none; }

.navette__steps { display: flex; margin: 0; padding: 0; list-style: none; }

.navette__step {
  --from: var(--lane-index);
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-width: 7rem;
}

.navette__step--an { --lane-index: 0; }
.navette__step--mid { --lane-index: 1; }
.navette__step--senat { --lane-index: 2; }
.navette__step--from-an { --from: 0; }
.navette__step--from-mid { --from: 1; }
.navette__step--from-senat { --from: 2; }

.navette__track {
  position: relative;
  display: block;
  height: calc(3 * var(--lane-size));
  background: linear-gradient(
    to bottom,
    transparent calc(33.333% - 1px),
    var(--ink) calc(33.333% - 1px) 33.333%,
    var(--lane) 33.333% calc(66.666% - 1px),
    var(--ink) calc(66.666% - 1px) 66.666%,
    transparent 66.666%
  );
  border-bottom: var(--hairline);
}

.navette__track::before,
.navette__track::after { content: ""; position: absolute; border: 0 solid var(--ink); }

/* Arrivée : horizontale au couloir précédent, puis verticale jusqu'au couloir de la case. */
.navette__step--turn-down .navette__track::before,
.navette__step--turn-up .navette__track::before,
.navette__step--turn-level .navette__track::before {
  left: 0;
  width: calc(50% + var(--line) / 2);
  top: calc((min(var(--from), var(--lane-index)) + 0.5) * var(--lane-size) - var(--line) / 2);
  height: calc(
    (max(var(--from), var(--lane-index)) - min(var(--from), var(--lane-index))) * var(--lane-size)
    + var(--line)
  );
}

.navette__step--turn-down .navette__track::before { border-width: var(--line) var(--line) 0 0; }
.navette__step--turn-up .navette__track::before { border-width: 0 var(--line) var(--line) 0; }
.navette__step--turn-level .navette__track::before { border-width: var(--line) 0 0; }

.navette__step--continues .navette__track::after {
  left: 50%;
  right: 0;
  top: calc((var(--lane-index) + 0.5) * var(--lane-size) - var(--line) / 2);
  height: var(--line);
  background: var(--ink);
}

.navette__step--ahead .navette__track::before { border-color: var(--status-neutral); }
.navette__step--before-ahead .navette__track::after { background: var(--status-neutral); }

.navette__node {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: calc((var(--lane-index) + 0.5) * var(--lane-size));
  width: var(--node);
  height: var(--node);
  transform: translate(-50%, -50%);
  font-size: 1.125rem;
}

.navette__caption {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 0.125rem;
  padding: 0.625rem 0.5rem 0.875rem;
  border-left: 1px solid var(--soft);
  text-decoration: none;
}

.navette__when,
.navette__note { font-size: 0.8125rem; }
.navette__title { font-weight: 800; font-size: 0.9375rem; line-height: 1.15; }
.navette__result { font-weight: 700; font-size: 0.8125rem; }
.navette__result--rejected,
.navette__result--disagreement { color: var(--vote-contre-text); }
.navette__step--ahead .navette__caption { color: var(--muted); }

/* Une seule chronologie (R3.3) : sur ordinateur, la case suffit, et « Lecture par lecture »
   suit ; le lien vers sa lecture couvre toute la colonne, son texte reste au lecteur d'écran
   et à la bulle (`title`). */
@media (min-width: 50.0625rem) {
  .navette__step { position: relative; }
  .navette__caption { position: absolute; z-index: 2; inset: 0; padding: 0; border: 0; }
  .navette__caption > * {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }
  a.navette__caption:hover,
  a.navette__caption:focus-visible { background: none; outline: 3px solid var(--ink); outline-offset: -3px; }
}

.stamps { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-top: 0.375rem; }
.navette__caption .stamp { font-size: 0.8125rem; padding: 0 0.25rem; }

.navette-help { margin: 0.625rem 0 0; font-size: 0.9375rem; }

/* Lecture par lecture : une case de la navette dépliable, ses étapes et ses documents */

.readings { border-bottom: var(--hairline); }
.reading { border-top: var(--hairline); }

/* Une lecture se déplie : le même « + / − » que tout dépliant, en fin de ligne pour garder la
   case de la navette en tête. */
.reading__summary {
  display: grid;
  grid-template-columns: auto 2.125rem minmax(0, 1fr) auto;
  gap: 0.875rem;
  align-items: center;
  padding: 0.875rem 0;
}

.reading__symbol { width: 1.75rem; height: 1.75rem; font-size: 0.9375rem; }
.reading__heading { display: flex; flex-direction: column; min-width: 0; }
.reading__title { font-weight: 900; font-stretch: 70%; font-size: 1.5rem; line-height: 1.1; text-transform: uppercase; }
.reading__result { font-size: 0.8125rem; }
.reading[open] > .reading__summary .reading__title { text-decoration: underline; text-decoration-thickness: 3px; }

.reading__body {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  padding: 0 0 1.125rem 3rem;
  scroll-margin-top: 6rem;
}

.reading__stages {
  flex: 1 1 22.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
  border-left: var(--rule);
}

.reading__stages li { padding: 0 0 0.75rem 1rem; }
.reading__stages li:last-child { padding-bottom: 0; }
.reading__date { display: block; color: var(--muted); font-size: 0.875rem; }
.reading__hour { font-weight: 600; font-size: 0.9375rem; }
.reading__link { display: inline-flex; align-items: center; min-height: 44px; margin-left: 0.25rem; }

.reading__documents { flex: 1 1 18.75rem; }
.reading__part { margin: 0 0 0.25rem; font-weight: 700; font-size: 1rem; }

.documents { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0.5rem 0 0; padding: 0; list-style: none; }

.document {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  min-height: 44px;
  padding: 0 0.625rem;
  border: 2px solid var(--ink);
  font-weight: 700;
  font-size: 0.9375rem;
  text-decoration: none;
}

.document--adopted { background: var(--ink); color: var(--paper); }

@media (max-width: 40rem) {
  .reading__summary { grid-template-columns: auto 2.125rem minmax(0, 1fr); }
  .reading__result { grid-column: 3; justify-self: start; }
  .reading__body { padding-left: 0; }
  .reading__title { font-size: 1.25rem; }
}

/* Titre de section suivi de sa légende */
.section__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0.75rem 1.5rem;
  margin-bottom: 1.125rem;
}

.section__head .heading { margin: 0; }

.legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  text-transform: uppercase;
}

.legend a { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 44px; text-decoration: none; }

.legend .box { width: 1.25rem; height: 1.25rem; border-width: 2px; font-size: 0.8125rem; }

/* Case d'une issue (navette, lecture, carte, légende) : symbole et ton, jamais la couleur seule. */
.box {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 3px solid var(--ink);
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-mono);
  font-weight: 600;
  line-height: 1;
}

/* Mêmes sens que les statuts : la case d'un texte en discussion est jaune (maintenant), celle
   d'une étape en cours garde le cadre noir, une étape adoptée est verte, la loi publiée noire. */
.box--adopted { background: var(--control); color: var(--on-control); }
.box--promulgated,
.box--law { background: var(--ink); color: var(--paper); }
.box--rejected { background: var(--status-negative); color: var(--on-highlight); }
.box--disagreement,
.box--partial,
.box--vanished { border-color: var(--status-negative); }
.box--now { background: var(--highlight); color: var(--on-highlight); }
.box--withdrawn,
.box--merged { background: var(--status-neutral); color: var(--ink); border-color: var(--status-neutral); }
.box--waiting,
.box--open,
.box--postponed,
.box--void { border-color: var(--muted); color: var(--muted); }
.box--upcoming { border-style: dashed; border-width: 2px; }

@media (max-width: 50rem) {
  .navette-frame { overflow-x: visible; }

  .navette {
    --lane-size: 2.75rem;
    --node: 1.875rem;
    display: block;
    min-width: 0;
  }

  .navette__lanes {
    grid-template-rows: none;
    grid-template-columns: repeat(3, var(--lane-size)) minmax(0, 1fr);
    border-bottom: var(--hairline);
  }

  .navette__lane {
    align-items: center;
    padding: 0.375rem 0;
    border-bottom: 0;
    font-weight: 800;
    font-stretch: 75%;
    font-size: 0.8125rem;
    line-height: 1.1;
    text-align: center;
  }

  .navette__lane--mid { font-size: 0.8125rem; }
  .navette__lane--caption { display: flex; align-items: flex-start; padding-left: 0.625rem; }
  .navette__lane-long { display: none; }
  .navette__lane-short { display: inline; }

  .navette__steps { flex-direction: column; }

  .navette__step { flex-direction: row; min-width: 0; }

  .navette__track {
    flex: 0 0 auto;
    width: calc(3 * var(--lane-size));
    height: auto;
    min-height: 6rem;
    background: linear-gradient(
      to right,
      transparent 33.333%,
      var(--lane) 33.333% 66.666%,
      transparent 66.666%
    );
    border-bottom: 0;
  }

  /* Arrivée : verticale dans le couloir précédent, puis horizontale jusqu'à la case. */
  .navette__step--turn-down .navette__track::before,
  .navette__step--turn-up .navette__track::before,
  .navette__step--turn-level .navette__track::before {
    top: 0;
    height: calc(50% + var(--line) / 2);
    left: calc((min(var(--from), var(--lane-index)) + 0.5) * var(--lane-size) - var(--line) / 2);
    width: calc(
      (max(var(--from), var(--lane-index)) - min(var(--from), var(--lane-index))) * var(--lane-size)
      + var(--line)
    );
  }

  .navette__step--turn-down .navette__track::before { border-width: 0 0 var(--line) var(--line); }
  .navette__step--turn-up .navette__track::before { border-width: 0 var(--line) var(--line) 0; }
  .navette__step--turn-level .navette__track::before { border-width: 0 0 0 var(--line); }

  .navette__step--continues .navette__track::after {
    top: 50%;
    bottom: 0;
    left: calc((var(--lane-index) + 0.5) * var(--lane-size) - var(--line) / 2);
    right: auto;
    width: var(--line);
    height: auto;
  }

  .navette__node { left: calc((var(--lane-index) + 0.5) * var(--lane-size)); top: 50%; font-size: 0.875rem; }

  .navette__caption {
    justify-content: center;
    min-width: 0;
    padding: 0.75rem 0 0.75rem 0.625rem;
    border-left: 0;
    border-bottom: 1px solid var(--soft);
  }

  /* Jaune : maintenant, la seule case d'un texte en discussion. */
  .navette__step--now .navette__caption { background: var(--highlight); color: var(--on-highlight); }
}

/* Pastille d'un groupe politique : son sigle sur sa couleur officielle, texte noir ou blanc selon
   le contraste. Lien : zone tactile de 44 px. `--group` est la seule valeur venue des données,
   posée en ligne par le seul helper `group_style` partout où la couleur d'un groupe s'affiche
   (pastille, sièges de la composition, barres de la frise). */

.group-badge {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  padding: 0.125rem 0.375rem;
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: var(--group, var(--paper));
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 800;
  line-height: 1.3;
  text-decoration: none;
  text-transform: none;
  white-space: nowrap;
}

a.group-badge::after { content: ""; position: absolute; inset: -0.75rem -2px; }
.group-badge--dark-text,
a.group-badge--dark-text:hover,
a.group-badge--dark-text:focus-visible { color: var(--on-group-dark); }
.group-badge--light-text,
a.group-badge--light-text:hover,
a.group-badge--light-text:focus-visible { color: var(--on-group-light); }
a.group-badge:hover,
a.group-badge:focus-visible { background: var(--group, var(--paper)); outline: 3px solid var(--highlight); outline-offset: 2px; }
abbr.group-badge { text-decoration: none; }
.group-badge--large { min-width: 4rem; padding: 0.375rem 0.625rem; font-size: 1rem; border-width: 3px; }
.group-badge--xl { min-width: 8.25rem; min-height: 8.25rem; padding: 0.5rem; border-width: 3px; font-family: var(--font-body); font-weight: 900; font-stretch: 62%; font-size: 2.75rem; line-height: 1; white-space: normal; text-align: center; }

@media (max-width: 40rem) {
  .group-badge--xl { min-width: 3.75rem; min-height: 3.75rem; font-size: 1.5rem; }
}

/* Pages Groupes : composition en hémicycle et sa légende, effectif dans le temps */

.groups-lead { margin-top: 1.25rem; }

.composition { display: flex; flex-wrap: wrap; gap: 1.75rem; align-items: center; }
/* Un hémicycle et sa légende dessous : la composition des groupes, « qui a voté quoi ». */
.composition__figure,
.who__figure { flex: 1 1 26rem; min-width: 0; max-width: 42.5rem; margin: 0; }
.composition__figure figcaption,
.who__figure figcaption { margin-top: 0.5rem; }
.composition__legend { flex: 1 1 18rem; margin: 0; padding: 0; list-style: none; border-top: var(--rule); }
.composition__legend li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 0.75rem; align-items: center; min-height: 44px; border-bottom: var(--hairline); }
/* Siège d'un groupe sans couleur publiée (Sénat) : blanc ou noir, comme dans l'hémicycle. */
.composition__seat { display: inline-block; width: 0.75rem; height: 0.75rem; margin-right: 0.5rem; vertical-align: -0.0625rem; border: 1px solid var(--ink); border-radius: 50%; background: var(--paper); }
.composition__seat--alt { background: var(--ink); }
.composition__label { display: flex; flex-direction: column; min-width: 0; padding: 0.375rem 0; font-size: 0.9375rem; }
.composition__name { font-weight: 700; text-decoration: none; }
.composition__name:hover { text-decoration: underline; }
.composition__detail { color: var(--muted); font-size: 0.875rem; }
.composition__count { font-size: 1.5rem; }
/* Les extrémités de l'hémicycle nommées, sous ses deux bords. */
.composition__sides { display: flex; justify-content: space-between; max-width: 42.5rem; margin: 0.25rem 0 0; color: var(--muted); font-size: 0.875rem; }
.composition__caption { margin-top: 0.5rem; color: var(--muted); font-size: 0.875rem; }


.size-chart { display: block; width: 100%; height: 10rem; border-bottom: var(--rule); }
/* Marches de l'effectif à la couleur du groupe (`--group`), noires sans couleur. */
.size-chart__bar { fill: var(--group, var(--ink)); }
.size-chart__axis { display: flex; justify-content: space-between; margin: 0.375rem 0 0; }
.size-chart--days { height: 6rem; }
/* Votes d'un député mois par mois : pour, contre, abstention empilés. */
.month-chart { display: block; width: 100%; height: 7rem; border-bottom: var(--rule); }
/* Axe des mois : un trait par trimestre, l'année écrite en janvier. */
.month-axis { display: block; width: 100%; height: 1.375rem; overflow: visible; }
.month-axis__tick { stroke: var(--ink); stroke-width: 1px; }
.month-axis__label { fill: var(--ink); font-family: var(--font-mono); font-size: 0.75rem; }
/* Sur téléphone, une longue carrière n'écrit qu'une année sur deux ou trois (`Tick.minor`). */
@media (max-width: 40rem) {
  .month-axis__label--minor { display: none; }
}
.months { margin: 1.25rem 0 0; }
.months__title { margin-bottom: 0.5rem; }
.months__peak { margin-top: 0.25rem; font-size: 0.9375rem; }
.vote-stats { margin-top: 1rem; }
.vote-stats > summary { display: flex; align-items: center; min-height: 44px; font-weight: 700; }
.vote-stats .positions { margin-top: 0.5rem; }

.fold { margin-top: 0.75rem; }
.fold > summary { padding: 0.8125rem 0; cursor: pointer; }
.movements { margin: 0.5rem 0 0; padding: 0; list-style: none; columns: 2 20rem; }
.movements li { padding: 0.25rem 0; break-inside: avoid; }
/* Le nom suit le fil de la phrase : une cible de 44 px par son remplissage, sans hausser la
   ligne. */
.movements a { padding-block: 0.8125rem; }
.movements + .subheading { margin-top: 1rem; }

/* Scrutins : cartes de la liste, « qui a voté quoi », listes nominatives */

.stamp--highlight { background: var(--highlight); color: var(--on-highlight); border-color: var(--on-highlight); }
a.stamp--highlight:hover,
a.stamp--highlight:focus-visible { background: var(--highlight); color: var(--on-highlight); }
/* Liste des scrutins : par jour, puis par texte (titre écrit une fois), comme les votes d'un
   député ; une ligne par scrutin, son issue devant, sa barre et ses voix à droite (dessous sur
   téléphone), ses tampons après l'objet du vote. */
.votes__item.scrutin-line { grid-template-columns: 7.5rem minmax(0, 1fr); align-items: center; }
.votes__item.scrutin-line--bare,
.votes__item--bare { grid-template-columns: minmax(0, 1fr); }
.votes__item .scrutin-line__body { display: grid; grid-template-columns: minmax(0, 1fr) 15rem; align-items: center; gap: 0.125rem 1.5rem; }
.scrutin-line__head { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.5rem; }
.scrutin-line__result { display: flex; flex-direction: column; gap: 0.25rem; }
.scrutin-line__count { font-size: 0.875rem; font-variant-numeric: tabular-nums; }
.scrutin-line__stamp { position: relative; }
.scrutin-line__stamp::after,
.dossier-scrutins__stamp::after,
.changes__badge .stamp::after,
.changes__stamp::after { content: ""; position: absolute; inset: calc(-0.625rem - 2px) -2px; }
.results-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.25rem 1.5rem; margin-bottom: 0.25rem; }
.results-head .results-title { margin: 0; }
/* « Télécharger » à côté du titre des résultats, qu'il exporte ; une page sans titre unique de
   résultats (plusieurs sections, une composition) le garde avant ses sources. */
.results-head .download { margin: 0; }
.notice--quiet { border-width: 1px; font-weight: 400; }

/* Sur téléphone, l'issue et l'objet sur une ligne, la barre et les voix dessous, sur toute la
   largeur. */
@media (max-width: 40rem) {
  .votes__item .scrutin-line__body { display: contents; }
  .scrutin-line__result { grid-column: 1 / -1; }
}

.who { display: flex; flex-wrap: wrap; gap: 1.75rem; align-items: center; padding-bottom: 1.5rem; }
.who__legend { flex: 1 1 15rem; margin: 0; padding: 0; list-style: none; border-top: var(--rule); }
.who__legend li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 0.25rem 0.625rem; align-items: center; padding: 0.5rem 0; border-bottom: var(--hairline); }
.who__legend .number { font-size: 2rem; }
.who__legend .label { grid-column: 2 / 4; }

.reading__summary--names { grid-template-columns: auto auto minmax(0, 1fr); }
.names { padding: 0 0 1.125rem; }
.names__position + .names__position { margin-top: 1rem; }
.names__title { font-weight: 600; margin-bottom: 0.375rem; }
.names__list { margin: 0.5rem 0 0; padding: 0; list-style: none; font-size: 0.9375rem; columns: 4 12rem; column-gap: 1.5rem; }
.names__list li { break-inside: avoid; }
.names__list a { display: inline-flex; align-items: center; min-height: 44px; }

.purpose { max-width: 48rem; }

/* Page d'un scrutin : le texte voté en titre (son lien), l'objet du vote dessous ; ce que
   propose l'amendement, cité ; la jauge des voix pour face à la majorité requise ; les mises
   au point réunies par changement de position. */
.proposal { max-width: 48rem; margin: 1rem 0 0; padding: 0.875rem 1.125rem 0.375rem; border: var(--hairline); }
.proposal__title { margin: 0 0 0.375rem; font-weight: 800; font-size: 1rem; line-height: 1.3; }
.proposal__quote { margin: 0; font-size: 1.0625rem; }
.proposal__quote p { margin: 0; }
.proposal__more { margin: 0.25rem 0 0; }
.proposal__more a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.majority { max-width: 48rem; margin: 1rem 0 0; }
.majority .gauge { margin-top: 0; }
.majority__caption { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin-top: 0.375rem; font-size: 0.9375rem; }
.majority__count { font-weight: 700; font-variant-numeric: tabular-nums; }
.who__caption { color: var(--muted); font-size: 0.875rem; }
.who__detail { grid-column: 2 / 4; font-size: 0.875rem; }
.names__counts { color: var(--muted); font-size: 0.875rem; font-weight: 400; }
.reading__summary--names .reading__title { font-weight: 700; font-stretch: 100%; font-size: 1.0625rem; text-transform: none; }
.corrections { max-width: 48rem; margin: 0.75rem 0 0; padding-left: 1.25rem; }
.corrections li + li { margin-top: 0.25rem; }
.requested { margin-top: 2rem; font-size: 0.9375rem; }

/* Fiche député : ses votes, sa participation en jauge avec le repère de la médiane */

.participation { max-width: 48rem; margin-bottom: 1.5rem; }
/* Jauge : fond gris clair, remplissage noir (R10). */
.gauge { display: block; width: 100%; height: 1.5rem; margin-top: 0.875rem; border: var(--rule); background: var(--lane); }
.gauge__fill { fill: var(--ink); }
/* Sous le repère qui compte (la médiane des lois suivies), la jauge passe à l'orange. */
.gauge__fill--below { fill: var(--status-negative); }
/* Repère (médiane, seuil) : trait blanc bordé de noir, jamais jaune, réservé à « maintenant » ;
   son libellé est écrit sous la jauge, à sa place (`gauge_mark`, R10). */
.gauge__median { stroke: var(--paper); stroke-width: 4px; }
.gauge__median-edge { stroke: var(--ink); stroke-width: 8px; }
.gauge__key { display: inline-block; width: 0.5rem; height: 0.875rem; margin-left: 0.25rem; vertical-align: -0.125rem; border: 2px solid var(--ink); background: var(--paper); }
.gauge-mark { display: block; width: 100%; height: 1.25rem; overflow: visible; }
.gauge-mark__label { fill: var(--ink); font-family: var(--font-body); font-weight: 700; font-size: 0.8125rem; dominant-baseline: hanging; }
.gauge__legend,
.positions__period { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 1rem; margin: 0.375rem 0 0; }
.participation__context { margin: 0.375rem 0 0; }
.participation__agreement { margin: 0.875rem 0 0; font-weight: 600; }

/* Proximité de vote. Page d'un groupe : une barre en trois parts par autre groupe, sur une
   échelle fixe de 0 à 100 % (même position en encre pleine, l'un des deux s'est abstenu en
   hachures, positions contraires en vide, toujours avec la légende) ; le nombre de scrutins
   est toujours écrit. /groupes/ : une matrice en escalier, cinq nuances d'encre et le nombre
   écrit dans chaque case. Aucune couleur nouvelle : l'encre et le papier, mêlés. */
.proximity__headline,
.proximity__line { max-width: 48rem; }
.proximity__line { margin: 0.5rem 0 0; }
.proximity__keys { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 1rem; margin-top: 0.75rem; }
.legend.proximity__legend { gap: 0.25rem 1rem; font-family: var(--font-body); font-size: 0.875rem; text-transform: none; }
.proximity__legend li { min-height: 0; }
.proximity-key { display: inline-block; flex: none; width: 1.5rem; height: 0.75rem; border: var(--hairline); background: var(--paper); }
.proximity-key--same { background: var(--ink); }
.proximity-key--abstained { background: repeating-linear-gradient(-45deg, var(--ink) 0 1.5px, var(--paper) 1.5px 5px); }
.proximity__method-link { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }

.proximity__head,
.proximity__scale,
.proximity__row {
  display: grid;
  grid-template-columns: 18rem minmax(0, 1fr) 5.5rem 4.5rem;
  grid-template-areas: "group bar all whole";
  column-gap: 1rem;
  align-items: center;
}
.proximity__head { margin-top: 1rem; padding-bottom: 0.375rem; border-bottom: var(--rule); font-size: 0.8125rem; font-weight: 700; line-height: 1.25; }
.proximity__head > span:first-child { grid-column: 1 / 4; }
.proximity__head-whole { grid-area: whole; text-align: right; }
.proximity__scale { margin: 0.25rem 0 0; font-family: var(--font-mono); font-size: 0.75rem; }
.proximity__scale > span:first-child { grid-area: bar; justify-self: start; }
.proximity__scale > span:nth-child(2) { grid-area: bar; justify-self: center; }
.proximity__scale > span:last-child { grid-area: bar; justify-self: end; }
.proximity__rows { margin: 0; padding: 0; list-style: none; }
.proximity__row { padding: 0.5rem 0; border-bottom: 1px solid var(--soft); }
.proximity__group { grid-area: group; display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: 0.9375rem; line-height: 1.2; }
.proximity__bar { grid-area: bar; display: block; width: 100%; height: 1.25rem; overflow: visible; }
.proximity__same { fill: var(--ink); }
.proximity__abstained { fill: url(#hatch); }
.proximity__frame { x: 0.75px; y: 0.75px; width: calc(100% - 1.5px); height: calc(100% - 1.5px); fill: none; stroke: var(--ink); stroke-width: 1.5px; }
.proximity__half { stroke: var(--muted); stroke-width: 1px; }
.proximity__figure { display: flex; flex-direction: column; align-items: flex-end; margin: 0; line-height: 1.1; }
.proximity__figure:not(.proximity__figure--whole) { grid-area: all; }
.proximity__figure--whole { grid-area: whole; }
.proximity__rate { font-weight: 900; font-stretch: 70%; font-size: 1.75rem; }
.proximity__figure--whole .proximity__rate { font-size: 1.25rem; font-weight: 700; font-stretch: 85%; }
.proximity__count { font-family: var(--font-mono); font-size: 0.75rem; text-align: right; }
.proximity__fold { border-top: var(--hairline); }
.proximity__fold > summary { display: flex; align-items: center; min-height: 44px; padding: 0; font-weight: 700; }

.proximity__cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr)); gap: 1rem 1.5rem; margin: 1rem 0; padding: 0; list-style: none; }
.proximity__card { padding-bottom: 0.5rem; border-bottom: var(--hairline); }
.proximity__card-head { display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: 0.875rem; }
.proximity__spark { display: block; width: 100%; height: 4rem; margin-top: 0.25rem; overflow: visible; }
.proximity__spark .proximity__half { stroke: var(--soft); }
.proximity__trace { stroke: var(--ink); stroke-width: 2px; }
.proximity__dot { fill: var(--ink); stroke: var(--ink); stroke-width: 1.5px; }
.proximity__dot--current { fill: var(--paper); }
.proximity__points { display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; margin: 0.25rem 0 0; padding: 0; list-style: none; text-align: center; line-height: 1.2; }
.proximity__points li { display: flex; flex-direction: column; min-width: 0; }
.proximity__step,
.proximity__point-count { font-family: var(--font-mono); font-size: 0.6875rem; white-space: nowrap; }
.proximity__point-rate { font-weight: 700; font-size: 0.875rem; }

@media (max-width: 48rem) {
  .proximity__head,
  .proximity__scale,
  .proximity__row {
    grid-template-columns: minmax(0, 1fr) 4.75rem 4rem;
    grid-template-areas: "group group group" "bar all whole";
    column-gap: 0.75rem;
  }
  .proximity__head > span:first-child { grid-column: 1 / 3; }
  .proximity__group { margin-bottom: 0.375rem; }
}

/* Page d'une paire : une barre par corpus ou par texte, sans colonne « Ensemble d'un texte ».
   Ses derniers scrutins : la position de chaque groupe, puis ce qu'elles font ensemble,
   marqué comme dans la légende de la barre. */
.proximity--pair .proximity__head,
.proximity--pair .proximity__scale,
.proximity--pair .proximity__row {
  grid-template-columns: 18rem minmax(0, 1fr) 5.5rem;
  grid-template-areas: "group bar all";
}
.proximity--pair .proximity__head > span:first-child { grid-column: 1 / -1; }
.proximity__card--pair { max-width: 36rem; margin: 1rem 0; }
.pair-head__groups { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; margin: 0.75rem 0 0; }
.pair-head__group { display: inline-flex; align-items: center; gap: 0.5rem; }
.votes__item.pair-votes__item { grid-template-columns: minmax(0, 1fr); gap: 0.375rem; }
.pair-votes__positions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.375rem 1rem; margin: 0; }
.pair-votes__stance { display: inline-flex; align-items: center; gap: 0.375rem; }
.pair-votes__relation { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; }
.matrix__cell[href] { text-decoration: none; }
.matrix__cell[href]:hover { outline: 2px solid var(--ink); outline-offset: 1px; }

@media (max-width: 48rem) {
  .proximity--pair .proximity__head,
  .proximity--pair .proximity__scale,
  .proximity--pair .proximity__row {
    grid-template-columns: minmax(0, 1fr) 4.75rem;
    grid-template-areas: "group group" "bar all";
  }
}

.matrices { display: flex; flex-wrap: wrap; gap: 1.5rem 3rem; margin-top: 1rem; }
.matrix { margin: 0; }
.matrix__caption { margin-bottom: 0.75rem; }
.matrix__title { font-weight: 800; font-size: 1.125rem; }
.matrix__count { font-family: var(--font-mono); font-size: 0.8125rem; }
.matrix__grid { display: flex; flex-direction: column; gap: 2px; }
.matrix__row { display: flex; align-items: center; gap: 2px; }
.matrix__cell {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid var(--soft);
  font-family: var(--font-mono);
  font-size: 0.875rem;
  font-weight: 600;
}
.matrix__cell--none { border-color: transparent; }
.matrix__cell--5 { background: var(--shade-5); color: var(--paper); border-color: var(--shade-5); }
.matrix__cell--4 { background: var(--shade-4); color: var(--paper); border-color: var(--shade-4); }
.matrix__cell--3 { background: var(--shade-3); color: var(--ink); }
.matrix__cell--2 { background: var(--shade-2); color: var(--ink); }
.matrix__cell--1 { background: var(--shade-1); color: var(--ink); }
.matrix__cell--framed { outline: 3px solid var(--ink); outline-offset: 1px; }
.matrix__group { display: inline-flex; align-items: center; margin-left: 0.25rem; white-space: nowrap; }
.matrix__key { display: inline-flex; align-items: center; justify-content: center; width: 1rem; height: 1rem; border: 1px solid var(--soft); font-family: var(--font-mono); }
.matrix__key.matrix__cell--5,
.matrix__key.matrix__cell--4 { border-color: transparent; }
.proximity__pair { white-space: nowrap; }
.proximity__pair-link { display: inline-flex; align-items: center; gap: 0.25rem; min-height: 44px; }

@media (max-width: 48rem) {
  .matrix__cell { width: 1.625rem; height: 1.625rem; font-size: 0.6875rem; }
}

/* Chiffres des élus et des votes (« Qui sont les élus », « Comment elle vote », « Comment il
   vote ») : une part en barre à partir de 30, un rond par élu ou un carré par scrutin en
   dessous (`apps/pages/gauges.py`) ; la ligne qui sert de repère (la chambre face à un groupe,
   l'autre chambre) en gris. Aucune couleur sémantique pour un chiffre neutre ; les couleurs de
   vote ne servent qu'aux positions (pour, contre, abstention), toujours avec leur symbole. */
.stat-lead { max-width: 48rem; margin: 0; }
.stat-period { margin: 0 0 0.75rem; }
.stat-block { margin-top: 2rem; }
.stat-block > .subheading { margin-bottom: 0.25rem; }
.stat-title { display: inline-block; margin: 1.25rem 0 0.25rem; font-weight: 800; font-size: 1rem; }
caption.stat-title { display: table-caption; text-align: left; }
.stat-note { max-width: 48rem; margin: 0.375rem 0 0; color: var(--muted); font-size: 0.875rem; }
.stat-note--lead { color: var(--ink); font-size: 1rem; }
.stat-legend { gap: 0 1rem; margin: 0.5rem 0 0; }
.stat-legend li { min-height: 2rem; }
.stat-compare { margin-top: 1rem; }
.stat-compare__title { margin: 0; font-weight: 700; font-size: 0.9375rem; }
.stat-compare__scale { font-weight: 400; color: var(--muted); font-size: 0.8125rem; }
.stat-rows { margin: 0.375rem 0 0; padding: 0; list-style: none; }
.stat-row { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr) 11rem; align-items: center; gap: 0.25rem 0.75rem; padding: 0.3125rem 0; border-bottom: 1px solid var(--soft); }
.stat-rows--wide .stat-row { grid-template-columns: minmax(0, 20rem) minmax(0, 1fr) 6.5rem; }
.stat-row--house .stat-row__name { font-weight: 800; }
.stat-row__name { display: flex; align-items: center; gap: 0.5rem; min-width: 0; margin: 0; font-size: 0.9375rem; line-height: 1.2; }
.stat-row__chart { min-width: 0; }
.stat-row__value { margin: 0; font-family: var(--font-mono); font-size: 0.8125rem; text-align: right; }
.stat-row__detail { display: block; margin-top: 0.125rem; color: var(--muted); font-family: var(--font-mono); font-size: 0.75rem; }
.stat-bar { display: block; width: 100%; height: 1rem; overflow: visible; }
.stat-bar__fill { fill: var(--ink); }
.stat-bar__fill--muted { fill: var(--muted); }
.stat-bar__frame { x: 0.5px; y: 0.5px; width: calc(100% - 1px); height: calc(100% - 1px); fill: none; stroke: var(--ink); stroke-width: 1px; }
.stat-bar__half { stroke: var(--muted); stroke-width: 1.5px; }
/* Le repère de la médiane : un trait clair cerné d'encre, lisible sur la part comme à côté. */
.stat-bar__median-edge { stroke: var(--ink); stroke-width: 6px; }
.stat-bar__median { stroke: var(--paper); stroke-width: 3px; }
.marks { display: flex; flex-wrap: wrap; gap: 3px; }
.mark { flex: none; width: 0.625rem; height: 0.625rem; border: 1.5px solid var(--ink); border-radius: 50%; background: var(--paper); }
.mark--on { background: var(--ink); }
.mark--set { border-radius: 0; }
.stat-key { display: inline-block; flex: none; width: 1.25rem; height: 0.75rem; border: 1.5px solid var(--ink); background: var(--paper); }
.stat-key--full { background: var(--ink); }
.seat-key { display: inline-block; flex: none; width: 0.75rem; height: 0.75rem; border: 1.5px solid var(--ink); border-radius: 50%; background: var(--paper); }
.seat-key--full { background: var(--ink); }
.seat-key--vacant { border-color: var(--muted); border-width: 1px; }
/* Hémicycle des femmes : siège plein de la couleur du groupe, cerclé d'encre ; siège d'homme
   évidé. Sans couleur publiée, les sièges pleins de deux groupes voisins alternent l'encre et
   le gris. */
.hemicycle .seat--femme { fill: var(--group, var(--ink)); stroke: var(--ink); stroke-width: 1; }
.hemicycle .seat--femme-alt { fill: var(--muted); stroke: var(--ink); stroke-width: 1; }
.hemicycle .seat--homme { fill: var(--paper); stroke: var(--ink); stroke-width: 1.25; }
.hemicycle .seat--inconnu { fill: url(#hatch-muted); stroke: var(--ink); stroke-width: 1; }
.seat-key--unknown { background: repeating-linear-gradient(45deg, var(--muted) 0 1.5px, var(--paper) 1.5px 4px); }
/* Âge : une pyramide par tranche de dix ans (femmes pleines à gauche, hommes évidés à
   droite), puis une rangée de points par groupe, un point par élu. */
.pyramid { max-width: 40rem; margin: 0; }
.pyramid__rows { margin: 0; padding: 0; list-style: none; }
.pyramid__row { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr) 7.5rem minmax(0, 1fr) 2.25rem; align-items: center; gap: 0 0.375rem; margin: 0; padding: 0.125rem 0; }
.pyramid__head { font-family: var(--font-mono); font-size: 0.75rem; text-transform: uppercase; }
.pyramid__side { grid-column: span 2; }
.pyramid__side--women { text-align: right; }
.pyramid__age { font-family: var(--font-mono); font-size: 0.75rem; text-align: center; white-space: nowrap; }
.pyramid__bar { display: block; width: 100%; height: 1rem; overflow: visible; }
.pyramid__count { font-family: var(--font-mono); font-size: 0.75rem; }
.pyramid__count--women { text-align: right; }
.pyramid__fill { fill: var(--ink); }
.pyramid__hollow { fill: var(--paper); stroke: var(--ink); stroke-width: 1.5px; }
.age-rows { margin: 0.5rem 0 0; padding: 0; list-style: none; }
.age-row { padding: 0.5rem 0 0; border-bottom: 1px solid var(--soft); }
.age-row__name { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; margin: 0 0 0.25rem; }
.age-row__stats { font-family: var(--font-mono); font-size: 0.75rem; }
.age-strip { display: block; width: 100%; height: auto; }
.age-strip__dot { fill: var(--ink); }
.age-strip__base { stroke: var(--soft); stroke-width: 2; }
.age-strip__median { stroke: var(--ink); stroke-width: 4; }
.age-strip__house { stroke: var(--muted); stroke-width: 4; }
.age-axis { display: grid; grid-template-columns: repeat(4, 2fr) 1fr; margin: 0.25rem 0 0; font-family: var(--font-mono); font-size: 0.75rem; }
/* Profession : quatre ensembles de familles, toujours dans le même ordre, distincts par la
   clarté et le motif, jamais par une teinte. */
.set-key { display: inline-block; flex: none; width: 1rem; height: 0.75rem; border: 1px solid var(--ink); }
.set-key--0,
.set-fill--0 { background: var(--ink); fill: var(--ink); }
.set-key--1,
.set-fill--1 { background: var(--shade-3); fill: var(--shade-3); }
.set-key--2 { background: repeating-linear-gradient(45deg, var(--ink) 0 1.5px, var(--paper) 1.5px 5px); }
.set-fill--2 { fill: url(#hatch); }
.set-key--3,
.set-fill--3 { background: var(--paper); fill: var(--paper); }
.stance-fill--pour { fill: var(--vote-pour); }
.stance-fill--contre { fill: var(--vote-contre); }
.stance-fill--abstention { fill: var(--vote-abst); }
.stance-fill--partage { fill: url(#hatch-muted); }
.stance-fill--sans_vote { fill: var(--paper); }
.stance-legend { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; margin: 0.5rem 0 0; padding: 0; list-style: none; font-size: 0.875rem; }
.stance-legend__count { font-family: var(--font-mono); font-size: 0.8125rem; }
.stance-cell { display: inline-flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; font-family: var(--font-mono); font-size: 0.8125rem; }
.stance-cell__item { display: inline-flex; align-items: center; gap: 0.25rem; white-space: nowrap; }
/* Ligne d'un groupe dans un tableau par groupe : un point par scrutin sous 30, une barre
   empilée au-delà, les comptes à droite (au téléphone, au-dessus de la barre). */
.stance-dots { display: flex; flex-wrap: wrap; gap: 2px; }
.stance-rows .stat-row { grid-template-columns: 8.5rem minmax(0, 1fr) 15rem; }
.stance-rows .stat-row__value .stance-cell { justify-content: flex-end; }
.stat-government { margin-top: 0.75rem; }
.stat-government__title { margin: 0; }
details.stat-government > summary,
details.stat-adopted > summary { display: flex; align-items: center; min-height: 44px; }
details.stat-government > summary .stat-title,
details.stat-adopted > summary .stat-title { margin: 0; }
/* Motions de censure d'un groupe : ses voix pour sur ses membres qui pouvaient voter. */
.censures { margin: 0.5rem 0 0; padding: 0; list-style: none; }
.censures__item { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr) 4rem; align-items: center; gap: 0.25rem 0.75rem; padding: 0.3125rem 0; border-bottom: 1px solid var(--soft); font-size: 0.875rem; }
.censures__when { font-family: var(--font-mono); font-size: 0.75rem; }
.censures__count { font-family: var(--font-mono); font-size: 0.8125rem; text-align: right; }
.censures__outcome { grid-column: 1 / -1; color: var(--muted); font-size: 0.8125rem; }
/* Qui a voté les textes adoptés : une colonne par groupe, une ligne par combinaison. */
.combo { border-collapse: collapse; font-size: 0.8125rem; }
.combo th,
.combo td { padding: 0.25rem; border-bottom: 1px solid var(--soft); text-align: center; vertical-align: middle; }
.combo__count { padding-right: 0.75rem; text-align: right; white-space: nowrap; }
.combo__count .number { font-size: 1.25rem; }
.combo__group { vertical-align: bottom; }
.combo__badge { display: inline-flex; flex-direction: column; align-items: center; writing-mode: vertical-rl; transform: rotate(180deg); }
.combo__cell { min-width: 2.25rem; }
.combo__in { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--ink); color: var(--paper); font-family: var(--font-mono); font-size: 0.75rem; font-weight: 700; }
.combo__absent { color: var(--muted); font-weight: 700; }
.combo__fraction { display: block; font-family: var(--font-mono); font-size: 0.625rem; }
.combo-details { margin: 0.25rem 0 0; padding: 0; list-style: none; font-size: 0.875rem; }
.combo-details li { margin-bottom: 0.5rem; }
.combo-legend .stance-mark,
.combo-legend .combo__in { width: 1rem; height: 1rem; font-size: 0.625rem; }

@media (max-width: 40rem) {
  .stat-row,
  .stat-rows--wide .stat-row,
  .stance-rows .stat-row { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name value" "chart chart"; }
  .stat-row__name { grid-area: name; }
  .stat-row__value { grid-area: value; }
  .stat-row__chart { grid-area: chart; }
  .censures__item { grid-template-columns: minmax(0, 1fr) 3.5rem; }
  .censures__item .stat-bar { grid-column: 1 / -1; grid-row: 2; }
}

/* Fiche dossier : application de la loi, sa jauge et ses mesures groupées par échéance */
.application-summary { max-width: 48rem; }
.application { max-width: 48rem; margin: 1.25rem 0 0; padding: 0; list-style: none; border-bottom: var(--hairline); }
.application__group { border-top: var(--hairline); }
.application__group > summary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.75rem;
  min-height: 44px;
  padding: 0.625rem 0;
  cursor: pointer;
  list-style: none;
}
.application__name { font-weight: 700; }
/* Échéance dépassée : dite en mots, l'orange ne fait que la souligner. */
.application__group--late .application__name { color: var(--status-negative-text); }
.application__count { margin-left: auto; color: var(--muted); }
.application__measures { margin: 0; padding: 0 0 0.875rem 1.75rem; list-style: none; }
.application__measure { padding: 0.625rem 0; border-top: var(--hairline); }
.application__measure p { margin: 0 0 0.25rem; overflow-wrap: anywhere; }
.application__article { font-weight: 700; }
.application__text { font-weight: 600; }
@media (max-width: 40rem) {
  .application__measures { padding-left: 0; }
}

.votes-title { margin: 1.5rem 0 0.5rem; }
/* Barre des positions d'un député, sous son « En clair ». */
.positions { margin: 1.5rem 0 0; }
.positions figcaption { margin-top: 0.625rem; }
.votes { margin: 0; padding: 0; list-style: none; border-top: var(--rule); }
.votes__item { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 0.75rem; padding: 0.625rem 0; border-bottom: var(--hairline); }
.votes__position { align-self: start; justify-self: start; }
.votes__outcome { font-weight: 600; }
.votes__body { display: flex; flex-direction: column; gap: 0.125rem; min-width: 0; }
.votes__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; }
/* Une ligne de texte suivie, que la flexbox couperait autour de sa date. */
.votes__meta--text { display: block; }
.votes__title,
.dossier-scrutins__title { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; text-decoration: none; }
.votes__title:hover,
.dossier-scrutins__title:hover { text-decoration: underline; }
.votes__note { font-size: 0.9375rem; color: var(--muted); }
.votes__note--group { color: var(--ink); font-weight: 600; }

/* Votes d'un député par jour puis par texte ; une série sur un même objet tient en une
   ligne, son détail replié. */
.vote-day { margin-top: 1.25rem; border-top: var(--rule); }
.vote-day__date { margin: 0; padding: 0.75rem 0 0.25rem; font-weight: 600; }
.vote-group + .vote-group { margin-top: 0.75rem; }
.vote-group__title a { display: inline-block; padding: 0.625rem 0; text-decoration: none; }
.vote-group__title a:hover { text-decoration: underline; }
.vote-group__title--none { padding: 0.625rem 0; color: var(--muted); font-weight: 700; font-size: 1rem; }
.vote-group .votes { border-top: var(--hairline); }
/* Le résumé garde son triangle de repli (affichage par défaut) et une cible de 44 px. */
.votes__series > summary { padding: 0.6875rem 0; cursor: pointer; }
.votes--nested { margin-top: 0.25rem; border-top: var(--hairline); }
.votes__more > summary { display: flex; align-items: center; min-height: 44px; font-weight: 700; }
.votes__more[open] > summary { border-bottom: var(--hairline); }
.votes--nested .votes__item:last-child { border-bottom: 0; }

/* Dossier : scrutins et amendements de chaque lecture, scrutins du dossier */

.reading__note { display: inline-flex; align-items: center; min-height: 44px; margin-left: 0.25rem; font-weight: 600; }
.reading__votes { flex: 2 1 28rem; min-width: 0; }
.reading__amendments { flex: 1 1 18.75rem; min-width: 0; }
.reading__votes > .label, .reading__amendments > .label { font-weight: 600; }
.reading__more { margin: 0.5rem 0 0; font-size: 0.9375rem; }
.reading__more a { display: inline-flex; align-items: center; min-height: 44px; }
.amendment-table { max-width: 28rem; margin-top: 0.375rem; }
.amendment-table th[scope="row"] { font-family: var(--font-body); font-size: 0.9375rem; font-weight: 600; text-transform: none; border-bottom: var(--hairline); }
/* Les mouvements d'un amendement de crédits : les programmes en texte courant, les en-têtes
   des montants sur plusieurs lignes, pour que les montants restent à l'écran du téléphone. */
.credit-table { margin-top: 0.375rem; }
.credit-table th[scope="row"] { min-width: 8rem; font-family: var(--font-body); font-size: 0.9375rem; font-weight: 600; text-transform: none; border-bottom: var(--hairline); }
.credit-table thead .table__number { white-space: normal; }
.outcome-bar { margin-top: 0.625rem; max-width: 28rem; }
.outcome-bar__place { display: flex; justify-content: space-between; margin: 0 0 0.25rem; font-size: 0.9375rem; font-weight: 600; }
.outcome-legend { display: flex; flex-direction: column; gap: 0.375rem; margin: 0.75rem 0 0; padding: 0; list-style: none; font-size: 0.9375rem; }
.amendments__article { margin: 0.875rem 0 0; font-size: 0.9375rem; }
.amendments { margin: 0.25rem 0 0; padding: 0; list-style: none; font-size: 0.9375rem; border-top: var(--hairline); }
.amendments li { padding: 0.125rem 0 0.5rem; border-bottom: 1px solid var(--soft); }
.amendments a { display: inline-flex; align-items: center; min-height: 44px; }
.amendments__purpose { display: block; color: var(--muted); }

.section__link { display: inline-flex; align-items: center; min-height: 44px; }
.dossier-scrutins { margin: 0.5rem 0 0; padding: 0; list-style: none; border-top: var(--hairline); }
.dossier-scrutins__item { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: 0.75rem; align-items: start; padding: 0.5rem 0; border-bottom: var(--hairline); }
.dossier-scrutins__item .status { justify-self: start; }
.dossier-scrutins__body { display: flex; flex-direction: column; min-width: 0; }
.dossier-scrutins__body .vote-bar { max-width: 28rem; margin-bottom: 0.25rem; }
.dossier-scrutins__stamp { position: relative; margin-left: 0.25rem; vertical-align: middle; }

/* Sur téléphone, un vote ou un scrutin tient sur une colonne ; la position d'un élu ou l'issue
   d'un scrutin, un ou deux mots, reste à gauche de sa ligne. */
@media (max-width: 40rem) {
  .votes__item,
  .dossier-scrutins__item { grid-template-columns: minmax(0, 1fr); gap: 0.25rem; }
  .votes__item--person,
  .votes__item.scrutin-line { grid-template-columns: auto minmax(0, 1fr); gap: 0 0.75rem; }
  .votes__item.scrutin-line--bare { grid-template-columns: minmax(0, 1fr); }
}

/* Ce qui a changé : une transition par ligne, son badge devant ; sur téléphone, au-dessus. */

.changes { margin: 0; padding: 0; list-style: none; }
.changes__item { display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: 0.25rem 0.75rem; align-items: start; padding: 0.75rem 0; border-bottom: var(--hairline); }
.changes__item:last-child { border-bottom: 0; }
.changes__badge { margin: 0; padding-top: 0.625rem; }
.changes__badge .stamp { position: relative; }
.changes__stamp { position: relative; margin-left: 0.25rem; }
.changes__body { display: flex; flex-direction: column; gap: 0.125rem; min-width: 0; }
.changes__body p { margin: 0; }
.changes__title a { display: inline-block; min-height: 44px; padding: 0.625rem 0; text-decoration: none; }
.changes__title a:hover { text-decoration: underline; }
.changes__object { font-weight: 600; }
.changes__shares { max-width: 20rem; margin: 0.25rem 0; }
.changes__sentence { font-size: 0.9375rem; }
.changes__meta a { display: inline-flex; align-items: center; min-height: 44px; }
.changes__position { padding-top: 0.625rem; font-weight: 600; }
.changes__note { font-size: 0.875rem; color: var(--muted); }
.changes__item--untitled .changes__badge { padding-top: 0; }
/* Le jaune des votes solennels ; le texte et les filets restent noirs dans les deux modes. */
.changes__item--highlight { margin-left: -0.75rem; padding-left: 0.75rem; padding-right: 0.75rem; background: var(--highlight); color: var(--on-highlight); border-bottom-color: var(--on-highlight); }
.changes__item--highlight a:not(.stamp):not(.group-badge),
.changes__item--highlight .changes__note,
.changes__item--highlight .status:not(.status--adopted) { color: var(--on-highlight); }
.changes__series > summary { min-height: 44px; padding: 0.8125rem 0; cursor: pointer; }
.changes__nested { margin: 0; padding: 0; list-style: none; border-top: var(--hairline); font-size: 0.9375rem; }
.changes__nested li { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.5rem; border-bottom: 1px solid var(--soft); }
.changes__nested a,
.changes__detail { display: inline-flex; align-items: center; min-height: 44px; }
.changes__detail { min-height: 2rem; font-family: var(--font-mono); font-size: 0.8125rem; text-transform: uppercase; }
.changes__empty { margin: 0; padding: 1rem 0; border-top: var(--rule); }
/* « Ce qui a changé » : le texte ou l'élu suivi sous le titre, le graphique replié, les liens
   d'attente d'une page encore vide. */
.changes-subject { margin: 0.75rem 0 0; }
.changes-subject a { font-weight: 700; }
.changes-chart { margin-top: 1rem; }
.changes-next { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.75rem; margin: 1.5rem 0 0; font-size: 1.0625rem; }
.changes-next a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.day__month { margin: 0; }

@media (max-width: 40rem) {
  .changes__item { grid-template-columns: minmax(0, 1fr); }
  .changes__badge,
  .changes__position { padding-top: 0; }
}

/* Flux RSS : s'abonner près du titre d'une page, copier l'adresse (bouton révélé par
   static/js/feeds.js quand le presse-papiers est disponible), l'aide au bout : un rang
   par flux, qui tient sur un téléphone sans repousser l'essentiel en clair. */
/* « Suivre en RSS » : un lien discret, sans cadre, en fin de surtitre ; il mène à /flux/, seule
   page qui montre l'adresse d'un flux et sa copie. Cible tactile de 44 px par `::after`. */
.follow {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-weight: 600;
  font-size: 0.875rem;
  text-decoration: none;
  white-space: nowrap;
}

.follow::after { content: ""; position: absolute; inset: -0.75rem -0.25rem; }
.follow:hover { text-decoration: underline; }
.follow__icon { flex: none; width: 14px; height: 14px; fill: currentColor; }

/* « Télécharger : CSV · JSON » : les exports de ce que montre la page, discrets comme
   « Suivre en RSS », juste avant ses sources ; chaque format est une cible tactile de 44 px. */
.download {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 0.25rem;
  margin: 2rem 0 0;
  font-weight: 600;
  font-size: 0.875rem;
}
.download__icon { flex: none; width: 14px; height: 14px; margin-right: 0.25rem; fill: currentColor; }
.download__group { display: inline-flex; flex-wrap: wrap; align-items: center; column-gap: 0.25rem; }
.download__link { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.download + .sources { margin-top: 0; }

.followed { margin-top: 1.5rem; padding: 1rem 1.25rem; border: var(--rule); }
.followed__title { margin: 0; font-weight: 900; font-stretch: 70%; font-size: 1.5rem; line-height: 1; text-transform: uppercase; }
.followed__name { margin: 0.5rem 0 0; font-weight: 800; font-size: 1.25rem; line-height: 1.25; }
.followed__subscribe { margin-top: 0.75rem; }
.followed__address { flex-basis: 100%; overflow-wrap: anywhere; }
.followed__copy[hidden] { display: none; }
.followed__next { margin: 0.75rem 0 0; }

.subscribes { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.375rem; margin-top: 0.75rem; }
.subscribe { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.375rem; max-width: 100%; }
/* Le nom du flux passe à la ligne dans son bouton plutôt que de chasser « Copier ». */
.subscribe__link {
  flex: 0 1 auto;
  flex-wrap: wrap;
  justify-content: flex-start;
  max-width: calc(100% - 3.125rem);
  min-height: 44px;
  column-gap: 0.5rem;
  row-gap: 0;
  padding: 0.25rem 0.75rem;
}
.subscribe__link > span { white-space: nowrap; }
.subscribe__icon { flex: none; width: 1.125rem; height: 1.125rem; fill: currentColor; }
.subscribe__link > .subscribe__what { min-width: 0; font-weight: 600; text-transform: none; letter-spacing: 0; white-space: normal; }
.subscribe__copy { flex: none; width: 44px; min-height: 44px; padding: 0; }
.subscribe__copy[hidden] { display: none; }
.subscribe__copy:hover,
.subscribe__copy:focus-visible { background: var(--highlight); color: var(--on-highlight); }
.subscribe__status { flex-basis: 100%; }
.subscribe__status:empty { display: none; }

/* Page « Flux RSS » : les étapes pour s'abonner, une carte par flux. */
.steps { display: grid; gap: 0.75rem; max-width: 48rem; margin: 0 0 1.25rem; padding: 0; list-style: none; }
.steps__step { display: flex; gap: 0.875rem; align-items: baseline; }
.steps__step p { margin: 0; }
.steps__number {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: var(--rule);
  font-weight: 700;
}
.feed-card p { margin: 0; }
.feed-card .subscribes { margin-top: 0; }
/* La fréquence d'un thème sur l'échelle commune de la liste : le texte la dit, la barre la
   compare d'un coup d'œil. */
.feed-card__bar { display: block; width: 100%; height: 0.375rem; }
.feed-card__scale { fill: var(--lane); }
.feed-card__rate { fill: var(--ink); }
/* Un flux du catalogue : sa fréquence sur une ligne, l'adresse repliée, des flux prêts à
   l'emploi ; « Pour commencer » sur le premier. */
.feed-card__pace { font-weight: 600; font-size: 0.9375rem; }
.feed-card__start { border-width: 2px; font-weight: 600; }
.feed-card__more > summary { display: flex; align-items: center; min-height: 44px; font-size: 0.9375rem; }
.feed-card__more .feed-card__address { margin-top: 0.25rem; }
.feed-card__presets { font-size: 0.9375rem; }
.feed-card__presets a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.feed-card__kind { color: var(--muted); font-size: 0.875rem; font-weight: 600; }
.subscribe__copy--text { width: auto; padding: 0 0.75rem; font-size: 0.875rem; }
.feeds-start { margin: 1rem 0 0; }
.feeds-dev { margin-top: 1.5rem; }
.feeds-dev dt { font-weight: 700; }
.feed-card__name { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.feed-card__name a:not(.group-badge) { display: inline-flex; align-items: center; min-height: 44px; }
.feed-card__address { padding: 0.5rem 0.625rem; background: var(--lane); text-transform: none; overflow-wrap: anywhere; }
.feed-card__params { display: grid; gap: 0.625rem; margin: 0.625rem 0 0; }
.feed-card__params dd { margin: 0.125rem 0 0; font-size: 0.9375rem; }
.feed-card__params dd p { margin: 0.25rem 0 0; }
.feed-card__values { display: grid; gap: 0.125rem; margin: 0.375rem 0 0; padding: 0; list-style: none; font-size: 0.875rem; }
.feed-card__values code { font-family: var(--font-mono); font-size: 0.8125rem; overflow-wrap: anywhere; }

/* Thèmes du Sénat : pastilles d'un texte, liste des thèmes, flux par thème. Une pastille de
   thème porte un filet à gauche : ni statut (mono majuscule), ni tampon (cadre entier). */
.theme-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.5rem; margin: 0.375rem 0 0; }
.card .theme-tags { margin: 0; }
.theme-tags__label { margin-right: 0.125rem; }
.theme-tags__label.label { font-family: var(--font-body); font-size: 0.875rem; text-transform: none; color: var(--muted); }
.theme-tags__label a { display: inline-flex; align-items: center; min-height: 44px; }
/* Le lien fait toute la cible (44 px de haut, sans déborder sur la rangée voisine) ; la
   pastille, filet à gauche et fond, n'en peint que le texte, 0,625rem plus bas que le haut.
   Elle passe au-dessus du lien de la carte, étendu à toute la carte. */
.theme-tag {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.625rem 0.5rem 0.625rem calc(0.5rem + 3px);
  background:
    linear-gradient(var(--ink), var(--ink)) left center / 3px calc(100% - 1.25rem) no-repeat,
    linear-gradient(var(--lane), var(--lane)) center / 100% calc(100% - 1.25rem) no-repeat;
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1.35;
  text-decoration: none;
}
.theme-tag:hover { text-decoration: underline; }
.theme-tag--committee { font-weight: 600; }

.theme-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); gap: 0 1.5rem; margin: 0; padding: 0; list-style: none; }
.theme-list__item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: start; align-items: baseline; gap: 0.25rem 0.75rem; padding: 0.625rem 0 0.875rem; border-top: var(--hairline); }
.theme-list__item .distribution,
.theme-list__summary { grid-column: 1 / -1; }
.theme-list__summary { margin: 0; font-size: 0.875rem; }
.theme-list__name { margin: 0; font-weight: 800; font-size: 1.0625rem; line-height: 1.25; }
.theme-list__name a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.theme-list__name a:hover { text-decoration: underline; }
/* Libellé entier d'une commission spéciale : deux lignes au plus, entier en infobulle. */
.theme-list__name--long { grid-column: 1 / -1; font-size: 0.9375rem; line-height: 1.5; }
.theme-list__name--long a { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.theme-list__count { margin: 0; white-space: nowrap; }
.theme-list__count .number { font-size: 1.5rem; }
/* « En cours » n'est pas « maintenant » : segment blanc entre filets noirs, comme son badge à
   cadre noir ; le jaune reste aux textes en discussion. */
.theme-list .distribution__segment--progress,
.theme-statuses .distribution__segment--progress { fill: var(--paper); }

/* « L'essentiel » d'un dossier : les synthèses officielles des rapports du Sénat. */
.essentials { margin-top: 1.5rem; padding: 1rem 0 0; border-top: var(--hairline); }
.essentials__title { margin: 0 0 0.25rem; font-weight: 600; }
.essentials__list { display: grid; gap: 0.125rem; margin: 0; padding: 0; list-style: none; }
.essentials__list li { padding: 0.5rem 0; }
/* En ligne : un titre sur deux lignes garde la flèche du lien externe à sa fin. */
.essentials__link { font-weight: 700; line-height: 1.6; }
/* Un rapport en plusieurs tomes : son nom, le compte de ses synthèses, puis les tomes. */
.essentials__list .essentials__report { padding: 0; }
.essentials__report summary { padding: 0.625rem 0; line-height: 1.5; cursor: pointer; }
.essentials__name { font-weight: 700; }
.essentials__list--parts { margin: 0 0 0.5rem 0.375rem; padding-left: 0.875rem; border-left: var(--hairline); }
.essentials__list--parts .essentials__link { font-weight: 600; }

.gauge--small { height: 0.75rem; margin-top: 0.5rem; border-width: 2px; }

/* Lois d'un thème : une ligne par loi, titre (toute la ligne est la cible), date, fraction
   et jauge courte. */
.law-rates { margin: 0.75rem 0 0; padding: 0; list-style: none; border-bottom: var(--hairline); }
.law-rate {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "title title" "meta fraction" "meta gauge";
  align-items: center;
  gap: 0.125rem 1rem;
  min-height: 44px;
  padding: 0.5rem 0;
  border-top: var(--hairline);
}
.law-rate p { margin: 0; }
.law-rate__title { grid-area: title; font-weight: 700; font-size: 1rem; line-height: 1.35; }
.law-rate__title a { display: -webkit-box; overflow: hidden; text-decoration: none; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.law-rate__title a::after { content: ""; position: absolute; inset: 0; }
.law-rate__title a:hover { text-decoration: underline; }
.law-rate__meta { grid-area: meta; font-size: 0.9375rem; color: var(--muted); }
.law-rate__fraction { grid-area: fraction; text-align: right; }
.law-rate__gauge.gauge { grid-area: gauge; width: 7rem; margin: 0; }
@media (min-width: 50rem) {
  .law-rate { grid-template-columns: minmax(0, 1fr) auto 9rem; grid-template-areas: "title fraction gauge" "meta fraction gauge"; gap: 0.125rem 1.25rem; }
  .law-rate__gauge.gauge { width: 9rem; }
}

/* Flux des thèmes : une ligne par thème, nom, barre, fréquence et bouton ; deux lignes sur
   téléphone. */
.theme-feeds { margin: 0; padding: 0; list-style: none; border-bottom: var(--hairline); }
.theme-feeds__item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "name rate" "bar subscribe";
  align-items: center;
  gap: 0 0.75rem;
  padding: 0.25rem 0 0.375rem;
  border-top: var(--hairline);
}
.theme-feeds__item p { margin: 0; }
.theme-feeds__name { grid-area: name; margin: 0; font-weight: 800; font-size: 1.0625rem; line-height: 1.25; }
.theme-feeds__name a { display: inline-flex; align-items: center; min-height: 44px; }
.theme-feeds__bar { grid-area: bar; }
.theme-feeds__rate { grid-area: rate; white-space: nowrap; text-align: right; }
.theme-feeds__item .theme-feeds__subscribe { grid-area: subscribe; justify-content: flex-end; margin-top: 0; }
@media (min-width: 50rem) {
  .theme-feeds__item {
    grid-template-columns: minmax(12rem, 20rem) minmax(0, 1fr) 9rem auto;
    grid-template-areas: "name bar rate subscribe";
    gap: 0 1.25rem;
    padding: 0.125rem 0;
  }
}

/* Travaux de contrôle : présentation de la liste, frise des actes (en colonnes sur grand
   écran, en ligne verticale sur téléphone), réunions à l'agenda. */
.intro { max-width: 48rem; margin: 0.75rem 0 0; }
.distribution__segment--open { fill: var(--lane); }

.control-frise {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: var(--rule);
}

.control-frise__step { display: flex; flex-direction: column; gap: 0.5rem; padding: 1rem 1rem 0 0; min-width: 0; }
.control-frise__box { width: 2rem; height: 2rem; font-size: 1rem; }
.control-frise__body p { margin: 0; }
.control-frise__body .documents { margin-top: 0.375rem; }
.control-frise__title { font-weight: 800; font-size: 1.125rem; line-height: 1.2; }
.control-frise__detail { margin-top: 0.125rem; font-size: 0.9375rem; overflow-wrap: anywhere; }
.control-frise__detail a { display: inline-block; padding: 0.625rem 0; }
.control-frise__step--ahead { color: var(--muted); }

@media (max-width: 40rem) {
  .control-frise { grid-auto-flow: row; grid-auto-columns: auto; border-top: 0; border-left: var(--rule); }
  .control-frise__step { flex-direction: row; align-items: flex-start; padding: 0 0 1.25rem 1rem; }
  .control-frise__box { flex: none; }
}

/* Membres d'un organe par groupe : barre empilée aux couleurs officielles, sigles en texte. */
.group-split { margin: 0.75rem 0 1rem; }
.group-split__bar { display: block; width: 100%; height: 1.5rem; border: var(--hairline); }
.group-split__bar rect { fill: var(--group, var(--paper)); stroke: var(--ink); stroke-width: 1; }
.group-split__legend { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; margin: 0.5rem 0 0; padding: 0; list-style: none; }
.group-split__legend .number { font-size: 1.25rem; }

.meetings__title { margin: 1.25rem 0 0.375rem; }
.meetings { margin: 0.375rem 0 1rem; padding: 0; list-style: none; border-top: var(--hairline); }
.meetings__item { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.75rem; padding: 0.25rem 0; border-bottom: var(--hairline); }
.meetings__item a { display: inline-flex; align-items: center; min-height: 44px; }
.meetings__when { flex: 0 0 10rem; font-weight: 600; font-size: 0.9375rem; }
.meetings__source { font-size: 0.875rem; }
.meetings__what { flex: 1 1 14rem; min-width: 0; }

@media (max-width: 40rem) {
  .responsibilities--people > div { grid-template-columns: minmax(0, 1fr); gap: 0.125rem; }
}

/* Page « Données » : la mention à recopier, les conventions des fichiers, le dictionnaire des
   champs de chaque export et les sources avec leurs dates. */
.data-mention { max-width: 48rem; margin: 0 0 1.25rem; padding: 0.75rem 1rem; border-left: var(--rule); background: var(--lane); }
.data-mention p { margin: 0; overflow-wrap: anywhere; }
.data-conventions { max-width: 48rem; }
.data-card__sources { font-size: 0.875rem; }
.feed-card .download { margin: 0; }
.data-dictionary th code { font-family: var(--font-mono); font-size: 0.8125rem; overflow-wrap: anywhere; }
.data-dictionary td p { margin: 0; }
.data-dictionary td .data-dictionary__type { margin-top: 0.25rem; font-size: 0.8125rem; }
.data-sources { margin: 0; padding: 0; list-style: none; border-top: var(--rule); }
.data-sources__item { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0 1rem; padding: 0.25rem 0 0.5rem; border-bottom: var(--hairline); }
.data-sources__name a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.data-sources__dates { font-size: 0.875rem; }
.data-sources__note { max-width: 48rem; margin: 0.75rem 0 1.25rem; }

/* Déclaration d'intérêts et d'activités (HATVP), mise en page provisoire : rubriques repliées,
   une ligne par activité, chaque montant avec son année et « net » ou « brut », jamais de total. */
.declaration-rubric { border-bottom: var(--hairline); }
.declaration-rubric > summary { display: flex; align-items: baseline; gap: 0.5rem; min-height: 44px; }
.declaration-rubric > summary .subheading { margin: 0; }
.declaration-rubric__count { font-weight: 700; }
.declaration-rubric__note { max-width: 48rem; margin: 0 0 1rem; }
.declaration-lines { max-width: 48rem; margin: 0 0 1rem; padding: 0; list-style: none; }
.declaration-line { padding: 0.75rem 0; border-top: var(--hairline); }
.declaration-line:first-child { border-top: 0; }
.declaration-line p { margin: 0; }
.declaration-line__what { font-weight: 700; overflow-wrap: anywhere; }
.declaration-line__who { overflow-wrap: anywhere; }
.declaration-line__period { margin-top: 0.25rem; }
.declaration-line__kept { margin-left: 0.5rem; }
.declaration-amounts,
.declaration-facts { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin: 0.5rem 0 0; padding: 0; list-style: none; font-variant-numeric: tabular-nums; }
.declaration-empty { max-width: 48rem; margin: 1rem 0 0; }
.declaration-previous { margin: 0; padding: 0; list-style: none; }
.declaration-previous li { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.75rem; }
.declaration-previous a { display: inline-flex; align-items: center; min-height: 44px; }
.declaration-patrimony { max-width: 48rem; margin: 2.5rem 0 0; padding-top: 1rem; border-top: var(--hairline); }
.declaration-rubric__note a { display: inline-flex; align-items: center; min-height: 44px; }
/* Liste des dossiers (Lisibilité 2) : phrase d'en-tête, recherche d'abord, barre chiffrée et
   puces blanches marquées d'un carré à la couleur du statut (une seule active, en noir), puces
   sur une ligne qui défile sur téléphone ; cartes au filet de leur nature. */
.filters-block .search-bar + .distribution,
.filters-block .errorlist + .distribution { margin-top: 1rem; }
.filters-note { margin: 0.5rem 0 0; font-size: 0.9375rem; }
.filters-note a { display: inline-flex; align-items: center; min-height: 44px; }

@media (max-width: 40rem) {
  .dossier-search input { flex-basis: 100%; }
  .dossier-search select[name="theme"] { flex: 1 1 100%; width: auto; }
  .dossier-search select[name="kind"] { flex: 1 1 0; width: auto; }
}

/* Fiche dossier (Lisibilité 2) : statut puis nature au-dessus du titre, tampons dessous ; une
   seule chronologie (les couloirs datés, puis lecture par lecture) ; dates et méta en Archivo,
   identifiants repliés sous les sources. */
.statuses__note { align-self: center; color: var(--muted); font-size: 0.9375rem; }
.statuses--stamps { margin: -0.5rem 0 1rem; }
.next-step__source a { display: inline-flex; align-items: center; min-height: 44px; }
.clear__note { max-width: 48rem; margin: 0.75rem 0 0; color: var(--muted); }
.legend--words { font-family: var(--font-body); font-size: 0.875rem; text-transform: none; }
.section__links { margin: 0; font-size: 0.875rem; }
.section__links a { padding: 0.75rem 0; line-height: 1.9; }
/* Au téléphone, une ligne par lien : un séparateur ne reste jamais seul en fin de ligne. */
@media (max-width: 40rem) {
  .section__links .section__sep { display: none; }
  .section__links .section__link { display: flex; width: fit-content; }
}
.lead.dossier-lead { font-weight: 400; font-size: 1.125rem; }
.reading__meta { color: var(--muted); font-size: 0.9375rem; }
.reading[open] .reading__meta,
.reading__summary:hover .reading__meta { color: inherit; }
.outcome-legend__count { color: var(--muted); font-size: 0.875rem; }
.dossier-scrutins__meta { color: var(--muted); font-size: 0.875rem; }
.dossier-scrutins__body .stamps { margin: 0.25rem 0; }
.essentials__count { color: var(--muted); }
.references { margin-top: 0.25rem; color: var(--muted); font-size: 0.875rem; }
.references > summary { display: inline-flex; align-items: center; min-height: 44px; }
.references__list { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 0.25rem 1rem; margin: 0.25rem 0 0; }
.references__list > div { display: contents; }
.references__list dd { margin: 0; font-family: var(--font-mono); overflow-wrap: anywhere; }

/* Fiche d'un groupe (Lisibilité 2) : noms successifs en Archivo, membres en une liste compacte
   (apparentés dits), effectif en marches sur un axe gradué, cohésion en titre-phrase et jauge. */
.group-head__names { margin: 0.5rem 0 0; color: var(--muted); font-size: 0.9375rem; }
.roster { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: 0 1.25rem; margin: 0; padding: 0; list-style: none; border-top: var(--hairline); }
.roster__item { display: flex; gap: 0.625rem; align-items: center; min-height: 44px; padding: 0.375rem 0; border-bottom: var(--hairline); }
.roster__body { display: flex; flex-direction: column; min-width: 0; }
.roster__name { font-weight: 700; text-decoration: none; }
.roster__name:hover { text-decoration: underline; }
.roster__meta { color: var(--muted); font-size: 0.875rem; }
.roster__tag { font-weight: 700; color: var(--ink); }
.initials--tiny { flex: none; width: 2.25rem; height: 2.25rem; border-width: 2px; font-size: 1.125rem; }
/* Carré d'initiales à la couleur du groupe, texte noir ou blanc selon le contraste. */
.initials--group { background: var(--group); border-color: var(--ink); }
.initials--dark-text { color: var(--on-group-dark); }
.initials--light-text { color: var(--on-group-light); }
.size-chart-frame { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.5rem; padding-top: 1.5rem; }
/* Deux valeurs proches, l'une au-dessus de l'autre (`groups.size_labels`). */
.size-chart-frame--stacked { padding-top: 2.5rem; }
/* La valeur actuelle et la plus forte, écrites au-dessus de leur barre (R10). */
.size-chart-frame .size-chart { overflow: visible; }
.size-chart__value { fill: var(--ink); font-family: var(--font-body); font-weight: 700; font-size: 0.8125rem; }
.size-chart__scale { display: flex; flex-direction: column; justify-content: space-between; margin: 0; font-size: 1rem; text-align: right; }
.movements__when { color: var(--muted); font-size: 0.875rem; }
.lead.cohesion__title { font-size: 1.25rem; }

/* Fiche d'un député ou d'un sénateur (Lisibilité 2) : surtitre et suivi RSS, carré d'initiales
   à la couleur du groupe (gris pour un mandat terminé), phrase d'en-tête. */
/* Un mandat terminé s'efface en gris, jamais en pointillé (réservé à ce qui est à venir). */
.initials--former,
.deputy-card--former .initials--small { background: var(--paper); color: var(--muted); border-color: var(--muted); }
.lead.person-lead { margin-top: 1rem; }
.deputy-head + .lead.person-lead { margin-bottom: 0.5rem; }

/* Liste du contrôle (Lisibilité 2) : organe et période repliés sous les puces. */
.filters-more { margin-top: 0.5rem; border-top: var(--hairline); border-bottom: var(--hairline); }
.filters-more > summary { display: flex; align-items: center; min-height: 44px; font-weight: 600; }
.filters-more .search-bar { margin: 0 0 0.75rem; align-items: flex-end; }
.filters-more select { flex: 1 1 24rem; width: auto; max-width: 100%; }

/* Fiche d'un travail de contrôle (Lisibilité 2) : nature au-dessus du titre, dates en clair,
   libellés en Archivo, identifiants repliés. */
.control-frise__when { margin: 0; color: var(--muted); font-size: 0.875rem; }
.responsibilities--people dt { color: var(--muted); font-size: 0.875rem; }

/* Squelette d'une fiche (`apps/pages/sheets.py`) : dès quatre sections, le sommaire, replié en
   tête au téléphone, en colonne collante au bureau ; une section que remplace sa phrase ; les
   sources et données, toujours en dernier. */
.sheet__aside { margin-top: 1.5rem; }
.toc--column { display: none; }
.toc--fold { border-top: var(--rule); border-bottom: var(--hairline); }
.toc__summary { display: flex; flex-wrap: wrap; align-items: center; min-height: 44px; font-weight: 800; }
.toc__total { margin-left: 0.25rem; font-family: var(--font-mono); font-size: 0.8125rem; font-weight: 400; text-transform: uppercase; }
.toc__title { margin: 0 0 0.25rem; }
.toc__title--pages { margin-top: 1.25rem; }
.toc__list { margin: 0; padding: 0; list-style: none; }
.toc__link { display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem; min-height: 44px; padding: 0.625rem 0; border-top: var(--hairline); font-weight: 600; text-decoration: none; }
.toc__link:hover > span:first-child { text-decoration: underline; }
.toc__count { flex: none; font-family: var(--font-mono); font-weight: 400; font-size: 0.8125rem; }
.sheet__phrase { max-width: 48rem; margin: 0; font-size: 1.0625rem; }
.sheet__origins { margin: 0; padding: 0; list-style: none; line-height: 1.9; }
.sheet__origins a { padding: 0.75rem 0; }
.sheet__collected { max-width: 48rem; margin: 0.5rem 0 0; color: var(--muted); font-size: 0.875rem; }
.sheet__unfold { margin: 0 0 0.75rem; }

@media (min-width: 64rem) {
  .sheet--toc { display: grid; grid-template-columns: 12.5rem minmax(0, 1fr); gap: 0 2.5rem; align-items: start; }
  .sheet__aside { position: sticky; top: 0; max-height: 100vh; margin-top: 2.5rem; padding: 1.75rem 0 1rem; overflow-y: auto; border-top: var(--rule); }
  .toc--fold { display: none; }
  .toc--column { display: block; }
  .toc__link { min-height: 0; padding: 0.4375rem 0; font-size: 0.9375rem; }
}
/* Deux vues d'une même donnée en onglets, sans JavaScript : un bouton radio par vue, le
   panneau de la vue cochée seul affiché (« Par groupe », « Par député » d'un scrutin). */
.tabs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; }
.tabs__tab { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1rem; border: var(--hairline); font-weight: 700; cursor: pointer; }
.tabs__input:checked + .tabs__tab { background: var(--ink); color: var(--paper); }
.tabs__input:focus-visible + .tabs__tab { outline: 3px solid var(--ink); outline-offset: 2px; }
.tabs__panel { display: none; flex: 1 1 100%; min-width: 0; margin-top: 0.75rem; }
.tabs__input--first:checked ~ .tabs__panel--first,
.tabs__input--second:checked ~ .tabs__panel--second { display: block; }
.toc__list--sub { padding-left: 0.875rem; }
.toc__link--sub { border-top: 0; font-weight: 400; }
/* En-tête d'une sous-page : la fiche et ses autres pages, avec leurs compteurs. */
.subpages { margin: 0.75rem 0 0; border-bottom: var(--hairline); }
.subpages__list { display: flex; flex-wrap: wrap; gap: 0 1.25rem; margin: 0; padding: 0; list-style: none; }
.subpages__link { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 44px; font-weight: 600; text-decoration: none; }
.subpages__link:hover { text-decoration: underline; }
.subpages__link[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--ink); }
.subpages__count { font-family: var(--font-mono); font-weight: 400; font-size: 0.8125rem; }
/* Liste des amendements d'un élu ou d'un texte : la première phrase de l'exposé, en citation. */
.amendment-lines__purpose { max-width: 48rem; margin-top: 0.375rem; color: var(--muted); font-size: 0.9375rem; }
/* « Fonctions et parcours » d'un élu : une qualité par ligne, l'organe lié, la date en mono. */
.functions { margin: 0; padding: 0; list-style: none; border-top: var(--hairline); }
.functions__line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.5rem; padding: 0.25rem 0; border-bottom: var(--hairline); font-size: 0.9375rem; line-height: 1.35; }
.functions__role { font-weight: 700; }
.functions__organ a { display: inline-block; padding-block: 0.5rem; }
.functions__since { margin-left: auto; color: var(--muted); }
.deputy-head__group { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0.5rem 0 0; font-weight: 600; }
.deputy-head__function { margin: 0.375rem 0 0; font-weight: 700; }
.deputy-head__actions { margin: 0.25rem 0 0; font-size: 0.9375rem; }
.deputy-head__actions a { display: inline-flex; align-items: center; min-height: 44px; }
.votes-legend { margin-bottom: 0.75rem; }
/* Des comptes en une ligne, sous une phrase : « Activités et mandats 4 · Collaborateurs 2 ». */
.figures-line { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin: 0.75rem 0 0; padding: 0; list-style: none; }
.figures-line .number { font-size: 1.5rem; }
.figures-line__label { font-weight: 600; font-size: 0.9375rem; }
.amendment-lines__text { margin: 0.75rem 0 0; }
.amendment-lines .work { padding: 0.375rem 0; }
/* Gouvernement : une fonction par ligne (la personne, l'intitulé lié à son ministère, ses dates)
   ; la frise des gouvernements, chacun posé sur le même axe, celui en fonction en jaune cerclé. */
.cabinet { margin: 0; padding: 0; list-style: none; border-top: var(--hairline); }
.cabinet + .cabinet__subheading { margin-top: 1.25rem; }
.cabinet__line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.125rem 0.5rem; padding: 0.625rem 0; border-bottom: var(--hairline); line-height: 1.35; }
.cabinet__name { font-weight: 800; }
/* Une cible de 44 px de haut sans écarter les lignes : le remplissage déborde sur l'interligne. */
.cabinet .cabinet__name a,
.cabinet .cabinet__title a { display: inline; min-height: 0; padding-block: 0.75rem; }
/* Sur le parcours d'un élu, dans une ligne de « Le mandat » qui a déjà ses filets. */
.cabinet--career { border-top: 0; }
.cabinet--career .cabinet__line:first-child { padding-top: 0; }
.cabinet--career .cabinet__line:last-child { border-bottom: 0; }
.cabinet__title { flex: 1 1 16rem; min-width: 0; font-size: 0.9375rem; }
.cabinet__when { margin-left: auto; color: var(--muted); font-size: 0.875rem; }
.cabinet__subject { flex-basis: 100%; padding-bottom: 0.375rem; color: var(--muted); font-size: 0.875rem; }
.cabinet__subheading { margin: 1rem 0 0.5rem; }
.cabinet__legend { margin: 0.5rem 0 0; font-size: 0.9375rem; line-height: 1.9; }
.cabinet__since { margin: 0 0 0.5rem; color: var(--muted); font-size: 0.875rem; }
.cabinet__houses { margin: 0; padding-left: 1.25rem; }
.cabinet__houses li { margin-bottom: 0.5rem; }
.cabinet__houses a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.cabinet__house { font-weight: 700; }
.cabinets { margin: 0; padding: 0; list-style: none; border-bottom: var(--hairline); }
.cabinet-line { padding: 0.75rem 0; border-top: var(--hairline); }
.cabinet-line__status { margin: 0 0 0.25rem; }
.cabinet-line__name { margin: 0; font-weight: 800; font-stretch: 75%; font-size: 1.5rem; line-height: 1.1; text-transform: uppercase; }
.cabinet-line__name a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.cabinet-line__name a:hover { text-decoration: underline; }
.cabinet-line__meta { margin: 0 0 0.5rem; font-size: 0.9375rem; }
.cabinet-line__meta a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.cabinet-span { display: block; width: 100%; height: 0.875rem; }
.cabinet-span__track { fill: var(--lane); }
.cabinet-span__period { fill: var(--ink); }
.cabinet-span__period--current { fill: var(--highlight); stroke: var(--ink); stroke-width: 2px; }
/* Les 49.3 et motions de censure d'un gouvernement : la date et l'issue, puis le texte, puis
   chaque motion qui a répondu. */
.cabinet-acts { margin: 0 0 1rem; padding: 0; list-style: none; border-top: var(--hairline); }
.cabinet-act { padding: 0.5rem 0; border-bottom: var(--hairline); font-size: 0.9375rem; line-height: 1.35; }
.cabinet-act p { margin: 0.25rem 0; }
.cabinet-act a { padding-block: 0.75rem; }
.cabinet-act__head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; }
.cabinet-act__motion { padding-left: 0.75rem; border-left: var(--rule); }
