/* =========================================================================
   CITIZENS RADIO REVIEW — « nuit studio » design system, prefix cr-
   Vocabulary: the radio studio after dark, in French as a signature:
   regie (the control-room header), plateau (studio floor = content
   width), console (home hero built as a program grid), voyant (the
   amber ON AIR lamp), cadran (the FM dial strip), emission (numbered
   section), vignette (card and image frame), journal/entree (dated
   program log), ouverture (article head), planche (lead image),
   colonne (reading column), frequence (night figure box), onde (sine
   divider), suite (read next), socle (footer).
   Palette: warm studio night, one amber VU accent, brass second tone.
   The console (header, hero, frequency boxes, footer) stays dark in
   both schemes; the paper flips automatically with the OS.
   No blue, no gradient ornament, no remote font, no gadget animation.
   ========================================================================= */

:root {
  color-scheme: light dark;

  /* ---- 1. COLOURS · the studio and its paper ---------------------------- */
  --papier:        #f4efe4;  /* warm paper, the magazine page              */
  --papier-creux:  #eae2d0;  /* reserves, banded sections                  */
  --papier-vif:    #fbf7ec;  /* lightest reserve, boxes                    */
  --encre:         #241f15;  /* deep warm ink: text                        */
  --encre-douce:   #6d6250;  /* captions, meta, second tone                */
  --ambre:         #965700;  /* the VU lamp: links, numbers (>=4.5:1)      */
  --ambre-fonce:   #774500;  /* pressed / hover on paper                   */
  --laiton:        #8a6d2f;  /* quiet brass second tone                    */
  --filet:         #d9cfb8;  /* hairline on paper                          */

  /* The console never sleeps: night values used in both schemes. */
  --nuit:          #16120c;  /* console ground                             */
  --nuit-carte:    #211a10;  /* console cards, frequency boxes             */
  --nuit-texte:    #ece2cb;  /* text on night                              */
  --nuit-doux:     #a89b80;  /* secondary text on night                    */
  --nuit-filet:    #3b3323;  /* hairline on night                          */
  --ambre-vif:     #f0a63f;  /* the lamp itself, on night grounds          */
  --ambre-vif-haut:#f8c069;  /* hover on night                             */

  /* ---- 2. TYPE · composed system stacks, nothing fetched --------------- */
  --police-titre: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", "URW Palladio L", Georgia, serif;
  --police-texte: "Gill Sans", "Gill Sans MT", Seravek, Caliban, "Segoe UI", system-ui, -apple-system, sans-serif;

  --caps-interlettre: 0.22em;
  --corps-taille: clamp(1.02rem, 0.97rem + 0.22vw, 1.12rem);
  --corps-interligne: 1.66;
  --echelle-h1: clamp(2.25rem, 1.2rem + 3.6vw, 4.3rem);
  --echelle-h2: clamp(1.45rem, 1.08rem + 1.5vw, 2.25rem);
  --echelle-h3: clamp(1.1rem, 1rem + 0.5vw, 1.35rem);

  /* ---- 3. RHYTHM -------------------------------------------------------- */
  --mesure:        64ch;       /* reading column                            */
  --largeur:       1380px;     /* studio floor                              */
  --marge-page:    clamp(1.1rem, 4vw, 4rem);
  --gouttiere:     clamp(0.9rem, 2.2vw, 2rem);
  --souffle:       clamp(2.6rem, 5.5vw, 5.6rem);

  /* ---- 4. DETAILS ------------------------------------------------------- */
  --filet-fin:   1px solid var(--filet);
  --vitesse:     150ms ease;
}

@media (prefers-color-scheme: dark) {
  :root {
    --papier:       #16130d;
    --papier-creux: #201a11;
    --papier-vif:   #292116;
    --encre:        #eae1cb;
    --encre-douce:  #b2a68c;
    --ambre:        var(--ambre-vif);
    --ambre-fonce:  var(--ambre-vif-haut);
    --laiton:       #c8a45c;
    --filet:        #3a3325;
  }
}

