/* Watch-page brand styling; playback, sizing and focus behaviour remain shared. */
/* One horizontal strip keeps chapters from pushing the transcript far down the page. */
.wk-chapters{margin:14px 0;padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--bg-soft);min-width:0}
.wk-chapters-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.wk-chapters-heading h2{margin:0;font-size:1.05rem}.wk-chapters-heading small{font-size:.8rem;font-weight:400;color:var(--fg-soft);margin-left:8px}
.wk-chapters-heading button{min-width:44px;min-height:44px;font-size:20px;padding:4px}
.wk-chapters-list{display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:3px 3px 10px}
.wk-chapter{flex:0 0 156px;scroll-snap-align:start;display:flex;flex-direction:column;align-items:stretch;gap:5px;border:2px solid transparent;border-radius:10px;padding:5px;background:var(--bg-elev);color:var(--fg);font:inherit;font-size:.85rem;text-align:left;cursor:pointer}
.wk-chapter img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:6px}.wk-chapter-time{color:var(--accent);font-weight:700}
.wk-chapter[aria-current=true]{border-color:var(--accent)}.wk-chapter:hover{background:var(--bg-soft)}
.wk-chapter:focus-visible{outline:3px solid var(--accent);outline-offset:1px}
.wk-chapter>span:last-child{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35;min-height:2.7em}
.wk-mobile-icon,.wk-mobile-label,.wk-mobile-header-button,.wk-mobile-history{display:none}
@media(max-width:680px){
  #playerControls.wk-mobile-tools{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  #playerControls.wk-mobile-tools>.player-primary-actions,
  #playerControls.wk-mobile-tools>#memberPlayerActions:not([hidden]){display:contents}
  #playerControls.wk-mobile-tools .player-primary-actions>.ctrl-btn,
  #playerControls.wk-mobile-tools #memberPlayerActions>.ctrl-btn{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:44px;padding:7px 5px;border-radius:12px;white-space:nowrap;font-size:11px;font-weight:600;color:var(--fg);line-height:1.25}
  #playerControls.wk-mobile-tools .wk-mobile-icon{display:inline-block}
  #playerControls.wk-mobile-tools .wk-action-icon{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  #playerControls.wk-mobile-tools .wk-mobile-label{display:inline}
  #playerControls.wk-mobile-tools .wk-desktop-label{display:none}
  #playerControls.wk-mobile-tools .player-primary-actions i,
  #playerControls.wk-mobile-tools #memberPlayerActions i{font-size:18px;flex-shrink:0}
  #playerControls.wk-mobile-tools #focusModeBtn i{order:-1;margin:0}
  #playerControls.wk-mobile-tools .wk-save-extra{display:none}

  #playerControls.wk-mobile-tools>.player-secondary-actions{grid-column:1/-1;grid-row:auto;display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;padding:4px 0 7px;border:0;scrollbar-width:thin}
  #playerControls.wk-mobile-tools>.player-secondary-actions>.ctrl-btn,
  #playerControls.wk-mobile-tools>.player-secondary-actions>.switch,
  #playerControls.wk-mobile-tools .more-tools>summary{display:flex;align-items:center;justify-content:center;gap:4px;min-height:44px;box-sizing:border-box;padding:7px 5px;border-radius:12px;font-size:11px;font-weight:600;color:var(--fg);white-space:nowrap;flex:1 0 auto}
  #playerControls.wk-mobile-tools>.player-secondary-actions>.switch{max-width:110px;white-space:nowrap}
  #playerControls.wk-mobile-tools .switch input{flex-shrink:0;margin:0}
  #playerControls.wk-mobile-tools button>i+span{margin-left:0}
  #playerControls.wk-mobile-tools .switch:has(input:checked){background:color-mix(in srgb,var(--accent) 14%,var(--bg-elev))}
  #playerControls.wk-mobile-tools .more-tools{flex:1 0 auto}
  #playerControls.wk-mobile-tools .more-tools-menu{position:fixed;top:auto;bottom:16px;left:16px;right:16px;max-height:50vh;overflow-y:auto;min-width:0;z-index:1000;grid-template-columns:repeat(2,minmax(0,1fr))}
  #playerControls.wk-mobile-tools .more-tools-menu .ctrl-btn{min-height:44px;white-space:normal;display:flex;align-items:center;justify-content:center}
  #playerControls.wk-mobile-tools .more-tools-menu .switch{grid-column:1/-1}
  #playerControls.wk-mobile-tools>details:not(.more-tools){grid-column:1/-1;margin:4px 0!important;font-size:.95rem!important;border:1px solid var(--border);border-radius:12px;background:var(--bg-elev);padding:10px 12px}
  #playerControls.wk-mobile-tools>details>summary{min-height:24px;font-weight:600}
  #playerControls.wk-mobile-tools>details>summary::after{content:'⌄';float:right}
  .wk-chapters{padding:10px}.wk-chapters-heading small{display:block;margin:3px 0 0}
  .wk-chapter{flex-basis:136px}
  .page-watch .site-header.wk-mobile-nav{display:flex;flex-wrap:nowrap;padding:12px;gap:6px}
  .page-watch .wk-mobile-nav .brand{margin-right:auto;font-size:23px;gap:6px}
  .page-watch .wk-mobile-nav .brand-mark{width:30px;height:30px}
  .page-watch .wk-mobile-nav .theme-toggle,.page-watch .wk-mobile-header-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px}
  .page-watch .wk-mobile-header-button{background:transparent;border:0;color:var(--fg);padding:8px;cursor:pointer}
  .page-watch .wk-mobile-nav .site-nav{display:none;position:absolute;top:100%;right:12px;min-width:180px;width:auto;padding:12px;background:var(--bg-elev);border:1px solid var(--border);border-radius:12px;z-index:1000;box-shadow:var(--shadow-md)}
  .page-watch .wk-mobile-nav .site-nav.wk-nav-open{display:flex;flex-direction:column;align-items:stretch}
  .page-watch .purify-form-compact .purify-input-wrap{flex-direction:row;gap:4px}
  .page-watch .purify-form-compact .purify-input-wrap input{min-width:0;font-size:14px;padding:10px}
  .page-watch .purify-form-compact .purify-btn{width:auto;flex:0 0 auto;padding:0 14px;min-height:44px}
  .page-watch .wk-mobile-history{display:inline-block;border:0;background:transparent;color:var(--accent);font:inherit;font-weight:600;min-height:44px;cursor:pointer}
  .page-watch #history:not(.wk-history-expanded) .history-tools{display:none}
  .page-watch #history:not(.wk-history-expanded) .history-grid{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px}
  .page-watch #history:not(.wk-history-expanded) .history-grid>.card{flex:0 0 160px;min-width:0}
  .page-watch #history .history-head{align-items:center}
  .page-watch #history .section-title{font-size:1.3rem}
}
@media(min-width:361px) and (max-width:680px){
  #playerControls.wk-mobile-tools>.player-secondary-actions{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr) minmax(0,1.15fr) minmax(0,.85fr) minmax(0,.85fr);overflow:visible}
  #playerControls.wk-mobile-tools>.player-secondary-actions>.ctrl-btn,
  #playerControls.wk-mobile-tools>.player-secondary-actions>.switch,
  #playerControls.wk-mobile-tools .more-tools{min-width:0;max-width:none}
}
@media(max-width:350px){
  #playerControls.wk-mobile-tools .player-primary-actions>.ctrl-btn,
  #playerControls.wk-mobile-tools #memberPlayerActions>.ctrl-btn{font-size:11px;gap:4px}
  .page-watch .wk-mobile-nav .brand{font-size:20px}
}
.page-watch{
  --bg:#fff;--bg-soft:#edf7fc;--bg-elev:#fff;
  --fg:#15354b;--fg-soft:#4d6574;--fg-muted:#627985;
  --border:#dbe6e9;--border-strong:#bbd0d7;
  --accent:#347b26;--accent-hover:#285d20;--accent-fg:#fff;
  --wk-ink:var(--fg);--wk-line:var(--border);
  font-family:'Segoe UI',system-ui,sans-serif;
}
html[data-theme=dark] .page-watch{
  --bg:#0e202a;--bg-soft:#152b36;--bg-elev:#193440;
  --fg:#e3eff4;--fg-soft:#afc2cd;--fg-muted:#afc2cd;
  --border:#2d424d;--border-strong:#45616f;
  --accent:#a8d792;--accent-hover:#c1e7af;--accent-fg:#102515;
}
@media(prefers-color-scheme:dark){
  html:not([data-theme=light]) .page-watch{
    --bg:#0e202a;--bg-soft:#152b36;--bg-elev:#193440;
    --fg:#e3eff4;--fg-soft:#afc2cd;--fg-muted:#afc2cd;
    --border:#2d424d;--border-strong:#45616f;
    --accent:#a8d792;--accent-hover:#c1e7af;--accent-fg:#102515;
  }
}
.page-watch .site-header{
  position:relative;max-width:1260px;margin:0 auto;padding:25px 36px;
  border:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;
  gap:24px;
}
.page-watch .brand{gap:9px;font-size:26px;font-weight:800;letter-spacing:-1.1px}
.page-watch .brand-text{color:var(--fg)}
.page-watch .brand-text-accent{color:var(--accent)}
.page-watch .brand-mark{
  width:34px;height:34px;border-radius:11px;background:#347b26;
  color:#fff;box-shadow:none;
}
.page-watch .wk-watch-symbol{
  width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;flex:none;
}
.page-watch .brand-mark svg{margin:0}
.page-watch .site-nav{gap:16px;flex-wrap:wrap}
.page-watch .site-nav a{color:var(--fg);font-size:14px;font-weight:600;white-space:nowrap}
.page-watch .site-nav a:hover{background:var(--bg-soft)}
.page-watch .theme-toggle{
  width:38px;height:38px;border-radius:50%;border-color:var(--border);
  color:var(--fg);padding:7px;
}
.page-watch .theme-toggle:hover{background:var(--bg-soft)}
.page-watch .purify-input-wrap{border-color:var(--border-strong);border-radius:13px}
.page-watch .purify-btn{border-radius:10px}
@media(max-width:680px){
  .page-watch .site-header{padding:16px 20px;gap:12px;flex-wrap:wrap}
  .page-watch .brand{font-size:24px}
  .page-watch .site-nav{gap:8px}
  .page-watch .site-nav a{padding:8px 6px;font-size:13px;min-height:44px;display:inline-flex;align-items:center}
  .page-watch .theme-toggle{width:44px;height:44px}
}
@media(max-width:390px){
  .page-watch .site-header{padding:12px 16px}
  .page-watch .site-nav{width:100%;justify-content:flex-end}
}

