/* CU-TOKENS-PALIER-01 — source unique des design tokens Genealogo.
   Chargé en premier sur toutes les pages.
   CU-COLORS-FILE-01 (#467) : la PALETTE DE MARQUE vit désormais dans
   colors.css (importé ci-dessous) — violet, jaune aide, premium, pâle,
   verres/voiles, champs. Les tokens ci-dessous ne redéfinissent plus ces
   couleurs, ils les RÉFÉRENCENT (var(--colo-*)). */
@import url('colors.css');
@import url('tooltip.css'); /* #1162 — chrome unique des bulles qui nomment */
/* #1152 — démo voie rapide (cosmétique) */

/* CC-SATOSHI-GLOBAL-01 (#839) : POLICES CENTRALISÉES ici — tokens.css est chargé
   en premier sur TOUTES les pages, donc ces @font-face + tokens portent toute la
   typographie d'un seul endroit (self-hosted, CSP-safe : aucune requête externe).
   Satoshi en fonte VARIABLE (poids 300–900 + italique) : une famille, tous les
   poids. Instrument Serif reste déclarée (ne télécharge que si utilisée, swap) —
   elle sert le REVERT serif via --font-title. Licences à côté des woff2. */
@font-face {
  font-family: 'Satoshi';
  src: url('/public/assets/fonts/Satoshi-Variable.woff2?v=e739aff9') format('woff2');
  font-weight: 300 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Satoshi';
  src: url('/public/assets/fonts/Satoshi-VariableItalic.woff2?v=e7b4e0ec') format('woff2');
  font-weight: 300 900; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Instrument Serif';
  src: url('/public/assets/fonts/InstrumentSerif-Regular.woff2?v=60c06664') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}