/* =========================================================================
   BASE
   ========================================================================= */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--papier);
  color: var(--encre);
  font-family: var(--police-texte);
  font-size: var(--corps-taille);
  line-height: var(--corps-interligne);
  overflow-wrap: break-word;
}
img, svg { max-width: 100%; height: auto; display: block; }
svg.cr-glyphe { display: inline-block; vertical-align: -0.14em; }

h1, h2, h3 {
  font-family: var(--police-titre);
  font-weight: 560;
  line-height: 1.1;
  margin: 0;
  text-wrap: balance;
  letter-spacing: 0.002em;
}
h1 { font-size: var(--echelle-h1); }
h2 { font-size: var(--echelle-h2); }
h3 { font-size: var(--echelle-h3); }

p, ul, ol, dl { margin: 0 0 1.1em; }
ul, ol { padding-left: 1.35em; }
li + li { margin-top: 0.34em; }

a {
  color: var(--ambre);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  transition: color var(--vitesse), background-color var(--vitesse), border-color var(--vitesse);
}
a:hover { color: var(--ambre-fonce); }
:focus-visible { outline: 2px solid var(--ambre); outline-offset: 2px; border-radius: 1px; }

::selection { background: var(--ambre-vif); color: #16120c; }

/* Small caps utility voice: kickers, plaques, meta lines. */
.cr-plaque, .cr-jour, .cr-grille__heure, .cr-console__kicker, .cr-console__edition,
.cr-regie__voyant, .cr-console__voyant, .cr-emission__numero, .cr-frequence__titre,
.cr-vignette__indication, .cr-fil {
  font-family: var(--police-texte);
  text-transform: uppercase;
  letter-spacing: var(--caps-interlettre);
  font-size: 0.72rem;
  font-weight: 600;
}

/* =========================================================================
   STUDIO FLOOR (content width) and skip link
   ========================================================================= */

.cr-plateau {
  max-width: var(--largeur);
  margin-inline: auto;
  padding-inline: var(--marge-page);
}
.cr-evite {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 50;
  background: var(--ambre-vif);
  color: #16120c;
  padding: 0.6rem 1rem;
  text-decoration: none;
  font-weight: 600;
}
.cr-evite:focus-visible { left: 0; color: #16120c; }

/* =========================================================================
   LA REGIE · the control-room header, always dark
   ========================================================================= */

.cr-regie {
  background: var(--nuit);
  color: var(--nuit-texte);
  border-bottom: 1px solid var(--nuit-filet);
}
.cr-regie__rang {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 3vw, 2.4rem);
  padding-block: 0.85rem;
  flex-wrap: wrap;
}
.cr-regie__mot {
  font-family: var(--police-titre);
  font-size: 1.28rem;
  color: var(--nuit-texte);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
}
.cr-regie__mot svg { color: var(--ambre-vif); }
.cr-regie__mot span {
  display: block;
  font-family: var(--police-texte);
  text-transform: uppercase;
  letter-spacing: var(--caps-interlettre);
  font-size: 0.62rem;
  color: var(--nuit-doux);
}
.cr-regie__mot:hover { color: var(--ambre-vif); }
.cr-passages { margin: 0; }
.cr-passages ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 1.1rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.cr-passages a {
  color: var(--nuit-doux);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: var(--caps-interlettre);
  font-size: 0.7rem;
  font-weight: 600;
  padding-block: 0.3rem;
  border-bottom: 1px solid transparent;
}
.cr-passages a:hover { color: var(--ambre-vif); border-bottom-color: var(--ambre-vif); }
.cr-regie__voyant {
  margin: 0 0 0 auto;
  color: var(--nuit-doux);
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.cr-voyant {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--ambre-vif);
  box-shadow: 0 0 8px 1px rgba(240, 166, 63, 0.55);
}

/* =========================================================================
   LA CONSOLE · home hero as a program grid, on the night console
   ========================================================================= */

.cr-console {
  position: relative;
  background: var(--nuit);
  color: var(--nuit-texte);
  overflow: hidden;
  border-bottom: 1px solid var(--nuit-filet);
}
.cr-console__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cr-console__voile {
  position: absolute;
  inset: 0;
  /* Veil is a hard-coded colour on purpose: never a CSS variable. */
  background: rgba(18, 13, 7, 0.9);
}
.cr-console__texte { position: relative; padding-block: clamp(2.2rem, 5vw, 4.2rem); }
.cr-console__tete {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: clamp(1.6rem, 3vw, 2.6rem);
}
.cr-console__kicker {
  margin: 0 0 0.9rem;
  color: var(--ambre-vif);
}
.cr-console__kicker svg { color: var(--ambre-vif); }
.cr-console h1 {
  color: var(--nuit-texte);
  max-width: 22ch;
}
.cr-console__deck {
  max-width: 68ch;
  color: var(--nuit-doux);
  margin: 1.1rem 0 0;
}
.cr-console__edition {
  margin: 1.4rem 0 0;
  color: var(--ambre-vif);
  border-top: 3px double var(--nuit-filet);
  padding-top: 0.7rem;
  display: inline-block;
}
.cr-console__edition em { font-style: normal; color: var(--nuit-doux); }
.cr-console__voyant {
  margin: 0;
  color: var(--nuit-texte);
  border: 1px solid var(--nuit-filet);
  padding: 0.55rem 0.95rem;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  white-space: nowrap;
}

/* The program grid: six slots, numbered like a station log. */
.cr-grille {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--nuit-filet);
}
.cr-grille__poste {
  display: grid;
  grid-template-columns: 4.6rem 1fr auto;
  align-items: baseline;
  gap: 1.2rem;
  padding-block: 0.78rem;
  border-bottom: 1px solid var(--nuit-filet);
  transition: background-color var(--vitesse);
}
.cr-grille__poste:hover { background: rgba(240, 166, 63, 0.06); }
.cr-grille__heure {
  margin: 0;
  color: var(--ambre-vif);
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.cr-grille__corps h2 {
  font-size: clamp(1.15rem, 1rem + 0.7vw, 1.55rem);
  margin: 0;
}
.cr-grille__lien {
  color: var(--nuit-texte);
  text-decoration: none;
}
.cr-grille__lien::after { content: ""; }
.cr-grille__poste:hover .cr-grille__lien { color: var(--ambre-vif); }
.cr-grille__corps p {
  margin: 0.15rem 0 0;
  color: var(--nuit-doux);
  max-width: 78ch;
}
.cr-grille__freq { margin: 0; color: var(--nuit-filet); }
.cr-grille__poste:hover .cr-grille__freq { color: var(--ambre-vif); }

/* =========================================================================
   LE CADRAN · the FM dial strip between console and page
   ========================================================================= */

.cr-cadran {
  background: var(--papier);
  border-bottom: var(--filet-fin);
  padding-block: 1.1rem;
}
.cr-cadran svg {
  display: block;
  width: min(1080px, 100% - 2 * var(--marge-page));
  margin-inline: auto;
  height: auto;
}
.cr-cadran__bande { fill: var(--ambre); opacity: 0.85; }
.cr-cadran__etiquette { fill: var(--ambre); font-size: 19px; letter-spacing: 2.4px; text-transform: uppercase; font-weight: 600; }
.cr-cadran__graduation line { stroke: var(--encre-douce); stroke-width: 1.4; }
.cr-cadran__graduation text { fill: var(--encre-douce); font-size: 19px; text-anchor: middle; font-variant-numeric: tabular-nums; }
.cr-cadran__aiguille { stroke: var(--ambre); stroke-width: 3; stroke-linecap: round; }
.cr-cadran__point { fill: var(--ambre); }

/* =========================================================================
   SECTIONS · numbered desks and banded reserves
   ========================================================================= */

.cr-emission { padding-block: clamp(2rem, 4.5vw, 4rem); }
.cr-emission--creuse { background: var(--papier-creux); border-block: var(--filet-fin); }
.cr-emission__tete {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 2rem;
  border-bottom: 1px solid var(--filet);
  padding-bottom: 0.9rem;
  margin-bottom: clamp(1.4rem, 3vw, 2.4rem);
  flex-wrap: wrap;
}
.cr-emission__titre { font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2rem); }
.cr-emission__numero {
  color: var(--ambre);
  margin-right: 0.8rem;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.cr-emission__note { margin: 0; color: var(--encre-douce); max-width: 52ch; }

/* =========================================================================
   VIGNETTES · the asymmetric mosaic of the desks
   ========================================================================= */

.cr-vignettes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: clamp(1rem, 2.4vw, 2rem) var(--gouttiere);
}
.cr-vignette { position: relative; }
.cr-vignette--plein { grid-column: span 6; }
.cr-vignette--large { grid-column: span 4; }
.cr-vignette--moitie { grid-column: span 3; }
.cr-vignette--tiers { grid-column: span 2; }
.cr-vignette--petit { grid-column: span 2; }
.cr-vignette--decale { margin-top: clamp(1rem, 2.6vw, 2.6rem); }
.cr-vignettes--denses { gap: 1.2rem var(--gouttiere); }
.cr-vignettes--denses .cr-vignette--petit { display: grid; grid-template-columns: minmax(9rem, 14rem) 1fr; gap: 1.2rem; }

