/* The sound controls form the lower edge of the cinema player. */
.watch-dock{padding-bottom:0;box-shadow:none}
.watch-dock .player{border-radius:12px 12px 0 0}
.watch-dock:has(.playback-support[hidden]) .player{border-radius:12px}
.watch-dock .playback-support{
  display:flex;align-items:center;justify-content:space-between;
  min-height:62px;margin:0;padding:6px 9px 6px 15px;gap:12px;
  background:#14181d;border:1px solid #252b31;border-top:0;
  border-radius:0 0 12px 12px;box-shadow:none;
}
.playback-identity{display:flex;align-items:center;gap:9px;min-width:0;flex:1;padding-block:7px}
.status-visual{display:grid;place-items:center;flex:none;width:18px;height:20px;color:#a9beb1}
.playback-support .playback-state{font-size:13px;font-weight:400;line-height:1.5;letter-spacing:.1px;color:#b0bac2;overflow-wrap:anywhere}
.playback-support .playback-state:before{display:none}
.status-bars{display:flex;align-items:center;justify-content:center;gap:3px;height:16px}
.status-bars i{display:block;width:2px;height:8px;border-radius:2px;background:currentColor;transform-origin:center}
.status-bars i:nth-child(2){height:16px}.status-bars i:nth-child(3){height:11px}
.status-spinner,.status-pause,.status-warning{display:none}
.playback-support[data-playback=playing] .status-bars i{animation:player-level 1.25s ease-in-out infinite}
.playback-support[data-playback=playing] .status-bars i:nth-child(2){animation-delay:-.3s}
.playback-support[data-playback=playing] .status-bars i:nth-child(3){animation-delay:-.6s}
.playback-support:is([data-playback=loading],[data-playback=paused],[data-playback=ended],[data-playback=error],[data-playback=blocked]) .status-bars{display:none}
.playback-support[data-playback=loading] .status-spinner{display:block;width:15px;height:15px;border:1.5px solid #39434a;border-top-color:#a3b6ab;border-radius:50%;animation:player-spin 1s linear infinite}
.playback-support:is([data-playback=paused],[data-playback=ended]) .status-pause{display:block;width:14px;height:14px;color:#9aa7af}
.playback-support:is([data-playback=error],[data-playback=blocked]) .status-warning{display:block;width:18px;height:18px;color:#c4ab91}
.playback-actions{display:flex;flex:none;align-items:center;justify-content:flex-end;gap:4px;max-width:58%;flex-wrap:wrap}
.playback-support .sound-toggle,.playback-support .play-retry{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;height:auto;min-width:0;max-width:100%;margin:0;padding:10px 7px;
  border:0;border-radius:6px;background:transparent;box-shadow:none;
  color:#c1d5c8;font-family:inherit;font-size:14px;font-weight:500;line-height:1.5;
  letter-spacing:.1px;white-space:normal;transition:background .18s,color .18s;
}
.playback-support .sound-toggle svg{width:19px;height:19px;flex:none;opacity:.85}
.sound-label{min-width:0;text-align:start;overflow-wrap:anywhere}
.sound-switch{position:relative;display:block;flex:none;width:38px;height:23px;border:1px solid #475158;border-radius:20px;background:#2b3339;transition:background .2s,border-color .2s}
.sound-switch:after{content:"";position:absolute;inset-block-start:3px;inset-inline-start:3px;width:15px;height:15px;border-radius:50%;background:#b0bbc1;transition:inset-inline-start .2s,background .2s}
.sound-toggle[aria-pressed=true] .sound-switch{background:#b9d9c5;border-color:#b9d9c5}
.sound-toggle[aria-pressed=true] .sound-switch:after{inset-inline-start:18px;background:#243e30}
.sound-toggle .volume-waves{display:none}.sound-toggle[aria-pressed=true] .volume-waves{display:block}.sound-toggle[aria-pressed=true] .volume-muted{display:none}
.playback-support .sound-toggle[aria-pressed=true]{background:transparent;color:#c9e0d1;box-shadow:none}
.playback-support .sound-toggle:disabled{opacity:.45;cursor:wait}
.playback-support .play-retry{color:#c5d2dd;border:1px solid #333f49;padding-inline:11px}
@media(hover:hover){.playback-support .sound-toggle:hover,.playback-support .play-retry:hover{background:#20272d;color:#e1ede5}}
.playback-support .sound-toggle:active,.playback-support .play-retry:active{background:#28312f}
.playback-support button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.film-details{padding-top:18px}
@keyframes player-level{0%,100%{transform:scaleY(.5)}45%{transform:scaleY(1)}70%{transform:scaleY(.75)}}
@keyframes player-spin{to{transform:rotate(360deg)}}
@media(max-width:350px){.watch-dock .playback-support{padding-inline:11px 5px;gap:8px}.playback-identity{gap:7px}.playback-support .sound-toggle{gap:8px;padding-inline:5px}.playback-support .sound-toggle>svg{display:none}}
@media(prefers-reduced-motion:reduce){.status-bars i,.status-spinner,.sound-toggle,.sound-switch,.sound-switch:after{animation:none!important;transition:none!important}}
