/* The player shares the site's colors; the video itself keeps a quiet dark surround. */
html.catalog-video-is-open { overflow: hidden !important; }
.catalog-video-dialog, .catalog-video-dialog * { box-sizing: border-box; }
.catalog-video-dialog:not([open]) { display: none !important; }
.catalog-video-dialog[open] {
    display: flex; flex-direction: column; gap: 0;
    position: fixed; inset: 0; margin: auto; padding: 0;
    width: min(1000px, calc(100vw - 2rem)); max-width: none;
    max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); overflow: auto;
    border: 1px solid color-mix(in srgb, var(--ink) 24%, transparent); border-radius: 1.25rem;
    background: var(--panel-strong); color: var(--ink);
    box-shadow: 0 24px 90px #0008;
}
/* Keep the aspect-ratio stage from overflowing a compressed grid row and
   covering the source buttons on short windows. Scroll the complete stack. */
.catalog-video-dialog > .catalog-video-heading,
.catalog-video-dialog > .catalog-video-stage,
.catalog-video-dialog > .catalog-video-footer { flex: 0 0 auto; }
.catalog-video-dialog::backdrop { background: #020712bf; backdrop-filter: blur(7px); }
.catalog-video-dialog .catalog-video-heading {
    position: sticky; top: 0; z-index: 2; display: flex; align-items: flex-start;
    justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem;
    background: var(--panel-strong); border-bottom: 1px solid color-mix(in srgb, var(--ink) 15%, transparent);
}
.catalog-video-heading-copy { min-width: 0; }
.catalog-video-dialog .catalog-video-kicker { margin: 0 0 .3rem; color: var(--muted); font-family: inherit; font-size: .7rem; font-weight: 700; line-height: 1.5; letter-spacing: .07em; text-transform: uppercase; }
.catalog-video-dialog .catalog-video-title { margin: 0; font-family: inherit; font-size: clamp(1rem, 2vw, 1.4rem); font-weight: 750; line-height: 1.4; overflow-wrap: anywhere; }
.catalog-video-dialog .catalog-video-close { flex: 0 0 auto; }
.catalog-video-stage { position: relative; min-height: 200px; width: 100%; aspect-ratio: 16 / 9; background: #070b14; color: #f5f7ff; }
.catalog-video-stage iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; border-radius: 0; }
.catalog-video-placeholder { display: flex; flex-direction: column; gap: .9rem; align-items: center; justify-content: center; min-height: 200px; height: 100%; padding: 1.5rem; text-align: center; background: radial-gradient(ellipse at center, #1c263d, #070b14 75%); }
.catalog-video-dialog a.catalog-video-placeholder { color: #f5f7ff; text-decoration: none; cursor: pointer; }
.catalog-video-dialog a.catalog-video-placeholder:hover { filter: brightness(1.12); }
.catalog-video-dialog a.catalog-video-placeholder:focus-visible { outline-offset: -4px; }
.catalog-video-dialog .catalog-video-placeholder p { margin: 0; color: #d5dcee; font-size: .95rem; line-height: 1.6; }
.catalog-video-symbol { display: grid; place-items: center; padding-left: .18rem; width: 3.5rem; height: 3.5rem; border: 1px solid #8d9ab755; border-radius: 50%; background: #ffffff0c; color: #f5f7ff; font-size: 1.15rem; }
.catalog-video-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .85rem 1.5rem; padding: 1rem 1.25rem; background: var(--panel-strong); }
.catalog-video-dialog .catalog-video-status { flex: 1 1 18rem; margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.6; }
.catalog-video-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.catalog-video-dialog .catalog-action {
    display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .7rem 1rem;
    margin: 0; border: 1px solid color-mix(in srgb, var(--ink) 28%, transparent); border-radius: .7rem;
    color: var(--ink); background: var(--panel-strong); font-family: inherit; font-size: .88rem; line-height: 1.4;
    font-weight: 750; text-decoration: none; cursor: pointer; white-space: normal; overflow-wrap: anywhere;
}
html[data-theme] .catalog-video-dialog a.catalog-video-external { background: var(--ink); color: var(--panel-strong) !important; border-color: var(--ink); }
.catalog-video-dialog .catalog-action:hover { filter: brightness(1.06); }
.catalog-video-dialog :where(a,button):focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.catalog-video-dialog .catalog-video-retry[hidden] { display: none !important; }
.catalog-page .catalog-watch-icon { font-size: .8em; margin-right: .4rem; }
@media (max-width: 560px) {
    .catalog-video-dialog[open] { width: calc(100vw - 1rem); max-height: calc(100vh - 1rem); max-height: calc(100dvh - 1rem); border-radius: 1rem; }
    .catalog-video-dialog .catalog-video-heading, .catalog-video-footer { padding: .9rem; }
    .catalog-video-actions { width: 100%; }
    .catalog-video-actions .catalog-action { flex: 1 1 auto; }
    .catalog-video-dialog .catalog-video-status { flex-basis: 100%; }
}
@media (forced-colors: active) {
    .catalog-video-dialog[open], .catalog-video-dialog .catalog-action { border: 1px solid CanvasText; }
    .catalog-video-dialog::backdrop { background: #000a; backdrop-filter: none; }
}