.cr-vignette__cadre { overflow: hidden; border: 1px solid var(--filet); background: var(--papier-creux); }
.cr-vignette__cadre--paysage { aspect-ratio: 4 / 3; }
.cr-vignette__cadre--portrait { aspect-ratio: 3 / 4; }
.cr-vignette__cadre--carre { aspect-ratio: 1 / 1; }
.cr-vignette__cadre--pano { aspect-ratio: 21 / 9; }
.cr-vignette__cadre--haut { aspect-ratio: 3 / 4; }
.cr-vignette__vue {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--vitesse);
}
.cr-vignette:hover .cr-vignette__vue { transform: scale(1.025); }

.cr-vignette__cartel { padding-top: 0.7rem; }
.cr-vignette__cartel .cr-plaque { color: var(--ambre); margin: 0 0 0.35rem; }
.cr-vignette__titre {
  margin: 0;
  font-size: clamp(1.08rem, 0.98rem + 0.5vw, 1.34rem);
}
.cr-vignette__lien {
  color: var(--encre);
  text-decoration: none;
}
.cr-vignette__lien::after { content: ""; position: absolute; inset: 0; }
.cr-vignette:hover .cr-vignette__lien { color: var(--ambre); }
.cr-vignette__note { margin: 0.35rem 0 0; color: var(--encre-douce); font-size: 0.95rem; }
.cr-vignette__indication {
  margin: 0.6rem 0 0;
  color: var(--laiton);
  border-top: 1px solid var(--filet);
  display: inline-block;
  padding-top: 0.45rem;
}

