/* Archetype: salle de cinéma sombre (streaming) | Adjectives: calme, net, chaleureux | Theme: dark
   Source : jetons sombres du dashboard du Campus (ui.css, html.dark + mob-cinema du 2026-10-10), recopiés tels quels.
   Contrastes mesurés sur --bg #111114 : encre 17,3:1, texte 14,9:1, gris 7,8:1, accent 10,8:1 ; texte sur l'accent 10,8:1.
   Interdit ici : dégradés de plusieurs teintes, lueurs, boutons sans état, couleurs hors de ce bloc. */
:root {
  color-scheme: dark;
  /* couleur */
  --bg: #111114;
  --surface: #1C1C21;
  --surface-2: #26262D;
  --surface-3: #303038;
  --border: rgb(255 255 255 / .1);
  --border-strong: rgb(255 255 255 / .2);
  --ink: #F5F5F7;
  --text: #E4E4E9;
  --muted: #A6A6AE;
  --faint: #7E7E86;
  --accent: #AFC6E0;
  --accent-hover: #C8D8EA;
  --accent-tint: rgb(175 198 224 / .16);
  --on-accent: #111114;
  --focus: #AFC6E0;
  --success: #56C98E;
  --danger: #F2A3A3;
  --danger-tint: rgb(242 163 163 / .12);
  --highlight: rgb(255 255 255 / .22);
  --media-bg: #0B0B0D;
  --glass: rgb(30 30 36 / .92);
  --scrim-side: linear-gradient(90deg, rgb(17 17 20 / .96) 0%, rgb(17 17 20 / .82) 34%, rgb(17 17 20 / 0) 70%);
  --scrim-bottom: linear-gradient(180deg, rgb(17 17 20 / 0) 55%, rgb(17 17 20 / .7) 82%, #111114 100%);
  --scrim-top: linear-gradient(180deg, rgb(11 11 13 / .72) 0%, rgb(11 11 13 / 0) 100%);
  --scrim-card: rgb(11 11 13 / .55);
  --fade-left: linear-gradient(90deg, rgb(0 0 0 / 0) 0%, rgb(0 0 0 / 1) 36%);
  --fade-bottom: linear-gradient(180deg, rgb(0 0 0 / 1) 64%, rgb(0 0 0 / 0) 100%);
  --track: rgb(255 255 255 / .22);
  /* logo « G » du bouton Google (couleurs imposées par Google) */
  --google-blue: #4285F4; --google-green: #34A853; --google-yellow: #FBBC05; --google-red: #EA4335;
  /* type : la police système du dashboard (--quiet-font) */
  --font-text: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --text-xs: 12px; --text-s: 13px; --text-m: 15px; --text-l: 17px;
  --title-s: 20px; --title-m: 28px; --title-l: 48px;
  --lh-tight: 1.15; --lh-text: 1.45;
  /* rayons (ui.css) */
  --radius-s: 12px; --radius-m: 16px; --radius-l: 22px; --radius-full: 999px;
  /* élévation (ui.css, sombre) */
  --elev-1: 0 1px 2px rgb(0 0 0 / .3);
  --elev-2: 0 1px 2px rgb(0 0 0 / .3), 0 14px 30px -18px rgb(0 0 0 / .6);
  --elev-float: 0 1px 2px rgb(0 0 0 / .3), 0 12px 30px -12px rgb(0 0 0 / .6);
  /* mouvement (ui.css) */
  --dur-press: 90ms; --dur-micro: 160ms; --dur-sheet: 220ms; --dur-scene: 350ms;
  --ease: cubic-bezier(.22, .8, .3, 1);
  /* espacement : grille de 4 px */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px;
  --gutter: 40px;
  --control: 44px;
  --bar: 64px;
}
@media (max-width: 560px) {
  :root { --gutter: 20px; --bar: 56px; --title-l: 32px; --title-m: 24px; }
}