.journey { width: min(100% - 112px, 1200px); margin: 0 auto; padding: 40px 0 64px; }
.journey [hidden] { display: none !important; }
.journey-heading { margin-bottom: 22px; }
.journey h2 { margin: 0; font-size: 20px; line-height: 1.4; font-weight: 400; letter-spacing: -.015em; }
.journey-stage { background: #243c45; }
.journey-art { position: relative; width: 100%; margin: 0; overflow: hidden; aspect-ratio: 1672 / 941; }
.journey-art img, .journey-art canvas { position: absolute; display: block; width: 100%; height: 100%; max-width: none; top: 0; left: 0; }
.journey-art canvas { pointer-events: none; }
.journey-controls { padding-top: 24px; }
.journey-transport { display: flex; flex-wrap: wrap; gap: 12px; }
.journey button { font: inherit; font-size: 15px; line-height: 1.2; min-height: 48px; padding: 12px 20px; color: #fff; border: 1px solid #898989; border-radius: 999px; background: transparent; cursor: pointer; }
.journey #play-toggle { min-width: 90px; }
.journey button:hover:enabled { border-color: #fec0ff; color: #fec0ff; }
.journey button:disabled, .journey input:disabled { opacity: .45; cursor: default; }
.journey :focus-visible { outline: 2px solid #fec0ff; outline-offset: 5px; }
.journey-stage:focus-visible { outline-offset: 5px; }
.journey-timeline { display: flex; align-items: center; gap: 20px; margin-top: 14px; }
.journey input[type=range] { flex: 1; min-width: 0; height: 44px; margin: 0; accent-color: #fec0ff; cursor: pointer; }
.journey #time-label { font-size: 13px; color: #b6b6b6; white-space: nowrap; font-variant-numeric: tabular-nums; }
.journey #player-status, .journey #reduced-motion-note, .journey noscript p { color: #b6b6b6; font-size: 14px; line-height: 1.6; margin-top: 10px; }
.journey #asset-error { color: #fec0ff; font-size: 14px; line-height: 1.6; margin-top: 12px; }
@media (max-width: 719px) { .journey-art { aspect-ratio: 706 / 941; } .journey #poster { width: 236.827195%; left: -68.413598%; } }
@media (max-width: 600px) { .journey { width: calc(100% - 48px); padding: 32px 0 40px; } .journey-heading { margin-bottom: 18px; } .journey h2 { font-size: 18px; } }