/* Le Cœur pâle — ton de la page (blanc nacré de la Lumière du Voyageur, ambre de la chaumière de
   Zavala, violet et rouge du Témoin, rose du Monolithe, irisé du Prismatique), ambiance par section
   (data-mood sur <body> : pale, home, witness, traveler, edge, prism, voir js/rituals.js), étapes de
   la campagne et du raid, adieu de Cayde, lanternes, Zavala, voix du Témoin, visions, socles de
   Khvostov, souvenirs, textes de légende, couleurs du plan et pastilles.
   Les deux mini-jeux sont dans css/games.css. */

.coeur {
  --pale: #f4ead0;
  --pale-hi: #fffaf0;
  --home: #f0b46a;
  --home-hi: #ffe6c4;
  --witness: #c77dff;
  --witness-hi: #f0d9ff;
  --traveler: #cfe2ff;
  --traveler-hi: #f4f8ff;
  --edge: #ff8fb1;
  --edge-hi: #ffe1ea;
  --prism: #e58cff;
  --prism-hi: #fde3ff;
  --deep: #7fd6c8;
  --memory: #f0b46a;
  --page-accent: var(--pale);
  --page-accent-hi: var(--pale-hi);
}
.coeur[data-mood="home"] { --page-accent: var(--home); --page-accent-hi: var(--home-hi); }
.coeur[data-mood="witness"] { --page-accent: var(--witness); --page-accent-hi: var(--witness-hi); }
.coeur[data-mood="traveler"] { --page-accent: var(--traveler); --page-accent-hi: var(--traveler-hi); }
.coeur[data-mood="edge"] { --page-accent: var(--edge); --page-accent-hi: var(--edge-hi); }
.coeur[data-mood="prism"] { --page-accent: var(--prism); --page-accent-hi: var(--prism-hi); }
.coeur ::selection { background: rgba(244, 234, 208, .3); }
.coeur main { background: radial-gradient(ellipse 70% 18% at 80% 5%, rgba(244, 234, 208, .08), transparent 70%), radial-gradient(ellipse 55% 16% at 8% 30%, rgba(199, 125, 255, .05), transparent 70%); }
.coeur .sec-title { transition: text-shadow .8s; text-shadow: 0 0 34px color-mix(in srgb, var(--page-accent) 26%, transparent); }
.coeur .kicker, .coeur .tag { transition: color .6s; }

