/* Controls occupy their own row, never the caption area inside an export. */
#family-play,#companion-play,#organizer-play,#review-play,#worship-play,
#quran-video-play,#books-video-play,#companion-progress{display:none!important}
.film-controls{display:flex;justify-content:flex-end;align-items:center;gap:12px;min-height:44px;margin:8px auto 0;width:100%;max-width:960px;color:#344d3d}
.film-controls[hidden],.film-seek[hidden]{display:none!important}
.film-toggle{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;padding:8px;border:0;border-radius:50%;background:#e3e5dc;color:#344d3d;box-shadow:none}
.film-toggle:hover{background:#d5dacd}
.film-toggle svg{display:block;width:20px;height:20px}
.film-seek{display:flex;align-items:center;gap:12px;width:min(100%,420px);min-width:0}
.film-seek input{width:100%;min-width:40px;accent-color:#344d3d;cursor:pointer}
.film-time{font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap;color:#66705f}
video:focus-visible{outline:2px solid #947545;outline-offset:3px}
.profiles-footer:has(#profiles-caption[hidden]){display:none}
.guided-footer:has(strong[hidden]){margin-top:0}
#companion .film-controls{max-width:none}

/* Shared focus cues; desktop enlarges, mobile retains fixed device sizes. */
@container page (min-width:701px){#companion .paired-stage {padding-top:28px;padding-bottom:38px;overflow:visible}}
#companion .companion-attention #companion-phone.paired-motion,
#companion .companion-attention #companion-home .paired-motion {
 transform:scale(var(--focus-scale,1));outline:2px solid rgb(52 77 61 / var(--focus-alpha,0));outline-offset:5px;
}
#companion .companion-attention #companion-phone {transform-origin:right center}
#companion .companion-attention #companion-home .screen-window {transform-origin:left center}
#companion .companion-attention video {opacity:var(--video-opacity,1)}
#companion .desktop-attention .device-name {font-size:12px;min-height:17px}
#companion .companion-attention .attention-name {color:#344d3d;font-weight:700}
#companion .desktop-attention ~ #companion-caption {font-size:16px;line-height:1.4;min-height:2.8em;max-width:650px;margin-top:18px}


@container page (max-width:700px){
 #companion .companion-attention ~ #companion-caption {font-size:14px;line-height:1.4;min-height:2.8em;margin-top:18px}
 #companion .companion-attention #companion-phone.paired-motion,
 #companion .companion-attention #companion-home .paired-motion {outline-offset:3px}
}

/* The matching background needs no surrounding video-box outline at either size. */
#companion .solid-background.companion-attention #companion-phone.paired-motion,
#companion .solid-background.companion-attention #companion-home .paired-motion {outline:none}