/* Media stays connected across both content modes and all view re-renders. */
#media-host{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;top:0;left:0;z-index:2}
#media-host:not(.is-visible){width:1px!important;height:1px!important}
#media-host.is-visible{opacity:1;pointer-events:auto;border-radius:12px;background:#0e251f}
#media-host video{display:block;width:100%;height:100%;object-fit:contain}
.video-mode{display:flex;gap:28px;justify-content:center;margin:16px 0}
.video-mode button{font-size:15px;min-height:44px;padding:8px 4px;color:#c4d4c7;border-bottom:2px solid transparent}
.video-mode button[aria-selected=true]{color:#fff5da;border-color:#dbc58b}
#video-slot{width:100%;height:min(48dvh,430px);min-height:220px}
#video-panel[hidden],#transcript-panel[hidden]{display:none}
#transcript-panel{position:relative}
.transcript-reader{height:min(48dvh,430px);min-height:220px;overflow-y:auto;overscroll-behavior:contain;position:relative;scrollbar-width:thin;padding:20px 16px 100px;border-radius:12px;background:#ffffff08;line-height:1.95;font-size:17px;color:#c6d2c8;scroll-behavior:auto}
.transcript-reader p{padding:8px 0;transition:color .15s}
.transcript-reader p[aria-current=true]{color:#fff3c9;font-weight:600}
.transcript-reader button{color:#fff3c9;text-decoration:underline;min-height:44px}
.transcript-follow{position:absolute;bottom:12px;right:14px;min-height:40px;border-radius:22px;padding:6px 15px;background:#f3eedb;color:#244d3f;box-shadow:0 2px 12px #0002}
.video-controls .player-seek{margin-top:18px}
.video-controls .transport{margin-top:12px}
.home-thumb>img{width:100%;height:100%;object-fit:cover}
@media(prefers-reduced-motion:reduce){.transcript-reader p{transition:none}}

.tiny-cover>img{width:100%;height:100%;object-fit:cover}

/* Compact video heading and accessible controls after returning home. */
.player-page:has(.video-heading) .page-head{padding-top:calc(12px + env(safe-area-inset-top));padding-bottom:4px}
.video-heading{margin:4px 0 6px}
.video-heading h2{font-size:19px;line-height:1.45;margin:0;font-weight:550}
.video-heading+.video-mode{margin:4px 0 12px;gap:28px}
.home-page:has(.mini) #view{padding-bottom:170px}

.home-page:has(.mini) .theme-switch{bottom:calc(158px + env(safe-area-inset-bottom))}
.mini-cover>img{display:block;width:100%;height:100%;object-fit:cover}