.theme-la-cafetiere{--bg:#100c0b;--surface:#211713;--ink:#eee9df;--ink-muted:#b9b0a6;--accent:#c89b61;--accent-2:#8db0b7;--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:#8db0b7}.illu__frame img{filter:saturate(.75) contrast(1.08)}
/* Immersion V2 : bougies, bal, objets qui s'éveillent */
.theme-la-cafetiere{position:relative;background:radial-gradient(circle at 50% 15%,#25170d 0,var(--bg) 40rem);transition:background 1.4s ease}
.theme-la-cafetiere::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 18% 35%,rgb(255 160 70/.09),transparent 20%),radial-gradient(circle at 82% 58%,rgb(255 180 90/.07),transparent 18%);animation:candle-room 4.6s ease-in-out infinite alternate}
.theme-la-cafetiere[data-mood="m2"]::before{opacity:1.45;animation-duration:2.8s}.theme-la-cafetiere[data-mood="m3"]::before{opacity:.8}
.theme-la-cafetiere .illu__frame{box-shadow:0 1.5rem 4.5rem rgb(0 0 0/.32),0 0 3rem rgb(177 104 47/.06)}
.theme-la-cafetiere .illu.is-revealed img{transform-origin:50% 65%}
.theme-la-cafetiere #page-2 .illu.is-revealed img{animation:dance-breathe 8s ease-in-out 1}
.theme-la-cafetiere #page-3 .illu.is-revealed .illu__frame{animation:porcelain-awake 4.8s ease-in-out 1}
.theme-la-cafetiere .chapter__title::after{content:"";display:block;width:2.5rem;height:1px;margin-top:.55rem;background:linear-gradient(90deg,var(--accent),transparent);box-shadow:0 0 12px var(--accent)}
@keyframes candle-room{0%{filter:brightness(.86)}24%{filter:brightness(1.05)}30%{filter:brightness(.92)}72%{filter:brightness(1.08)}100%{filter:brightness(.96)}}
@keyframes dance-breathe{0%,100%{transform:scale(1)}45%{transform:scale(1.025) translateY(-.4%)}70%{transform:scale(1.012) translateY(.25%)}}
@keyframes porcelain-awake{0%,100%{transform:rotate(0);box-shadow:0 1.5rem 4.5rem rgb(0 0 0/.32)}42%{transform:rotate(-.12deg);box-shadow:0 1.5rem 5rem rgb(0 0 0/.35),0 0 2.5rem rgb(177 104 47/.14)}47%{transform:rotate(.12deg)}52%{transform:rotate(-.08deg)}}

.theme-la-cafetiere[data-mood="m4"]::before{opacity:.8;animation-duration:2.1s}.theme-la-cafetiere[data-mood="m5"]::before{opacity:.95;animation-duration:1.55s}.theme-la-cafetiere[data-mood="m4"] .story-hero,.theme-la-cafetiere[data-mood="m5"] .story-hero{filter:sepia(.08)}.theme-la-cafetiere #page-5 .illu.is-revealed .illu__frame{animation:candle-float 4.6s ease-in-out 2}@keyframes candle-float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-7px) rotate(.18deg);box-shadow:0 2rem 5rem rgb(175 105 40/.22)}}

.theme-la-cafetiere[data-mood="m4"]::before{opacity:.8;animation-duration:2.1s}.theme-la-cafetiere[data-mood="m5"]::before{opacity:.95;animation-duration:1.55s}.theme-la-cafetiere[data-mood="m4"] .story-hero,.theme-la-cafetiere[data-mood="m5"] .story-hero{filter:sepia(.08)}.theme-la-cafetiere #page-5 .illu.is-revealed .illu__frame{animation:candle-float 4.6s ease-in-out 2}@keyframes candle-float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-7px) rotate(.18deg);box-shadow:0 2rem 5rem rgb(175 105 40/.22)}}

/* 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{background:radial-gradient(circle at 18% 76%,rgba(255,154,66,.13),transparent 16%),radial-gradient(circle at 82% 30%,rgba(255,190,98,.08),transparent 13%);animation:candleRoom 4.2s ease-in-out infinite}body::after{inset:-15%;background:linear-gradient(115deg,transparent 20%,rgba(0,0,0,.16) 38%,transparent 55%);animation:movingShadow 13s ease-in-out infinite alternate}body[data-mood="m4"] .scene-figure img,body[data-mood="m5"] .scene-figure img{animation:objectFloat 7s ease-in-out infinite}body[data-mood="m5"] .scene-figure::after{opacity:.38;background:radial-gradient(circle at 50% 45%,rgba(255,178,95,.25),transparent 46%);animation:finalFlame 3.5s ease-in-out infinite}@keyframes candleRoom{0%,100%{opacity:.5}35%{opacity:.85}42%{opacity:.45}70%{opacity:.75}}@keyframes movingShadow{from{transform:translateX(-6%) skewX(-2deg)}to{transform:translateX(7%) skewX(3deg)}}@keyframes objectFloat{0%,100%{transform:scale(1.025) translateY(0)}50%{transform:scale(1.045) translateY(-7px)}}@keyframes finalFlame{50%{opacity:.7;transform:scale(1.06)}}
/* 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 : treize coups à minuit (piloté par scripts/themes/la-cafetiere.js) ===== */
.chime { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .7rem; margin: 2rem auto 2.4rem; max-width: 32rem; }
.chime__c {
  width: .72rem; height: 1.5rem; border-radius: 50% 50% 45% 45% / 70% 70% 30% 30%;
  background: rgb(255 255 255 / .06); border: 1px solid rgb(200 155 97 / .25);
  transition: background .5s, box-shadow .6s, transform .5s;
}
.chime__c.on { background: linear-gradient(180deg, #ffe3a6, #e0a35c 60%, #a0602a); box-shadow: 0 0 .8rem 0 rgb(255 190 100 / .55); transform: translateY(-.15rem); }
.chime__c--13.on { background: linear-gradient(180deg, #f4fbff, #bfe3f2 60%, #6aa7c2); box-shadow: 0 0 1.6rem .2rem rgb(170 225 255 / .7); transform: translateY(-.3rem) scale(1.25); }
.chime__n { margin-left: .6rem; font-family: var(--font-display); letter-spacing: .2em; font-size: .95rem; color: transparent; transition: color 1.2s; }
.chime.is-done .chime__n { color: #bfe3f2; }
body.chime-flash main.story { animation: chime-flash 1.1s ease-out; }
@keyframes chime-flash { 0% { filter: none; } 15% { filter: brightness(1.45) saturate(.8) hue-rotate(-12deg); } 100% { filter: none; } }
.cafe-glow {
  position: fixed; inset: 0; z-index: 1; pointer-events: none; mix-blend-mode: screen; --gx: 70%; --gy: 40%; --lvl: .5;
  background: radial-gradient(circle at var(--gx) var(--gy), rgb(255 176 80 / calc(.2 * var(--lvl))), rgb(255 150 60 / calc(.07 * var(--lvl))) 12rem, transparent 24rem);
  animation: cafe-flick 5.2s infinite;
}
@keyframes cafe-flick { 0%, 100% { opacity: .8; } 18% { opacity: .6; } 33% { opacity: .95; } 52% { opacity: .7; } 71% { opacity: 1; } 86% { opacity: .65; } }
.theme-la-cafetiere[data-mood="m2"] { --lvl: 1; } .theme-la-cafetiere[data-mood="m3"] { --lvl: 1; }
.theme-la-cafetiere[data-mood="m4"] { --lvl: .8; } .theme-la-cafetiere[data-mood="m5"] { --lvl: .6; }
.shadow-leave { animation: shadow-leave 3.6s ease-out forwards; }
@keyframes shadow-leave {
  0% { text-shadow: 0 0 0 rgb(224 175 105 / 0); }
  30% { text-shadow: .35rem .08rem 0 rgb(224 175 105 / .26); }
  100% { text-shadow: 3.4rem -.1rem 0 rgb(224 175 105 / 0); }
}
.fg { transition: opacity 1.6s ease, filter 1.6s ease; transition-delay: calc(var(--k) * 160ms); }
.is-forgetting .fg { opacity: .3; filter: blur(.5px); }
body.effects-off .cafe-glow { display: none; }
body.effects-off .fg { transition: none; }