/* =========================================================================
   LE JOURNAL · the dated program log of the home page
   ========================================================================= */

.cr-journal {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.4rem clamp(1.4rem, 3vw, 2.8rem);
}
.cr-entree {
  display: grid;
  grid-template-columns: 8.4rem 1fr;
  gap: 1.1rem;
  align-items: start;
  padding-bottom: 1.3rem;
  border-bottom: 1px solid var(--filet);
}
.cr-entree__vue {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid var(--filet);
  background: var(--papier-creux);
}
.cr-entree .cr-jour { color: var(--ambre); margin: 0 0 0.3rem; }
.cr-entree h3 { margin: 0 0 0.3rem; font-size: 1.16rem; }
.cr-entree h3 a { color: var(--encre); text-decoration: none; }
.cr-entree h3 a:hover { color: var(--ambre); }
.cr-entree > div > p:last-child { margin: 0; color: var(--encre-douce); font-size: 0.95rem; }

/* =========================================================================
   L'ONDE · sine divider between movements
   ========================================================================= */

.cr-onde {
  display: flex;
  justify-content: center;
  color: var(--laiton);
  padding-block: clamp(0.6rem, 1.5vw, 1.4rem);
}
.cr-onde svg { width: 150px; height: 16px; }

/* =========================================================================
   FIL D'ARIANE, OUVERTURE, PLANCHE, COLONNE · article architecture
   ========================================================================= */

