/* =====================================================================================================================
   Jetons du socle (kit) : relevé 01 § 6, mêmes noms, valeurs du code Swift (Theme.swift, Grille.swift).
   Sombre forcé (BilanApp/MoniteurApp : .preferredColorScheme(.dark)). 1 point iOS = 1 px CSS.
   Espaces : <div class="ak-app" data-espace="pnl|moniteur"> fixe teinte, sur-teinte, voiles du verre et couleurs du fond.
   ===================================================================================================================== */

/* ---------- Polices : TTF du projet (apps-ios/Polices/) convertis en WOFF2 complets (pas de sous-ensemble) ---------- */
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/kit/polices/IBMPlexSans-Regular.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("/kit/polices/IBMPlexSans-Medium.woff2") format("woff2"); }
/* 600 à 900 : l'app ramène semibold, bold, heavy et black sur SemiBold (Theme.swift:107-112). */
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 600 900; font-display: swap;
  src: url("/kit/polices/IBMPlexSans-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 100 400; font-display: swap;
  src: url("/kit/polices/IBMPlexMono-Regular.woff2") format("woff2"); }
/* Mono : tout poids au-dessus de regular → Medium (Theme.swift:107-112). */
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500 900; font-display: swap;
  src: url("/kit/polices/IBMPlexMono-Medium.woff2") format("woff2"); }

