/* Le bassin d'Hellas — ton de la page (glace de Mars, rouge orangé de l'Esprit tutélaire, vert
   de la Ruche), ambiance qui suit la section lue (attribut data-mood sur <body>, voir
   js/rituals.js), sélecteur d'arme, couleurs de la coupe et blocs propres à Raspoutine. */

.mars {
  --mind: #ff7a45;
  --mind-hi: #ffc09a;
  --ice: #9fd0e8;
  --ice-hi: #d8eef8;
  --hive: #c8e26b;
  --hive-hi: #e6f3b4;
  --page-accent: var(--mind);
  --page-accent-hi: var(--mind-hi);
}
.mars[data-mood="hive"] { --page-accent: var(--hive); --page-accent-hi: var(--hive-hi); }
.mars ::selection { background: rgba(255, 122, 69, .35); }
.mars .tag, .mars .kicker { transition: color .6s; }

/* ---------- Ambiance par section ---------- */
.mars main { transition: background 1s; }
.mars [data-mood="mind"] { background: radial-gradient(ellipse 60% 34% at 88% 8%, rgba(255, 122, 69, .09), transparent 70%); }
.mars [data-mood="hive"] { background: radial-gradient(ellipse 70% 30% at 12% 6%, rgba(200, 226, 107, .08), transparent 70%), radial-gradient(ellipse 60% 26% at 90% 70%, rgba(200, 226, 107, .05), transparent 70%); }
/* Xol passe sous la page */
.mars.quake main { animation: quake .9s cubic-bezier(.36, .07, .19, .97); }
@keyframes quake {
  10%, 90% { transform: translate(-1px, 1px); }
  20%, 80% { transform: translate(3px, -2px); }
  30%, 50%, 70% { transform: translate(-5px, 2px); }
  40%, 60% { transform: translate(5px, -1px); }
}