.cr-fil {
  padding-block: 1.1rem 0;
  color: var(--encre-douce);
}
.cr-fil ol { list-style: none; display: flex; flex-wrap: wrap; gap: 0.3rem 0.7rem; margin: 0; padding: 0; }
.cr-fil li + li::before { content: "›"; margin-right: 0.7rem; color: var(--ambre); }
.cr-fil a { color: var(--encre-douce); text-decoration: none; }
.cr-fil a:hover { color: var(--ambre); }
.cr-fil [aria-current="page"] { color: var(--encre); }

.cr-scene { padding-bottom: var(--souffle); }
.cr-ouverture { padding-block: clamp(1.6rem, 3.5vw, 3rem) clamp(1.2rem, 2.5vw, 2rem); }
.cr-ouverture .cr-plaque { color: var(--ambre); margin: 0 0 1rem; position: relative; display: inline-block; }
.cr-ouverture .cr-plaque::after {
  content: "";
  display: block;
  width: 3.2rem;
  border-top: 2px solid var(--ambre);
  margin-top: 0.55rem;
}
.cr-ouverture h1 { max-width: 24ch; }
.cr-ouverture__chapo {
  max-width: 66ch;
  font-size: clamp(1.06rem, 1rem + 0.4vw, 1.24rem);
  color: var(--encre-douce);
  margin: 1.1rem 0 0;
}
.cr-indications {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.6rem;
  margin: 1.3rem 0 0;
  padding: 0.7rem 0 0;
  border-top: 1px solid var(--filet);
  color: var(--encre-douce);
}
.cr-indications li { text-transform: uppercase; letter-spacing: var(--caps-interlettre); font-size: 0.68rem; font-weight: 600; }
.cr-indications a { color: var(--encre-douce); text-decoration: none; }
.cr-indications a:hover { color: var(--ambre); }

.cr-planche { margin: 0 0 clamp(1.6rem, 3vw, 2.6rem); }
.cr-planche__vue {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border: 1px solid var(--filet);
  background: var(--papier-creux);
}

.cr-colonne { max-width: calc(var(--mesure) + 2 * var(--marge-page)); }
.cr-colonne > * { max-width: var(--mesure); margin-inline: auto; }
.cr-colonne > h2 { margin-top: 2.2em; }
.cr-colonne > h2::before {
  content: "";
  display: block;
  width: 2.4rem;
  border-top: 1px solid var(--ambre);
  margin-bottom: 0.7rem;
}

/* Lettrine: the amber drop cap that opens every article. */
.cr-colonne--lettrine > p:first-of-type::first-letter {
  font-family: var(--police-titre);
  float: left;
  font-size: 3.6em;
  line-height: 0.78;
  padding: 0.06em 0.12em 0 0;
  color: var(--ambre);
  font-weight: 560;
}

/* =========================================================================
   ENCADRE FREQUENCE · night box, VU-lamp numbers, always dark
   ========================================================================= */

.cr-frequence {
  background: var(--nuit-carte);
  color: var(--nuit-texte);
  border-left: 3px solid var(--ambre-vif);
  padding: 1.1rem 1.3rem 0.6rem;
  margin-block: 1.8rem;
}
.cr-frequence__titre {
  margin: 0 0 0.8rem;
  color: var(--ambre-vif);
}
.cr-frequence ul { list-style: none; margin: 0; padding: 0; }
.cr-frequence li {
  padding-block: 0.45rem;
  border-top: 1px solid var(--nuit-filet);
  color: var(--nuit-doux);
  font-size: 0.95rem;
}
.cr-frequence strong {
  display: block;
  color: var(--ambre-vif);
  font-family: var(--police-titre);
  font-size: 1.35rem;
  font-weight: 560;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
  letter-spacing: 0.01em;
}

/* =========================================================================
   SUITE · read next, and the home closing note
   ========================================================================= */

.cr-suite {
  margin-top: 2.4rem;
  border-top: 3px double var(--filet);
  padding-top: 1.1rem;
}
.cr-suite h2 { font-size: 1.05rem; text-transform: uppercase; letter-spacing: var(--caps-interlettre); font-family: var(--police-texte); color: var(--encre-douce); }
.cr-suite ul { margin-bottom: 0; }
.cr-note { max-width: 74ch; margin: clamp(1.4rem, 3vw, 2.4rem) auto 0; color: var(--encre-douce); }

