/* v408: scoped minimal controls; existing navigation/social/seek nodes stay in place. */
.video-shell[data-simple-controls] > .video-simple-controls {
    position:absolute; inset:auto 8px 6px; height:44px; z-index:33;
    display:flex; align-items:center; gap:2px; direction:ltr;
    padding:0 3px; border-radius:8px; color:#fff;
    background:linear-gradient(transparent,rgba(0,0,0,.75));
    font:500 12px/1.2 system-ui,sans-serif; pointer-events:auto;
}
.video-shell[data-simple-controls] > .video-simple-controls button {
    display:grid; place-items:center; flex:0 0 44px; width:44px; min-width:44px;
    height:44px; min-height:44px; padding:10px; margin:0; border:0; border-radius:6px;
    background:transparent; color:inherit; cursor:pointer; touch-action:manipulation;
}
.video-shell[data-simple-controls] > .video-simple-controls button:hover { background:rgba(255,255,255,.14); }
.video-shell[data-simple-controls] > .video-simple-controls button:focus-visible { outline:2px solid #fff; outline-offset:-3px; }
.video-shell[data-simple-controls] > .video-simple-controls svg { width:22px; height:22px; pointer-events:none; }
.video-simple-controls .video-simple-time { color:inherit; white-space:nowrap; font:inherit; font-variant-numeric:tabular-nums; }
.video-simple-controls .video-simple-spacer { flex:1; }
html:root body[data-page="loopz"] .loopz-item .video-shell[data-simple-controls] > .video-simple-controls {
    left:max(16px,env(safe-area-inset-left,0px));
    right:calc(var(--loopz-rail-inset) + var(--loopz-rail-width) + 12px);
    bottom:calc(var(--loopz-nav-reserve) + 48px);
}
html:root body[data-page="loopz"] .loopz-item.loopz-has-seek:has(.video-simple-controls) .loopz-meta {
    bottom:calc(var(--loopz-nav-reserve) + 136px) !important;
}
@media (max-height:500px) {
    /* A capped portrait frame can be <200px wide in landscape. Keep all
       three 44px buttons; move only its clock above the row, without
       growing the media frame or adding page padding. */
    .feed-video-shell[data-simple-controls]:not(:fullscreen) > .video-simple-controls {
        justify-content:space-between;
    }
    .feed-video-shell[data-simple-controls]:not(:fullscreen) > .video-simple-controls .video-simple-time {
        position:absolute; bottom:44px; left:3px; padding:3px 5px;
        background:rgba(0,0,0,.72); border-radius:3px;
    }
    .feed-video-shell[data-simple-controls]:not(:fullscreen) > .video-simple-controls .video-simple-spacer { display:none; }
    html:root body[data-page="loopz"] .loopz-item .video-shell[data-simple-controls] > .video-simple-controls {
        right:calc(var(--loopz-rail-inset) + 128px);
    }
}
html:root body .video-shell[data-simple-controls]:fullscreen {
    width:100vw !important; height:100dvh !important; max-width:none !important; max-height:none !important;
    aspect-ratio:auto !important; background:#000; --loopz-nav-reserve:0px;
}
html:root body .video-shell[data-simple-controls]:fullscreen > video.chaabi-custom-player {
    width:100% !important; height:100% !important; max-height:100% !important; object-fit:contain !important;
}
html:root body[data-page] .video-shell[data-simple-controls]:fullscreen > .video-simple-controls {
    left:8px; right:8px; bottom:max(44px,env(safe-area-inset-bottom,0px));
}
@media (forced-colors:active) {
    .video-shell[data-simple-controls] > .video-simple-controls { background:Canvas; color:CanvasText; border:1px solid CanvasText; }
    .video-shell[data-simple-controls] > .video-simple-controls button:focus-visible { outline-color:Highlight; }
}

/* Home/Post are tap-only; the existing controls live in the single-video viewer. */
body:is([data-page="home"],[data-page="post"]) .post-card .video-shell:not(.chaabi-single-video-media) > :is(.video-simple-controls,[data-seek-ui],[data-mute]) { display:none !important; }
body:is([data-page="home"],[data-page="post"]) .post-card video.chaabi-custom-player { touch-action:manipulation; }
body:is([data-page="home"],[data-page="post"]) .post-card [data-single-video-open] > span { display:none !important; }
html.chaabi-single-video-open,html.chaabi-single-video-open body { overflow:hidden !important; overscroll-behavior:none; }
dialog#chaabi-single-video-viewer.chaabi-single-video-viewer[open] {
    display:block !important; position:fixed !important; inset:0 !important;
    width:100vw !important; height:100vh !important; height:100dvh !important;
    max-width:none !important; max-height:none !important; min-width:0; min-height:0;
    margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important;
    background:#000 !important; color:#fff !important; overflow:hidden !important;
    overscroll-behavior:none; box-sizing:border-box; outline:0;
}
dialog#chaabi-single-video-viewer::backdrop { background:#000; }
dialog#chaabi-single-video-viewer.chaabi-single-video-viewer[open] .video-shell.chaabi-single-video-media {
    display:block !important; position:relative !important; width:100% !important; height:100% !important;
    min-width:0 !important; min-height:0 !important; max-width:none !important; max-height:none !important;
    aspect-ratio:auto !important; margin:0 !important; padding:0 !important; border:0 !important;
    border-radius:0 !important; overflow:hidden !important; background:#000 !important;
}
dialog#chaabi-single-video-viewer.chaabi-single-video-viewer[open] .video-shell.chaabi-single-video-media > video.chaabi-custom-player {
    display:block !important; position:absolute !important; inset:0 !important;
    width:100% !important; height:100% !important; min-width:0 !important; min-height:0 !important;
    max-width:none !important; max-height:none !important; aspect-ratio:auto !important;
    margin:0 !important; padding:0 !important; object-fit:contain !important; background:#000 !important;
}
dialog#chaabi-single-video-viewer [data-single-video-open],dialog#chaabi-single-video-viewer [data-video-loopz],dialog#chaabi-single-video-viewer [data-mute] { display:none !important; }
dialog#chaabi-single-video-viewer.chaabi-single-video-viewer[open] .video-simple-controls {
    display:flex !important; position:absolute !important; inset-inline:12px !important;
    top:auto !important; bottom:calc(12px + env(safe-area-inset-bottom,0px)) !important;
    width:auto !important; min-width:0 !important; min-height:52px !important;
    align-items:center; flex-wrap:nowrap; gap:8px; padding:4px 8px !important; margin:0 !important;
    border-radius:10px; background:rgba(0,0,0,.65); color:#fff !important; z-index:12;
}
dialog#chaabi-single-video-viewer.chaabi-single-video-viewer[open] .video-simple-time {
    position:static !important; inset:auto !important; transform:none !important;
    width:auto !important; margin:0 !important; padding:0 !important; background:none !important;
    color:#fff !important; font-size:14px; line-height:20px; white-space:nowrap; flex:0 0 auto;
}
dialog#chaabi-single-video-viewer.chaabi-single-video-viewer[open] .video-simple-controls button {
    width:44px !important; min-width:44px !important; height:44px !important; min-height:44px !important;
    padding:0 !important; margin:0 !important; flex:0 0 44px; color:#fff !important;
}
dialog#chaabi-single-video-viewer.chaabi-single-video-viewer[open] [data-seek-ui] {
    display:flex !important; position:absolute !important; inset-inline:20px !important;
    top:auto !important; bottom:calc(64px + env(safe-area-inset-bottom,0px)) !important;
    width:auto !important; height:44px !important; align-items:center; margin:0 !important;
    padding:0 !important; pointer-events:auto; z-index:13; direction:ltr;
}
dialog#chaabi-single-video-viewer.chaabi-single-video-viewer[open] input[data-loopz-seek] {
    display:block !important; appearance:none; -webkit-appearance:none; width:100% !important;
    height:44px !important; min-height:44px !important; padding:0 !important; margin:0 !important;
    border:0 !important; border-radius:0 !important; direction:ltr !important; touch-action:none;
    cursor:pointer; color:#fff;
    background:linear-gradient(to right,#fff 0 var(--seek-progress,0%),rgba(255,255,255,.5) var(--seek-progress,0%) var(--seek-buffered,0%),rgba(255,255,255,.2) var(--seek-buffered,0%) 100%) center/100% 3px no-repeat !important;
}
dialog#chaabi-single-video-viewer input[data-loopz-seek]::-webkit-slider-runnable-track { height:3px; background:transparent; }
dialog#chaabi-single-video-viewer input[data-loopz-seek]::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:12px; height:12px; border:0; border-radius:50%; background:#fff; margin-top:-4.5px; }
dialog#chaabi-single-video-viewer input[data-loopz-seek]::-moz-range-track { height:3px; background:transparent; }
dialog#chaabi-single-video-viewer input[data-loopz-seek]::-moz-range-thumb { width:12px; height:12px; border:0; border-radius:50%; background:#fff; }
dialog#chaabi-single-video-viewer [data-seek-time] { display:none; position:absolute; top:-12px; left:0; padding:2px 4px; color:#fff; background:rgba(0,0,0,.7); font-size:11px; line-height:16px; border-radius:4px; }
dialog#chaabi-single-video-viewer .is-seeking [data-seek-time] { display:block; }
dialog#chaabi-single-video-viewer .chaabi-single-video-back {
    display:flex !important; position:absolute !important; z-index:20;
    inset-block-start:calc(12px + env(safe-area-inset-top,0px)); inset-inline-start:calc(12px + env(safe-area-inset-left,0px));
    width:44px !important; height:44px !important; min-width:44px !important; min-height:44px !important;
    align-items:center; justify-content:center; margin:0 !important; padding:0 !important;
    color:#fff !important; background:rgba(0,0,0,.6) !important; border:1px solid rgba(255,255,255,.3) !important;
    border-radius:50% !important; box-shadow:none !important; cursor:pointer;
}
dialog#chaabi-single-video-viewer:dir(rtl) .chaabi-single-video-back svg { transform:rotate(180deg); }
dialog#chaabi-single-video-viewer :is(button,input):focus-visible { outline:2px solid #fff !important; outline-offset:2px; }
