/* ── HUKAIA · les retouches d'octobre ────────────────────────────────────
   Charlotte, le 10 octobre, après la refonte du site (charte d'octobre,
   tout en terre cuite) : « avec ce nouveau skill je veux faire des
   améliorations aussi sur l'app ». Cinq choix, et seulement ceux-là :

   1. Le CHROME fixe prend la terre cuite du site : la barre d'onglets
      (onglet actif, rond central) et les boutons « Continuer » du
      questionnaire. Le CONTENU garde la couleur de la saison — décision
      du 3 octobre, redemandée et confirmée le 10 : « garder la saison ».
   2. Le questionnaire sans barre d'onglets, dès qu'on a choisi comment
      composer (html.deck-concentre, posé par positionDeck dans deck.js).
      La première carte la garde : c'est par elle qu'on s'en va.
   3. Les questions perdent leur mot en couleur : un mot accentué par
      titre est la signature visuelle « faite par une IA » que le site a
      quittée (DOSSIER-IDENTITE, site/).
   4. (screens-main.js, presence.js, place-stories.js : textes.)
   5. Des gestes plus nets : un appui se sent sur les cartes et les
      choix, le programme du jour arrive ligne après ligne. Tout s'éteint
      sous « Réduire les animations » (core.css garde son interrupteur).

   Chargée en DERNIER (index.html) : elle n'a pas à gagner par la force.
   ─────────────────────────────────────────────────────────────────────── */

/* ── 1. Le chrome en terre cuite ────────────────────────────────────── */
:root{
  --chrome:#DE643F;          /* la terre cuite du site (site/site.css) */
  --chrome-clair:#F0A383;    /* sur le verre de la barre : 5,0:1 au pire (verre sur blanc) */
  --chrome-encre:#221D16;    /* le texte posé sur la terre cuite : 4,8:1 */
  /* L'onglet actif lisait --d-actif (direction.css), la saison éclaircie.
     Les bancs vérifient que l'actif porte --d-actif : on change sa valeur,
     pas la règle. */
  --d-actif:var(--chrome-clair);
}
.tab-it[data-tabbtn="create"] .tab-ico{
  background:var(--chrome); color:#FFFFFF;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 8px 18px -8px rgba(222,100,63,.7);
}
.tab-it[data-tabbtn="create"].on .tab-ico{ color:#FFFFFF; box-shadow:0 0 0 2px rgba(20,17,14,.7), 0 0 0 4px var(--chrome) }

/* Le bouton du questionnaire : la terre cuite, l'encre sombre dessus
   (comme les boutons du site), jamais le blanc, qui y tombe à 3,5:1. */
#deck .dcard .d-foot .btn{ background:var(--chrome); color:var(--chrome-encre); box-shadow:0 10px 24px -12px rgba(222,100,63,.75) }

/* ── 2. Le questionnaire, sans barre d'onglets ──────────────────────── */
html.deck-concentre .tabbar{ opacity:0; transform:translateY(24px); pointer-events:none; transition:opacity .25s ease, transform .3s ease }
html.deck-concentre .tabbar::before{ opacity:0 }
/* La réserve de 250 px comptait 103 px pour la pilule (screens.css) :
   sans elle, la carte récupère ce bas d'écran. */
html.deck-concentre #deck{ height:calc(var(--app-vh, 1vh) * 100 - 160px) }
/* Le bouton suit la réponse au lieu d'attendre au pied de la carte : sur
   une question à trois choix, il y avait trois cents pixels de vide entre
   la réponse et « Continuer ». Le corps garde son défilement quand la
   réponse est longue. */
#deck .dcard .d-body{ flex:0 1 auto; padding-bottom:24px }
/* Les 24 px du bas : les réponses entrent en montant de 22 px au plus
   (mouvement.css, mv-monte). Sans cette place, elles dépassaient du corps
   pendant leur glissé, et le dégradé « il reste à voir » s'allumait sur
   une liste courte (banc-defilement, question 04). */
#deck .dcard .d-foot{ margin-top:0 }

/* ── 3. Les questions, d'une seule couleur ──────────────────────────── */
.dcard .d-q em{ color:inherit }

/* ── 5. Les gestes ──────────────────────────────────────────────────── */
/* Un appui se SENT : les tuiles et cartes cèdent un peu, puis reviennent
   avec un ressort. Les règles existantes (wow.css) n'en touchaient qu'une
   partie ; on prend toutes les cartes qu'on touche. */
.ref-tuile, .trace-carte, .envie, .dcard .radio-it, .dcard .mode-btn{
  transition:transform .35s cubic-bezier(.2,.9,.3,1.25), box-shadow .3s ease;
}
.ref-tuile:active, .trace-carte:active, .envie:active, .dcard .radio-it:active, .dcard .mode-btn:active{ transform:scale(.975); transition-duration:.12s }
.btn:active{ transform:scale(.97); transition-duration:.1s }

/* L'écran d'UN jour (overlay « day ») : son programme arrive ligne après
   ligne, une seule fois, à l'ouverture. L'itinéraire a déjà le sien
   (mouvement.css, .itn-day.open) : on ne le touche pas. */
@keyframes oct-pose{ from{ opacity:0; transform:translateY(10px) } to{ opacity:1; transform:none } }
.ov[data-ov="day"].in .moment{ animation:oct-pose .45s cubic-bezier(.2,.8,.2,1) both }
.ov[data-ov="day"].in .moment:nth-child(2){ animation-delay:.05s }
.ov[data-ov="day"].in .moment:nth-child(3){ animation-delay:.1s }
.ov[data-ov="day"].in .moment:nth-child(4){ animation-delay:.15s }
.ov[data-ov="day"].in .moment:nth-child(5){ animation-delay:.2s }
.ov[data-ov="day"].in .moment:nth-child(n+6){ animation-delay:.25s }

@media (prefers-reduced-motion:reduce){
  html.deck-concentre .tabbar{ transition:none; transform:none }
  .ov[data-ov="day"].in .moment{ animation:none }
  .ref-tuile:active, .trace-carte:active, .envie:active, .dcard .radio-it:active, .dcard .mode-btn:active, .btn:active{ transform:none }
}
