.character-rail.swiper { display: block; overflow: hidden; margin-inline: 28px; padding: 0 0 16px; scroll-snap-type: none; }
.character-rail .swiper-wrapper { display: flex; align-items: stretch; }
.character-rail .character-card { flex-shrink: 0; width: max(310px, 25vw); height: auto; scroll-snap-align: none; }
.character-link { display: block; color: inherit; }
.character-link:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; border-radius: var(--radius); }
.character-rail .character-photo { position: relative; overflow: hidden; background: #273034; }
.character-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.character-photo img.hero-panorama-portrait, .program-card-image img.hero-panorama-portrait { width: 400%; max-width: none; object-fit: fill; transform: translateX(var(--hero-portrait-shift)); }
.character-meta > div { min-width: 0; }
.character-meta h3 { overflow-wrap: anywhere; }
.character-meta p { overflow-wrap: anywhere; }
.rail-button:disabled { opacity: .35; cursor: default; }
.characters-empty { padding: 0 clamp(22px, 7vw, 110px); color: rgba(255,255,255,.65); }
@media (max-width: 1050px) { .character-rail .character-card { width: max(300px, 46vw); } }
@media (max-width: 700px) {
  .character-rail.swiper { margin-inline: 12px; }
  .character-rail .character-card { width: 82vw; }
}