:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#000;color:#fff}body{overflow:hidden}#stage{position:relative;width:100%;height:100%;min-height:0;background:#000;overflow:hidden}#video{display:block;width:100%;height:100%;object-fit:contain;background:#000}#ads{display:none;position:absolute;inset:0;z-index:10}#start{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border:0;border-radius:50%;background:#f04f87;color:#fff;font-size:30px;cursor:pointer;box-shadow:0 2px 16px #0008}#start span{display:inline-block;margin-left:4px}#message{position:absolute;z-index:8;left:12px;bottom:56px;color:#fff;background:#000a;padding:5px 8px;font-size:14px;border-radius:3px;pointer-events:none}.controls{position:absolute;z-index:7;left:0;right:0;bottom:0;display:flex;align-items:center;gap:10px;padding:28px 14px 10px;background:linear-gradient(transparent,#000b 45%,#000e);opacity:1;transition:opacity .2s}.controls.hidden,.controls.hidden *{opacity:0!important;pointer-events:none!important}.control-button{flex:0 0 auto;border:0;background:transparent;color:#fff;font-size:18px;line-height:1;padding:5px;cursor:pointer}.control-button:hover{color:#ff5b91}.timeline{min-width:35px;flex:1;height:4px;accent-color:#f04f87;cursor:pointer}.time{white-space:nowrap;font-size:13px;font-variant-numeric:tabular-nums}.volume{width:72px;height:4px;accent-color:#f04f87;cursor:pointer}.settings-wrap{position:relative;display:flex;align-items:center}.speed{position:absolute;right:0;bottom:34px;display:none;min-width:74px;padding:6px;background:#171717;color:#fff;border:1px solid #666;border-radius:4px}.settings-wrap.open .speed{display:block}#stage:fullscreen,#stage:-webkit-full-screen{width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none}#stage:fullscreen #video,#stage:-webkit-full-screen #video{width:100%;height:100%}#stage:fullscreen .controls,#stage:-webkit-full-screen .controls{padding-bottom:max(10px,env(safe-area-inset-bottom))}@media(max-width:620px){.controls{gap:5px;padding:23px 7px 8px}.control-button{font-size:15px;padding:4px}.time{font-size:11px}.volume{width:46px}.timeline{min-width:20px}}@media(max-width:420px){.volume{display:none}.controls{gap:4px}.time{font-size:10px}}

/* Keep the transparent control bar from intercepting the ad provider's Skip Ad button. */
.controls{pointer-events:none}.controls>*{pointer-events:auto}

/* Keep the transparent control bar from intercepting the ad provider Skip Ad button. */
.controls{pointer-events:none}.controls>*{pointer-events:auto}

/* Fit the iframe viewport; keep controls within short mobile embeds. */
html,body{height:100%;min-height:0}
#stage{height:100%;min-height:0}
.controls{padding-bottom:max(8px,env(safe-area-inset-bottom))}
@media(max-width:620px){
 .controls{display:grid;grid-template-columns:32px 32px 32px minmax(0,1fr) 32px 32px 36px;gap:2px;padding:18px 6px 6px}
 .timeline{grid-column:1/-1;grid-row:1;width:100%;margin:0 0 7px;min-width:0}
 .time{font-size:10px;text-align:center}
 .volume{display:none}
 .control-button{min-height:30px;font-size:16px}
 .settings-wrap{justify-content:center}
}
#stage.landscape-fallback{
 position:fixed!important;left:50%!important;top:50%!important;
 width:var(--landscape-width)!important;height:var(--landscape-height)!important;
 max-width:none!important;max-height:none!important;
 transform:translate(-50%,-50%) rotate(90deg);transform-origin:center;z-index:99999
}
#stage.landscape-fallback #video{width:100%;height:100%;object-fit:contain}

/* Keep ad controls above the player controls and fully clickable. */
#ads{z-index:10;pointer-events:auto}
.controls{z-index:7}
.controls.hidden,.controls.hidden *{pointer-events:none!important}
