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

:root {
  --noir: #050407;
  --encre: #0a0810;
  --rouge: #8b1a1a;
  --rouge-sang: #c0392b;
  --or: #a07040;
  --or-pale: #c8a96e;
  --texte: #c5b9a8;
  --texte-pale: #7a6e62;
  --blanc-os: #e8ddd0;
}

html {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--texte);
  font-family: "Crimson Pro", Georgia, serif;
  background:
    radial-gradient(ellipse 70% 42% at 50% 18%, rgba(139,26,26,.13), transparent 62%),
    radial-gradient(ellipse 70% 50% at 50% 55%, rgba(160,112,64,.04), transparent 72%),
    linear-gradient(to bottom, var(--encre), var(--noir) 55%, #020103);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: .28;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.08'/%3E%3C/svg%3E");
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 100;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 38%, rgba(5,4,7,.76) 100%);
}

.page-turn {
  position: fixed;
  inset: 0;
  background: var(--noir);
  z-index: 8000;
  pointer-events: none;
  opacity: 1;
  animation: pageTurnIn 1.2s ease forwards;
}

/* =========================
   UNIVERSAL CHAPTER HEADER
========================= */

.reader-nav {
  position: sticky;
  top: 0;
  z-index: 600;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 1rem;
  align-items: center;
  padding: .95rem clamp(1rem, 4vw, 2.5rem);
  background: linear-gradient(to bottom, rgba(5,4,7,.98), rgba(5,4,7,.86));
  border-bottom: 1px solid rgba(160,112,64,.08);
  backdrop-filter: blur(8px);
}

.reader-nav a {
  color: var(--or-pale);
  text-decoration: none;
  white-space: nowrap;
}

.nav-home {
  font-family: "IM Fell English", serif;
  font-size: 1.08rem;
  letter-spacing: .08em;
}

.nav-progress {
  justify-self: center;
  color: var(--texte-pale);
  font-size: .72rem;
  letter-spacing: .25em;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
}

.nav-next {
  justify-self: end;
  color: var(--rouge-sang) !important;
  font-size: .78rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  border: 1px solid rgba(139,26,26,.28);
  padding: .45rem .8rem;
}

/* =========================
   CHAPTER PAGE
========================= */

.ch-header {
  min-height: 54vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  padding: 6rem 2rem 4rem;
  position: relative;
  overflow: hidden;
}

.ch-header::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 50% 58% at 50% 78%, rgba(139,26,26,.11), transparent 70%),
    linear-gradient(to bottom, rgba(10,8,16,.75), transparent);
}

.ch-num {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -54%);
  font-family: "IM Fell English", serif;
  font-size: clamp(5rem, 18vw, 14rem);
  line-height: .8;
  color: rgba(200,169,110,.045);
  pointer-events: none;
  user-select: none;
}

.ch-eyebrow {
  position: relative;
  z-index: 2;
  color: var(--rouge-sang);
  letter-spacing: .55em;
  text-transform: uppercase;
  font-size: .72rem;
  margin-bottom: 1.2rem;
  animation: fadeUp .9s ease .15s both;
}

.ch-title {
  position: relative;
  z-index: 2;
  font-family: "IM Fell English", serif;
  font-size: clamp(2.8rem, 8vw, 4.8rem);
  color: var(--blanc-os);
  line-height: 1.05;
  text-shadow: 0 0 45px rgba(192,57,43,.28), 0 4px 24px rgba(0,0,0,.8);
  animation: fadeUp 1.1s ease .35s both;
}

.ch-subtitle {
  position: relative;
  z-index: 2;
  margin-top: 1rem;
  font-style: italic;
  font-size: clamp(1.05rem, 2.6vw, 1.25rem);
  color: var(--or-pale);
  max-width: 720px;
  animation: fadeUp 1s ease .62s both;
}

.ch-divider {
  position: relative;
  z-index: 2;
  margin: 2rem auto 0;
  width: 90px;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--rouge-sang), transparent);
  animation: fadeIn 1s ease .9s both;
}

.ch-body {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
  padding: 4.5rem clamp(1.35rem, 4vw, 2.5rem) 7rem;
}

.ch-body p {
  font-size: clamp(1.13rem, 2.6vw, 1.24rem);
  line-height: 2.05;
  color: var(--texte);
  margin-bottom: 1.65em;
  animation: fadeUp .65s ease both;
}

.doc-excerpt {
  margin: 2.6rem 0;
  padding: 1.4rem 1.5rem;
  border-left: 2px solid var(--rouge-sang);
  background: rgba(139,26,26,.045);
  font-family: "Special Elite", "Courier New", monospace;
  font-size: .95rem;
  color: var(--texte-pale);
  line-height: 1.85;
  white-space: pre-wrap;
  position: relative;
  animation: fadeUp .7s ease both;
}

.doc-excerpt::before {
  content: attr(data-label);
  position: absolute;
  top: -.65rem;
  left: 1rem;
  font-family: "Crimson Pro", serif;
  font-size: .65rem;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--rouge-sang);
  background: var(--noir);
  padding: 0 .5rem;
}

.cliffhanger {
  margin-top: 3.8rem;
  padding: 2.2rem 1rem 0;
  border-top: 1px solid rgba(160,112,64,.15);
  font-family: "IM Fell English", serif;
  font-style: italic;
  font-size: clamp(1.25rem, 3.4vw, 1.55rem);
  color: var(--or-pale);
  text-align: center;
  line-height: 1.7;
  animation: fadeIn 1.4s ease .8s both;
}

.emma-dynamic {
  color: var(--rouge-sang);
  text-shadow: 0 0 12px rgba(192,57,43,.35);
}

.ch-footer-nav {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
  padding: 0 clamp(1.35rem, 4vw, 2.5rem) 6rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.footer-nav-link {
  font-size: .82rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--texte-pale);
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .85rem 1.15rem;
  border: 1px solid rgba(160,112,64,.12);
  min-width: 150px;
  text-align: center;
}

.footer-nav-link.next-chapter {
  color: var(--rouge-sang);
  border-color: rgba(139,26,26,.34);
}

.disabled-next {
  opacity: .58;
  cursor: pointer;
  pointer-events: auto;
}

/* =========================
   INDEX
========================= */

.index-body {
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
}

.index-container {
  width: 100%;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.2rem;
  position: relative;
  z-index: 2;
}

