[hidden] { display: none !important; }
.skip-link { position: absolute; left: -10000px; }
.skip-link:focus { position: fixed; left: 1rem; top: 1rem; z-index: 2000; background: white; padding: 1rem; }
.theme-filters { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 1rem; border: 0; }
.theme-option { display: flex; flex-direction: column; align-items: center; cursor: pointer; font-size: .85rem; }
.theme-option img { width: 52px; height: 52px; }
.theme-option input { accent-color: #cc0000; }
.search-controls { display: flex; justify-content: center; flex-wrap: wrap; gap: .6rem; margin-top: 1.25rem; }
.search-controls input { max-width: 320px; }
.portrait-card .square img { object-fit: cover; }
.portrait-card a:focus-visible { outline: 3px solid #c00; outline-offset: 4px; display: block; }
.portrait-detail { width: min(100%, 570px); margin: 1.5rem auto; }
.portrait-detail .view .title { padding-bottom: 15px; }
.portrait-detail audio { width: 100%; display: block; margin-top: 1rem; }
.story-heading { font-size: 1.8rem; }
.story-navigation { display: flex; justify-content: center; gap: .75rem; flex-wrap: wrap; margin: 2rem 0; }
.video-preview { display: block; border: 0; padding: 0; background: #222; color: white; width: 100%; position: relative; cursor: pointer; margin-bottom: 2rem; }
.video-preview span { position: absolute; inset: auto 0 0; padding: 1rem; background: #000a; }
.intro-video { width: 100%; aspect-ratio: 16/9; border: 0; margin-bottom: 2rem; }
.modal.show { background: #0008; }
@media (max-width: 575px) { .theme-option { font-size: .75rem; } .theme-option img { width: 40px; height: 40px; } .theme-filters { gap: .6rem; } .portrait-detail .squarehover.view .title h3 { font-size: 2em; margin-left: 0; } .portrait-detail .squarehover.view .title p { margin-left: 0; margin-bottom: 0; } }
@media print { .story-navigation, audio, .skip-link { display: none; } }