.theme-la-peur{--bg:#080b08;--surface:#151a13;--ink:#eee9df;--ink-muted:#b9b0a6;--accent:#b7b05f;--accent-2:#6f8d72;--font-display:"Instrument Serif",Georgia,serif;--font-body:"Literata",Georgia,serif}
.story-hero{min-height:78svh;position:relative;isolation:isolate;overflow:hidden}.story-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(0,0,0,.18),var(--bg) 96%),var(--hero) center/cover no-repeat;filter:saturate(.72) contrast(1.05)}.story-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 35%,transparent,rgba(0,0,0,.58) 76%)}.story-hero h1{font-family:var(--font-display);font-size:clamp(4rem,12vw,10rem);line-height:.82;max-width:10ch;text-wrap:balance}.story-kicker{letter-spacing:.16em;text-transform:uppercase;font-size:.75rem}.hero-hook{font-family:var(--font-display);font-size:clamp(1.6rem,4vw,3.2rem);max-width:22ch;margin-top:2rem;color:var(--accent-2)}.chapter{transition:background .8s ease}.chapter[data-mood="m2"]{--accent:#6f8d72}.illu__frame img{filter:saturate(.75) contrast(1.08)}
/* Immersion V2 : forêt, brouillard, menace hors champ */
.theme-la-peur{position:relative;background:linear-gradient(180deg,#0c100c,var(--bg));transition:background 1.6s ease}
.theme-la-peur::before,.theme-la-peur::after{content:"";position:fixed;inset:-15% -35%;z-index:-1;pointer-events:none;background:repeating-linear-gradient(100deg,transparent 0 9%,rgb(175 190 170/.035) 12%,transparent 16%);filter:blur(16px);opacity:.5;animation:forest-mist 24s linear infinite}
.theme-la-peur::after{opacity:.25;animation-duration:37s;animation-direction:reverse}
.theme-la-peur[data-mood="m2"]::before{opacity:.68}.theme-la-peur[data-mood="m3"]::before{opacity:.88;filter:blur(22px)}
.theme-la-peur .illu__frame::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle at 50% 48%,transparent 38%,rgb(0 5 0/.52) 100%);opacity:.65;transition:opacity 2s ease}
.theme-la-peur .illu.is-revealed .illu__frame::before{opacity:.34}
.theme-la-peur #page-2 .illu.is-revealed img{animation:forest-drift 10s ease-in-out 1}.theme-la-peur #page-3 .illu.is-revealed img{animation:fear-jolt 7s ease-in-out 1}
.theme-la-peur[data-mood="m3"] .chapter__title{text-shadow:0 0 1.5rem rgb(183 176 95/.16)}
@keyframes forest-mist{to{transform:translateX(28%)}}
@keyframes forest-drift{0%,100%{transform:scale(1)}50%{transform:scale(1.035) translateX(-.7%)}}
@keyframes fear-jolt{0%,62%,100%{transform:scale(1)}63%{transform:scale(1.018) translate(-2px,1px)}64%{transform:scale(1.018) translate(2px,-1px)}65%{transform:scale(1.012) translate(-1px,0)}72%{transform:scale(1.025)} }

.theme-la-peur[data-mood="m4"]::before{opacity:.88;animation-duration:11s}.theme-la-peur[data-mood="m5"]::before{opacity:1;animation-duration:7s}.theme-la-peur[data-mood="m4"] .chapter,.theme-la-peur[data-mood="m5"] .chapter{filter:contrast(1.03)}.theme-la-peur #page-5 .illu.is-revealed img{animation:fear-jolt 6.2s steps(1,end) 1}@keyframes fear-jolt{0%,86%,100%{transform:scale(1.02)}87%{transform:scale(1.025) translateX(-3px)}88%{transform:scale(1.025) translateX(2px)}89%{transform:scale(1.02)}}

.theme-la-peur[data-mood="m4"]::before{opacity:.88;animation-duration:11s}.theme-la-peur[data-mood="m5"]::before{opacity:1;animation-duration:7s}.theme-la-peur[data-mood="m4"] .chapter,.theme-la-peur[data-mood="m5"] .chapter{filter:contrast(1.03)}.theme-la-peur #page-5 .illu.is-revealed img{animation:fear-jolt 6.2s steps(1,end) 1}@keyframes fear-jolt{0%,86%,100%{transform:scale(1.02)}87%{transform:scale(1.025) translateX(-3px)}88%{transform:scale(1.025) translateX(2px)}89%{transform:scale(1.02)}}

/* V3.2 : immersion renforcée; le titre reste géré par le lecteur commun */
body::before,body::after{pointer-events:none;position:fixed;content:"";inset:0;z-index:0}
.scene-figure{position:relative;overflow:hidden;isolation:isolate}
.scene-figure::after{content:"";position:absolute;inset:-8%;pointer-events:none;z-index:2;opacity:0}
body.effects-off::before,body.effects-off::after,body.effects-off .scene-figure::after{animation:none!important;opacity:0!important}
@media (prefers-reduced-motion:reduce){body::before,body::after,.scene-figure::after,.scene-figure img,.story-part p{animation:none!important;transform:none!important}}
body::before{inset:-20%;background:radial-gradient(ellipse at 35% 65%,rgba(210,218,211,.10),transparent 30%),radial-gradient(ellipse at 75% 40%,rgba(185,196,190,.08),transparent 28%);filter:blur(20px);animation:fearFog 16s linear infinite alternate}body::after{background:radial-gradient(circle at center,transparent 32%,rgba(0,0,0,.48) 100%);opacity:.55;animation:fearVignette 7s ease-in-out infinite}body[data-mood="m4"] .scene-figure img,body[data-mood="m5"] .scene-figure img{animation:fearCamera 12s ease-in-out infinite}body[data-mood="m5"] .scene-figure::after{opacity:.3;background:linear-gradient(90deg,transparent,rgba(210,220,214,.17),transparent);animation:fogCross 7s linear infinite}@keyframes fearFog{from{transform:translateX(-7%) scale(1.04)}to{transform:translateX(8%) scale(1.12)}}@keyframes fearVignette{50%{opacity:.78}}@keyframes fearCamera{0%,100%{transform:scale(1.03) translate(0)}45%{transform:scale(1.07) translate(-3px,2px)}47%{transform:scale(1.07) translate(2px,-1px)}49%{transform:scale(1.07) translate(-1px,1px)}70%{transform:scale(1.055) translate(2px,0)}}@keyframes fogCross{from{transform:translateX(-65%)}to{transform:translateX(65%)}}
/* V3.3 : alignement du hero sur le composant historique du lecteur */
.story-hero > div {
  position: relative;
  z-index: 1;
  width: min(100%, 76rem);
  margin-inline: auto;
  padding: clamp(5.5rem, 10vh, 7rem) var(--gutter) clamp(3rem, 8vh, 5rem);
  box-sizing: border-box;
}
@media (max-width: 640px) {
  .story-hero > div { padding-top: 5.25rem; padding-bottom: 2.75rem; }
  .story-hero h1 { font-size: clamp(3.4rem, 18vw, 6rem); }
}

/* ===== V4.2.5 : les pas dans la brume (piloté par scripts/themes/la-peur.js) ===== */
.theme-la-peur.has-peur::before, .theme-la-peur.has-peur::after { content: none !important; }   /* ancienne brume en boucle, remplacée par .peur-fog */
.peur-fog {
  position: fixed; inset: -12% -8%; z-index: 1; pointer-events: none;
  opacity: var(--fog, .2); transition: opacity 2.6s ease; filter: blur(22px);
  background:
    radial-gradient(60% 38% at 18% 72%, rgb(150 170 156 / .34), transparent 72%),
    radial-gradient(52% 42% at 82% 38%, rgb(150 170 156 / .28), transparent 72%),
    radial-gradient(80% 30% at 50% 102%, rgb(170 190 176 / .36), transparent 72%);
  animation: peur-drift 46s ease-in-out infinite alternate;
}
@keyframes peur-drift { from { transform: translateX(-3%); } to { transform: translateX(3%) scale(1.04); } }
/* le brouillard épaissit de page en page, puis retombe à l'aube */
.theme-la-peur[data-mood="m1"] { --fog: .2; }
.theme-la-peur[data-mood="m2"] { --fog: .36; }
.theme-la-peur[data-mood="m3"] { --fog: .6; }
.theme-la-peur[data-mood="m4"] { --fog: .46; }
.theme-la-peur[data-mood="m5"] { --fog: .22; }
.peur-lantern {
  position: fixed; inset: 0; z-index: 1; pointer-events: none; opacity: 0; transition: opacity 1.8s ease; mix-blend-mode: screen;
  --lx: 50%; --ly: 60%;
  background: radial-gradient(circle at var(--lx) var(--ly), rgb(255 205 120 / .22), rgb(255 190 100 / .07) 14rem, transparent 26rem);
}
.peur-lantern.is-on { opacity: 1; }
.peur-steps { position: fixed; inset: 0; z-index: 4; pointer-events: none; overflow: hidden; }
.peur-step {
  position: absolute; width: .62rem; height: 1.25rem; opacity: 0;
  border-radius: 55% 55% 48% 48% / 62% 62% 40% 40%; background: rgb(122 30 24 / .7);
  transform: translate(-50%, -50%) rotate(var(--r, 0deg)); animation: peur-step 5.4s ease forwards;
}
.peur-step.is-stay { animation-duration: 14s; }
@keyframes peur-step { 0% { opacity: 0; scale: .6; } 7% { opacity: .8; scale: 1; } 65% { opacity: .5; } 100% { opacity: 0; } }
body.effects-off .peur-lantern, body.effects-off .peur-steps { display: none; }
body.effects-off .peur-fog { animation: none; }