/* Shared result/player controls. Keep download UI rules here, not in page styles. */
.media-download-controls { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px; }
.media-download-controls .media-quality-control { display: inline-flex; min-width: 0; max-width: 100%; border: 1px solid var(--gnw-border); border-radius: 12px; }
.media-download-controls .media-quality-control > .btn {
    box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
    min-height: 44px; margin: 0; padding: 10px 12px; border: 0; border-radius: 0;
    background: transparent; color: var(--gnw-text); font-family: system-ui, -apple-system, "Segoe UI", sans-serif !important;
    font-size: .92rem; font-weight: 600; line-height: 1.5; text-decoration: none; text-align: center;
    cursor: pointer; transition: background .15s, color .15s;
}
.media-download-controls .media-quality-control > .media-quality-button { position: relative; flex: 1 1 auto; width: auto; min-width: 128px; }
.media-download-controls .media-quality-control[data-media-kind="mp4"] > .media-quality-button { background: rgba(110,168,254,.14); }
.media-download-controls .media-quality-control > .media-quality-action { flex: 0 0 44px; min-width: 44px; width: 44px; padding: 0; border-left: 1px solid var(--gnw-border); color: var(--gnw-accent); }
.media-download-controls .media-quality-control > .media-quality-action span { font-family: monospace; font-size: .82rem; }
.media-download-controls .media-quality-control > :first-child { border-radius: 11px 0 0 11px; }
.media-download-controls .media-quality-control > :last-child { border-radius: 0 11px 11px 0; }
.media-download-controls .media-quality-control > :only-child { border-radius: 11px; }
.media-download-controls .media-quality-control:hover, .media-download-controls .media-quality-control:focus-within { border-color: rgba(110,168,254,.5); }
.media-download-controls .media-quality-control > .btn:hover, .media-download-controls .media-quality-control > .btn:focus-visible, .media-download-controls .media-quality-control > .btn[aria-expanded="true"] { background: rgba(110,168,254,.1); color: var(--gnw-text); }
.media-download-controls .media-quality-control > .btn:focus-visible { outline: 2px solid var(--gnw-accent); outline-offset: -2px; }
.media-download-controls .media-quality-control > .btn:disabled { opacity: .55; cursor: default; }
.media-download-controls .media-quality-control > .is-download-pending { background: transparent; box-shadow: none; color: var(--gnw-muted); cursor: wait; }
.media-download-controls .has-media-size { margin-bottom: 22px; }
.media-download-controls .media-size-label { position: absolute; top: calc(100% + 7px); left: 50%; transform: translateX(-50%); color: var(--gnw-muted); font-size: .72rem; font-weight: 500; line-height: 1; white-space: nowrap; pointer-events: none; }
.media-download-controls .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.media-download-controls .hls-file-download-status[hidden] { display: none; }
.media-download-controls .hls-file-download-status:not([hidden]) {
    box-sizing: border-box; flex: 0 0 100%; width: 100%; min-width: 0; display: flex; flex-wrap: wrap; align-items: center;
    gap: 8px; margin: 2px 0 4px; padding: 14px 16px; border: 1px solid rgba(110,168,254,.28); border-radius: 12px;
    background: rgba(110,168,254,.08); color: #c6d5e8; font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    font-size: .88rem; font-weight: 500; line-height: 1.35; overflow-wrap: anywhere;
}
.media-download-controls .hls-file-download-status.is-complete:not([hidden]) { background: rgba(25,135,84,.14); border-color: rgba(58,211,138,.45); color: #8ce6b7; font-weight: 600; }
.media-download-controls .hls-file-download-status.is-error:not([hidden]) { background: rgba(220,53,69,.12); border-color: rgba(255,107,122,.42); color: #ffabb5; font-weight: 600; }
.media-download-controls .hls-file-download-status.is-cancelled:not([hidden]) { background: rgba(108,117,125,.12); border-color: rgba(173,181,189,.28); color: #c4cad2; }
.media-download-controls .hls-file-download-note, .media-download-controls .is-complete .hls-file-download-message { flex-basis: 100%; }
.media-download-controls .hls-file-download-note:not([hidden]) { display: block; margin-top: 4px; }
.media-download-controls .media-download-cancel { padding: 0; border: 0; background: transparent; color: var(--gnw-accent); font: inherit; font-weight: 600; cursor: pointer; }
.media-download-controls .hls-file-download-chrome { color: var(--gnw-accent); font-weight: 600; }
@media (max-width: 767px) {
    .media-download-controls { flex-direction: column; }
    .media-download-controls .media-quality-control { width: 100%; }
    .media-download-controls .media-quality-control > .media-quality-button { flex: 1 1 auto; width: auto; }
    .media-download-controls .media-quality-control > .media-quality-action { flex-basis: 48px; width: 48px; min-width: 48px; }
}