/* Keep popup surfaces and controls on the same palette as the player. */
body.page-watch .wk-dialog,.page-watch .wk-download-dialog,.page-watch .trim-modal-card{background:var(--bg-soft);color:var(--fg);border:1px solid var(--border-strong);border-radius:16px;font-family:inherit}
.page-watch .trim-modal-card{position:relative}.page-watch .trim-modal-card h2{padding-right:44px}
.page-watch .wk-dialog>h2{padding-right:44px}
.page-watch .wk-dialog input,.page-watch .wk-dialog select,.page-watch .wk-dialog textarea{background:var(--bg-elev);color:var(--fg);border-color:var(--border-strong)}
.page-watch .wk-dialog .wk-offer-primary,.page-watch .wk-dialog .wk-save-done{background:var(--accent);color:var(--accent-fg)}
.page-watch .wk-dialog .wk-offer-signin{color:var(--fg);border-color:var(--border-strong)}
.page-watch .wk-download-tabs button{background:var(--bg-elev);color:var(--fg);border-color:var(--border-strong)}
.page-watch .wk-download-tabs button[aria-pressed=true]{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.page-watch #chaptersClose,.page-watch .wk-dialog .wk-close,.page-watch #wkDownloadClose,.page-watch .wk-loop-close{background:transparent!important;color:var(--fg)!important;border:0!important;border-radius:0;box-shadow:none!important;font-size:25px;line-height:1;width:44px;height:44px;padding:4px;cursor:pointer}
.page-watch .wk-dialog .wk-close,.page-watch .wk-loop-close{position:absolute;right:12px;top:12px;margin:0}
.page-watch #chaptersClose:hover,.page-watch .wk-close:hover,.page-watch #wkDownloadClose:hover,.page-watch .wk-loop-close:hover{background:transparent!important;color:var(--fg)!important}
.page-watch #chaptersClose:focus-visible,.page-watch .wk-close:focus-visible,.page-watch #wkDownloadClose:focus-visible,.page-watch .wk-loop-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Reserve sidebar width without letting a long transcript push the history down. */
@media(min-width:1400px){
 .page-watch .watch-main:has(#transcriptPanel:not([hidden])){max-width:1760px;--wk-transcript-width:clamp(400px,30vw,540px)}
 .page-watch .player-area:has(#transcriptPanel:not([hidden])){position:relative;padding-right:calc(var(--wk-transcript-width) + 24px)}
 .page-watch .watch-main:has(#transcriptPanel:not([hidden])) #history{margin-right:calc(var(--wk-transcript-width) + 24px)}
 .page-watch .player-area #transcriptPanel:not([hidden]){position:absolute;right:0;top:0;width:var(--wk-transcript-width);height:100%;margin-top:0;max-height:calc(100dvh - 32px)}
 .page-watch #transcriptPanel .pv-transcript{display:flex;flex-direction:column;height:100%;max-height:calc(100dvh - 32px)}
 .page-watch #transcriptPanel .pv-transcript-head,.page-watch #transcriptPanel .pv-transcript-tools{flex-shrink:0}
 .page-watch #transcriptPanel .pv-transcript-body{flex:1;min-height:0;max-height:calc(100dvh - 260px);overflow-y:auto}
 .page-watch .player-area:has(#transcriptPanel:not([hidden])) .player-stage,.page-watch.purify-focus-mode .player-area:has(#transcriptPanel:not([hidden])) .player-controls{max-width:100%;width:100%}
}

/* Use Share and Loop's pill buttons in every player popup. */
.page-watch .wk-dialog button:not(.wk-close),.page-watch .wk-dialog .wk-offer-actions a,.page-watch .wk-download-tabs button{appearance:none;background:var(--bg-soft);color:var(--fg-soft);border:1px solid var(--border);border-radius:999px;padding:8px 14px;font-family:inherit;font-size:.9rem;font-weight:500;line-height:1.4;text-decoration:none;cursor:pointer;filter:none}
.page-watch .wk-dialog button:not(.wk-close):hover,.page-watch .wk-dialog .wk-offer-actions a:hover,.page-watch .wk-download-tabs button:hover{background:var(--bg-elev);color:var(--fg);border-color:var(--border-strong);filter:none}
.page-watch .wk-dialog .wk-offer-actions .wk-offer-primary,.page-watch .wk-dialog button.wk-save-done{background:transparent;color:var(--accent);border-color:var(--accent)}
.page-watch .wk-dialog .wk-offer-actions .wk-offer-primary:hover,.page-watch .wk-dialog button.wk-save-done:hover,.page-watch .wk-download-tabs button[aria-pressed=true]{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}