/* Match the embedding canvas while keeping controls dark. */
html[data-surface="video_overlay"]{color-scheme:normal;background:transparent}
body[data-surface="video_overlay"]{background:transparent;pointer-events:none}
body[data-surface="video_overlay"] .app{color-scheme:dark;position:fixed;top:48px;right:48px;width:min(680px,calc(100vw - 80px));height:min(760px,calc(100dvh - 100px));background:var(--bg);border:1px solid var(--line);border-radius:12px;overflow:hidden;pointer-events:auto;box-shadow:0 10px 32px #0007;padding-top:8px}
body[data-surface="video_overlay"] .page>h1,body[data-surface="video_overlay"] .page>.heading{padding-right:32px}
#overlay-open{position:fixed;right:48px;top:48px;pointer-events:auto;background:var(--bg);color:var(--gold);box-shadow:0 3px 16px #0005}
#overlay-close{position:absolute;right:0;top:0;width:44px;height:44px;min-height:44px;border:0;z-index:5;color:var(--ink);background:var(--bg)}
@media(max-width:700px){body[data-surface="video_overlay"] .app{right:20px;top:36px;width:calc(100vw - 40px);height:calc(100dvh - 80px)}#overlay-open{right:20px;top:36px}}