:root {
  /* ── Marque : voir colors.css (--colo-fresh, --colo-magenta, --colo-premium,
        --colo-help, --colo-pale, --colo-brand-bg/-2, --bg) ── */
  --color-valid: #4cdc8b;
  --color-error: #b3261e;
  --color-error-alt: #c0392b;
  --color-danger: #e11d48;
  --color-success: #1a7f4c;
  --color-success-bright: #2faf6b;
  --color-success-dark: #0d5c36;
  --color-success-text: #1d7a4f;

  /* ── Texte (canonique) ── */
  /* #839 : TOUTE la typographie passe par --font / --font-title. Bascule
     Satoshi ⇄ police d'origine en (dé)commentant UNE valeur (revert = décommenter
     la ligne d'origine et commenter la ligne Satoshi). */
  --font: 'Satoshi', -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; /* #839/#906b : Satoshi. Plus de !important — theme.js ne force plus Inter inline. */
  /* --font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; */ /* #839 REVERT : valeur d'origine (UI en Inter) — décommenter, commenter la ligne Satoshi */
  --font-title: var(--font); /* #839 : titres en Satoshi (suivent --font). REVERT SERIF = décommenter la ligne ci-dessous : */
  /* --font-title: 'Instrument Serif', Georgia, serif; */ /* #839 REVERT : titres/wordmark en serif d'origine */
  /* #1333 — LA SERIF DU RÉCIT, NOMMÉE UNE FOIS. C'est la voix du produit
     quand il RACONTE : les titres de mouvement du musée, le souvenir ouvert,
     et la carte d'un souvenir sans média. Elle n'est PAS `--font-title` —
     depuis le #839 celui-ci vaut Satoshi, et s'y brancher aurait livré la
     bonne variable pour la mauvaise police (le piège est déjà consigné dans
     `.svv-sansmedia`, souvenirs-atlas.css).
     ⚠️ ELLE EXISTE PARCE QU'ELLE ÉTAIT DÉJÀ RECOPIÉE SIX FOIS en littéral
     (calendrier, invite-page, login, shell, souvenirs-atlas…). Deux copies
     d'une même décision divergent au premier ajustement : le #1333 en ajoutait
     une septième, on nomme la décision à la place. Les copies existantes
     restent — les rallier est un geste à part, qui se juge à l'écran. */
  --font-recit: 'Instrument Serif', Georgia, serif;
  /* ⚠️ LA VOIX DES CHIFFRES DU PRODUIT, ICI ET NULLE PART AILLEURS.
     Ces deux jetons vivaient sur `#chrono-rail` (timeline.css) : ils
     n'existaient donc que dans la frise. Le #1365 v3 les a montés au `:root`
     de cette feuille-là — ce qui a suffi pour l'Atlas, qui la charge, mais pas
     pour Révélations ni Anniversaires, qui ne la chargent pas : `var(...)`
     y résolvait dans le vide, et le repli aurait recopié la pile.
     `tokens.css` est la seule feuille que TOUTES les pages chargent : c'est
     le domicile d'un jeton produit. Valeurs inchangées, au caractère près. */
  --chrono-font: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --chrono-font-nombres: var(--chrono-font);
  --text-fg: #1d2330;
  --text-muted: #6b7480;
  --text-subtle: #9aa2ad;
  --text-tertiary: #5b6573;
  --text-inverse: #fff;

  /* ── Texte (valeurs distinctes préservées — décisions D1–D6) ── */
  --text-fg-drawer: #1a1a1a;
  --text-muted-admin: #8a93a3;
  --text-muted-menu: #8a93a0;
  --text-muted-drawer: #9ca3af;
  --text-caption: #3c4453;
  --text-placeholder: #a8b0bc;
  --text-hint: #c5cad3;

  /* ── Typo (échelle + demi-points préservés) ── */
  --text-xs: 10px;
  --text-xs-plus: 10.5px;
  --text-2xs: 11px;
  --text-sm-alt: 11.5px;
  --text-sm: 12px;
  --text-sm-plus: 12.5px;
  --text-base: 13px;
  --text-base-plus: 13.5px;
  --text-md: 14px;
  --ui-fs-title: var(--text-md);
  --ui-fs: var(--text-base);
  --ui-fs-sm: var(--text-sm);

  /* ── Surfaces ── */
  --surface: #fff;
  --surface-inverse: #000;
  --surface-muted: #f4f5f8;
  --surface-control: #f0f2f6;
  --surface-subtle: #f6f7fa;
  --surface-subtle-2: #f6f7fb;
  --surface-subtle-3: #f2f4f8;
  --surface-subtle-4: #f3f4f6;
  --surface-subtle-5: #eef1f6;
  --surface-subtle-6: #eef0f4;
  --surface-subtle-7: #f8f9fb;
  --surface-subtle-8: #fafafa;
  --surface-subtle-9: #fbfbfe;
  --surface-subtle-10: #f1f2f7;
  --surface-subtle-11: #f7f8fb;
  --surface-accent-soft: #edecfe;
  --surface-error: #fff3f3;
  --surface-error-soft: #fdecea;
  --surface-success-soft: #e8f8ef;
  --surface-success-mid: #b8e6cc;
  --surface-success-badge: #e5f6ee;
  --surface-error-border: #f5c6c0;
  --surface-error-tint: #e8b4b0;
  --surface-account-hover: #f4f5f9;
  /* --surface-glass, --surface-glass-menu, --surface-overlay-modal(-light) :
     déplacés dans colors.css (verres/voiles de marque) */
  --surface-overlay: rgba(20, 25, 40, 0.32);
  --surface-overlay-dark: rgba(20, 24, 40, 0.42);
  --surface-scrim: rgba(20, 30, 50, 0.45);

  /* ── Bordures (chaque hex préservé) ── */
  --border: #e7e9ef;
  --border-login: #e2e6ee;
  --border-drawer: #eceef2;
  --border-alt: #e6e9ef;
  --border-strong: #dfe2e9;
  /* --field-* et --popin-* (champs + verre/voile des popins) : déplacés dans
     colors.css (CU-COLORS-FILE-01 #467) */
  --border-hover: #d7dbe3;
  --border-hover-alt: #c9cfdb;
  --border-muted: #cfd4dd;
  --border-panel: #eceef4;
  --border-panel-alt: #e4e8f2;
  --border-error: #f3c8c8;
  --border-chip: #dfe3ec;
  --border-account-sep: #f0f1f5;
  --shell-border: color-mix(in srgb, var(--colo-fresh) 8%, transparent); /* #467 : suit --colo-fresh */
  --text-icon-muted: #b8bfc9;

  /* ── Shell layout ── */
  /* #883 : DEUX largeurs, deux rôles.
     --sidebar-rail = la largeur FERMÉE, constante — c'est l'ANCRE DU GRAPHE :
       l'encre commence là et n'en bouge plus, quel que soit l'état du panneau.
     --sidebar-w = la largeur VIVANTE du panneau (72 fermé, 220 ouvert via
       html.sidebar-expanded) — le chrome qui doit ESQUIVER le panneau ouvert
       (topnav, #atlas-ctx, carrousel, panneau SA, ancrages Aperçu) la suit ;
       le surplus d'ouverture (148px) FLOTTE au-dessus de l'Atlas. */
  --sidebar-rail: 72px; /* CC-DESIGN-3-01 (#566) : rail 60→72 (plus confortable, icônes centrées) */
  --sidebar-w: var(--sidebar-rail);
  --topnav-h: 52px;
  --shell-surface: var(--surface-glass);
  --nav-active-bg: color-mix(in srgb, var(--colo-fresh) 12%, white);
  /* #883 (3) : survol FRANCHEMENT distinct — 6% → 12%, et base TRANSPARENTE au
     lieu de white : le même token tient sur la sidebar claire ET sombre
     (vo-dark redéfinit la surface, pas ce mix). Seul le token de marque parle. */
  /* #894 : la sidebar ne parle plus par la SURFACE mais par le TRAIT — ce token
     n'y sert plus (il reste pour .topnav-link, seul consommateur restant). */
  --nav-hover-bg: color-mix(in srgb, var(--colo-fresh) 12%, transparent);
  /* #894 — les TROIS ÉTATS de la sidebar, en tokens (aucune valeur en dur) :
     l'ENCRE dit TOUT (repos → survol → sélection). v3, retour Damien :
     l'épaisseur au survol est ABANDONNÉE (« ça fait sale ») — le trait reste
     constant, --nav-stroke est le seul token d'épaisseur. */
  /* #957 v2 (Damien) : les icônes doivent être PLUS SOMBRES et PLUS MARQUÉES —
     l'encre de repos passe de 34 % à 55 % (le 34 datait du #894, quand elles
     étaient plus grandes). Un seul jeton à bouger si c'est encore trop pâle. */
  --nav-ink: rgba(0, 0, 0, 0.55);
  --nav-ink-selected: var(--colo-fresh);
  /* #957 v2 (Damien) : AU SURVOL, DU VIOLET — plus le noir 84 % du #894. Même
     violet que la sélection (--colo-fresh) : survol et sélection parlent la
     même couleur, la sélection se distingue par sa graisse (.nav-item.on,
     600). ⚠️ « sans bold » : le survol ne touche PAS la graisse — épinglé. */
  --nav-ink-hover: var(--colo-fresh);
  /* #898 — LA GÉOMÉTRIE DE LA SIDEBAR EN DEUX NOMBRES.
     Avant, le Δx = 0 tenait sur TROIS sommes accordées à la main
     (nav 8+16 = pied 6+18 = ouvert 10+14 = 24) : juste, mais fragile — toucher
     un padding sans les deux autres cassait l'immobilité des icônes.
     Désormais l'axe est un TOKEN et les paddings s'en DÉDUISENT : Δx = 0 par
     construction, plus par coïncidence entretenue.
       --nav-x   = le bord gauche des boîtes d'icône, identique dans les trois
                   états (fermé, ouvert, Aperçu) ;
       --nav-ico = la taille des icônes. Le centre tombe donc toujours à
                   --nav-x + --nav-ico/2 — c'est l'axe sur lequel le « G » de
                   la marque et la flèche Replier se calent.
     ⚠️ AMENDEMENT #898 — LA RÉDUCTION EST ABANDONNÉE (retour Damien). Les trois
     valeurs sont EXACTEMENT celles d'avant, reprises de 7e6984a (état issu des
     #880 / #882 / #889) : rien ne change à l'écran.
       --nav-x   24 → nav 8+16, pied 6+18, ouvert 10+14 (les sommes du #880) ;
       --nav-ico 24 → la taille historique des glyphes ;
       --nav-y    8 → la respiration historique.
     Ce qui reste du #898 ici, c'est la FORME : ces nombres ne sont plus
     recopiés en trois endroits, ils sont dérivés. Le point 3 de l'amendement
     (« la boîte et le padding se recalculent ensemble, ne touche pas l'un sans
     l'autre ») est ainsi tenu par construction. Repasser à des nombres en dur
     reste possible en une ligne — mais on reperdrait ça. */
  /* #957 (5) : icônes de nav à 80 % (24 → 19, arrondi au px entier — 19,2
     fabriquerait des demi-pixels flous). ⚠️ --nav-x n'est PLUS un nombre : il
     se DÉDUIT pour que l'AXE des icônes reste à rail/2 (36) — c'est lui que
     le G de la marque (#898) et la loge droite (#951) prennent pour miroir.
     Un --nav-x figé à 24 aurait déporté l'axe à 33,5 et cassé la symétrie. */
  --nav-x: calc(var(--sidebar-rail) / 2 - var(--nav-ico) / 2);
  --nav-ico: 21px; /* #957 v2 : « légèrement plus gros » — 19 → 21 (le 80 % du #957 était un cran trop bas) */
  /* #941 v4 (Damien, 18/08) : « autant de padding top que de padding bottom
     autour du logo, sur toutes les pages ». UN jeton — la marque le pose
     deux fois (haut/bas), la nav de l'app en DÉDUIT son ancrage (shell.css),
     Révélations le reçoit par la même classe .sidebar-brand. */
  --brand-pad-y: 14px;
  /* ══ #951 — LA LOGE DROITE (décision Damien) : le bord droit est une sidebar
     FANTÔME, miroir exact de la sidebar repliée. Tout s'en DÉDUIT, rien ne s'y
     recopie — bouger --sidebar-rail emmène l'avatar, le rail de looks et la
     signature ensemble, comme --nav-x emmène le G (#898).
       · --loge-w      = la largeur de la gauche REPLIÉE, à sa source ;
       · --loge-item   = le gabarit commun des habitants (4b73ddc : avatar
                         compte, signature, et le G de la marque — trois nœuds
                         déjà à 38, ici NOMMÉ une fois pour toutes) ;
       · --loge-inset  = ce qu'il faut laisser à droite pour qu'un habitant de
                         38 tombe sur l'AXE de la loge : (72 − 38) / 2 = 17 ;
       · --loge-top / --loge-bottom = les deux bords intérieurs de la loge :
                         le padding haut de #topnav et le bas de la rangée
                         signature — c'est entre eux que le rail se centre. */
  --loge-w: var(--sidebar-rail);
  --loge-item: 38px;
  --loge-inset: calc((var(--loge-w) - var(--loge-item)) / 2);
  --loge-top: 18px;
  --loge-bottom: 20px;
  /* #957 (rail, décision Damien) : le rail de looks n'occupe PAS toute la
     loge — 62 % de sa hauteur, centré, donc 19 % d'air en haut et 19 % en bas.
     Une PROPORTION (nombre sans unité), pas des pixels : elle tient à toutes
     les tailles de fenêtre. La bande du bas n'est plus « réservée » à la
     signature partie (#957 7a) — c'est de l'air, simplement.
     --rail-air se DÉDUIT : (1 − 0,62) / 2 = 0,19. Bouger --rail-h suffit. */
  --rail-h: 0.62;
  /* ══ #962 ② — L'ÉCHELLE D'ESPACEMENT DE RÉVÉLATIONS, trois valeurs, pas une
     de plus. Constat à l'œil sur capture pleine page : la page respirait par
     une douzaine de nombres différents (14, 12, 10, 8, 6, 4, 2…), donc par
     hasard. Trois étages nommés — entre SECTIONS, entre CARTES, DANS la
     carte — et tout s'y range. Un quatrième nombre qui reviendrait dans
     stats-page.css se verrait comme le nez au milieu de la figure. */
  --rev-espace-section: 40px;
  --rev-espace-carte: 16px;
  --rev-espace-interne: 12px;
  --nav-y: 8px;
  --nav-stroke: 2.25;                 /* #957 v2 : trait ÉPAISSI (2 → 2.25) — « plus marquées » ; défaut Lucide = 2 */

  /* ── Menu layout ── */
  --menu-pad: 14px;
  --menu-gap: 10px;
  --menu-bg: var(--surface-glass-menu);
  --menu-title-size: 12px;
  --menu-label-size: 12px;
  --menu-val-size: 11px;
  --tooltip-bg: var(--menu-bg);
  --tooltip-fg: var(--text-fg);

  /* ── Print modal layout ── */
  --pm-modal-h: min(84vh, 720px); /* CC-BTN-CHARTE-PRINT-01 : popin Print moins haute (constat Damien — 860px mangeait l'écran) */
  --pm-modal-w: min(1120px, calc(100vw - 32px));

  /* ── Alias modules (rétro-compat, zéro changement visuel) ── */
  --shell-fg: var(--text-fg);
  --shell-muted: var(--text-muted);
  --login-fg: var(--text-fg);
  --login-muted: var(--text-muted);
  --login-border: var(--border-login);
  --adm-font: var(--font);
  --adm-fresh: var(--colo-fresh);
  --adm-ink: var(--text-fg);
  --adm-mut: var(--text-muted);
  --adm-line: var(--border);
  /* #1142 : une seule largeur max BO. 920 déjà rendu (theme gagnait sur shell 900). */
  --adm-page-max-width: 920px;
  --menu-fg: var(--text-fg);
  --menu-border: var(--border);
  --menu-muted: var(--text-muted-menu);
  --menu-accent: var(--colo-fresh);
  --pd-font: var(--font);
  --pd-fg: var(--text-fg-drawer);
  --pd-muted: var(--text-muted-drawer);
  --pd-border: var(--border-drawer);
  --pd-accent: var(--colo-fresh);
  --pm-fresh: var(--colo-fresh);
  --pm-magenta: var(--colo-magenta);
  --pm-valid: var(--color-valid);
  --pm-fg: var(--text-fg);
  --pm-muted: var(--text-muted);
  --pm-border: var(--border-login);
  --pm-font: var(--font);

  /* ── Rayons (valeur exacte préservée) ── */
  --radius-none: 0;
  --radius-4: 4px;
  --radius-6: 6px;
  --radius-8: 8px;
  --radius-9: 9px;
  --radius-10: 10px;
  --radius-12: 12px;
  --radius-14: 14px;
  --radius-16: 16px;
  --radius-18: 18px;
  --radius-20: 20px;
  --radius-22: 22px;
  --radius-26: 26px;
  --radius-full: 999px;
  --radius-circle: 50%;
  --radius-split-left: 20px 0 0 20px;
  --radius-split-right: 0 20px 20px 0;
  --menu-radius-sm: var(--radius-8);
  --menu-radius: var(--radius-14);

  /* ── Typo complémentaire (valeurs exactes) ── */
  --text-3xs: 9px;
  --text-15: 15px;
  --text-16: 16px;
  --text-17: 17px;
  --text-18: 18px;
  --text-19: 19px;
  --text-20: 20px;
  --text-22: 22px;
  --text-24: 24px;
  --text-26: 26px;
  --text-32: 32px;
  --text-36: 36px;
  --text-rem-5625: 0.5625rem;
  --text-rem-625: 0.625rem;
  --text-rem-68: 0.68rem;
  --text-rem-72: 0.72rem;
  --text-rem-75: 0.75rem;
  --text-rem-78: 0.78rem;
  --text-rem-8125: 0.8125rem;
  --text-rem-85: 0.85rem;
  --text-rem-86: 0.86rem;
  --text-rem-875: 0.875rem;
  --text-rem-88: 0.88rem;
  --text-rem-8: 0.8rem;
  --text-rem-9: 0.9rem;
  --text-rem-92: 0.92rem;
  --text-rem-95: 0.95rem;
  --text-rem-1: 1rem;
  --text-rem-135: 1.35rem;
  --text-rem-1375: 1.375rem;
  --text-rem-13: 1.3rem;
  --text-rem-15: 1.5rem;
  --text-rem-165: 1.65rem;
  --text-rem-2: 2rem;
  --text-rem-225: 2.25rem;
  --text-rem-3: 3rem;
  --text-rem-38: 3.8rem;
  --text-display-sm: clamp(2rem, 3.5vw, 2.75rem);
  --text-display-lg: clamp(2.2rem, 4vw, 3rem);

  /* ── Ombres (valeur exacte préservée — D10 violette incluse) ── */
  --shadow-sidebar: 2px 0 24px color-mix(in srgb, var(--colo-fresh) 4%, transparent); /* #467 */
  --shadow-sidebar-drawer: 12px 0 40px rgba(20, 30, 50, .25);
  --shadow-chip: 0 2px 8px rgba(20,30,50,.06);
  --shadow-chip-md: 0 2px 10px rgba(20, 30, 50, .05);
  --shadow-chip-lg: 0 2px 10px rgba(20, 30, 50, .10);
  --shadow-tooltip: 0 6px 20px rgba(20, 30, 50, .18);
  --shadow-btn-hover: 0 6px 20px rgba(20,30,50,.18);
  --shadow-edit-toggle: 0 1px 2px color-mix(in srgb, var(--colo-fresh, #7141D9) 25%, transparent);
  --shadow-cta: 0 4px 16px color-mix(in srgb, var(--colo-fresh, #7141D9) 30%, transparent);
  --shadow-cta-glow: 0 4px 20px color-mix(in srgb, var(--colo-fresh) 35%, transparent);
  --shadow-cta-hover: 0 8px 24px color-mix(in srgb, var(--colo-fresh, #7141D9) 38%, transparent);
  /* CC-SHEEN-RELOCATE-01 (#584) : lumière des CTA — halo radial plus CLAIR qui
     part du coin HAUT-DROIT et se dégrade en diagonale jusqu'au BAS-GAUCHE
     (#579). Blanc pur, AUCUNE valeur de marque → il vit ici (voie neutre) et
     non dans colors.css (voie exclusive de Cursor pour les couleurs).
     Usage : `background: var(--cta-sheen), var(--colo-fresh);` */
  --cta-sheen: radial-gradient(circle farthest-corner at 100% 0%,
    rgba(255, 255, 255, .32) 0%,
    rgba(255, 255, 255, .12) 55%,
    rgba(255, 255, 255, 0) 100%);
  --shadow-card: 0 4px 16px rgba(20, 30, 50, 0.12);
  --shadow-card-tint: 0 4px 16px color-mix(in srgb, var(--pm-fresh) 30%, transparent);
  --shadow-subtle: 0 2px 14px rgba(0, 0, 0, 0.04);
  --shadow-subtle-md: 0 2px 14px rgba(0, 0, 0, 0.05);
  --shadow-subtle-lg: 0 4px 14px rgba(0, 0, 0, 0.08);
  --shadow-dot: 0 1px 4px rgba(0, 0, 0, 0.15);
  --shadow-overlay-soft: 0 6px 18px rgba(0, 0, 0, 0.12);
  --shadow-overlay: 0 8px 28px rgba(0, 0, 0, 0.1);
  --shadow-fresh-soft: 0 8px 28px color-mix(in srgb, var(--colo-fresh) 14%, transparent); /* #467 */
  --shadow-popin: 0 20px 60px rgba(20, 30, 50, 0.22);
  --shadow-onboarding: 0 18px 60px rgba(20, 30, 50, .14);
  --shadow-modal: 0 24px 70px rgba(20, 30, 50, .3);
  --shadow-modal-violet: 0 24px 80px rgba(26, 15, 46, 0.35);
  --shadow-drawer: -16px 0 48px rgba(26, 15, 46, 0.14);
  --shadow-pricing: 0 12px 34px rgba(20, 30, 50, .14);
  --shadow-help: 0 6px 20px color-mix(in srgb, var(--colo-help, #C9F235) 35%, transparent);
  --shadow-inset-valid: inset 0 0 0 1px color-mix(in srgb, var(--pm-valid) 30%, transparent);
  --shadow-focus-fresh: 0 0 0 3px color-mix(in srgb, var(--colo-fresh) 18%, transparent);
  --shadow-focus-fresh-fb: 0 0 0 3px color-mix(in srgb, var(--colo-fresh, #7141D9) 18%, transparent);
  --shadow-focus-fresh-35: 0 0 0 3px color-mix(in srgb, var(--colo-fresh, #7141D9) 35%, transparent);
  --shadow-focus-valid-20: 0 0 0 3px color-mix(in srgb, var(--pm-valid) 20%, transparent);
  --shadow-focus-valid-35: 0 0 0 3px color-mix(in srgb, var(--pm-valid) 35%, transparent);
  --shadow-focus-valid-40: 0 0 0 4px color-mix(in srgb, var(--pm-valid) 40%, transparent);
  --shadow-focus-valid-1: 0 0 0 1px color-mix(in srgb, var(--pm-valid) 35%, transparent);
  --shadow-focus-accent: 0 0 0 4px color-mix(in srgb, var(--pd-accent) 20%, transparent);
  --shadow-focus-danger: 0 0 0 3px color-mix(in srgb, var(--color-danger) 15%, transparent);
  --shadow-carousel-ring: 0 0 14px color-mix(in srgb, currentColor 75%, transparent);
  --menu-shadow: 0 10px 34px rgba(20, 30, 50, 0.14);

  /* ══════════ #1263 — LE HALO DE MARQUE, UNE SEULE FOIS ══════════
     Le dégradé lavande du coin haut-gauche vivait dans `.rev2-body`
     (revelations2.css). Damien le veut aussi derrière TOUTES les vues : le
     recopier dans shell.css aurait donné deux halos qui divergent au premier
     réglage — position, rayon, opacité, à deux endroits.
     ⚠️ SA TEINTE RESTE UNE VARIABLE (`--r2-halo`, posée au #1261) : l'Accueil
     y met la couleur de votre connexion, tout le reste prend le violet de
     marque. On change la SOURCE, jamais les usages. */
  --halo-marque: radial-gradient(1100px 620px at 0% 0%, color-mix(in srgb, var(--r2-halo, var(--colo-fresh, #7141D9)) 20%, transparent), transparent 66%);

  /* #1153 lot 1 — rapatriés tels quels (valeurs inchangées) */
  --adm-bg: color-mix(in srgb, var(--colo-fresh) 5%, var(--surface-muted));
  --adm-surface-elevated: var(--surface);
  --adm-radius-panel: var(--radius-16, 16px);
  --fresh: var(--adm-fresh);
  --ink: var(--adm-ink);
  --mut: var(--adm-mut);
  --line: var(--adm-line);
  --notif-red: var(--color-danger, #e11d48);
  --verify-success: var(--color-success, #1a7f4c);
  --verify-success-soft: var(--surface-success-soft, #e8f8ef);
  --verify-success-mid: var(--surface-success-mid, #b8e6cc);
  --help-bg: var(--colo-help, #C9F235);
  --login-baseline: 31px;
  --legal-toast-w: min(360px, calc(100vw - 32px));
  --pd-accent-soft: color-mix(in srgb, var(--pd-accent) 14%, var(--surface));
  --pd-glow: color-mix(in srgb, var(--pd-accent) 16%, transparent);
  /* #1180 — chiffres de dates : Satoshi expose tnum. Alignement, pas une fonte. */
  --nums-date: tabular-nums;
}

/* #1180 — utilitaire global + recensement des affichages date/année.
   18 emplacements, 18 couverts. font-variant-numeric (ne casse pas liga). */
.date-nums,
#chrono-timeline .chrono-tick span,
#chrono-title .chrono-years,
.sidebar-atlas-years,
.tt-years,
.node .yr,
.pd-name-dates,
.cx-ident-annees,
.cx-vie-qui-dates,
.cal-event-quand,
.rev2-carte-nom i,
.rev2-gens-lot-nom i,
.rev2-connexion-texte i,
.rev2-depart-liste b,
.pfield input[type="date"],
input[type="date"],
.lg-meta,
.pp-updated,
.adm-table .num,
.sv-detail-meta,
#sv-caption,
.sa-deploy-status,
.ja-updated {
  font-variant-numeric: var(--nums-date);
}

/* #1154 : chrome champ app (bg + filet + ombre recess) — une source.
   Padding, rayon et focus restent locaux.
   Frontières : login vitrine, BO .adm-field. */
.pfield input,
.pfield select,
.pfield textarea,
.print-modal-field input,
.print-modal-promo-input,
.ob-form input,
.atlas-invite-email,
.ve-otp-field {
  background: var(--field-bg);
  border: 1px solid var(--field-border);
  box-shadow: var(--field-shadow);
}

/* #1356 — le surnom se rend en italique, nu (plus de « »). Satoshi Variable
   Italic est déjà chargé plus haut. */
.surnom { font-style: italic; font-weight: inherit; }