.index-content {
  width: min(700px, 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  text-align: center;
}

.index-top {
  font-size: .72rem;
  letter-spacing: .38em;
  text-transform: uppercase;
  color: #b65d56;
  line-height: 1.8;
  max-width: 90%;
}

.logo-box {
  position: relative;
  width: min(620px, 100%);
  padding: .6rem 1rem .8rem;
  border: 1px solid rgba(255,83,62,.14);
  border-radius: 8px;
  background: rgba(15,5,5,.14);
  overflow: visible;
  box-shadow:
    inset 0 0 30px rgba(255,54,40,.055),
    0 0 34px rgba(255,54,40,.12);
}

.logo-box::before {
  content: "";
  position: absolute;
  inset: -45px;
  background: radial-gradient(ellipse at center, rgba(255,55,38,.34), transparent 62%);
  filter: blur(34px);
  z-index: -1;
  opacity: .92;
  animation: signPulse 7s ease-in-out infinite;
}

.index-title {
  position: relative;
  font-family: "IM Fell English", serif;
  font-size: clamp(4.2rem, 15vw, 8rem);
  line-height: .8;
  letter-spacing: .04em;
  color: #fff4ec;
  text-shadow:
    0 0 2px rgba(255,255,255,1),
    0 0 8px rgba(255,226,205,.95),
    0 0 18px rgba(255,104,77,.98),
    0 0 42px rgba(255,54,40,.92),
    0 0 90px rgba(192,57,43,.72),
    0 0 155px rgba(111,13,11,.58);
  filter: brightness(1.12) saturate(1.2);
  animation: tiredNeonStrong 8.5s infinite steps(1,end);
}

.index-title::before {
  content: "EMMA";
  position: absolute;
  inset: 0;
  z-index: -1;
  color: rgba(255,58,40,.38);
  filter: blur(3px);
  transform: translate(2px, 1px);
  text-shadow:
    0 0 28px rgba(255,48,34,.95),
    0 0 85px rgba(192,57,43,.78),
    0 0 165px rgba(111,13,11,.52);
  animation: redBleedTired 6.8s infinite steps(1,end);
}

.index-title::after {
  content: "EMMA";
  position: absolute;
  inset: 0;
  color: #fffaf5;
  text-shadow:
    0 0 4px rgba(255,255,255,1),
    0 0 16px rgba(255,145,112,1),
    0 0 38px rgba(255,54,40,.95),
    0 0 88px rgba(192,57,43,.82);
  opacity: 0;
  pointer-events: none;
  animation: neonSurge 8.5s infinite steps(1,end);
}

.index-subtitle {
  font-style: italic;
  font-size: clamp(1.3rem, 4vw, 2rem);
  color: var(--or-pale);
}

.index-line {
  width: 1px;
  height: 38px;
  background: linear-gradient(to bottom, transparent, var(--or-pale), transparent);
}

.typing-box {
  width: min(620px, 100%);
  padding: 1.3rem;
  border: 1px solid rgba(179,138,93,.15);
  background: rgba(0,0,0,.22);
  border-radius: 8px;
}

.typing-label {
  font-size: .8rem;
  letter-spacing: .4em;
  text-transform: uppercase;
  color: #b95f57;
  margin-bottom: 1rem;
}

.typing {
  min-height: 52px;
  font-family: "Special Elite", monospace;
  font-size: clamp(1.15rem, 4vw, 1.7rem);
  line-height: 1.6;
}

#typing::after {
  content: "";
  display: inline-block;
  width: .5em;
  height: 1em;
  background: #eee;
  margin-left: 4px;
  animation: cursor .8s infinite;
  transform: translateY(.18em);
}

.read {
  font-size: .82rem;
  letter-spacing: .45em;
  text-transform: uppercase;
  opacity: .85;
}

.read::before,
.read::after {
  content: "—";
  margin: 0 .9rem;
  color: var(--or-pale);
}

.chapter-zone {
  width: min(620px, 100%);
  padding-top: .8rem;
  border-top: 1px solid rgba(179,138,93,.1);
  display: flex;
  flex-direction: column;
  gap: .8rem;
}

.doors {
  font-size: .82rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: #b75d56;
}

.empty {
  font-style: italic;
  opacity: .7;
}

.chapter-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .9rem 1rem;
  border-top: 1px solid rgba(179,138,93,.12);
  text-decoration: none;
  color: var(--texte);
  transition: .25s;
  font-size: 1rem;
}

.chapter-card:hover {
  background: rgba(120,10,10,.12);
}

.chapter-num {
  color: #c65a50;
  letter-spacing: .15em;
  font-size: .78rem;
}

.chapter-arrow {
  color: var(--or-pale);
  opacity: .7;
}

.index-footer {
  margin-top: .5rem;
  font-size: .72rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  opacity: .42;
}

/* =========================
   GENERATOR
========================= */

.generator-body {
  padding: 2rem;
}

.generator-app {
  position: relative;
  z-index: 2;
  max-width: 1280px;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 390px;
  gap: 1.5rem;
}

.panel {
  border: 1px solid rgba(160,112,64,.16);
  background: rgba(0,0,0,.28);
  backdrop-filter: blur(8px);
  box-shadow: 0 0 70px rgba(139,26,26,.08);
}

.editor,
.side {
  padding: 1.5rem;
}

.brand {
  text-align: center;
  margin-bottom: 1.5rem;
}

.brand h1 {
  font-family: "IM Fell English", serif;
  color: var(--blanc-os);
  font-size: clamp(2.8rem, 7vw, 4.5rem);
  line-height: .85;
  text-shadow: 0 0 34px rgba(192,57,43,.28);
}

.brand p {
  margin-top: .7rem;
  color: var(--rouge-sang);
  letter-spacing: .28em;
  text-transform: uppercase;
  font-size: .72rem;
}

.grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.field {
  display: flex;
  flex-direction: column;
  gap: .45rem;
  margin-bottom: 1rem;
}

label {
  color: var(--or-pale);
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: .72rem;
}

input,
select,
textarea {
  width: 100%;
  background: rgba(5,4,7,.75);
  border: 1px solid rgba(160,112,64,.14);
  color: var(--texte);
  font-family: "Crimson Pro", Georgia, serif;
  font-size: 1rem;
  padding: .85rem .95rem;
  outline: none;
}

textarea {
  min-height: 320px;
  resize: vertical;
  line-height: 1.75;
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(192,57,43,.45);
}

.btn {
  width: 100%;
  padding: 1rem;
  border: 1px solid rgba(192,57,43,.38);
  background: rgba(192,57,43,.14);
  color: var(--blanc-os);
  letter-spacing: .22em;
  text-transform: uppercase;
  cursor: pointer;
  margin-top: .5rem;
}

.btn:hover {
  background: rgba(192,57,43,.22);
}

.secondary {
  border-color: rgba(160,112,64,.2);
  background: rgba(0,0,0,.18);
  color: var(--or-pale);
}

#file-hint {
  text-align: center;
  margin-top: 1rem;
  padding: .85rem;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(160,112,64,.12);
  color: var(--texte-pale);
}

code {
  color: var(--or-pale);
  background: rgba(160,112,64,.08);
  padding: .1rem .3rem;
}

pre {
  max-height: 560px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.55;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(160,112,64,.12);
  padding: 1rem;
  font-size: .78rem;
  color: var(--texte-pale);
  margin-top: 1rem;
}

.help {
  color: var(--texte-pale);
  line-height: 1.7;
  font-size: .95rem;
}

.help ul {
  margin-top: 1rem;
  padding-left: 1.1rem;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}

/* =========================
   ECRITURE
========================= */

.ecriture-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 1.4rem;
  position: relative;
  z-index: 2;
}

.ecriture-box {
  width: min(760px, 94vw);
  text-align: center;
  border: 1px solid rgba(160,112,64,0.16);
  background:
    linear-gradient(to bottom, rgba(255,255,255,0.018), transparent),
    rgba(0,0,0,0.28);
  box-shadow:
    0 0 80px rgba(139,26,26,0.18),
    inset 0 0 45px rgba(0,0,0,0.35);
  padding: clamp(2rem, 6vw, 4rem);
}

