/* ============================================================================
 * MODULE 13 — BASE
 * ----------------------------------------------------------------------------
 * Fond sombre légèrement chaud, texte blanc cassé, aucune ombre portée,
 * aucun dégradé. Les seules couleurs de l'interface sont celles des thèmes.
 * Typographie : la serif système d'iOS (New York) pour les titres, la
 * sans-serif système (SF Pro) pour le corps. Zéro police à télécharger :
 * l'application s'affiche instantanément et fonctionne hors connexion.
 * ==========================================================================*/

:root {
  /* Fonds — chauds, jamais gris bleutés */
  --fond:          #0F0E0C;
  --surface:       #1A1815;
  --surface-haut:  #24211D;
  --bordure:       #2E2A25;

  /* Texte */
  --texte:         #F2EFE9;   /* blanc cassé, jamais #FFF */
  --texte-moyen:   #A39C90;
  --texte-faible:  #6E675C;

  /* Signaux */
  --retard:        #C4554D;   /* rouge discret, pas d'alarme */
  --succes:        #6E9E63;

  /* Rythme */
  --marge:         20px;
  --rayon:         22px;
  --rayon-petit:   14px;
  --cible:         44px;      /* cible tactile minimale */

  /* Animations — 150 à 250 ms, rien de plus */
  --transition:    180ms cubic-bezier(0.32, 0.72, 0, 1);

  /* Zones de sécurité iPhone */
  --haut:          env(safe-area-inset-top, 0px);
  --bas:           env(safe-area-inset-bottom, 0px);

  --serif:  ui-serif, "New York", Georgia, "Times New Roman", serif;
  --sans:   -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;

  color-scheme: dark;
}

/* --- Remise à zéro ------------------------------------------------------- */

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

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: var(--fond);
}

body {
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.45;
  color: var(--texte);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;

  /* Portrait uniquement, pas de zoom, pas de rebond horizontal */
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior-y: contain;
}

button, input, select, textarea {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
}

button { cursor: pointer; }

/* Rien n'est sélectionnable au doigt, sauf les champs de saisie :
   un appui long doit ouvrir NOTRE menu, pas celui d'iOS. */
* { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
input, textarea { -webkit-user-select: text; user-select: text; }

ul, ol { list-style: none; margin: 0; padding: 0; }

/* --- Structure des vues -------------------------------------------------- */

.vue {
  display: block;
  min-height: 100%;
  padding: calc(var(--haut) + 8px) var(--marge) calc(var(--bas) + 40px);
  max-width: 560px;
  margin: 0 auto;
}

/* --- Typographie --------------------------------------------------------- */

.titre-serif {
  font-family: var(--serif);
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.15;
  margin: 0;
}

.date-du-jour {
  font-family: var(--serif);
  font-size: 30px;
  font-weight: 500;
  letter-spacing: -0.015em;
  margin: 0;
}

.sous-texte {
  color: var(--texte-moyen);
  font-size: 15px;
}

.faible { color: var(--texte-faible); }

/* --- Accessibilité ------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}