/* Voyage en Loge (clic dans la voie lactée) */
body.loge-sky-hover { cursor: zoom-in; }
body.loge-voyage-wait { cursor: progress; }

#loge-voyage {
    position: fixed; inset: 0; z-index: 1030; display: none; overflow: hidden; opacity: 0;
    background: #05060f url("../pave-bg.jpg") center / cover no-repeat;
}
#loge-voyage.on { display: block; }
body.loge-voyage #loge-player { z-index: 1045; }          /* la musique reste accessible */
#loge-voyage .lv-stage { position: absolute; inset: 0; }
#loge-voyage .lv-shot { position: absolute; opacity: 0; transform-origin: 50% 50%; will-change: transform, opacity; }
#loge-voyage .lv-shot img { display: block; width: 100%; height: 100%; user-select: none; -webkit-user-drag: none; pointer-events: none; }
#loge-voyage .lv-vignette {
    position: absolute; inset: 0; pointer-events: none;
    background: radial-gradient(ellipse at 50% 45%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .55) 100%),
                linear-gradient(to bottom, rgba(0, 0, 0, 0) 62%, rgba(0, 0, 0, .55) 100%);
}

/* lueurs : la parole, les flammes, la lumière qui passe d'un officier à l'autre */
#loge-voyage .lv-glow {
    position: absolute; width: 9vmin; height: 9vmin; border-radius: 50%; pointer-events: none; mix-blend-mode: screen;
    background: radial-gradient(circle, rgba(255, 226, 150, .75) 0, rgba(255, 196, 100, .28) 35%, rgba(255, 180, 80, 0) 70%);
}
#loge-voyage .lv-glow.lv-flame { width: 7vmin; height: 7vmin;
    background: radial-gradient(circle, rgba(255, 240, 200, .95) 0, rgba(255, 170, 70, .45) 30%, rgba(255, 150, 50, 0) 70%); }
#loge-voyage .lv-glow.lv-word { width: 14vmin; height: 14vmin; }
#loge-voyage .lv-orb {
    position: absolute; width: 2.4vmin; height: 2.4vmin; margin: -1.2vmin 0 0 -1.2vmin; border-radius: 50%; pointer-events: none;
    background: radial-gradient(circle, #fff6dc 0, rgba(255, 214, 140, .9) 30%, rgba(255, 190, 90, 0) 72%);
    box-shadow: 0 0 18px 8px rgba(255, 200, 110, .45); mix-blend-mode: screen;
}

/* sous-titres du rituel */
#loge-voyage .lv-caption {
    position: absolute; left: 50%; bottom: max(7vh, 56px); transform: translate(-50%, 8px);
    width: min(860px, calc(100vw - 32px)); text-align: center; opacity: 0; pointer-events: none;
    transition: opacity .5s ease, transform .5s ease; text-shadow: 0 1px 3px #000, 0 0 12px rgba(0, 0, 0, .9);
}
#loge-voyage .lv-caption.show { opacity: 1; transform: translate(-50%, 0); }
#loge-voyage .lv-caption::before {
    content: ""; position: absolute; inset: -18px -40px; z-index: -1; border-radius: 50%;
    background: radial-gradient(ellipse at center, rgba(4, 5, 14, .72) 0, rgba(4, 5, 14, .45) 45%, rgba(4, 5, 14, 0) 72%);
}
#loge-voyage .lv-who {
    font: italic 600 clamp(12px, 1.6vw, 15px) Georgia, "Times New Roman", serif; letter-spacing: .08em;
    color: #d8b25a; text-transform: uppercase; margin-bottom: 6px;
}
#loge-voyage .lv-txt { font: clamp(17px, 2.4vw, 27px)/1.35 Georgia, "Times New Roman", serif; color: #f6ead0; }
#loge-voyage .lv-caption.lv-narr .lv-txt { font-style: italic; color: #f3d98a; }

#loge-voyage .lv-bar {
    position: absolute; left: 0; right: 0; bottom: 0; height: 2px; transform-origin: 0 50%;
    background: linear-gradient(90deg, rgba(216, 178, 90, .2), #d8b25a);
}
#loge-voyage .lv-close {
    position: absolute; top: max(14px, env(safe-area-inset-top)); right: 14px; width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid rgba(216, 178, 90, .6); background: rgba(10, 8, 20, .55); color: #f3d98a; font-size: 24px; line-height: 36px;
    padding: 0; cursor: pointer; backdrop-filter: blur(4px);
}
#loge-voyage .lv-close:hover { background: rgba(30, 22, 10, .8); }
@media (prefers-reduced-motion: reduce) { #loge-voyage .lv-caption { transition: none; } }