.ecriture-warning {
  margin-top: 2rem;
  color: var(--texte-pale);
  font-style: italic;
  line-height: 1.8;
  font-size: 1.05rem;
}

.ecriture-actions {
  margin-top: 2.4rem;
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

.ecriture-actions a {
  color: var(--or-pale);
  text-decoration: none;
  border: 1px solid rgba(160,112,64,0.18);
  padding: 0.85rem 1.15rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-size: 0.78rem;
}

/* =========================
   ANIMATIONS
========================= */

@keyframes pageTurnIn {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes tiredFlicker {
  0%,91%,100% { opacity: 1; }
  92% { opacity: .45; }
  93% { opacity: 1; }
  96% { opacity: .25; }
  97% { opacity: 1; }
}

@keyframes cursor {
  50% { opacity: 0; }
}

/* =========================
   TABLET / IPAD / MOBILE
========================= */

@media (max-width: 1024px) {
  .reader-nav {
    grid-template-columns: 1fr;
    gap: .65rem;
    padding: .85rem 1rem 1rem;
    text-align: center;
  }

  .nav-home,
  .nav-next,
  .nav-progress {
    justify-self: center;
  }

  .nav-home {
    font-size: 1.28rem;
  }

  .nav-progress {
    font-size: .68rem;
    letter-spacing: .17em;
    white-space: normal;
    line-height: 1.5;
  }

  .nav-next {
    font-size: .72rem;
    padding: .45rem .9rem;
    max-width: 92vw;
    white-space: normal;
    text-align: center;
  }

  .ch-header {
    min-height: 42vh;
    padding: 3.8rem 1.2rem 2.8rem;
  }

  .ch-num {
    font-size: clamp(5rem, 28vw, 10rem);
  }

  .ch-eyebrow {
    letter-spacing: .32em;
    font-size: .66rem;
  }

  .ch-body {
    padding-top: 2.8rem;
  }

  .ch-footer-nav {
    flex-direction: column;
    align-items: stretch;
  }

  .footer-nav-link {
    width: 100%;
  }

  .generator-body {
    padding: 1rem;
  }

  .generator-app {
    grid-template-columns: 1fr;
  }

  .grid {
    grid-template-columns: 1fr;
  }

  .editor,
  .side {
    padding: 1.1rem;
  }
}

@media (max-width: 700px) {
  .index-content {
    gap: .8rem;
  }

  .logo-box {
    padding: .5rem .7rem .7rem;
  }

  .typing-box {
    padding: 1rem;
  }

  .index-top,
  .read,
  .doors,
  .index-footer {
    letter-spacing: .2em;
  }

  .ecriture-actions a {
    width: 100%;
  }
}

@media (max-height: 750px) {
  .index-content {
    transform: scale(.88);
  }
}


/* =========================
   NEON FATIGUÉ — INDEX
========================= */

@keyframes tiredNeonStrong {
  0%, 6%, 12%, 31%, 43%, 57%, 68%, 82%, 100% {
    opacity: 1;
    filter: brightness(1.14) saturate(1.24);
  }

  7% { opacity: .28; filter: brightness(.44) saturate(.75); }
  8% { opacity: .96; filter: brightness(1.35) saturate(1.35); }
  13% { opacity: .55; filter: brightness(.72) saturate(.9); }
  14% { opacity: 1; filter: brightness(1.18) saturate(1.25); }
  32% { opacity: .18; filter: brightness(.35) saturate(.65); }
  33% { opacity: 1; filter: brightness(1.45) saturate(1.4); }
  34% { opacity: .72; filter: brightness(.82) saturate(1); }
  44% { opacity: .38; filter: brightness(.55) saturate(.8); }
  45% { opacity: 1; filter: brightness(1.2) saturate(1.25); }
  58% { opacity: .22; filter: brightness(.38) saturate(.7); }
  59% { opacity: .95; filter: brightness(1.38) saturate(1.35); }
  69% { opacity: .5; filter: brightness(.65) saturate(.9); }
  70% { opacity: 1; filter: brightness(1.16) saturate(1.25); }
  83% { opacity: .12; filter: brightness(.3) saturate(.62); }
  84% { opacity: 1; filter: brightness(1.48) saturate(1.45); }
}

@keyframes redBleedTired {
  0%, 100% { opacity: .52; transform: translate(2px, 1px); }
  20% { opacity: .88; transform: translate(-1px, 1px); }
  32% { opacity: .18; transform: translate(3px, 0); }
  33% { opacity: .95; transform: translate(-2px, 1px); }
  58% { opacity: .22; transform: translate(1px, -1px); }
  84% { opacity: .9; transform: translate(-1px, 1px); }
}

@keyframes neonSurge {
  0%, 8%, 14%, 33%, 45%, 59%, 70%, 84%, 100% { opacity: 0; }
  9% { opacity: .45; }
  10% { opacity: 0; }
  34% { opacity: .85; }
  35% { opacity: .08; }
  46% { opacity: .32; }
  60% { opacity: .65; }
  85% { opacity: .95; }
  86% { opacity: 0; }
}

@keyframes signPulse {
  0%, 100% { opacity: .58; filter: blur(30px); }
  50% { opacity: .95; filter: blur(42px); }
}

@media (max-width: 1024px) {
  .index-title {
    text-shadow:
      0 0 2px rgba(255,255,255,1),
      0 0 8px rgba(255,226,205,.92),
      0 0 18px rgba(255,104,77,.9),
      0 0 36px rgba(255,54,40,.78),
      0 0 72px rgba(192,57,43,.55);
  }

  .logo-box::before {
    opacity: .7;
    filter: blur(28px);
  }
}

/* EMMA V2 — conversation */
.emma-conversation{max-width:720px;margin:4rem auto 6rem;padding:clamp(1rem,4vw,2rem);min-height:430px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.emma-conversation .emma-speaks{min-height:5rem;font-family:"Special Elite",monospace;font-size:clamp(1.25rem,4vw,2rem);line-height:1.6;color:#eee5dc;text-shadow:0 0 18px rgba(255,59,47,.18)}
.emma-conversation .emma-speaks::after{content:"_";margin-left:.15em;color:#c96055;animation:emmaCursor .8s steps(1) infinite}
@keyframes emmaCursor{50%{opacity:0}}
.emma-answer{width:min(460px,100%);margin-top:2rem}.emma-answer[hidden]{display:none}.emma-answer label{display:block;color:#8c7c6e;font-size:.9rem;margin-bottom:.7rem}.emma-answer-row{display:flex;gap:.65rem}.emma-answer input{min-width:0;flex:1;background:rgba(0,0,0,.5);border:1px solid rgba(184,138,93,.35);color:#fff5ef;padding:.9rem 1rem;border-radius:4px;font:inherit;outline:none}.emma-answer input:focus{border-color:#c96055;box-shadow:0 0 0 3px rgba(201,96,85,.12)}.emma-answer button,.emma-choice{border:1px solid rgba(201,96,85,.42);background:rgba(80,12,12,.22);color:#eadbd0;padding:.85rem 1rem;border-radius:4px;cursor:pointer;font:inherit}.emma-answer button:hover,.emma-choice:hover{background:rgba(120,20,20,.32)}
.emma-story-bridge{max-width:760px;margin:2rem auto;color:#cbb8a4;line-height:1.9}.emma-story-bridge p{margin:1.25rem 0}.emma-whisper{font-family:"Special Elite",monospace;color:#d7786d;text-align:center;margin:2.5rem 0}.emma-choice-grid{display:grid;gap:.7rem;max-width:520px;margin:2rem auto}.emma-choice{width:100%;text-align:left}.emma-choice-result{min-height:3rem;text-align:center;color:#c96055;font-family:"Special Elite",monospace;margin-top:1rem}
@media(max-width:560px){.emma-answer-row{flex-direction:column}.emma-answer button{width:100%}}

/* EMMA V2.1 — accueil centre et chapitre I conversation continue */
.index-page{min-height:100vh}.index-actions{margin-top:.35rem}.index-invite{font-size:1.05rem;color:var(--texte);opacity:.82}.start-link{display:inline-flex;align-items:center;justify-content:center;min-width:180px;min-height:48px;padding:.85rem 1.4rem;border:1px solid rgba(192,57,43,.42);color:var(--blanc-os);text-decoration:none;letter-spacing:.24em;font-size:.78rem;background:rgba(88,12,12,.18);transition:.25s ease}.start-link:hover{background:rgba(139,26,26,.25);border-color:rgba(192,57,43,.75)}.index-note{max-width:520px;color:var(--texte-pale);font-size:.85rem}
.emma-intro-page{min-height:100vh}.intro-status{justify-self:end;color:#6d5d53;font-size:.68rem;letter-spacing:.2em}.emma-intro{width:min(900px,calc(100% - 2rem));margin:0 auto;padding:clamp(3rem,8vw,7rem) 0 8rem}.intro-heading{text-align:center;margin-bottom:clamp(4rem,10vw,8rem)}.intro-heading h1{font-family:"IM Fell English",serif;font-size:clamp(3.5rem,10vw,6.5rem);color:var(--blanc-os);text-shadow:0 0 45px rgba(192,57,43,.2)}.intro-heading>p:last-child{margin-top:.8rem;color:var(--or-pale);font-style:italic}.intro-dialogue{width:min(700px,100%);margin:0 auto;min-height:540px}.dialogue-history{display:flex;flex-direction:column;gap:1.15rem}.dialogue-line{font-family:"Special Elite",monospace;font-size:clamp(1.2rem,3vw,1.65rem);line-height:1.55}.dialogue-line.emma{align-self:flex-start;color:#eee5dc}.dialogue-line.reader{align-self:flex-end;color:var(--or-pale);padding:.65rem 1rem;border-right:2px solid rgba(192,57,43,.55);text-align:right}.dialogue-narration{max-width:590px;margin:2.3rem auto;color:#8e8175;font-size:1.05rem;line-height:1.8;font-style:italic;text-align:center;animation:fadeIn .8s ease}.emma-live{margin-top:1.35rem;min-height:3rem;font-family:"Special Elite",monospace;font-size:clamp(1.2rem,3vw,1.65rem);line-height:1.55;color:#f0e7df}.live-cursor{color:#c96055;animation:emmaCursor .8s steps(1) infinite}.intro-answer{margin:2rem 0 0}.intro-answer[hidden],.intro-choices[hidden],.intro-finish[hidden]{display:none}.intro-answer label{display:block;margin-bottom:.7rem;color:#83756a;font-size:.88rem}.intro-answer-row{display:flex;gap:.7rem}.intro-answer input{flex:1;min-width:0;padding:1rem 1.05rem;background:rgba(0,0,0,.42);border:1px solid rgba(160,112,64,.35);color:#fff;font:inherit;outline:none}.intro-answer input:focus{border-color:#b54c43;box-shadow:0 0 0 3px rgba(181,76,67,.1)}.intro-answer button,.intro-choice{min-height:46px;padding:.8rem 1rem;border:1px solid rgba(192,57,43,.4);background:rgba(80,12,12,.18);color:#e7d9ce;font:inherit;cursor:pointer}.intro-choices{display:grid;gap:.75rem;margin-top:2rem}.intro-choice{text-align:left}.intro-choice:hover{background:rgba(120,20,20,.28)}.intro-finish{text-align:center;margin:5rem 0 1rem}.enter-story{display:inline-flex;padding:1rem 1.5rem;border:1px solid rgba(192,57,43,.5);color:#efe4da;text-decoration:none;letter-spacing:.2em;font-size:.76rem}.enter-story:hover{background:rgba(120,20,20,.25)}
@media(max-width:700px){.intro-status{display:none}.emma-intro{width:min(100% - 1.5rem,900px);padding-top:2.5rem}.intro-heading{margin-bottom:4rem}.intro-answer-row{flex-direction:column}.intro-answer button{width:100%}.dialogue-line.reader{max-width:88%}}

/* EMMA V2.2 — conversation integree a la narration */
.intro-heading-soft{margin-bottom:clamp(2.5rem,7vw,5rem)}
.intro-heading-soft>p:last-child{display:none}
.chat-answer{max-width:620px;margin:2rem auto 0}
.chat-answer .intro-answer-row{background:rgba(10,8,8,.42);border-bottom:1px solid rgba(160,112,64,.24)}
.chat-answer input{border:0;background:transparent;padding-left:.25rem}
.chat-answer input:focus{box-shadow:none}
.chat-answer button{border:0;border-left:1px solid rgba(192,57,43,.28);background:transparent;color:#a88f80;letter-spacing:.08em}
.story-narration{max-width:650px;text-align:left;font-style:normal;color:#c8b9ab;font-family:"Crimson Pro",serif;font-size:clamp(1.15rem,2.6vw,1.35rem);line-height:1.9;border-left:1px solid rgba(192,57,43,.22);padding-left:1.35rem;margin-top:2.7rem;margin-bottom:2.7rem}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* =========================================================
   EMMA V2.4 — COUVERTURE / ACCUEIL
   L'accueil ne raconte rien : il ouvre simplement le livre.
========================================================= */
.emma-cover-page{
  margin:0; min-height:100vh; overflow:hidden; background:#020202; color:#e8e0d8;
  font-family:"Crimson Pro",serif; position:relative;
}
.emma-cover-page::before{
  content:""; position:fixed; inset:0; pointer-events:none;
  background:
    radial-gradient(circle at 50% 43%,rgba(78,8,8,.17),transparent 18%),
    radial-gradient(ellipse at 50% 48%,rgba(255,255,255,.025),transparent 36%),
    linear-gradient(115deg,transparent 0 47%,rgba(255,255,255,.012) 49%,transparent 52%);
  animation:emmaRoomBreathe 9s ease-in-out infinite;
}
.emma-cover-noise{position:fixed;inset:-40%;pointer-events:none;opacity:.11;z-index:3;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.48'/%3E%3C/svg%3E");animation:emmaNoise 1.1s steps(2) infinite}
.emma-cover-vignette{position:fixed;inset:0;pointer-events:none;z-index:4;box-shadow:inset 0 0 180px 55px #000,inset 0 0 35px #000;background:linear-gradient(to bottom,rgba(0,0,0,.28),transparent 20%,transparent 72%,rgba(0,0,0,.7))}
.emma-cover{position:relative;z-index:5;min-height:100vh;display:grid;place-items:center;padding:clamp(2rem,6vw,5rem) 1.25rem}
.emma-cover-content{width:min(720px,100%);text-align:center;display:flex;flex-direction:column;align-items:center}
.emma-cover-mark{margin:0 0 clamp(2.4rem,8vw,5rem);font-family:"Special Elite",monospace;font-size:.64rem;letter-spacing:.52em;color:#625955;opacity:.72}
.emma-cover-title-wrap{position:relative;isolation:isolate}
.emma-cover-title{position:relative;margin:0;font-family:"IM Fell English",serif;font-weight:400;font-size:clamp(5.2rem,21vw,11rem);line-height:.72;letter-spacing:.035em;color:#ddd6cf;text-shadow:0 1px 0 #fff,0 0 18px rgba(255,255,255,.06),0 0 52px rgba(103,0,0,.15);animation:emmaTitleAlive 11s steps(1,end) infinite}
.emma-cover-title::before,.emma-cover-title::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;opacity:0}
.emma-cover-title::before{color:#761b18;transform:translate(-2px,1px);clip-path:inset(44% 0 36% 0);animation:emmaTitleGhostA 13s steps(1,end) infinite}
.emma-cover-title::after{color:#b9b2ac;transform:translate(2px,-1px);clip-path:inset(66% 0 17% 0);animation:emmaTitleGhostB 17s steps(1,end) infinite}
.emma-cover-stain{position:absolute;z-index:-1;left:50%;top:57%;width:78%;height:50%;transform:translate(-50%,-50%);background:radial-gradient(ellipse,rgba(91,0,0,.23),rgba(31,0,0,.06) 46%,transparent 72%);filter:blur(22px);animation:emmaStain 8s ease-in-out infinite}
.emma-cover-author{margin:2.3rem 0 0;font-size:clamp(.95rem,2.8vw,1.15rem);font-style:italic;letter-spacing:.08em;color:#746b65}
.emma-cover-rule{width:min(280px,58vw);height:1px;margin:clamp(2.6rem,7vw,4.5rem) 0 2.3rem;background:linear-gradient(90deg,transparent,#3a302d 20%,#5d1815 50%,#3a302d 80%,transparent);position:relative}
.emma-cover-rule span{position:absolute;width:3px;height:3px;border-radius:50%;background:#7d211d;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 12px rgba(142,24,19,.55)}
.emma-cover-actions{display:flex;flex-direction:column;align-items:center;gap:1.1rem}
.emma-cover-open{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:190px;min-height:52px;padding:.85rem 1.6rem;border:1px solid #3d302d;color:#d8d0c8;text-decoration:none;background:rgba(8,5,5,.52);font-family:"Special Elite",monospace;font-size:.74rem;letter-spacing:.32em;transition:border-color .35s ease,background .35s ease,color .35s ease;overflow:hidden}
.emma-cover-open::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 0 43%,rgba(112,17,14,.13) 50%,transparent 57%);transform:translateX(-120%);transition:transform .65s ease}
.emma-cover-open:hover,.emma-cover-open:focus-visible{border-color:#6f211d;background:rgba(35,5,5,.58);color:#f0e7df;outline:none}
.emma-cover-open:hover::before,.emma-cover-open:focus-visible::before{transform:translateX(120%)}
.emma-cover-reset{border:0;background:none;color:#4e4642;font:inherit;font-size:.78rem;cursor:pointer;text-decoration:underline;text-decoration-color:#302927;text-underline-offset:4px;padding:.6rem 1rem}.emma-cover-reset:hover{color:#8b7770}
.emma-cover-fragment{position:absolute;right:clamp(1.2rem,5vw,4rem);bottom:clamp(1.2rem,4vw,3rem);margin:0;font-family:"Special Elite",monospace;font-size:.65rem;color:#241f1d;letter-spacing:.2em;user-select:none}
@keyframes emmaRoomBreathe{0%,100%{opacity:.72}50%{opacity:1}}
@keyframes emmaNoise{0%{transform:translate(0,0)}25%{transform:translate(2%,-1%)}50%{transform:translate(-1%,2%)}75%{transform:translate(1%,1%)}100%{transform:translate(-2%,-1%)}}
@keyframes emmaStain{0%,100%{opacity:.6;transform:translate(-50%,-50%) scale(.94)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}}
@keyframes emmaTitleAlive{0%,8%,10%,48%,50%,100%{opacity:1}9%{opacity:.86}49%{opacity:.94}}
@keyframes emmaTitleGhostA{0%,37%,39%,78%,80%,100%{opacity:0}38%,79%{opacity:.58}}
@keyframes emmaTitleGhostB{0%,58%,60%,91%,93%,100%{opacity:0}59%,92%{opacity:.36}}
@media(max-width:600px){.emma-cover{padding-left:1rem;padding-right:1rem}.emma-cover-mark{letter-spacing:.36em}.emma-cover-author{margin-top:1.8rem}.emma-cover-rule{margin-top:3rem}.emma-cover-open{min-width:175px}.emma-cover-vignette{box-shadow:inset 0 0 95px 24px #000,inset 0 0 24px #000}}
@media(prefers-reduced-motion:reduce){.emma-cover-page::before,.emma-cover-noise,.emma-cover-title,.emma-cover-title::before,.emma-cover-title::after,.emma-cover-stain{animation:none}.emma-cover-noise{opacity:.07}}

/* =========================================================
   V2.5 — LECTURE IMMERSIVE / EMMA HORS DU LIVRE
   ========================================================= */
body:not(.emma-cover-page){background:#030304;color:#d6cdc5}
body:not(.emma-cover-page)::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse 58% 42% at 50% 22%,rgba(70,5,7,.075),transparent 70%),linear-gradient(90deg,rgba(0,0,0,.38),transparent 20%,transparent 80%,rgba(0,0,0,.38))}
.reader-nav{position:fixed;left:0;right:0;background:linear-gradient(to bottom,rgba(3,3,4,.96),rgba(3,3,4,.54),transparent);border:0;backdrop-filter:none;padding:1.2rem clamp(1rem,4vw,3rem)}
.nav-progress{opacity:.42}.nav-next{border:0;padding:.45rem 0;opacity:.52}.nav-home{opacity:.7}.reader-nav a:hover{opacity:1}
.ch-header{min-height:62vh;padding:9rem 1.5rem 5rem;justify-content:center}
.ch-header::before{background:radial-gradient(ellipse 42% 36% at 50% 52%,rgba(88,7,8,.11),transparent 74%)}
.ch-num{font-size:clamp(7rem,24vw,18rem);color:rgba(255,255,255,.018)}
.ch-eyebrow{font-size:.63rem;letter-spacing:.7em;color:#76211e;margin-bottom:1.55rem}
.ch-title{font-size:clamp(3.4rem,9vw,6.5rem);font-weight:400;text-shadow:0 0 60px rgba(105,0,0,.14)}
.ch-subtitle{max-width:620px;color:#776d66;font-size:clamp(1rem,2vw,1.15rem);line-height:1.7}
.ch-divider{width:44px;background:#4d1716;opacity:.65}
.ch-body{max-width:850px;padding:3rem clamp(1.5rem,7vw,5rem) 9rem}
.ch-body p{max-width:690px;margin-left:auto;margin-right:auto;font-size:clamp(1.17rem,2vw,1.35rem);line-height:1.95;color:#cfc5bc;animation:none}
.doc-excerpt{max-width:650px;margin:3.4rem auto;padding:1.4rem 0 1.25rem 1.45rem;border-left:1px solid #54201e;background:transparent;color:#837974;font-size:.86rem;line-height:1.9;animation:none}
.doc-excerpt::before{position:static;display:block;margin-bottom:.7rem;padding:0;background:none;color:#54201e;font-size:.58rem;letter-spacing:.34em}
.emma-intervention{max-width:690px;margin:4.5rem auto;padding-left:clamp(1rem,4vw,2.3rem);position:relative;font-family:"Special Elite",monospace;min-height:3.4rem;animation:emmaWhisperIn .7s ease both}
.emma-intervention::before{content:"";position:absolute;left:0;top:.2rem;bottom:.15rem;width:1px;background:linear-gradient(#6d1b19,rgba(109,27,25,.08));box-shadow:0 0 14px rgba(109,27,25,.25)}
.emma-intervention-name{display:block;margin-bottom:.65rem;color:#6e2421;font-size:.62rem;letter-spacing:.28em;text-transform:lowercase}
.emma-intervention-text{display:inline;color:#ded6d0;font-size:clamp(1rem,2vw,1.12rem);line-height:1.75;text-shadow:0 0 18px rgba(130,25,20,.08)}
.emma-intervention.is-typing .emma-intervention-text::after{content:"_";margin-left:.15em;color:#6f211e;animation:emmaCursor .75s steps(1) infinite}
.cliffhanger{max-width:650px;margin:6rem auto 0;padding:3rem 0 0;border-color:rgba(92,31,28,.3);color:#8f7d70;font-size:clamp(1.25rem,2.8vw,1.55rem)}
.ch-footer-nav{max-width:850px;padding:0 clamp(1.5rem,7vw,5rem) 7rem}.footer-nav-link{border-color:rgba(95,67,55,.13);opacity:.65}.footer-nav-link:hover{opacity:1}
@keyframes emmaWhisperIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:650px){.reader-nav{grid-template-columns:auto 1fr}.nav-progress{display:none}.ch-header{min-height:55vh}.ch-body{padding-top:1rem}.emma-intervention{margin:3.6rem auto}.ch-footer-nav{flex-direction:column-reverse;align-items:stretch}.footer-nav-link{width:100%}}

/* stronger monochrome title corruption — brief, irregular, not permanent */
.emma-cover-title{animation:emmaTitleCorrupt 9.7s steps(1,end) infinite}
.emma-cover-title::before{clip-path:polygon(0 18%,100% 18%,100% 31%,0 31%,0 55%,100% 55%,100% 64%,0 64%);animation:emmaGlitchSliceA 9.7s steps(1,end) infinite}
.emma-cover-title::after{clip-path:polygon(0 38%,100% 38%,100% 46%,0 46%,0 72%,100% 72%,100% 82%,0 82%);animation:emmaGlitchSliceB 9.7s steps(1,end) infinite}
@keyframes emmaTitleCorrupt{0%,17%,19%,46%,48%,76%,79%,100%{transform:none;filter:none}17.25%{transform:translateX(-2px) skewX(-1deg)}17.5%{transform:translateX(3px)}17.75%{transform:translateX(-1px)}46.3%{transform:translate(1px,-1px)}46.6%{transform:translate(-3px,1px);filter:blur(.35px)}77%{transform:skewX(2deg)}77.25%{transform:translateX(4px)}77.5%{transform:translateX(-3px)}}
@keyframes emmaGlitchSliceA{0%,17%,18.1%,46%,47.1%,76%,78%,100%{opacity:0;transform:translate(0)}17.2%{opacity:.8;transform:translate(-9px,1px)}17.45%{opacity:.38;transform:translate(7px,-1px)}46.35%{opacity:.65;transform:translate(11px)}77.1%{opacity:.8;transform:translate(-13px)}}
@keyframes emmaGlitchSliceB{0%,17.1%,18.2%,46.1%,47.2%,76.1%,78.1%,100%{opacity:0;transform:translate(0)}17.3%{opacity:.5;transform:translate(10px,-1px)}17.6%{opacity:.75;transform:translate(-6px,1px)}46.45%{opacity:.55;transform:translate(-12px)}77.25%{opacity:.6;transform:translate(8px)}}

/* V2.7 — correction du prologue : Emma est une présence, pas une pile de labels */
.ch-body{max-width:920px}
.ch-body p{max-width:720px;font-size:clamp(1.22rem,1.7vw,1.42rem);line-height:2.02}
.emma-conversation{max-width:720px;margin:4.8rem auto 5.4rem;padding:0 0 0 1.7rem;min-height:0}
.emma-intervention-lines{display:flex;flex-direction:column;align-items:flex-start;gap:.48rem}
.emma-intervention-line{margin:0;color:#ded6d0;font-size:clamp(1.02rem,1.55vw,1.16rem);line-height:1.72;letter-spacing:.01em}
.emma-intervention-line + .emma-intervention-line{margin-top:.12rem}
.emma-intervention-line.is-current::after{content:"_";margin-left:.14em;color:#6f211e;animation:emmaCursor .75s steps(1) infinite}
.emma-conversation .emma-intervention-name{margin-bottom:1rem}
.doc-excerpt{max-width:680px;padding:1.25rem 1.45rem;background:linear-gradient(90deg,rgba(70,9,10,.09),transparent 75%);border-left:1px solid #5c1e1b}
@media(max-width:650px){.ch-body p{font-size:1.12rem;line-height:1.88}.emma-conversation{padding-left:1.1rem;margin:3.6rem auto 4.2rem}.doc-excerpt{padding:1.05rem 1rem}}


/* V2.8 — séparation visuelle stricte : livre brut / Emma vivante */
.ch-body > p{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}
.emma-intervention{animation:none!important}
.emma-intervention-lines,.emma-intervention-text{min-height:1.5em}
.emma-intervention:not(.is-awake) .emma-intervention-name{opacity:.28}
.emma-intervention.is-awake .emma-intervention-name{opacity:1;transition:opacity .35s ease}
.emma-intervention-line.is-current::after,.emma-intervention.is-typing .emma-intervention-text::after{content:"_";margin-left:.14em;color:#6f211e;animation:emmaCursor .75s steps(1) infinite}

/* V2.9 — EMMA et le roman n'occupent jamais le même espace visuel. */
.emma-inline-disabled{display:none!important}
.emma-scene-marker{display:block;width:1px;height:1px;pointer-events:none}
.emma-focus[hidden]{display:none!important}
.emma-focus{position:fixed;inset:0;z-index:12000;background:#020203;display:grid;place-items:center;padding:clamp(1.25rem,5vw,4rem);opacity:0;transition:opacity .5s ease;overflow:auto}
.emma-focus::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse 52% 42% at 50% 48%,rgba(67,4,6,.10),transparent 72%),linear-gradient(90deg,rgba(0,0,0,.5),transparent 25%,transparent 75%,rgba(0,0,0,.5))}
.emma-focus.is-visible{opacity:1}
.emma-focus-inner{position:relative;width:min(760px,100%);min-height:min(440px,72vh);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.emma-focus-name{margin:0 0 1.45rem;color:#6e2421;font-family:"Special Elite",monospace;font-size:.64rem;letter-spacing:.34em;text-transform:lowercase}
.emma-focus-lines{width:100%;font-family:"Special Elite",monospace;color:#e2dad4;font-size:clamp(1.15rem,2.3vw,1.48rem);line-height:1.75;text-shadow:0 0 22px rgba(120,18,15,.10)}
.emma-focus-line{margin:0 0 .72rem;min-height:1.4em}
.emma-focus-line.is-current::after{content:"_";margin-left:.13em;color:#76241f;animation:emmaCursor .75s steps(1) infinite}
.emma-focus-return{align-self:flex-end;margin-top:2.3rem;border:0;border-bottom:1px solid rgba(111,33,29,.45);background:none;color:#675b55;padding:.55rem .1rem;font:inherit;font-size:.76rem;letter-spacing:.08em;cursor:pointer;opacity:.78;transition:.25s ease}
.emma-focus-return:hover,.emma-focus-return:focus-visible{color:#bdaaa0;border-color:#7a2823;outline:none;opacity:1}
body.emma-is-speaking{overflow:hidden}
@media(max-width:650px){.emma-focus{padding:1.2rem}.emma-focus-inner{min-height:78vh}.emma-focus-lines{font-size:1.15rem;line-height:1.7}.emma-focus-return{margin-top:1.7rem}}

/* V2.10 - Emma occupe toujours le viewport complet, independamment du lecteur. */
html,body{width:100%;max-width:none;min-height:100%;overflow-x:hidden}
.emma-focus{
  position:fixed!important;
  top:0!important;right:0!important;bottom:0!important;left:0!important;
  width:100vw!important;
  max-width:none!important;
  height:100vh!important;
  height:100dvh!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  margin:0!important;
  box-sizing:border-box!important;
  transform:none!important;
  border:0!important;
  border-radius:0!important;
  background:#020203!important;
  z-index:2147483000!important;
  overflow:auto;
  overscroll-behavior:contain;
}
.emma-focus::before{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
.emma-focus-inner{width:min(760px,calc(100vw - 2.5rem))!important;max-width:760px!important;margin:auto!important;box-sizing:border-box}
body.emma-is-speaking{overflow:hidden!important}
@media(max-width:650px){
  .emma-focus{padding:max(1.25rem,env(safe-area-inset-top)) max(1.1rem,env(safe-area-inset-right)) max(1.25rem,env(safe-area-inset-bottom)) max(1.1rem,env(safe-area-inset-left))!important}
  .emma-focus-inner{width:100%!important;min-height:70dvh!important}
  .emma-focus-lines{font-size:clamp(1.05rem,5vw,1.3rem)}
}


/* V2.11 - TRUE FULLSCREEN EMMA
   Aucun vignettage lateral du lecteur pendant une conversation. */
html.emma-mode,
html.emma-mode body,
body.emma-mode {
  margin:0!important;
  padding:0!important;
  width:100%!important;
  max-width:none!important;
  min-height:100%!important;
  background:#000!important;
}
body.emma-mode::before,
body.emma-mode::after {
  content:none!important;
  display:none!important;
  background:none!important;
}
body.emma-mode .reader-nav,
body.emma-mode .ch-header,
body.emma-mode .ch-body,
body.emma-mode .ch-footer-nav,
body.emma-mode .page-turn {
  visibility:hidden!important;
}
body.emma-mode .emma-focus {
  visibility:visible!important;
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100vh!important;
  height:100dvh!important;
  margin:0!important;
  padding:clamp(1.25rem,5vw,4rem)!important;
  background:#000!important;
  background-image:none!important;
  box-shadow:none!important;
  filter:none!important;
  z-index:2147483647!important;
  isolation:isolate!important;
}
/* IMPORTANT: l'ancien ::before ajoutait volontairement les deux bandes
   sombres laterales via linear-gradient. Il est supprime en mode Emma. */
body.emma-mode .emma-focus::before,
body.emma-mode .emma-focus::after {
  content:none!important;
  display:none!important;
  background:none!important;
}
body.emma-mode .emma-focus-inner {
  position:relative!important;
  z-index:1!important;
  width:min(760px,calc(100vw - 2.5rem))!important;
  max-width:760px!important;
  margin:auto!important;
}
@media(max-width:650px){
  body.emma-mode .emma-focus{
    padding:max(1.25rem,env(safe-area-inset-top)) max(1.1rem,env(safe-area-inset-right)) max(1.25rem,env(safe-area-inset-bottom)) max(1.1rem,env(safe-area-inset-left))!important;
  }
  body.emma-mode .emma-focus-inner{width:100%!important;}
}

/* V2.12 - ESPACE EMMA : plein ecran immersif, sans bandes laterales. */
body.emma-mode .emma-focus{
  background:
    radial-gradient(ellipse 62% 48% at 50% 50%, rgba(86,8,12,.16) 0%, rgba(49,4,7,.09) 35%, rgba(12,3,5,.035) 62%, transparent 78%),
    radial-gradient(ellipse 115% 100% at 50% 50%, transparent 48%, rgba(0,0,0,.28) 78%, rgba(0,0,0,.58) 100%),
    #050405!important;
  box-shadow:none!important;
}
body.emma-mode .emma-focus::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  pointer-events:none!important;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E")!important;
  background-size:220px 220px!important;
  opacity:.022!important;
  mix-blend-mode:screen!important;
  animation:emmaAtmosphereNoise 1.8s steps(2,end) infinite!important;
}
body.emma-mode .emma-focus::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:radial-gradient(ellipse 54% 40% at 50% 50%,rgba(105,10,14,.035),transparent 72%)!important;
  opacity:.75!important;
  animation:emmaAtmosphereBreath 8s ease-in-out infinite!important;
}
body.emma-mode .emma-focus-inner{z-index:2!important;}
body.emma-mode .emma-focus-name{
  text-transform:none!important;
  color:#8b302c!important;
  text-shadow:0 0 16px rgba(120,24,20,.22)!important;
}
body.emma-mode .emma-focus-lines{
  color:#e7dfd8!important;
  text-shadow:0 0 20px rgba(116,22,19,.10)!important;
}
body.emma-mode .emma-focus-line.is-current::after{
  color:#9a332d!important;
  text-shadow:0 0 9px rgba(145,35,29,.4)!important;
}
@keyframes emmaAtmosphereBreath{0%,100%{opacity:.52}50%{opacity:.92}}
@keyframes emmaAtmosphereNoise{0%{transform:translate(0,0)}25%{transform:translate(-.5%,.35%)}50%{transform:translate(.35%,-.45%)}75%{transform:translate(.45%,.25%)}100%{transform:translate(0,0)}}
@media(prefers-reduced-motion:reduce){body.emma-mode .emma-focus::before,body.emma-mode .emma-focus::after{animation:none!important}}

/* V2.13 - SCROLL LOCK EMMA
   Empêche la scrollbar du navigateur d'apparaitre/disparaitre pendant la frappe. */
html.emma-mode,
html.emma-mode body,
body.emma-mode{
  overflow:hidden!important;
  overscroll-behavior:none!important;
  height:100%!important;
  min-height:100%!important;
}
body.emma-mode .emma-focus{
  overflow:hidden!important;
  max-height:100dvh!important;
}
body.emma-mode .emma-focus-inner{
  max-height:calc(100dvh - clamp(2.5rem,10vw,8rem))!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}
body.emma-mode .emma-focus-inner::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}
@media(max-width:650px){
  body.emma-mode .emma-focus-inner{
    max-height:calc(100dvh - max(2.5rem, env(safe-area-inset-top) + env(safe-area-inset-bottom) + 2rem))!important;
  }
}

/* V2.14 — réponses intégrées à la conversation, jamais comme un formulaire de site. */
.emma-focus-response{margin-top:1.5rem;width:min(100%,720px)}
.emma-choice-list{display:grid;gap:.55rem}
.emma-choice,.emma-text-answer button{appearance:none;border:0;border-bottom:1px solid rgba(155,38,48,.28);background:transparent;color:rgba(244,238,238,.82);font:inherit;text-align:left;padding:.72rem .15rem;cursor:pointer;transition:color .18s ease,border-color .18s ease,transform .18s ease}
.emma-choice:hover,.emma-choice:focus-visible{color:#fff;border-color:rgba(180,48,58,.7);transform:translateX(3px);outline:none}
.emma-choice:disabled{opacity:.35;cursor:default}
.emma-text-answer{display:flex;gap:.7rem;align-items:center;border-bottom:1px solid rgba(155,38,48,.42)}
.emma-text-answer input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#f4eeee;font:inherit;padding:.8rem .1rem;caret-color:#a72b36}
.emma-text-answer button{flex:0 0 auto;border:0;padding:.8rem .2rem;color:rgba(190,61,70,.88)}


/* V2.16 — une intervention obligatoire d'Emma ne peut jamais être contournée. */
.emma-next-locked{
  opacity:.18!important;
  pointer-events:auto!important;
  cursor:not-allowed!important;
  filter:grayscale(1);
  text-decoration:none!important;
}
.emma-next-locked:hover,.emma-next-locked:focus-visible{opacity:.24!important;color:inherit!important;}


/* V2.17 — réponse d'Emma intégrée à la scène, sans apparence de formulaire HTML. */
body.emma-mode .emma-focus-response{margin-top:1.8rem;width:min(100%,680px)}
body.emma-mode .emma-text-answer{display:flex;align-items:center;gap:1rem;width:100%;border:0;border-bottom:1px solid rgba(126,35,38,.48);padding:0;background:transparent}
body.emma-mode .emma-text-answer:focus-within{border-bottom-color:rgba(169,53,57,.85);box-shadow:0 8px 18px -18px rgba(169,53,57,.65)}
body.emma-mode .emma-text-answer input{appearance:none;flex:1;min-width:0;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#e5dcd6;font-family:"Special Elite",monospace;font-size:clamp(1rem,1.8vw,1.15rem);line-height:1.5;padding:.72rem .1rem;caret-color:#8e2c2d}
body.emma-mode .emma-text-answer input::placeholder{color:rgba(164,145,139,.38);opacity:1}
body.emma-mode .emma-text-answer button{appearance:none;border:0!important;background:transparent!important;box-shadow:none!important;color:rgba(145,57,58,.72);font-family:"Special Elite",monospace;font-size:.76rem;letter-spacing:.06em;padding:.72rem .05rem;white-space:nowrap;cursor:pointer}
body.emma-mode .emma-text-answer button:hover,body.emma-mode .emma-text-answer button:focus-visible{color:#c27a76;outline:none}
@media(max-width:520px){body.emma-mode .emma-text-answer{gap:.55rem}body.emma-mode .emma-text-answer button{font-size:.7rem}}

/* V2.19 - Mention editoriale discrete sur la couverture */
.emma-cover-editorial-note {
  position: fixed;
  left: 50%;
  bottom: max(12px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  width: min(92vw, 760px);
  margin: 0;
  text-align: center;
  font-family: "Crimson Pro", Georgia, serif;
  font-size: clamp(9px, .62rem, 11px);
  font-weight: 300;
  line-height: 1.35;
  letter-spacing: .025em;
  color: rgba(225, 220, 215, .34);
  pointer-events: none;
  z-index: 4;
}
@media (max-height: 560px) {
  .emma-cover-editorial-note { position: static; transform: none; width: auto; margin: 22px 18px 10px; }
}


/* V2.20 — Responsive global + zones tactiles.
   Toutes les interfaces d'Emma doivent rester utilisables sans hover. */
html,body{max-width:100%;}
img,video,svg,canvas{max-width:100%;height:auto;}
input,button,textarea,select{font:inherit;max-width:100%;}
.emma-focus,.emma-focus-inner,.emma-focus-response,.emma-choice-list,.emma-text-answer{min-width:0;max-width:100%;}
.emma-choice,.emma-text-answer button{min-height:44px;touch-action:manipulation;}
.emma-text-answer input{font-size:max(16px,1rem);min-height:44px;}
@media(max-width:768px){
  body.emma-mode .emma-focus{padding:max(1.25rem,env(safe-area-inset-top)) max(1.1rem,env(safe-area-inset-right)) max(1.25rem,env(safe-area-inset-bottom)) max(1.1rem,env(safe-area-inset-left))!important;}
  body.emma-mode .emma-focus-inner{width:100%!important;max-width:100%!important;max-height:calc(100dvh - max(2.5rem,env(safe-area-inset-top) + env(safe-area-inset-bottom) + 2rem))!important;}
  body.emma-mode .emma-focus-response{width:100%!important;margin-top:1.25rem;}
  body.emma-mode .emma-choice{width:100%;padding:.85rem .1rem;line-height:1.35;}
  body.emma-mode .emma-text-answer{width:100%;gap:.65rem;}
  body.emma-mode .emma-text-answer button{min-width:44px;min-height:44px;}
}
@media(max-width:420px){
  body.emma-mode .emma-text-answer{align-items:flex-end;}
  body.emma-mode .emma-text-answer button{white-space:normal;text-align:right;line-height:1.15;}
}
@media(hover:none),(pointer:coarse){
  .emma-choice:hover,.emma-text-answer button:hover{transform:none;}
  .emma-choice:active,.emma-text-answer button:active{opacity:.72;}
}
@media(orientation:landscape) and (max-height:520px){
  body.emma-mode .emma-focus{padding:max(.65rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(.65rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))!important;}
  body.emma-mode .emma-focus-inner{max-height:calc(100dvh - 1.3rem)!important;}
}