:root {
  color-scheme: dark;

  /* ---- neutres « nuit chaude » (Theme.swift:43-52, valeurs sombres) ---- */
  --couleur-fond: #0C0B0A;                    /* ground */
  --couleur-surface: #171512;                 /* surface : fiches opaques */
  --couleur-surface-2: #211E1A;               /* surface2 : avatars, puces au repos, champs */
  --couleur-surface-3: #2C2822;               /* surface3 : pressé, pastille de décision, rail de jauge */
  --couleur-texte: #F3EFE8;                   /* label */
  --couleur-texte-2: #B5AEA3;                 /* label2 */
  --couleur-texte-3: #8A837A;                 /* label3 */
  --couleur-filet: rgba(243, 239, 232, 0.08); /* separator : filets explicites de 0,5 pt */
  --couleur-filet-moitie: rgba(243, 239, 232, 0.04);   /* separator.opacity(0.5) */
  --couleur-filet-grille: rgba(243, 239, 232, 0.032);  /* grille de graphique : separator × 0,4 */
  --couleur-filet-systeme: rgba(84, 84, 88, 0.65);     /* Divider() SwiftUI (valeur iOS indicative) */
  --couleur-lisere-verre: rgba(255, 255, 255, 0.10);   /* liseré 0,5 pt des matériaux et des panneaux en feuille */
  --couleur-pressee: rgba(44, 40, 34, 0.60);           /* RangeeStyle : surface3 à 60 % */

  /* ---- statuts (Theme.swift:54-63, sombre) ---- */
  --couleur-gain: #4CC38A;      --couleur-gain-doux: #16302A;
  --couleur-perte: #E5484D;     --couleur-perte-doux: #3A2226;
  --couleur-alerte: #F0923B;    --couleur-alerte-doux: #3A2A1A;   /* caution */
  --couleur-paypal: #5BA8E0;
  --couleur-klarna: #E89AB4;

  /* ---- voiles de la couleur de texte (opacités réellement utilisées) ---- */
  --voile-texte-04: rgba(243, 239, 232, 0.04);
  --voile-texte-06: rgba(243, 239, 232, 0.06);
  --voile-texte-08: rgba(243, 239, 232, 0.08);
  --voile-texte-10: rgba(243, 239, 232, 0.10);
  --voile-texte-12: rgba(243, 239, 232, 0.12);
  --voile-texte-14: rgba(243, 239, 232, 0.14);
  --voile-texte-18: rgba(243, 239, 232, 0.18);
  --voile-texte-22: rgba(243, 239, 232, 0.22);
  --voile-texte-55: rgba(243, 239, 232, 0.55);

  /* ---- espace par défaut : Bilan (pnl) ---- */
  --couleur-teinte: #F4EFE6;                  /* Espace.pnl.teinte */
  --couleur-sur-teinte: #1A1612;              /* Espace.pnl.surTeinte */
  --voile-verre: transparent;                 /* glassEffect(.regular) sans tint */
  --voile-givre: transparent;
  --lisere-verre-espace: rgba(255, 255, 255, 0.13);
  --couleur-fond-app: #0C0B0A;                /* base du fond vivant */

  /* ---- fonds vivants (Grille.swift:294, 310-312) ---- */
  --fond-bilan-lueur: #8A4A14;  --fond-bilan-ombre: #2E1C10;
  --fond-moniteur-noir: #07090C; --fond-moniteur-lueur: #0F4A52; --fond-moniteur-lueur-2: #12325A;

  /* ---- rayons (Theme.swift:65-68 + littéraux) ---- */
  --rayon-xxs: 2px;    /* échantillons de légende */
  --rayon-xs: 3px;     /* segments de BarrePostes, barres horaires */
  --rayon-sm: 6px;     /* radiusSm */
  --rayon-s: 8px;      /* vignettes 36/56, cases de matrice, puces d'itération */
  --rayon-md: 10px;    /* radiusMd */
  --rayon-galerie: 14px;
  --rayon-lg: 16px;    /* radiusLg : Carte, Groupe, panneaux, tuile de créa */
  --rayon-xl: 20px;    /* radiusXl : CarteVerre, fiches du bilan du soir */
  --rayon-bulle: 30px; /* bulle du vocal */
  --rayon-capsule: 9999px;

  /* ---- polices ---- */
  --police-sans: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --police-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --police-systeme: -apple-system, system-ui, "SF Pro Text", "Helvetica Neue", sans-serif; /* composants système (SF Pro) */
  --interligne: 1.3;                           /* métriques Plex : (1025 + 275) / 1000 */
  --interligne-texte-long: calc(1.3em + 3px);  /* lineSpacing(3) : bilan du soir, méthodologie */
  --graisse-normale: 400;  --graisse-moyenne: 500;  --graisse-forte: 600;

  /* tailles = Dynamic Type « Large » écrites dans Fonte.taille (Theme.swift:91-106) */
  --taille-grand-titre: 34px;   /* largeTitle */
  --taille-titre: 28px;         /* title */
  --taille-titre-2: 22px;       /* title2 */
  --taille-titre-3: 20px;       /* title3 */
  --taille-intertitre: 17px;    /* headline (graisse 500 par défaut) */
  --taille-corps: 17px;         /* body */
  --taille-legende-haute: 16px; /* callout */
  --taille-sous-titre: 15px;    /* subheadline */
  --taille-note: 13px;          /* footnote */
  --taille-legende: 12px;       /* caption */
  --taille-legende-2: 11px;     /* caption2 */
  --taille-heros: 44px;         /* chiffre héros de GrilleChiffres, medium */

  /* ---- espacements et hauteurs ---- */
  --espace-page: 16px;     --espace-bloc: 24px;   --espace-carte: 16px;   --espace-bas-page: 40px;
  --haut-ligne: 52px;      --haut-rangee-bouton: 56px;  --haut-rangee-marque: 60px;  --haut-rangee-produit: 64px;  --haut-rangee-crea: 72px;
  --haut-commande: 44px;   --haut-oeil: 36px;      --haut-segment: 40px;
  --haut-barre: 56px;      --ecart-barre: 12px;    --marge-bas-barre: 8px;
  --haut-puce-filtre: 36px; --haut-puce-type: 32px;
  --haut-globe: 340px;
  --trait-fin: 0.5px;
  --largeur-colonne: 560px;   /* ARCHITECTURE § 6 : colonne centrée de 600 à 1099 px */

  /* ---- zones sûres ---- */
  --sur-haut: env(safe-area-inset-top, 0px);
  --sur-bas: env(safe-area-inset-bottom, 0px);
  --sur-gauche: env(safe-area-inset-left, 0px);
  --sur-droite: env(safe-area-inset-right, 0px);

  /* ---- mouvement ---- */
  --duree-doux: 454ms;         /* spring(response 0,38, amortissement 1) : Mouvement.doux */
  --duree-apparition: 537ms;   /* spring(0,45) : apparitionDouce, + rang × 50 ms */
  --duree-calendrier: 334ms;   /* spring(0,28) */
  --duree-liste: 477ms;        /* spring(0,40) : ventes par produit */
  --duree-tube: 716ms;         /* spring(0,60) : TubeVerre */
  --ressort-repli: cubic-bezier(0.22, 0.9, 0.3, 1);   /* repli pour les moteurs sans linear() */
  --ressort: linear(0, 0.0321, 0.1075, 0.2032, 0.305, 0.4043, 0.4963, 0.5787, 0.6508, 0.7127, 0.7651, 0.809, 0.8454, 0.8754, 0.8999, 0.9199, 0.9361, 0.9491, 0.9596, 0.968, 0.9747, 0.98, 0.9842, 0.9876, 0.9902, 0.9923, 0.994, 1);
  --duree-appui: 120ms;
  --duree-anneau: 600ms;       /* AnneauProgression easeOut */
  --duree-anneau-pourcent: 400ms;
  --duree-roue: 1100ms;        /* AnneauPourcent indéterminé : linéaire, infini */
  --duree-connexion: 180ms;    /* bouton Se connecter, easeOut */
}

