/* Interview room: compact browsing alongside a focused reading workspace. */
.interview-room { --room-accent:var(--lime); min-width:0; }
.interview-room [hidden] { display:none!important; }
.room-heading { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-bottom:20px; }
.room-heading h1 { font-size:clamp(28px,3vw,40px); line-height:1.12; letter-spacing:-.04em; margin:8px 0 12px; text-wrap:balance; }
.room-heading p:not(.eyebrow) { color:var(--muted); font-size:14px; margin:0; }
.room-stats { display:flex; gap:24px; flex-shrink:0; }
.room-stats span { display:grid; gap:7px; font-size:12px; color:var(--muted); }
.room-stats strong { color:var(--text); font-size:27px; font-weight:500; font-variant-numeric:tabular-nums; }
.room-search { display:grid; grid-template-columns:minmax(160px,1fr) 155px auto auto; gap:8px; align-items:center; }
.room-search wa-input { min-width:0; --wa-form-control-height:44px; }
.room-search select { width:100%; }
.room-search #interviewFilterCount:not(:empty) { margin-left:5px; color:var(--lime); font-variant-numeric:tabular-nums; }
.room-filter-panel { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; padding:18px; background:var(--surface); border:1px solid var(--line); border-radius:8px; margin-top:10px; }
.room-filter-panel label { display:grid; gap:8px; font-size:12px; color:var(--muted); min-width:0; margin:0; }
.room-filter-panel select { min-width:0; width:100%; }
.room-discovery { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 0 10px; border-bottom:1px solid var(--line); }
.room-people { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.room-people>span { color:var(--muted); font-size:12px; margin-right:4px; }
.room-people .chip { min-height:40px; background:transparent; font-size:12px; padding:8px 10px; }
.room-people .chip[aria-pressed="true"] { background:#242d20; border-color:#536544; color:var(--lime); }
.room-workspace-bar { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:8px 0; }
.room-workspace-bar p { margin:0; font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
.interview-room .interview-layout { grid-template-columns:clamp(270px,25vw,340px) minmax(0,1fr); gap:22px; align-items:start; }
.interview-library { min-width:0; background:var(--surface); border-radius:10px; box-shadow:0 0 0 1px var(--line); position:sticky; top:88px; overflow:hidden; }
.room-list-heading { display:flex; justify-content:space-between; align-items:center; padding:17px 16px; border-bottom:1px solid var(--line); gap:8px; }
.room-list-heading h2 { font-size:14px; letter-spacing:0; margin:0; }
.room-list-heading span { font:12px ui-monospace,monospace; letter-spacing:.07em; color:var(--muted); }
.interview-room .interview-list { max-height:calc(100dvh - 156px); min-height:240px; overflow:auto; overscroll-behavior:contain; padding:5px; scrollbar-gutter:stable; }
.interview-room .interview-choice { display:grid; grid-template-columns:92px minmax(0,1fr); gap:12px; align-items:start; padding:13px 10px; border:1px solid transparent; border-bottom-color:var(--line); border-radius:6px; box-shadow:none; background:transparent; margin:2px 0; transition:background .16s,border-color .16s; }
.interview-room .interview-choice:hover { background:var(--raised); }
.interview-room .interview-choice.active { background:#222c20; border-color:#536544; box-shadow:inset 2px 0 var(--lime); }
.room-thumb { display:block; position:relative; width:92px; aspect-ratio:16/10; margin-top:2px; }
.room-thumb img { width:100%; height:100%; object-fit:cover; border-radius:4px; outline:1px solid rgb(255 255 255 / 10%); }
.room-thumb-placeholder { display:grid; place-items:center; height:100%; font-size:25px; background:var(--raised); border-radius:4px; color:var(--muted); }
.room-duration { position:absolute; bottom:3px; right:3px; padding:2px 4px; background:#080c0be6; color:white; border-radius:3px; font:12px ui-monospace,monospace; font-variant-numeric:tabular-nums; }
.room-choice-copy { display:grid; gap:5px; min-width:0; }
.room-choice-copy strong { font-size:12px; line-height:1.45; font-weight:500; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.room-choice-publisher { font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.room-choice-speakers { font-size:12px; color:var(--muted); line-height:1.4; }
.room-choice-meta { font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
.room-availability { font-size:12px; color:#cdbd90; margin-top:2px; }
.room-availability.has-transcript { color:var(--lime); }
.interview-room .interview-player { background:var(--surface); border-radius:10px; box-shadow:0 0 0 1px var(--line),0 12px 28px #0002; overflow:hidden; min-height:450px; }
.room-recording { padding:24px; display:grid; grid-template-columns:minmax(150px,.75fr) minmax(0,1.25fr); gap:22px; align-items:start; }
.room-recording-art { min-width:0; }
.room-poster-link { display:block; position:relative; border-radius:6px; overflow:hidden; background:#090c09; }
.room-poster-link img { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; outline:1px solid rgb(255 255 255 / 10%); outline-offset:-1px; border-radius:6px; }
.room-poster-link:after { content:""; position:absolute; inset:35% 0 0; background:transparent; pointer-events:none; }
.room-play { position:absolute; left:50%; top:45%; translate:-50% -50%; width:42px; height:42px; display:grid; place-items:center; padding-left:3px; background:#111d; border:1px solid #fff7; border-radius:50%; color:white; z-index:1; font-size:15px; transition:scale .16s,background .16s; }
.room-poster-link:hover .room-play { background:#263023; scale:1.06; }
.room-poster-link:active .room-play { scale:.96; }
.room-poster-action { position:absolute; bottom:12px; left:0; right:0; z-index:1; text-align:center; font-size:12px; color:white; background:#111d; padding:7px; }
.room-art-placeholder { display:grid; place-items:center; aspect-ratio:16/10; background:var(--raised); border-radius:6px; font-size:44px; color:var(--muted); }
.room-image-credit { color:var(--muted); font-size:12px; margin:8px 0 0; }
.room-recording-copy .eyebrow { color:var(--lime); margin:0 0 10px; font-size:12px; }
.room-recording-copy h2 { font-size:clamp(21px,2.1vw,30px); line-height:1.22; letter-spacing:-.025em; margin:0 0 14px; text-wrap:balance; }
.room-recording-meta { display:flex; flex-wrap:wrap; gap:6px 12px; color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.room-recording-copy .interview-person-row { margin:13px 0 17px; gap:5px; }
.room-recording-copy .interview-person-row .chip { background:transparent; border:0; padding:4px 0; min-height:32px; color:var(--lime); font-size:12px; }
.room-recording-copy .interview-person-row .chip + .chip:before { content:"·"; color:var(--muted); margin-right:6px; }
.room-recording-copy .actions { gap:8px; }
.room-recording-copy .actions .button { font-size:12px; padding:10px 14px; min-height:40px; }
.room-recording-status { margin-top:16px; display:flex; gap:7px; align-items:center; color:var(--muted); font-size:12px; }
.room-status-dot { height:5px; width:5px; border-radius:50%; background:#cdbd90; flex-shrink:0; }
.room-status-dot.available { background:var(--lime); }
.room-recording video { margin:0; aspect-ratio:16/10; min-height:130px; }
.room-reading { border-top:1px solid var(--line); }
.interview-room .room-panel-nav { padding:8px 18px; margin:0; gap:3px; border-bottom:1px solid var(--line); background:#141914; }
.room-panel-nav wa-button::part(button) { min-height:42px; font-size:12px; }
.room-panel { padding:24px; min-width:0; }
.room-panel p { font-size:13px; line-height:1.75; text-wrap:pretty; }
.room-panel h3 { font-size:17px; line-height:1.35; margin:0 0 12px; letter-spacing:-.015em; }
.room-panel .room-section + .room-section { margin-top:24px; padding-top:22px; border-top:1px solid var(--line); }
.room-panel .room-lead { margin-top:0; color:#d1d8ce; font-size:15px; }
.room-panel .room-section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.room-panel .room-section-heading span { color:var(--muted); font-size:12px; }
.room-panel .notice { padding:14px 16px; font-size:12px; margin:14px 0; }
.room-panel .interview-connections { margin:20px 0 0; padding:18px; background:#1b221a; }
.room-panel .connection-teaser strong { font-size:14px; }
.room-panel .connection-teaser>span:last-child { font-size:12px; }
.room-transcript-toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:12px; }
.room-transcript-toolbar input { flex:1; min-width:160px; width:auto; }
.room-transcript-toolbar #cueCount { font-size:12px; }
.room-panel .transcript-list { max-height:600px; min-height:220px; margin:0; border:1px solid var(--line); background:var(--bg); scroll-behavior:auto; overscroll-behavior:contain; }
.room-panel .cue { padding:12px; grid-template-columns:55px minmax(0,1fr); gap:10px; }
.room-panel .cue button { min-height:40px; }
.room-panel .cue-passage { color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; padding-top:8px; }
.room-panel .cue:focus { outline:2px solid var(--lime); outline-offset:-2px; }
.room-panel .cue p { margin:0; font-size:13px; }
.room-panel .cue.active { background:#263321; box-shadow:inset 2px 0 var(--lime); }
.room-moment-list { display:grid; gap:12px; }
.room-moment { padding:16px; background:var(--bg); border:1px solid var(--line); border-radius:7px; }
.room-moment>button { display:grid; grid-template-columns:65px minmax(0,1fr) 16px; gap:12px; width:100%; text-align:left; background:transparent; border:0; padding:0; align-items:start; }
.room-moment time { color:var(--lime); font:12px ui-monospace,monospace; padding-top:3px; }
.room-moment strong { font-size:14px; line-height:1.5; }
.room-moment p { margin:10px 0 0; color:var(--muted); font-size:12px; }
.room-moment .chip-row { margin-top:12px; }
.room-source-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:18px 0; }
.room-source-grid dt { font-size:12px; color:var(--muted); margin-bottom:7px; }
.room-source-grid dd { font-size:12px; margin:0; overflow-wrap:anywhere; }
.room-panel .interview-visuals { margin:24px 0 0; }
.room-panel .interview-visuals>div { grid-template-columns:repeat(2,minmax(0,1fr)); }
.room-panel .interview-visuals p { font-size:12px; }
.room-panel .reader-research-record>header { display:none; }
.room-panel .reader-section { margin:0 0 22px; }
.room-panel .reader-more { padding:12px 0; border-top:1px solid var(--line); }
.room-panel .reader-more summary { min-height:32px; cursor:pointer; font-size:12px; }
.room-panel .reader-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:15px; }
.interview-room.is-focused .interview-layout { grid-template-columns:minmax(0,1fr); max-width:1080px; margin-inline:auto; }
.interview-room.is-focused .interview-library { display:none; }
.room-empty { text-align:center; padding:48px 22px; }
.room-empty>span { color:var(--lime); font-size:32px; display:block; margin-bottom:15px; }
.room-empty p { color:var(--muted); font-size:13px; max-width:46ch; margin:12px auto 20px; }
@media(min-width:1550px) { .room-recording { grid-template-columns:minmax(230px,.8fr) minmax(0,1.2fr); } }
@media(max-width:1200px) {
 .room-heading { align-items:start; }
 .room-stats { gap:15px; }
 .room-stats span:last-child { display:none; }
 .interview-room .interview-layout { grid-template-columns:280px minmax(0,1fr); gap:16px; }
 .room-recording { grid-template-columns:1fr; padding:20px; gap:16px; }
 .room-poster-link img { aspect-ratio:2.25/1; object-position:center 36%; }
 .room-recording-art { max-width:100%; }
 .room-panel { padding:20px; }
 .room-filter-panel { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .room-discovery { align-items:start; }
 .room-discovery>wa-button { flex-shrink:0; }
}
@media(max-width:850px) {
 .room-heading { flex-wrap:wrap; gap:20px; }
 .room-stats { gap:28px; }
 .room-stats span:last-child { display:grid; }
 .room-stats strong { font-size:23px; }
 .interview-room .interview-layout { grid-template-columns:minmax(0,1fr); gap:20px; }
 .interview-library { position:static; }
 .interview-room .interview-list { max-height:280px; min-height:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
 .interview-room .interview-choice { grid-template-columns:76px minmax(0,1fr); gap:10px; }
 .room-thumb { width:76px; }
 .room-recording { grid-template-columns:minmax(160px,.7fr) minmax(0,1.3fr); }
 .room-poster-link img { aspect-ratio:16/10; }
 .room-discovery { flex-direction:column; gap:6px; }
 .room-choice-speakers { display:none; }
}
@media(max-width:560px) {
 .room-heading h1 { font-size:31px; }
 .room-heading p:not(.eyebrow) { font-size:13px; }
 .room-stats { width:100%; justify-content:space-between; gap:12px; }
 .room-stats span { font-size:12px; }
 .room-search { grid-template-columns:minmax(0,1fr) auto auto; }
 .room-search wa-input { grid-column:1/-1; }
 .room-search select { font-size:12px; }
 .room-filter-panel { grid-template-columns:1fr; }
 .room-people { flex-wrap:nowrap; width:100%; overflow:auto; padding-bottom:3px; }
 .room-people .chip { white-space:nowrap; }
 .room-people>span { display:none; }
 .room-workspace-bar p { font-size:12px; }
 .room-workspace-bar wa-button::part(button) { font-size:12px; padding-inline:8px; }
 .interview-room .interview-list { grid-template-columns:1fr; max-height:250px; }
 .interview-room .interview-choice { grid-template-columns:90px minmax(0,1fr); }
 .room-thumb { width:90px; }
 .room-recording { grid-template-columns:1fr; padding:16px; }
 .room-recording-copy h2 { font-size:24px; }
 .room-poster-link img { aspect-ratio:1.9/1; }
 .room-panel { padding:17px; }
 .interview-room .room-panel-nav { padding:7px; display:grid; grid-template-columns:1fr 1fr; gap:4px; }
 .room-panel-nav wa-button::part(button) { padding-inline:9px; font-size:12px; }
 .room-panel .interview-visuals>div,.room-source-grid { grid-template-columns:1fr; }
 .room-moment>button { grid-template-columns:52px minmax(0,1fr) 12px; gap:7px; }
 .room-panel .cue { padding:10px; gap:6px; grid-template-columns:46px minmax(0,1fr); }
 .room-panel .cue p { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) { .interview-room * { transition:none!important; scroll-behavior:auto!important; } }

.room-search wa-input::part(label) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.interview-room>.ui-section-switch { margin-bottom:16px; padding-bottom:8px; }

.room-back-to-catalogue { display:none; }
@media(max-width:850px) { .room-back-to-catalogue { display:inline-flex; margin:8px 8px 0; } .interview-room .interview-player { scroll-margin-top:16px; } }

/* Publisher video and transcript share one reading desk; no local video transport. */
.interview-room .interview-player { container-type:inline-size; }
.room-recording>.room-back-to-catalogue { grid-column:1/-1; }
.room-watch-layout { display:grid; min-width:0; }
.room-watch-layout .room-recording { display:flex; flex-direction:column; gap:20px; padding:18px; min-width:0; }
.room-watch-layout .room-recording-art { width:100%; }
.room-watch-layout .room-recording-copy h2 { font-size:22px; }
.room-watch-layout .room-panel { padding:18px; }
.room-watch-layout .room-panel-nav { display:grid; grid-template-columns:1fr 1fr; padding:8px; }
.room-watch-layout .room-panel-nav wa-button { min-width:0; }
.room-watch-layout .room-panel-nav wa-button::part(button) { padding-inline:8px; }
.room-publisher-frame { width:100%; min-width:0; aspect-ratio:16/9; min-height:200px; background:#090c09; border-radius:7px; overflow:hidden; }
.room-publisher-frame iframe { width:100%; height:100%; min-height:200px; display:block; border:0; }
.room-embed-launch { width:100%; height:100%; min-height:200px; padding:0; border:0; border-radius:7px; }
.room-embed-launch img,.room-embed-launch .room-art-placeholder { height:100%; width:100%; aspect-ratio:auto; object-fit:cover; }
.room-embed-launch .room-play { width:52px; height:52px; font-size:19px; }
.room-embed-launch .room-poster-action { font-size:12px; bottom:14px; }
.room-playback-status { margin:10px 0 5px; font-size:12px; color:var(--lime); line-height:1.5; }
.room-playback-status.is-error { color:#e3c490; }
.room-host-note { margin:0; color:var(--muted); font-size:12px; line-height:1.6; }
.room-follow-controls { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px; }
.room-follow-controls label { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:12px; min-height:36px; cursor:pointer; }
.room-follow-controls input { width:16px; height:16px; margin:0; accent-color:var(--lime); }
#interviewPlaybackTime { color:var(--lime); font:12px ui-monospace,monospace; font-variant-numeric:tabular-nums; }
.room-watch-layout .transcript-list { max-height:min(62dvh,650px); }
.room-watch-layout .translation-controls { margin:0 0 14px; padding:12px; }
.room-watch-layout .translation-controls .actions { gap:6px; }
.room-watch-layout .translation-controls .button { font-size:12px; }
@container(min-width:740px) {
 .room-watch-layout { grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
 .room-watch-layout .room-reading { border-top:0; border-left:1px solid var(--line); min-width:0; }
 .room-watch-layout .room-recording { position:sticky; top:0; }
}

.room-new-collection { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding: 10px 0; border-bottom: 1px solid var(--line, #354131); font-size: 12px; }
.room-new-collection > span { color: var(--muted); }
.room-new-collection > a { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; color: var(--accent, #c7ef81); }
.room-moment-publisher { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: start; width: 100%; min-height: 40px; padding: 12px 0; color: inherit; text-decoration: none; }
.room-moment-publisher time { color: var(--accent, #c7ef81); font-size: 12px; }
.room-moment-publisher strong { font-size: 14px; }
.room-moment-publisher:hover strong { color: var(--accent, #c7ef81); }
.room-moment-publisher:focus-visible, .room-new-collection > a:focus-visible { outline: 2px solid var(--accent, #c7ef81); outline-offset: 3px; }
@media (max-width: 600px) { .room-moment-publisher { grid-template-columns: 1fr auto; } .room-moment-publisher time { grid-column: 1 / -1; } }

.room-audio-playback img{width:100%;border-radius:10px;aspect-ratio:16/9;object-fit:cover}.room-audio-playback audio{width:100%;margin-top:12px}

/* Bounded transcript windows leave the player mounted while reading changes. */
#transcriptPager .pager { margin: 0 0 12px; gap: 8px; flex-wrap: wrap; }
#transcriptPager wa-button::part(base), #transcriptPager wa-button::part(button) { min-height: 40px; }
#transcriptPager .pager > span { font-variant-numeric: tabular-nums; font-size: 12px; }