/* ---------- Héros ---------- */
.coeur .hero-title span:last-child { margin-top: .18em; font-size: .36em; font-weight: 500; letter-spacing: .3em; color: var(--page-accent-hi); }
.hero-fact { margin: 0; font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.hero-fact b { color: var(--page-accent-hi); }

/* ---------- Sections ---------- */
.coeur .steps { margin-bottom: clamp(30px, 4vw, 44px); }
.coeur .quarters + .raid, .coeur .raid + .quarters, .coeur .duo + .quarters, .coeur .quarters + .duo, .coeur .quarters + .steps,
.coeur .steps + .duo, .coeur .duo + .duo, .coeur .duo + .testimonies, .coeur .testimonies + .duo, .coeur .words-note + .duo,
.coeur .raid-steps + .duo, .coeur .duo + .lanterns-box, .coeur .lanterns-box + .quarters, .coeur .steps + .quarters,
.coeur .quarters + .rubicon, .coeur .duo + .rubicon, .coeur .rubicon + .last-words, .coeur .visions-grid + .words-note,
.coeur .words-note + .ergo-lore, .coeur .raid-steps + .game, .coeur .game + .secrets-raid, .coeur .secrets-raid + .quarters { margin-top: clamp(30px, 4vw, 44px); }
.coeur .quarters + .duo { margin-top: clamp(30px, 4vw, 44px); }
.journey-sec { background: radial-gradient(ellipse 60% 22% at 50% 3%, rgba(244, 234, 208, .09), transparent 70%); }
.home-sec { background: radial-gradient(ellipse 60% 24% at 18% 6%, rgba(240, 180, 106, .1), transparent 70%), radial-gradient(ellipse 50% 20% at 90% 60%, rgba(240, 180, 106, .05), transparent 70%); }
.witness-sec { background: radial-gradient(ellipse 60% 22% at 84% 6%, rgba(199, 125, 255, .1), transparent 70%), radial-gradient(ellipse 50% 20% at 8% 62%, rgba(120, 20, 40, .22), transparent 70%); }
.traveler-sec { background: radial-gradient(ellipse 70% 26% at 50% 0%, rgba(207, 226, 255, .1), transparent 70%); }
.edge-sec { background: radial-gradient(ellipse 60% 24% at 82% 6%, rgba(255, 143, 177, .09), transparent 70%); }
.secrets-sec { background: radial-gradient(ellipse 60% 45% at 30% 30%, color-mix(in srgb, var(--page-accent) 7%, transparent), transparent 70%); }
.lore-sec { background: radial-gradient(ellipse 60% 24% at 20% 8%, rgba(207, 226, 255, .06), transparent 70%); }
.coeur .secrets-layout .games { gap: 28px; }
/* photo cliquable d'une carte : le lien remplit le cadre comme le ferait l'image seule */
.coeur .quarter-photo > a { display: block; height: 100%; }
.coeur .quarter-photo > a > img { width: 100%; height: 100%; object-fit: cover; }
/* douze entrées de menu : plus serrées que sur les autres pages */
@media (min-width: 1021px) { .coeur .nav-menu a { padding: 8px 7px; letter-spacing: .08em; font-size: .7rem; white-space: nowrap; } }
@media (min-width: 1021px) and (max-width: 1400px) { .coeur .brand span { display: none; } }
.words-note { margin: 12px 0 0; font-size: .74rem; font-style: italic; color: var(--muted); }
/* un filet de Lumière entre deux sections */
.light-rule { position: relative; height: 1px; margin: 0; border: 0; overflow: visible; background: linear-gradient(90deg, transparent, rgba(244, 234, 208, .7) 30%, #fff 50%, rgba(244, 234, 208, .7) 70%, transparent); box-shadow: 0 0 22px rgba(244, 234, 208, .55); }
.light-rule::after { content: ''; position: absolute; left: 50%; top: -5px; width: 11px; height: 11px; margin-left: -5.5px; border-radius: 50%; background: #fff; box-shadow: 0 0 18px 4px rgba(244, 234, 208, .9); animation: light-pulse 4s ease-in-out infinite; }
@keyframes light-pulse { 50% { transform: scale(.55); opacity: .6; } }

/* ---------- Deux colonnes : un portrait et son texte ---------- */
.duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); background: var(--panel-solid); border: 1px solid var(--line); }
.duo-photo { position: relative; min-height: 380px; margin: 0; overflow: hidden; }
.duo-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.duo .duo-photo > a { position: absolute; inset: 0; display: block; }
.duo-photo figcaption { position: absolute; left: 0; bottom: 0; padding: 6px 12px; background: rgba(6, 8, 16, .78); font-size: .6rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.duo-body { padding: clamp(22px, 3vw, 36px); }
.duo-body h3 { margin: 4px 0 14px; font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 800; letter-spacing: .02em; text-transform: uppercase; color: var(--pearl); }
.duo-body > p:not(.tag) { margin: 0 0 14px; font-size: .95rem; line-height: 1.65; color: var(--muted); }
.duo-note { margin: 0; font-size: .86rem; line-height: 1.6; color: var(--muted); }
.lore-lines { display: grid; gap: 8px; margin: 0 0 14px; padding: 0; list-style: none; }
.lore-lines li { padding-left: 12px; border-left: 2px solid var(--page-accent); }
.lore-lines q { quotes: '« ' ' »'; font-family: var(--font-lore); font-style: italic; font-size: 1.08rem; line-height: 1.38; color: #e9e3d6; }
.lore-lines small { display: block; margin-top: 2px; font-size: .62rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--page-accent-hi); }

/* ---------- Étapes (campagne et raid) ---------- */
.raid-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 0 0 clamp(30px, 4vw, 44px); padding: 0; list-style: none; }
.raid-step { position: relative; display: flex; flex-direction: column; border: 1px solid var(--line); background: var(--panel-solid); }
.raid-step figure { position: relative; margin: 0; aspect-ratio: 16 / 9; overflow: hidden; }
.raid-step figure > a { display: block; height: 100%; }
.raid-step figure img { width: 100%; height: 100%; object-fit: cover; }
.raid-step > div { padding: 16px 18px 20px; }
.raid-step h3 { margin: 4px 0 8px; font-size: 1.12rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: var(--pearl); }
.raid-step p:not(.tag) { margin: 0; font-size: .88rem; line-height: 1.6; color: var(--muted); }
.raid-step--last { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); border-color: color-mix(in srgb, var(--page-accent) 50%, transparent); }
.raid-step--last figure { aspect-ratio: auto; min-height: 280px; }
.raid-step--last > div { padding: 24px 26px; align-self: center; }
.raid-step--last h3 { font-size: 1.4rem; }
.journey .raid-step:nth-child(6) { border-color: color-mix(in srgb, var(--traveler) 35%, transparent); }

/* ---------- L'adieu de Cayde ---------- */
.radio-msg { margin: 0 0 14px; padding: 14px 18px; border-left: 3px solid var(--pale); background: linear-gradient(90deg, rgba(244, 234, 208, .08), transparent); }
.radio-msg p { margin: 0 0 10px; font-family: var(--font-lore); font-style: italic; font-size: 1.12rem; line-height: 1.45; color: #ece5d4; }
.radio-msg p:last-child { margin-bottom: 0; }

/* ---------- Les lanternes (js/rituals.js) ---------- */
.lanterns-box { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); border: 1px solid color-mix(in srgb, var(--home) 40%, transparent); background: var(--panel-solid); overflow: hidden; }
.lanterns-text { padding: clamp(22px, 3vw, 34px); }
.lanterns-text h3 { margin: 4px 0 12px; font-size: clamp(1.4rem, 2.6vw, 1.9rem); font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.lanterns-text p:not(.tag) { margin: 0 0 12px; font-size: .92rem; line-height: 1.6; color: var(--muted); }
.lanterns-note { min-height: 3.2em; font-family: var(--font-lore); font-style: italic; font-size: 1.08rem !important; color: var(--home-hi) !important; }
.lanterns-sky { position: relative; min-height: 320px; overflow: hidden; }
.lanterns-sky > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.38) saturate(.8); }
.lanterns-sky::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 8, 22, .7), transparent 50%, rgba(10, 8, 22, .6)); pointer-events: none; }
.lanterns-row { position: absolute; left: 0; right: 0; bottom: 18px; z-index: 1; display: flex; justify-content: space-around; gap: 6px; padding: 0 12px; }
.lantern { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 6px; border: 0; background: none; color: var(--pearl); cursor: pointer; }
.lantern-body { position: relative; width: 34px; height: 44px; border-radius: 8px 8px 12px 12px; background: linear-gradient(180deg, #5a4a3a, #3a2e24); box-shadow: inset 0 0 0 1px rgba(255, 230, 196, .35); transition: background .5s, box-shadow .5s; }
.lantern-body::before { content: ''; position: absolute; left: 50%; top: -7px; width: 14px; height: 5px; margin-left: -7px; border-radius: 2px; background: #2a221c; }
.lantern-name { max-width: 90px; font-size: .58rem; font-weight: 800; letter-spacing: .1em; text-align: center; text-transform: uppercase; color: var(--muted); }
.lantern:hover .lantern-body, .lantern:focus-visible .lantern-body { box-shadow: inset 0 0 0 1px var(--home-hi), 0 0 14px rgba(240, 180, 106, .5); }
.lantern.is-lit .lantern-body { background: radial-gradient(circle at 50% 60%, #fff6dc, #ffc46e 45%, #e07a2a); box-shadow: 0 0 22px 6px rgba(255, 180, 90, .55); }
.lantern.is-lit .lantern-name { color: var(--home-hi); }
.lantern.is-rising .lantern-body { animation: lantern-rise 4s ease-in forwards; }
@keyframes lantern-rise { 0% { transform: none; opacity: 1; } 70% { opacity: 1; } 100% { transform: translate(14px, -260px) scale(.55); opacity: 0; } }
.lantern.is-lit:not(.is-rising) .lantern-body { animation: lantern-glow 3s ease-in-out infinite; }
@keyframes lantern-glow { 50% { box-shadow: 0 0 30px 10px rgba(255, 180, 90, .4); } }

/* ---------- Zavala ---------- */
.testimonies { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.testimony { display: flex; flex-direction: column; margin: 0; padding: 20px 20px 16px; border: 1px solid var(--line); border-top: 2px solid var(--home); background: var(--panel-solid); }
.testimony--ghost { border-top-color: var(--traveler); background: linear-gradient(180deg, rgba(207, 226, 255, .07), var(--panel-solid) 60%); }
.testimony blockquote { margin: 0 0 14px; }
.testimony blockquote p { margin: 0; font-family: var(--font-lore); font-style: italic; font-size: 1.1rem; line-height: 1.42; color: #e9e3d6; }
.testimony figcaption { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--line); font-size: .62rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.testimony figcaption b { color: var(--page-accent-hi); }
.zavala-steps .n { border-color: var(--home); color: var(--home-hi); }

/* ---------- Le Témoin ---------- */
.voices-log { display: grid; gap: 6px; margin: 0 0 14px; padding: 14px 16px; border: 1px solid rgba(199, 125, 255, .3); background: rgba(20, 8, 30, .5); font-family: var(--font-ui); font-size: .86rem; line-height: 1.5; color: #d8cde6; }
.voices-log p { margin: 0; }
.voices-log span { color: var(--witness); font-weight: 800; }
.voices-log .dissent { color: #fff1d0; }
.voices-log .dissent span { color: var(--home); }
.rubicon { padding: clamp(22px, 3vw, 34px); border: 1px solid rgba(199, 125, 255, .35); background: linear-gradient(180deg, rgba(40, 14, 52, .55), var(--panel-solid)); }
.rubicon header h3 { margin: 4px 0 10px; font-size: clamp(1.4rem, 2.6vw, 1.9rem); font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.rubicon header > p:not(.tag) { max-width: 760px; margin: 0 0 22px; font-size: .92rem; line-height: 1.6; color: var(--muted); }
.rubicon-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.rubicon-cols blockquote { margin: 0; padding: 16px 18px; border-left: 2px solid var(--witness); background: rgba(6, 6, 14, .45); }
.rubicon-cols p { margin: 0 0 10px; font-family: var(--font-lore); font-style: italic; font-size: 1.04rem; line-height: 1.42; color: #e7e0f0; }
.rubicon-cols .rb-title { font-family: var(--font-ui); font-style: normal; font-size: .64rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--witness-hi); }
.last-words { padding: clamp(28px, 5vw, 56px) 16px; text-align: center; }
.last-line { margin: 10px 0 14px; font-family: var(--font-lore); font-style: italic; font-size: clamp(1.7rem, 4vw, 2.8rem); line-height: 1.2; color: #f1eaf7; }
.je { display: inline; padding: 0 .06em; border: 0; border-bottom: 1px dashed transparent; background: none; font: inherit; color: inherit; cursor: pointer; transition: color .5s, text-shadow .5s, border-color .5s; }
.je:hover, .je:focus-visible { border-bottom-color: rgba(255, 255, 255, .35); }
.je.is-found { color: #fff; text-shadow: 0 0 18px rgba(255, 255, 255, .8), 0 0 40px rgba(244, 234, 208, .6); }
.last-note { max-width: 620px; margin: 0 auto; font-size: .86rem; line-height: 1.6; color: var(--muted); }

/* ---------- Les visions ---------- */
.visions-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.vision { position: relative; padding: 18px 16px 16px; border: 1px solid rgba(207, 226, 255, .18); background: radial-gradient(circle at 50% 0%, rgba(207, 226, 255, .1), transparent 60%), var(--panel-solid); }
.vision::before { content: ''; position: absolute; top: 14px; right: 14px; width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle, #fff, rgba(207, 226, 255, .3) 60%, transparent); box-shadow: 0 0 12px rgba(207, 226, 255, .8); }
.vision-n { margin: 0; font-size: .62rem; font-weight: 800; letter-spacing: .22em; color: var(--traveler); }
.vision h3 { margin: 4px 0 8px; font-size: .98rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.vision p:not(.vision-n) { margin: 0; font-family: var(--font-lore); font-style: italic; font-size: 1rem; line-height: 1.38; color: #dfe6f1; }
.ergo-lore { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.3fr); border: 1px solid rgba(207, 226, 255, .3); background: var(--panel-solid); }
.ergo-lore figure { position: relative; min-height: 360px; margin: 0; overflow: hidden; }
.ergo-lore figure > a { position: absolute; inset: 0; }
.ergo-lore figure img { width: 100%; height: 100%; object-fit: cover; }
.ergo-lore figcaption { position: absolute; left: 0; bottom: 0; padding: 6px 12px; background: rgba(6, 8, 16, .78); font-size: .6rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.ergo-text { padding: clamp(22px, 3vw, 36px); }
.ergo-text h3 { margin: 4px 0 14px; font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.ergo-text > p:not(.tag):not(.duo-note) { margin: 0 0 12px; font-family: var(--font-lore); font-size: 1.08rem; line-height: 1.5; color: #e6ebf3; }
.ergo-text .ergo-last { font-style: italic; color: var(--traveler-hi) !important; }

/* ---------- Le raid : Euphonie et armurerie ---------- */
.secrets-raid { display: grid; gap: 18px; }
.armory { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.armory .item-card { margin: 0; }
.item-card.legendary .item-head { background: linear-gradient(90deg, #5a3d7a, #43305e); }
.armory .item-flavor { font-size: .96rem; }
.armory .item-flavor span { display: block; margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .08); font-family: var(--font-ui); font-style: normal; font-size: .8rem; line-height: 1.55; color: var(--muted); }
.armory.exotics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.item-shot { position: relative; margin: 0; aspect-ratio: 16 / 8; overflow: hidden; background: #0c0d16; }
.item-shot > a { display: block; height: 100%; }
.item-shot img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Les socles de Khvostov (js/rituals.js) ---------- */
.pedestals { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr); border: 1px solid color-mix(in srgb, var(--traveler) 35%, transparent); background: var(--panel-solid); }
.pedestals-photo { position: relative; min-height: 260px; margin: 0; overflow: hidden; }
.pedestals-photo > a { position: absolute; inset: 0; }
.pedestals-photo img { width: 100%; height: 100%; object-fit: cover; }
.pedestals-body { padding: clamp(20px, 3vw, 30px); }
.pedestals-body h3 { margin: 4px 0 10px; font-size: 1.35rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.pedestals-body > p:not(.tag) { margin: 0 0 12px; font-size: .9rem; line-height: 1.6; color: var(--muted); }
.pedestal-row { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px; margin: 6px 0 12px; }
.pedestal { position: relative; height: 46px; border-bottom: 6px solid #3a3f52; }
.pedestal::before { content: ''; position: absolute; left: 50%; top: 4px; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%; border: 1px dashed rgba(207, 226, 255, .3); }
.pedestal.is-lit::before { border: 0; background: radial-gradient(circle, #fff, rgba(207, 226, 255, .6) 50%, transparent 72%); box-shadow: 0 0 16px rgba(207, 226, 255, .9); }
.pedestal.is-lit { border-bottom-color: #c9d8f0; }
.pedestal-state { min-height: 3em; font-family: var(--font-lore); font-style: italic; font-size: 1.05rem !important; color: var(--traveler-hi) !important; }
.pedestals.is-open { border-color: #ffd36e; box-shadow: 0 0 30px rgba(255, 211, 110, .18); }

/* ---------- Les souvenirs (js/rituals.js) ---------- */
.memories { padding: clamp(20px, 3vw, 30px); border: 1px solid rgba(240, 180, 106, .3); background: linear-gradient(180deg, rgba(30, 18, 10, .55), var(--panel-solid)); }
.memories header h3 { margin: 4px 0 8px; font-size: 1.35rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.memories header p:not(.tag) { margin: 0 0 16px; font-size: .9rem; line-height: 1.6; color: var(--muted); }
.memory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.memory { display: grid; grid-template-columns: 26px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); background: rgba(6, 6, 14, .5); color: var(--pearl); text-align: left; cursor: pointer; transition: border-color .3s, background .3s; }
.memory:hover, .memory:focus-visible { border-color: rgba(240, 180, 106, .6); }
.memory-statue { grid-row: 1 / 3; width: 26px; height: 34px; border-radius: 13px 13px 3px 3px; background: linear-gradient(180deg, #1c1a24, #0c0b12); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
.memory-title { font-size: .78rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.memory-who { font-size: .7rem; color: var(--muted); }
.memory.is-playing { border-color: var(--home); background: rgba(240, 180, 106, .08); }
.memory.is-heard .memory-statue { background: radial-gradient(circle at 50% 35%, #fff4dc, #f0b46a 55%, #8a5a2a); box-shadow: 0 0 12px rgba(240, 180, 106, .5); }
.memory-play:not(:empty) { margin-top: 16px; padding: 14px 16px; border-left: 3px solid var(--home); background: rgba(240, 180, 106, .06); }
.memory-head { margin: 0 0 8px; font-size: .66rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--home-hi); }
.memory-lines { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.memory-lines li { font-family: var(--font-lore); font-size: 1.05rem; line-height: 1.4; color: #ece4d6; animation: memory-in .6s ease both; }
.memory-lines b { font-family: var(--font-ui); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--home); }
@keyframes memory-in { from { opacity: 0; transform: translateY(4px); } }

/* ---------- Textes de légende ---------- */
.lore-books { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.lore-card { border: 1px solid var(--line); background: var(--panel-solid); }
.lore-card .item-head { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: linear-gradient(90deg, rgba(207, 226, 255, .1), transparent); }
.lore-card .item-head img { flex: none; border: 1px solid rgba(255, 255, 255, .2); }
.lore-card .item-name { margin: 0; font-size: .92rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.lore-card .item-type { margin: 2px 0 0; font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.lore-flavor { margin: 0; padding: 12px 16px 0; font-family: var(--font-lore); font-style: italic; font-size: 1.04rem; line-height: 1.4; color: #e9e3d6; }
.lore-card details { padding: 10px 16px 16px; }
.lore-card summary { cursor: pointer; font-size: .66rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--page-accent-hi); }
.lore-card details[open] summary { margin-bottom: 10px; }
.lore-card details p { margin: 0 0 10px; font-family: var(--font-lore); font-size: 1.02rem; line-height: 1.5; color: #e2dccd; }
.lore-card .lore-data { font-family: var(--font-ui); font-size: .72rem; letter-spacing: .04em; color: var(--muted); }

/* ---------- Divers ---------- */
.game-foot { margin: 10px 0 0; font-size: .72rem; font-style: italic; color: var(--muted); }
.act-vision { margin-top: 6px; }

/* ---------- Plan (brique commune : css/components/depths.css) ---------- */
.coeur .depths { aspect-ratio: 10 / 12; }
.stratum--dehors { background: linear-gradient(180deg, #120e1c, #181226); }
.stratum--coeur { background: linear-gradient(180deg, #1c1d22 0%, #1a2018 55%, #141a14 100%); }
.stratum--profondeurs { background: linear-gradient(180deg, #0e1a1a 0%, #0c1416 60%, #0a1012 100%); }
.stratum--monolithe { background: linear-gradient(180deg, #1c0c16 0%, #160a14 60%, #0e060c 100%); }
.wound { fill: rgba(255, 143, 177, .2); stroke: rgba(255, 190, 220, .6); stroke-width: .5; }
.monolith-shape { fill: rgba(255, 143, 177, .06); stroke: rgba(255, 143, 177, .35); stroke-width: .5; }
.pale-line { fill: none; stroke: rgba(244, 234, 208, .3); stroke-width: 1; stroke-dasharray: 3 3; }
.way-line { stroke: rgba(231, 235, 245, .3); }
.way-line--rift { stroke: rgba(255, 190, 220, .85); stroke-dasharray: 1 5; stroke-linecap: round; }
.room-node--zone { color: #fffaf0; }
.room-node--far { color: #ffc0d8; }
.room-node--region { color: var(--pale); }
.room-node--memory { color: var(--memory); }
.room-node--deep { color: var(--deep); }
.room-node--witness { color: var(--witness); }
.room-node--raid { color: var(--edge); }
.room-node--end { color: #ffffff; }
.coeur .room-label { text-shadow: 0 1px 6px rgba(0, 0, 0, .95), 0 0 2px rgba(0, 0, 0, .9); }

/* ---------- Pastilles ---------- */
.coeur .spot[hidden] { display: none; }
.spot[data-secret="visions"] { color: #ffffff; border-color: rgba(207, 226, 255, .95); box-shadow: 0 0 16px rgba(207, 226, 255, .7); }
.spot[data-secret="clins"] { color: #fff4dc; border-color: rgba(244, 234, 208, .85); }
.spot[data-secret="coffres"] { color: #ffe9b8; border-color: rgba(240, 180, 106, .95); }
.spot[data-secret="plumes"] { color: #fdf7ff; border-color: rgba(229, 140, 255, .95); box-shadow: 0 0 14px rgba(229, 140, 255, .5); }

@media (max-width: 1200px) {
  .visions-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1020px) {
  .duo, .lanterns-box, .ergo-lore, .pedestals { grid-template-columns: minmax(0, 1fr); }
  .duo-photo { min-height: 0; aspect-ratio: 16 / 10; }
  .ergo-lore figure { min-height: 0; aspect-ratio: 16 / 10; }
  .pedestals-photo { min-height: 0; aspect-ratio: 16 / 9; }
  .raid-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .raid-step--last { grid-template-columns: minmax(0, 1fr); }
  .testimonies, .rubicon-cols, .lore-books { grid-template-columns: minmax(0, 1fr); }
  .armory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .memory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .coeur .depths { aspect-ratio: 10 / 17; }
  .raid-steps, .armory, .armory.exotics, .memory-grid { grid-template-columns: minmax(0, 1fr); }
  .visions-grid { grid-template-columns: minmax(0, 1fr); }
  .pedestal-row { gap: 4px; }
  .lantern-name { font-size: .5rem; letter-spacing: .04em; }
  .lanterns-sky { min-height: 260px; }
}
@media (prefers-reduced-motion: reduce) {
  .light-rule::after, .lantern.is-lit .lantern-body, .lantern.is-rising .lantern-body { animation: none; }
}
/* six étapes : trois par rangée plutôt que quatre puis deux */
@media (min-width: 1021px) { .coeur .zavala-steps, .coeur .witness-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }