/* Monde du trône de Savathûn — ton de la page : le vert lucent et l'or pâle de la Couvée, le vert sombre
   des marais, le noir des Profondeurs de Principe, le rouge de la Pyramide de Rhulk. Ambiance par section
   (data-mood sur <body> : lucent, swamp, witch, deep, pyramid, voir js/rituals.js). Souvenance
   (body.is-deepsight) : voile vert, bourreaux visibles, murmures démasquables. Cartes, plongée, murmures,
   Tableau des preuves, quête du ver, couleurs du plan et pastilles. Les mini-jeux sont dans css/games.css. */

.trone {
  --lucent: #b9ff98;
  --lucent-hi: #e8ffd9;
  --moss: #8fd38a;
  --altar: #7ad4ff;
  --witch: #e3c97a;
  --witch-hi: #fff0c4;
  --deep: #a28dff;
  --deep-hi: #e2dbff;
  --rhulk: #ff7a5c;
  --rhulk-hi: #ffd2c4;
  --page-accent: var(--lucent);
  --page-accent-hi: var(--lucent-hi);
}
.trone[data-mood="swamp"] { --page-accent: var(--moss); --page-accent-hi: #dff5d6; }
.trone[data-mood="witch"] { --page-accent: var(--witch); --page-accent-hi: var(--witch-hi); }
.trone[data-mood="deep"] { --page-accent: var(--deep); --page-accent-hi: var(--deep-hi); }
.trone[data-mood="pyramid"] { --page-accent: var(--rhulk); --page-accent-hi: var(--rhulk-hi); }
.trone .kicker, .trone .tag { transition: color .6s; }
.trone .kicker { color: var(--page-accent); }
.trone .sec-head .tag, .trone .quarter .tag, .trone .duo .tag, .trone .mission-step .tag { color: var(--page-accent); }
.trone .regions li::before { background: var(--page-accent); }
.trone .footer-crest, .trone .brand svg { color: var(--lucent); }
.trone main { background: radial-gradient(ellipse 70% 14% at 82% 3%, rgba(185, 255, 152, .07), transparent 70%), radial-gradient(ellipse 55% 12% at 8% 30%, rgba(227, 201, 122, .05), transparent 70%); }
@media (min-width: 1021px) { .trone .nav-menu a { padding: 8px 7px; letter-spacing: .08em; font-size: .7rem; white-space: nowrap; } }
@media (min-width: 1021px) and (max-width: 1440px) { .trone .brand span { display: none; } }

/* ---------- Héros ---------- */
.trone .hero-status { display: grid; grid-template-columns: auto auto; column-gap: 18px; row-gap: 0; }
.trone .hero-status .status-label { grid-row: 1; }
.trone .hero-status .status-value { grid-row: 2; }
.trone .hero-content .actions { flex-wrap: wrap; }
.trone .hero-title { font-size: clamp(2.6rem, 6.2vw, 5.6rem); }
.trone .hero-title span:last-child { margin-top: .18em; font-size: .36em; font-weight: 500; letter-spacing: .3em; color: var(--page-accent-hi); }
body.is-deepsight [data-souvenance-hud] { color: var(--lucent); }

/* ---------- Petits éléments ---------- */
.tr { display: block; margin-top: 6px; font-family: var(--font-ui); font-style: normal; font-size: .68rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.quarter-body .tr, .sec-sub .tr, .duo-body .tr, .duo-note .tr, .mission-step .tr, .dive-step .tr, .game-head .tr { display: inline; margin: 0 0 0 6px; }
.words-note { margin: 14px 0 0; font-size: .76rem; font-style: italic; line-height: 1.55; color: var(--muted); }
.sub-title { margin: clamp(34px, 5vw, 54px) 0 16px; font-size: .8rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--page-accent-hi); }
.trone .atlas-photo > a { position: absolute; inset: 0; }
.trone .quarter-photo > a { display: block; height: 100%; }
.trone .quarter-photo > a > img { width: 100%; height: 100%; object-fit: cover; }
.trone .quarter { transition: box-shadow .4s, border-color .4s; }
.trone .quarter:hover { border-color: color-mix(in srgb, var(--page-accent) 55%, transparent); box-shadow: 0 0 26px color-mix(in srgb, var(--page-accent) 14%, transparent); }
.trone .quarters + .duo, .trone .words-note + .duo, .trone .duo + .duo, .trone .duo + .fynch-case, .trone .mission-steps + .duo, .trone .duo + .board,
.trone .lie-cards + .game, .trone .game + .armory, .trone .duo + .whispers-wrap, .trone .words-note + .game, .trone .raid + .quarters, .trone .quarters + .duo,
.trone .duo + .glyph-board, .trone .worm-quest + .duo, .trone .duo + .quarters, .trone .dive + .sub-title { margin-top: clamp(30px, 4vw, 44px); }
.trone .lead-quote { margin-top: 0; }
@media (min-width: 1021px) { .quarters--three { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---------- Deux colonnes : une image 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--flip { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.duo--flip .duo-photo { order: 2; }
.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% 35%; }
.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, 10, 22, .82); font-size: .62rem; 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.5rem, 2.8vw, 2.1rem); 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); }
.duo-actions { margin: 18px 0 0 !important; }
.duo-actions .d-btn svg, .whispers-head .d-btn svg { width: 16px; height: 16px; }
.trone .d-btn:disabled { opacity: .5; cursor: default; }
.lore-lines { display: grid; gap: 10px; 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.1rem; line-height: 1.4; color: #eef3e6; }
.lore-lines small { display: block; margin-top: 2px; font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--page-accent-hi); }
.duo--ritual .duo-photo img { object-position: 50% 60%; }