/* =========================================================================
   LE SOCLE · footer, always dark
   ========================================================================= */

.cr-socle {
  background: var(--nuit);
  color: var(--nuit-doux);
  border-top: 1px solid var(--nuit-filet);
  margin-top: var(--souffle);
}
.cr-socle__rang {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.4rem, 3vw, 2.6rem);
  padding-block: clamp(1.8rem, 4vw, 3rem);
}
.cr-socle h2 {
  font-family: var(--police-texte);
  text-transform: uppercase;
  letter-spacing: var(--caps-interlettre);
  font-size: 0.7rem;
  color: var(--ambre-vif);
  margin-bottom: 0.8rem;
}
.cr-socle ul { list-style: none; margin: 0; padding: 0; }
.cr-socle a { color: var(--nuit-texte); text-decoration: none; font-size: 0.95rem; }
.cr-socle a:hover { color: var(--ambre-vif); text-decoration: underline; }
.cr-socle__bas {
  border-top: 1px solid var(--nuit-filet);
  padding-block: 1rem;
  color: var(--nuit-doux);
  font-size: 0.82rem;
  letter-spacing: 0.04em;
}
.cr-socle__bas svg { color: var(--ambre-vif); }

/* =========================================================================
   RESPONSIVE
   ========================================================================= */

@media (max-width: 1100px) {
  .cr-vignettes { grid-template-columns: repeat(2, 1fr); }
  .cr-vignette--plein, .cr-vignette--large { grid-column: span 2; }
  .cr-vignette--moitie, .cr-vignette--tiers, .cr-vignette--petit { grid-column: span 1; }
  .cr-vignette--decale { margin-top: 0; }
}
@media (max-width: 900px) {
  .cr-regie__rang { gap: 0.8rem 1.2rem; }
  .cr-passages { order: 3; flex-basis: 100%; }
  .cr-passages ul { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 0.3rem; }
  .cr-passages a { white-space: nowrap; }
  .cr-regie__voyant { margin-left: auto; }
  .cr-console__tete { flex-direction: column; align-items: flex-start; gap: 1.2rem; }
  .cr-socle__rang { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .cr-journal { grid-template-columns: 1fr; }
  .cr-vignettes--denses .cr-vignette--petit { grid-template-columns: 1fr; }
  .cr-grille__poste { grid-template-columns: 3rem 1fr; }
  .cr-grille__freq { display: none; }
  .cr-entree { grid-template-columns: 6.4rem 1fr; }
}
@media (max-width: 560px) {
  .cr-vignettes { grid-template-columns: 1fr; }
  .cr-vignette--plein, .cr-vignette--large,
  .cr-vignette--moitie, .cr-vignette--tiers, .cr-vignette--petit { grid-column: span 1; }
  .cr-socle__rang { grid-template-columns: 1fr; }
}

/* =========================================================================
   IMPRESSION
   ========================================================================= */

@media print {
  :root {
    --papier: #ffffff;
    --papier-creux: #ffffff;
    --papier-vif: #ffffff;
    --encre: #000000;
    --encre-douce: #444444;
    --ambre: #000000;
    --ambre-fonce: #000000;
    --filet: #999999;
  }
  body { font-size: 10.5pt; background: #ffffff; color: #000000; }
  .cr-regie, .cr-socle, .cr-passages, .cr-voyant, .cr-console__voyant,
  .cr-evite, .cr-onde, .cr-cadran, .cr-console { display: none !important; }
  a { color: #000000; text-decoration: none; }
  .cr-colonne a[href^="/"]::after { content: " [" attr(href) "]"; font-size: 0.8em; color: #444444; }
  .cr-planche__vue, .cr-vignette__vue, .cr-entree__vue { display: none; }
  .cr-scene { padding-bottom: 0; }
  .cr-socle { display: none !important; }
  .cr-frequence { background: #ffffff; color: #000000; border: 1px solid #444444; }
  .cr-frequence strong, .cr-frequence__titre { color: #000000; }
}