@supports not (transition-timing-function: linear(0, 1)) {
  :root { --ressort: var(--ressort-repli); }
}

/* ---------- espaces ---------- */
[data-espace="pnl"] {
  --couleur-teinte: #F4EFE6;
  --couleur-sur-teinte: #1A1612;
  --voile-verre: transparent;
  --voile-givre: transparent;
  --lisere-verre-espace: rgba(255, 255, 255, 0.13);
  --couleur-fond-app: #0C0B0A;                 /* ground : base du maillage « nuit chaude » */
}
[data-espace="moniteur"] {
  --couleur-teinte: #3A8F88;
  --couleur-sur-teinte: #FFFFFF;
  --voile-verre: rgba(15, 74, 82, 0.18);       /* .regular.tint(#0F4A52 à 18 %) : CarteVerre, Carte */
  --voile-givre: rgba(15, 74, 82, 0.10);       /* voile des Groupe */
  --lisere-verre-espace: rgba(60, 150, 215, 0.30);    /* bord bleuté mesuré sur les captures du Moniteur (≈ #1C455B sur fond noir) */
  --couleur-fond-app: #07090C;                 /* « studio froid » */
}

/* ---------- mode clair (jamais affiché dans l'app ; valeurs du code pour mémoire) ---------- */
[data-mode="clair"] {
  color-scheme: light;
  --couleur-fond: #F7F4EE;  --couleur-surface: #FFFFFF;  --couleur-surface-2: #EFE9DF;  --couleur-surface-3: #E4DDD1;
  --couleur-texte: #1F1B16; --couleur-texte-2: #5E554A;  --couleur-texte-3: #7B7266;
  --couleur-filet: rgba(31, 27, 22, 0.08);
  --couleur-gain: #16A34A; --couleur-gain-doux: #E3F4EA; --couleur-perte: #DC2626; --couleur-perte-doux: #FBE9E7;
  --couleur-alerte: #C2410C; --couleur-alerte-doux: #FBEFDD; --couleur-paypal: #0F6CB0; --couleur-klarna: #C2567C;
}
[data-mode="clair"][data-espace="pnl"]      { --couleur-teinte: #1F1B16; --couleur-sur-teinte: #FFFFFF; }
[data-mode="clair"][data-espace="moniteur"] { --couleur-teinte: #0F6E68; --couleur-sur-teinte: #FFFFFF; }