/* ---------- La grotte de Fynch ---------- */
.fynch-case { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.3fr); border: 1px solid rgba(185, 255, 152, .25); background: radial-gradient(circle at 100% 0%, rgba(185, 255, 152, .07), transparent 55%), var(--panel-solid); }
.fynch-photo { position: relative; min-height: 300px; margin: 0; overflow: hidden; }
.fynch-photo > a { position: absolute; inset: 0; }
.fynch-photo img { width: 100%; height: 100%; object-fit: cover; }
.fynch-body { padding: clamp(20px, 3vw, 32px); }
.fynch-body h3 { margin: 4px 0 12px; font-size: 1.5rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.fynch-body > p:not(.tag) { margin: 0 0 16px; font-size: .92rem; line-height: 1.65; color: var(--muted); }
.moth-case { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 8px; max-width: 520px; padding: 12px; border: 1px solid var(--line); background: #050a07; }
.moth-case i { aspect-ratio: 1; border: 1px dashed rgba(185, 255, 152, .25); border-radius: 50%; transition: background .6s, box-shadow .6s, border-color .6s; }
.moth-case i.is-lit { border: 1px solid var(--lucent); background: radial-gradient(circle, #f3ffe8 0 18%, var(--lucent) 30%, transparent 72%); box-shadow: 0 0 14px rgba(185, 255, 152, .6); }
.moth-count { margin: 10px 0 0 !important; font-size: .78rem !important; color: var(--muted); }
.moth-count b { color: var(--lucent-hi); font-variant-numeric: tabular-nums; }

/* ---------- Esquisses ---------- */
.sketches { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sketch { position: relative; margin: 0; aspect-ratio: 16 / 10; overflow: hidden; border: 1px solid var(--line); }
.sketch > a { display: block; height: 100%; }
.sketch img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.sketch:hover img { transform: scale(1.04); }
.sketch figcaption { position: absolute; left: 0; bottom: 0; padding: 4px 10px; background: rgba(6, 10, 22, .85); font-size: .6rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }

/* ---------- Le périple ---------- */
.mission-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.mission-step { position: relative; display: flex; flex-direction: column; border: 1px solid var(--line); background: var(--panel-solid); transition: border-color .3s, box-shadow .3s; }
.mission-step:hover { border-color: color-mix(in srgb, var(--page-accent) 60%, transparent); box-shadow: 0 0 24px color-mix(in srgb, var(--page-accent) 16%, transparent); }
.mission-step figure { position: relative; margin: 0; aspect-ratio: 16 / 9; overflow: hidden; }
.mission-step figure > a { display: block; height: 100%; }
.mission-step figure img { width: 100%; height: 100%; object-fit: cover; }
.mission-step > div { padding: 14px 16px 18px; }
.mission-step h3 { margin: 4px 0 8px; font-size: 1.02rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: var(--pearl); }
.mission-step p:not(.tag) { margin: 0; font-size: .85rem; line-height: 1.58; color: var(--muted); }
.room-hint { margin: 12px 0 0; font-size: .78rem; font-style: italic; color: var(--muted); }

/* Le Tableau des preuves */
.board { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: 0 26px; padding: clamp(18px, 3vw, 28px); border: 1px solid rgba(227, 201, 122, .35); background: linear-gradient(180deg, rgba(62, 48, 18, .22), var(--panel-solid)); }
.board-photo { grid-row: span 3; position: relative; margin: 0; min-height: 240px; overflow: hidden; border: 1px solid var(--line); }
.board-photo > a { position: absolute; inset: 0; }
.board-photo img { width: 100%; height: 100%; object-fit: cover; }
.board-photo figcaption { position: absolute; left: 0; bottom: 0; padding: 4px 10px; background: rgba(6, 10, 22, .85); font-size: .6rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.board h3 { margin: 4px 0 10px; font-size: 1.4rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.board header p:not(.tag) { margin: 0 0 14px; font-size: .9rem; line-height: 1.6; color: var(--muted); }
.board-pins { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.board-pins li { position: relative; padding: 10px 12px 10px 26px; border: 1px solid rgba(227, 201, 122, .2); background: rgba(10, 14, 10, .7); font-size: .8rem; line-height: 1.5; color: var(--muted); }
.board-pins li::before { content: ''; position: absolute; left: 10px; top: 14px; width: 8px; height: 8px; border-radius: 50%; background: var(--witch); box-shadow: 0 0 8px rgba(227, 201, 122, .7); }
.board-pins b { display: block; margin-bottom: 2px; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--witch-hi); }
.board-pins .pin-final { grid-column: 1 / -1; border-color: rgba(206, 174, 51, .55); }
.board-pins .pin-final::before { background: var(--exotic); }
.board-score { margin: 14px 0 0; font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.board-score b { color: var(--witch-hi); font-variant-numeric: tabular-nums; }

/* ---------- Les mensonges : cartes à retourner ---------- */
.lies-sec { background: radial-gradient(ellipse 60% 24% at 80% 6%, rgba(227, 201, 122, .07), transparent 70%); }
.lie-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.lie-card { position: relative; display: block; width: 100%; height: 100%; min-height: 330px; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; perspective: 1200px; }
.lie-face { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 16px; overflow: hidden; border: 1px solid var(--line); background: var(--panel-solid); backface-visibility: hidden; transition: transform .7s var(--ease), border-color .3s; }
.lie-front img.photo { margin: -14px -16px 6px; width: calc(100% + 32px); height: 140px; object-fit: cover; }
.lie-card--text .lie-front img { border: 1px solid rgba(255, 255, 255, .2); margin-bottom: 4px; }
.lie-back { transform: rotateY(180deg); border-color: rgba(227, 201, 122, .55); background: radial-gradient(circle at 50% 0%, rgba(227, 201, 122, .12), transparent 60%), #0f1309; }
.lie-card.is-flipped .lie-front { transform: rotateY(-180deg); }
.lie-card.is-flipped .lie-back { transform: rotateY(0); }
.lie-card:hover .lie-face, .lie-card:focus-visible .lie-face { border-color: color-mix(in srgb, var(--page-accent) 60%, transparent); }
.lie-label { font-size: .6rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--faint); }
.lie-back .lie-label { color: var(--witch); }
.lie-face b { font-size: 1.05rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: var(--pearl); }
.lie-face > span:last-child { font-size: .84rem; line-height: 1.55; color: var(--muted); }
.lie-back > span:last-child { color: #ece3c8; }
.armory { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.armory .item-card { margin: 0; }
.armory .item-flavor span, .worm-prize .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); }
.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 trois sœurs ---------- */
.sisters-sec { background: linear-gradient(180deg, transparent, rgba(8, 6, 20, .6) 40%, rgba(4, 3, 10, .85)); }
.sisters { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 2fr); gap: 18px; align-items: stretch; }
.sisters-art { position: relative; margin: 0; min-height: 420px; overflow: hidden; border: 1px solid var(--line); background: #f2f2f2; }
.sisters-art > a { position: absolute; inset: 0; }
.sisters-art img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.sisters-art figcaption { position: absolute; left: 0; bottom: 0; padding: 4px 10px; background: rgba(6, 10, 22, .85); font-size: .6rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.sister-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.sister { display: flex; flex-direction: column; padding: 18px; border: 1px solid var(--line); border-top: 3px solid var(--accent); background: var(--panel-solid); }
.sister .tag { color: var(--accent) !important; }
.sister h3 { margin: 4px 0 10px; font-family: var(--font-lore); font-size: 2rem; font-weight: 600; color: var(--pearl); }
.sister p:not(.tag) { margin: 0 0 12px; font-size: .86rem; line-height: 1.6; color: var(--muted); }
.sister .sister-to { margin: auto 0 0 !important; padding-top: 10px; border-top: 1px solid var(--line); font-size: .74rem !important; letter-spacing: .08em; text-transform: uppercase; }
.sister-to b { color: var(--accent); }

/* La plongée : chaque étape un peu plus sombre */
.dive { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: dive; }
.dive-step { --shade: calc(var(--depth) / 7); position: relative; display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 20px; padding: 18px 22px; border-left: 2px solid color-mix(in srgb, var(--deep) calc(30% + var(--depth) * 10%), transparent);
  background: linear-gradient(90deg, rgba(20, 40, 50, calc(.5 - var(--shade) * .45)), rgba(4, 3, 12, calc(.2 + var(--shade) * .7))); }
.dive-step + .dive-step { border-top: 1px solid rgba(255, 255, 255, .04); }
.dive-mark { align-self: start; padding-top: 4px; font-size: .64rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: color-mix(in srgb, var(--deep-hi) calc(100% - var(--depth) * 6%), #555); }
.dive-mark::before { content: ''; display: block; width: 10px; height: 10px; margin-bottom: 8px; border-radius: 50%; background: var(--deep); box-shadow: 0 0 12px var(--deep); opacity: calc(1 - var(--shade) * .6); }
.dive-step h3 { margin: 0 0 6px; font-size: 1.05rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: var(--pearl); }
.dive-step p { margin: 0; font-size: .9rem; line-height: 1.65; color: color-mix(in srgb, var(--muted) calc(100% - var(--depth) * 4%), #6d6a80); }

/* Les murmures */
.whispers-wrap { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 2fr); gap: 18px; padding: clamp(18px, 3vw, 26px); border: 1px solid rgba(162, 141, 255, .3); background: rgba(8, 6, 20, .8); }
.whispers-head p:not(.panel-title) { margin: 0 0 14px; font-size: .88rem; line-height: 1.6; color: var(--muted); }
.whispers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.whisper { position: relative; display: block; width: 100%; height: 100%; min-height: 150px; padding: 14px 16px; border: 1px solid rgba(162, 141, 255, .25); background: #0b0918; color: inherit; font: inherit; text-align: left; cursor: pointer; overflow: hidden; transition: border-color .4s, box-shadow .4s; }
.whisper q { quotes: '« ' ' »'; display: block; font-family: var(--font-lore); font-style: italic; font-size: 1.08rem; line-height: 1.38; color: #e6e1f5; }
.whisper small { display: block; margin-top: 8px; font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--deep-hi); }
.whisper-true { display: none; }
.whisper.is-revealed { border-color: rgba(185, 255, 152, .6); box-shadow: 0 0 22px rgba(185, 255, 152, .12); background: #08120c; }
.whisper.is-revealed .whisper-said { display: block; opacity: .45; }
.whisper.is-revealed .whisper-said q { text-decoration: line-through; text-decoration-color: rgba(185, 255, 152, .5); }
.whisper.is-revealed .whisper-true { display: block; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(185, 255, 152, .3); }
.whisper.is-revealed .whisper-true q { color: #f1ffe8; font-style: normal; }
.whisper.is-revealed .whisper-true small { color: var(--lucent); }
body.is-deepsight .whisper:not(.is-revealed) { border-color: rgba(185, 255, 152, .55); animation: whisper-pulse 1.8s ease-in-out infinite; }
@keyframes whisper-pulse { 50% { box-shadow: 0 0 22px rgba(185, 255, 152, .35); } }

/* ---------- Les Autels du reflet ---------- */
.altars-sec { background: radial-gradient(ellipse 60% 26% at 20% 6%, rgba(122, 212, 255, .06), transparent 70%), radial-gradient(ellipse 50% 22% at 90% 60%, rgba(185, 255, 152, .05), transparent 70%); }
.altar-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.altar-card { display: flex; flex-direction: column; border: 1px solid rgba(122, 212, 255, .2); background: var(--panel-solid); }
.altar-card figure { margin: 0; aspect-ratio: 16 / 9; overflow: hidden; }
.altar-card figure > a { display: block; height: 100%; }
.altar-card img { width: 100%; height: 100%; object-fit: cover; }
.altar-card > div { padding: 12px 14px 16px; }
.altar-card h3 { margin: 4px 0 6px; font-size: 1.05rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.altar-card p:not(.tag) { margin: 0; font-size: .82rem; line-height: 1.5; color: var(--muted); }

/* ---------- Le raid ---------- */
.raid-sec { background: radial-gradient(ellipse 60% 22% at 70% 4%, rgba(255, 122, 92, .06), transparent 70%); }
.trone .raid-img { position: relative; }
.glyph-board { position: relative; margin: 0; border: 1px solid var(--line); background: #e7e2d8; }
.glyph-board > a { display: block; }
.glyph-board img { display: block; width: 100%; max-height: 520px; object-fit: contain; }
.glyph-board figcaption { padding: 10px 14px; background: var(--panel-solid); font-size: .82rem; line-height: 1.5; color: var(--muted); }

/* Des reines et des vers */
.worm-quest { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.3fr) minmax(0, .9fr); border: 1px solid rgba(206, 174, 51, .35); background: linear-gradient(180deg, rgba(60, 48, 14, .2), var(--panel-solid)); }
.worm-photo { position: relative; margin: 0; min-height: 300px; overflow: hidden; }
.worm-photo > a { position: absolute; inset: 0; }
.worm-photo img { width: 100%; height: 100%; object-fit: cover; }
.worm-body { padding: clamp(18px, 3vw, 28px); }
.worm-body h3 { margin: 4px 0 10px; font-size: 1.35rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.worm-body > p:not(.tag) { margin: 0 0 12px; font-size: .88rem; line-height: 1.6; color: var(--muted); }
.worm-steps { display: grid; gap: 8px; margin: 0 0 14px; padding: 0; list-style: none; counter-reset: worm; }
.worm-step { position: relative; padding: 8px 10px 8px 34px; border: 1px solid var(--line); font-size: .8rem; line-height: 1.5; color: var(--faint); transition: color .4s, border-color .4s; counter-increment: worm; }
.worm-step::before { content: counter(worm); position: absolute; left: 10px; top: 8px; width: 16px; height: 16px; border-radius: 50%; border: 1px solid currentColor; font-size: .62rem; font-weight: 800; line-height: 15px; text-align: center; }
.worm-step b { display: block; color: inherit; font-weight: 600; }
.worm-step.is-current { color: var(--pearl); border-color: rgba(206, 174, 51, .6); }
.worm-step.is-done { color: var(--muted); }
.worm-step.is-done::before { content: '✓'; color: var(--exotic); border-color: var(--exotic); }
.worm-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0; }
.worm-note { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--exotic); }
.worm-prize { margin: 0; border-left: 1px solid var(--line); }
.worm-prize .item-shot { filter: grayscale(.85) brightness(.6); transition: filter 1s; }
body.has-parasite .worm-prize .item-shot { filter: none; }

/* ---------- Personnages, secrets, légendes ---------- */
.voices--eight { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.secrets-sec { background: radial-gradient(ellipse 60% 45% at 30% 30%, color-mix(in srgb, var(--page-accent) 6%, transparent), transparent 70%); }
.trone .secrets-layout .games { gap: 24px; }
.collect-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.collect-card { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 14px; padding: 16px; border: 1px solid var(--line); background: var(--panel-solid); }
.collect-card img { border: 1px solid rgba(255, 255, 255, .2); }
.collect-card h3 { margin: 2px 0 6px; font-size: 1rem; font-weight: 800; text-transform: uppercase; color: var(--pearl); }
.collect-card p:not(.tag) { margin: 0; font-size: .84rem; line-height: 1.55; color: var(--muted); }
.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--wide { grid-column: span 2; border-color: rgba(185, 255, 152, .3); }
.lore-card .item-head { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: linear-gradient(90deg, rgba(162, 141, 255, .14), 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: .06em; 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.06rem; line-height: 1.42; color: #eef3e6; }
.lore-card details { padding: 10px 16px 16px; }
.lore-card summary { cursor: pointer; font-size: .66rem; font-weight: 700; letter-spacing: .14em; 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.04rem; line-height: 1.5; color: #e4e6dc; }
.game-foot { margin: 10px 0 0; font-size: .72rem; font-style: italic; color: var(--muted); }
.game > .game-foot { margin: -8px 0 0; padding: 0 24px 18px; }
.trone .game { border-color: color-mix(in srgb, var(--page-accent) 30%, var(--line)); box-shadow: 0 0 40px color-mix(in srgb, var(--page-accent) 7%, transparent); }
.trone .game-hud .hud-count { color: var(--page-accent-hi); }
.trone .event-img > a { display: block; height: 100%; }
.item-card--legendary .item-head { background: linear-gradient(90deg, #5a3270, #3c2050); }

/* ---------- Plan (brique commune : css/components/depths.css) ---------- */
.trone .depths { aspect-ratio: 10 / 11; background: #040806; }
.stratum--forteresse { background: linear-gradient(180deg, #14201a 0%, #101a15 100%); }
.stratum--monde { background: linear-gradient(180deg, #0e1a12 0%, #0c160f 70%, #0b140e 100%); }
.stratum--sous { background: linear-gradient(180deg, #0b0f12 0%, #090b10 100%); }
.stratum--pyramide { background: radial-gradient(ellipse 60% 70% at 50% 60%, #1a0d0a, #070404 80%); }
.swamp { fill: none; stroke: rgba(143, 211, 138, .25); stroke-width: 1; stroke-dasharray: 6 5; }
.seal-line { stroke: rgba(255, 122, 92, .55); stroke-width: 1; stroke-dasharray: 2 3; }
.pyramid-mark { fill: rgba(255, 122, 92, .08); stroke: rgba(255, 122, 92, .4); stroke-width: .3; }
.way-line { stroke: rgba(230, 240, 220, .28); }
.way-line--portail { stroke: rgba(122, 212, 255, .7); stroke-dasharray: 1 3; stroke-linecap: round; }
.way-line--raid { stroke: rgba(255, 122, 92, .7); stroke-dasharray: 4 3; }
.way-line--rayon { stroke: rgba(185, 255, 152, .8); stroke-dasharray: 2 2; }
.room-node--zone { color: #f3f8e4; }
.room-node--court { color: var(--lucent); }
.room-node--region { color: var(--moss); }
.room-node--temple { color: var(--gold); }
.room-node--lost { color: #ff9bd2; }
.room-node--altar { color: var(--altar); }
.room-node--season { color: var(--witch); }
.room-node--raid { color: var(--rhulk); }
.trone .room-label { text-shadow: 0 1px 6px rgba(0, 0, 0, .95), 0 0 2px rgba(0, 0, 0, .9); }
.trone .depths-count b { color: var(--lucent-hi); }

/* ---------- Pastilles ---------- */
.spot[data-secret="coffres"] { color: #fff8ea; border-color: rgba(241, 219, 164, .9); }
.spot[data-secret="mites"] { color: #f3ffe8; border-color: rgba(185, 255, 152, .95); box-shadow: 0 0 12px rgba(185, 255, 152, .45); }
.spot[data-secret="failles"] { color: #e9fff0; border-color: rgba(120, 255, 170, .8); }
body:not(.has-parasite) .spot[data-secret="failles"]:not(.found) { opacity: .65; }
.spot[data-secret="indices"] { color: #fff6d6; border-color: rgba(227, 201, 122, .95); }
.spot[data-secret="pyramide"] { color: #fff0ea; border-color: rgba(255, 122, 92, .95); box-shadow: 0 0 12px rgba(255, 122, 92, .45); }
.trone .spot.found { background: var(--pearl); border-color: var(--pearl); color: var(--night); }
.trone p > .spot--inline { width: 26px; height: 26px; margin: 0 0 0 6px; vertical-align: -7px; }
.trone p > .spot--inline svg { width: 14px; height: 14px; }
/* Les bourreaux : seulement à la Souvenance */
.spot--deep { display: none; color: #f3ffe8; border-color: var(--lucent); animation: deep-pulse 2.2s ease-in-out infinite; }
body.is-deepsight .spot--deep, .spot--deep.found { display: grid; }
@keyframes deep-pulse { 50% { box-shadow: 0 0 24px rgba(185, 255, 152, .9); } }

/* ---------- La Souvenance ---------- */
.deep-veil { position: fixed; inset: 0; z-index: 44; pointer-events: none; opacity: 0; transition: opacity 1s ease;
  background: radial-gradient(ellipse 120% 90% at 50% 50%, transparent 45%, rgba(20, 60, 24, .6) 100%), linear-gradient(180deg, rgba(185, 255, 152, .05), rgba(80, 160, 90, .06)); mix-blend-mode: screen; }
body.is-deepsight .deep-veil { opacity: 1; }
body.is-deepsight .photo { filter: var(--photo-filter) saturate(.55) sepia(.25) hue-rotate(50deg) brightness(1.05); }
.souvenance-badge { position: fixed; left: 50%; bottom: 18px; z-index: 60; display: flex; align-items: center; gap: 8px; margin: 0; padding: 8px 16px; transform: translateX(-50%); border: 1px solid var(--lucent); background: rgba(6, 16, 8, .92); box-shadow: 0 0 24px rgba(185, 255, 152, .35); font-size: .7rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--lucent-hi); }
.souvenance-badge svg { width: 16px; height: 16px; color: var(--lucent); }
.souvenance-badge b { min-width: 3.2em; font-variant-numeric: tabular-nums; color: #fff; }
.souvenance-badge[hidden] { display: none; }

@media (max-width: 1200px) {
  .mission-steps, .lie-cards, .altar-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voices--eight { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .worm-quest { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); }
  .worm-prize { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--line); }
  .sisters { grid-template-columns: minmax(0, 1fr); }
  .sisters-art { min-height: 0; aspect-ratio: 4 / 3; }
}
@media (max-width: 1020px) {
  .duo, .duo--flip, .fynch-case, .board, .whispers-wrap, .worm-quest { grid-template-columns: minmax(0, 1fr); }
  .duo--flip .duo-photo { order: 0; }
  .duo-photo, .fynch-photo, .worm-photo { min-height: 0; aspect-ratio: 16 / 10; }
  .board-photo { grid-row: auto; aspect-ratio: 16 / 9; min-height: 0; margin-bottom: 14px; }
  .lore-books { grid-template-columns: minmax(0, 1fr); }
  .lore-card--wide { grid-column: auto; }
  .sketches { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sister-cards { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 680px) {
  .trone .depths { aspect-ratio: 10 / 16; }
  .mission-steps, .lie-cards, .armory, .collect-cards, .board-pins, .whispers { grid-template-columns: minmax(0, 1fr); }
  .altar-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .altar-card > div { padding: 10px 10px 12px; }
  .altar-card p:not(.tag) { font-size: .76rem; }
  .voices--eight { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .moth-case { gap: 4px; padding: 8px; }
  .dive-step { grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 14px 16px; }
  .dive-mark::before { display: inline-block; margin: 0 8px 0 0; vertical-align: middle; }
  .trone .hero-content { bottom: 150px; }
  .trone .hero-content .actions { gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .spot--deep, body.is-deepsight .whisper:not(.is-revealed) { animation: none; }
  .lie-face { transition: none; }
}
