main.journey-host { position: relative; }
.journey-map { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; z-index: 2; contain: layout paint; }
.journey-map path { fill: none; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.journey-track { stroke: #101828; stroke-opacity: .12; stroke-width: 1; }
.journey-progress { stroke: #849827; stroke-opacity: .65; stroke-width: 1.6; }
.journey-stop { fill: #f4f3ef; stroke: #9aa187; stroke-width: 1; }
.journey-stop.is-passed { fill: #d6ee5a; stroke: #849827; }
.journey-halo { fill: #d6ee5a; fill-opacity: .18; stroke: #849827; stroke-opacity: .25; }
.journey-point { fill: #d6ee5a; stroke: #596827; stroke-width: 1.5; }
@media (max-width: 760px) {
    .journey-track { stroke-opacity: .16; }
    .journey-progress { stroke-width: 1.2; }
    .journey-halo { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .journey-progress, .journey-halo, .journey-point { display: none; }
    .journey-stop.is-passed { fill: #f4f3ef; stroke: #9aa187; }
}
@media print { .journey-map { display: none; } }
@media(min-width:1101px) {
    .journey-host > .container { width: min(var(--width), calc(100% - 160px)); }
}
.journey-track { stroke-opacity: .15; }
.journey-progress { stroke: #829833; stroke-opacity: .72; stroke-width: 1.5; }
.journey-halo { r: 10px; fill-opacity: .12; stroke-opacity: .18; }