/* ---------- Héros ---------- */
.mars .hero-title span:last-child { margin-top: .18em; font-size: .36em; font-weight: 500; letter-spacing: .3em; color: var(--ice-hi); }
.mars .hero-status { border-left-color: var(--mind); }
/* un WARSAT traverse le ciel de temps en temps */
.warsat { position: absolute; left: 0; top: 0; z-index: 2; width: 180px; height: 2px; pointer-events: none; opacity: 0; transform-origin: 100% 50%; background: linear-gradient(90deg, transparent, rgba(255, 190, 150, .9) 80%, #fff); box-shadow: 0 0 12px rgba(255, 122, 69, .8); animation: warsat 13s linear 3s infinite; }
@keyframes warsat {
  0% { opacity: 0; transform: translate(62vw, -4vh) rotate(28deg); }
  2% { opacity: 1; }
  11% { opacity: 1; }
  13%, 100% { opacity: 0; transform: translate(96vw, 44vh) rotate(28deg); }
}
.sec-note { margin: 14px 0 0; font-size: .82rem; color: var(--muted); }
.sec-note b { color: var(--page-accent-hi); font-weight: 700; }

/* ---------- Sélecteur d'arme ---------- */
.loadout { position: fixed; left: 16px; bottom: 16px; z-index: 45; display: flex; align-items: center; gap: 4px; padding: 6px 8px; background: rgba(6, 10, 22, .78); border: 1px solid var(--line-strong); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .35s, transform .35s var(--ease), visibility .35s; }
.past-hero .loadout { opacity: 1; visibility: visible; transform: none; }
.loadout-label { padding: 0 8px 0 4px; font-size: .58rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--faint); }
.loadout button { display: flex; align-items: center; gap: 7px; padding: 6px 9px; cursor: pointer; background: none; border: 1px solid transparent; font: inherit; font-size: .64rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); transition: color .2s, border-color .2s, background .2s; }
.loadout button i { width: 10px; height: 10px; transform: rotate(45deg); background: var(--c); box-shadow: 0 0 8px var(--c); }
.loadout button:hover, .loadout button:focus-visible { outline: 0; color: #fff; border-color: var(--line-strong); }
.loadout button[aria-checked="true"] { color: #fff; border-color: var(--c); background: color-mix(in srgb, var(--c) 16%, transparent); }
.loadout button.locked { opacity: .4; }
[data-equip="kinetic"], [data-needs="kinetic"] { --c: #e7ebf5; }
[data-equip="solar"], [data-needs="solar"] { --c: #f2721b; }
[data-equip="arc"], [data-needs="arc"] { --c: #79bbe8; }
[data-equip="void"], [data-needs="void"] { --c: #b184c5; }
[data-equip="valkyrie"], [data-needs="valkyrie"] { --c: #ff3b2f; }

/* ---------- Pastilles ---------- */
.spot[data-secret="fragments"] { color: var(--c); border-color: var(--c); box-shadow: 0 0 14px color-mix(in srgb, var(--c) 60%, transparent); }
.spot[data-secret="fragments"].found { box-shadow: none; }
.spot[data-needs="valkyrie"] { outline: 1px dashed rgba(255, 59, 47, .7); outline-offset: 4px; }
.spot[data-secret="winks"] { color: var(--ice-hi); border-color: rgba(159, 208, 232, .7); }
.spot[data-secret="worldline"], .spot[data-secret="sparrow"] { color: var(--gold-hi); border-color: var(--exotic); }

/* ---------- Coupe (brique commune : css/components/depths.css) ---------- */
.depths-sec { background: linear-gradient(180deg, transparent, rgba(159, 208, 232, .04) 40%, transparent); }
.stratum--orbite { background: radial-gradient(ellipse 40% 120% at 50% 120%, rgba(214, 112, 70, .35), transparent 70%), linear-gradient(180deg, #04060c, #101426); }
.stratum--surface { background: linear-gradient(180deg, #2a2030 0%, #6b4236 50%, #b9805f 90%, #e9eef2 98.5%, #b9c9d6 100%); }
.stratum--complexe { background: radial-gradient(ellipse 26% 60% at 90% 30%, rgba(255, 122, 69, .2), transparent 70%), linear-gradient(180deg, #4a596a 0%, #263140 7%, #151b26 100%); }
.stratum--abime { background: radial-gradient(ellipse 60% 80% at 34% 80%, rgba(200, 226, 107, .16), transparent 70%), linear-gradient(180deg, #151b26, #07090a); }
.mars .stratum--surface .stratum-name { color: rgba(255, 255, 255, .88); }
.mars .stratum--surface .stratum-note { color: rgba(255, 255, 255, .6); }
.ice { fill: none; stroke: rgba(240, 248, 255, .85); stroke-width: 1.5; }
.mind-core { fill: rgba(40, 8, 4, .7); stroke: var(--mind); stroke-width: 1.2; filter: drop-shadow(0 0 6px rgba(255, 122, 69, .7)); }
.xol-trail { fill: none; stroke: rgba(200, 226, 107, .5); stroke-width: 7; stroke-linecap: round; stroke-dasharray: 1 11; }
.way-line { stroke: rgba(231, 235, 245, .36); }
.way-line--rasputin { stroke: rgba(255, 122, 69, .6); stroke-dasharray: 4 4; }
.way-line--bray { stroke: rgba(159, 208, 232, .5); }
.way-line--cabal { stroke: rgba(255, 179, 71, .5); }
.way-line--hive { stroke: rgba(200, 226, 107, .5); }
.room-node--zone { color: #f3eee4; }
.room-node--rasputin { color: var(--mind); }
.room-node--rasputin i { transform: none; }
.room-node--bray { color: var(--ice); }
.room-node--cabal { color: #ffb347; }
.room-node--hive { color: var(--hive); }
.mars .stratum--surface ~ .room-node--zone .room-label, .mars .room-node--zone .room-label, .mars .room-node--bray .room-label { text-shadow: 0 1px 6px rgba(0, 0, 0, .9); }

/* ---------- Raspoutine ---------- */
.voice-box { margin: 0 0 clamp(30px, 4vw, 44px); padding: clamp(20px, 3vw, 32px); border: 1px solid color-mix(in srgb, var(--mind) 40%, transparent); background: linear-gradient(135deg, rgba(255, 122, 69, .08), transparent 60%), var(--panel-solid); }
.voice-box .lead-quote { max-width: none; margin: 0 0 16px; min-height: 7.2em; transition: color .4s, letter-spacing .4s; }
.voice-box .lead-quote.reversed { color: var(--mind-hi); letter-spacing: .04em; opacity: .8; word-break: break-word; }
.voice-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin: 0; }
.voice-foot cite { font-style: normal; font-size: .68rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--page-accent); }
.protocols { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 0 0 clamp(36px, 5vw, 56px); padding: 0; list-style: none; }
.protocols li { padding: 16px; background: #0b0d14; border: 1px solid var(--line); border-left: 3px solid var(--mind); }
.protocols p { margin: 0; font-size: .82rem; line-height: 1.5; color: var(--muted); }
.protocols .proto-name { font-family: ui-monospace, 'Cascadia Mono', Consolas, monospace; font-size: .78rem; font-weight: 700; letter-spacing: .06em; color: var(--mind-hi); }
.protocols .proto-en { margin: 2px 0 10px; font-size: .64rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--faint); }
.mars #raspoutine .raid + .quarters, .mars #ruche .quarters { margin-bottom: clamp(36px, 5vw, 56px); }
.mars #raspoutine .quarters { margin-top: clamp(8px, 2vw, 20px); margin-bottom: 0; }
.mars .steps + .quarters { margin-top: 0; }

/* cartes d'information du Protocole : toutes les lignes se lisent */
.mars .now-list li { opacity: 1; align-items: flex-start; }
.mars .now-list img { margin-top: 2px; }

@media (max-width: 1100px) {
  .protocols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .protocols { grid-template-columns: minmax(0, 1fr); }
  .loadout { left: 8px; right: 8px; bottom: 8px; justify-content: space-between; gap: 0; padding: 5px; }
  .loadout-label { display: none; }
  .loadout button { flex-direction: column; gap: 4px; padding: 6px 4px; font-size: .52rem; }
  .voice-box .lead-quote { min-height: 12em; }
}
@media (prefers-reduced-motion: reduce) {
  .warsat { display: none; }
  .mars.quake main { animation: none; }
}