/* Keep each Short, its caption, and its controls inside one visible frame. */
.voicer-shorts { background: var(--voicer-canvas) !important; }
.voicer-shorts #vidcontainer { margin-top: 34px !important; padding-top: 6px; }
.voicer-shorts .snapcontainer {
    height: calc(100dvh - 64px); overflow-y: auto; overflow-x: hidden;
    scroll-snap-type: y mandatory; overscroll-behavior-y: contain; scrollbar-width: none;
}
.voicer-shorts .snapcontainer::-webkit-scrollbar { display: none; }
.voicer-shorts .shortsContainer {
    display: flex; align-items: flex-end; justify-content: center; gap: 12px;
    height: calc(100dvh - 64px) !important; min-height: 0;
    margin: 0 !important; padding: 0 12px 10px;
    scroll-snap-align: start; scroll-snap-stop: always;
}
.voicer-shorts .shortsBoxVideo {
    position: relative; flex: 0 0 auto; width: auto; max-width: min(471px, calc(100% - 76px));
    height: calc(100dvh - 84px); max-height: 100%; aspect-ratio: 9 / 16;
    margin: 0 !important; overflow: hidden; border-radius: 16px; background: #0b1422;
    box-shadow: 0 12px 34px rgba(17, 43, 79, .18);
}
.voicer-shorts .shortsBoxVideo > div:first-child { width: 100%; height: 100%; }
.voicer-shorts .shortsBoxVideo video {
    display: block; width: 100% !important; height: 100% !important;
    max-height: none !important; margin: 0; border-radius: 0;
    object-fit: contain; background: #0b1422;
}
.voicer-shorts .shortsBoxVideo .shortsBoxInfo {
    position: absolute; right: 0; bottom: 0; left: 0; z-index: 2;
    display: flex; align-items: flex-end; gap: 9px;
    max-width: none; min-height: 0; max-height: 48%; margin: 0 !important;
    padding: 52px 15px 16px !important;
    background: linear-gradient(transparent, rgba(5, 12, 23, .87));
    color: #fff; overflow: hidden;
}
.voicer-shorts .shortsBoxInfo > img {
    flex: 0 0 38px; width: 38px; height: 38px; margin: 0 0 2px !important;
    border: 2px solid rgba(255,255,255,.9); border-radius: 50%; object-fit: cover;
}
.voicer-shorts .shortsBoxInfo .vid-info-shorts { min-width: 0; max-width: none; width: 100%; }
.voicer-shorts .shortsBoxInfo .vid-info-shorts p { margin: 0 0 4px; color: #fff !important; line-height: 1.35; }
.voicer-shorts .shortsBoxInfo .vid-info-shorts p:first-child {
    display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
    overflow-wrap: anywhere; text-shadow: 0 1px 5px rgba(0,0,0,.45);
}
.voicer-shorts .shortsBoxInfo .vid-info-shorts p:last-child { color: #dce8f8 !important; font-size: 11px; }
.voicer-shorts .shortsBoxInfo .vid-info-shorts button { float: none !important; margin: 4px 0 !important; }
.voicer-shorts .shortsBoxVideo > .shorts-sound-toggle {
    position: absolute; top: 14px; left: 14px; z-index: 3;
    display: grid; place-items: center; width: 42px; height: 42px;
    border: 1px solid rgba(255,255,255,.26); border-radius: 50%;
    background: rgba(10, 23, 42, .66); color: #fff; cursor: pointer;
}
.voicer-shorts .shortsBoxVideo > .shorts-sound-toggle:hover { background: rgba(14, 40, 77, .88); }
.voicer-shorts .shortsBoxTools {
    flex: 0 0 62px; display: flex; flex-direction: column; align-items: center;
    justify-content: flex-end; width: 62px; height: auto !important;
    margin: 0 0 2px !important; padding: 0 !important;
}
.voicer-shorts .shortsBoxTools > div { width: 100%; margin: 0 !important; text-align: center; }
.voicer-shorts .shortsBoxTools > div.text-center { margin: 1px 0 6px !important; font-size: 11px; }
.voicer-shorts .shortsBoxTools > div.text-center span { margin: 0 !important; color: #48617e; }
.voicer-shorts .shortsBoxTools > div.facolors { display: flex; justify-content: center; }
.voicer-shorts .shortsBoxTools :is(.fa-thumbs-up, .fa-paper-plane, .fa-comments, .fa-ellipsis-v),
.voicer-shorts .shortsBoxTools [id^="StatusFavorite"] :is(.fa-heart, .fa-star) {
    background: #eaf3ff !important; color: #234566 !important;
}
.voicer-shorts .shorts-favorite-action {
    display: grid; place-items: center; width: 48px; height: 48px; padding: 0;
    border: 0; border-radius: 50%; background: #eaf3ff; color: #234566;
    text-decoration: none; cursor: pointer;
}
.voicer-shorts .shorts-favorite-action:hover,
.voicer-shorts .shorts-favorite-action:focus-visible { background: #d9eaff; color: #175bc7; }
.voicer-shorts .shorts-favorite-action[aria-pressed="true"] { background: #d8e8ff; color: #155cc7; }
.voicer-shorts .shorts-favorite-action:focus-visible { outline: 2px solid #195fe6; outline-offset: 3px; }
.voicer-shorts .shorts-favorite-action:disabled { cursor: wait; opacity: .65; }
.voicer-shorts .shorts-bookmark-glyph {
    display: block; width: 23px; height: 23px; background: currentColor;
    -webkit-mask: url('/icons/outline-bookmark.svg') center / contain no-repeat;
    mask: url('/icons/outline-bookmark.svg') center / contain no-repeat;
}
.voicer-shorts .open-footer-gallery[aria-expanded="true"] { opacity: 0; pointer-events: none; }
#menu-sidebar-left-3 > div:first-child { justify-content: space-between; }
#menu-sidebar-left-3 #closesidebarmobil { flex: 0 0 38px !important; margin-left: auto !important; }
#menu-sidebar-left-3 .shortcut-links a { min-height: 47px; margin: 0 !important; }
#menu-sidebar-left-3 .shortcut-links a[aria-current="page"] { background: #e6f0ff; color: #155bc2 !important; }
#menu-sidebar-left-3 .subscribed-list a { width: 100%; min-height: 42px; margin: 0 0 4px; padding: 5px 10px; border-radius: 10px; }
#menu-sidebar-left-3 .subscribed-list a:hover { background: #e9f3ff; }
#menu-sidebar-left-3 .subscribed-list a img { width: 30px; height: 30px; margin-right: 11px; object-fit: cover; }
#menu-sidebar-left-3 .subscribed-list a p { margin: 0; font-size: 13px; font-weight: 600; }
@media (min-width: 768px) {
    #footer-bar:not(.d-lg-none) { right: 16px !important; width: clamp(260px, 22vw, 320px); }
}
body.theme-dark .voicer-shorts { background: #111927 !important; }
body.theme-dark .voicer-shorts .shortsBoxTools > div.text-center span { color: #b9cce5; }
body.theme-dark .voicer-shorts .shortsBoxTools :is(.fa-thumbs-up, .fa-paper-plane, .fa-comments, .fa-ellipsis-v),
body.theme-dark .voicer-shorts .shortsBoxTools [id^="StatusFavorite"] :is(.fa-heart, .fa-star) {
    background: #263b56 !important; color: #e1edfc !important;
}
body.theme-dark .voicer-shorts .shorts-favorite-action { background: #263b56; color: #e1edfc; }
body.theme-dark .voicer-shorts .shorts-favorite-action[aria-pressed="true"] { background: #244e84; color: #fff; }
body.theme-dark #menu-sidebar-left-3 .shortcut-links a[aria-current="page"] { background: #284665; color: #a9cfff !important; }
@media (min-width: 1201px) {
    .voicer-shorts .sidebarvid {
        top: 50px; width: 232px; height: calc(100dvh - 50px);
        padding: 18px 12px 20px !important; overflow-y: auto;
        background: #f8fbff !important; border-right: 1px solid #dce7f5;
        box-shadow: none !important;
    }
    .voicer-shorts .containervid { padding-left: 256px; }
    .voicer-shorts .sidebarvid.small-sidebar { width: 68px; padding-inline: 8px !important; }
    .voicer-shorts .containervid.large-container { padding-left: 88px; }
    .voicer-shorts .sidebarvid .shortcut-links { display: grid; gap: 3px; }
    .voicer-shorts .sidebarvid .shortcut-links a {
        display: flex; align-items: center; width: 100%; min-height: 44px;
        margin: 0; padding: 9px 11px; border-radius: 11px;
        color: #395675 !important; text-decoration: none;
    }
    .voicer-shorts .sidebarvid .shortcut-links a:hover,
    .voicer-shorts .sidebarvid .shortcut-links a:focus-visible { background: #e9f3ff; color: #155bc2 !important; }
    .voicer-shorts .sidebarvid .shortcut-links a[aria-current="page"] { background: #e6f0ff; color: #155bc2 !important; }
    .voicer-shorts .sidebarvid .shortcut-links a p {
        margin: 0 !important; color: inherit !important; font-size: 14px; font-weight: 640;
        background: transparent !important; box-shadow: none !important;
    }
    .voicer-shorts .sidebarvid .shortcut-links a:not(#menu-icon) > span {
        display: inline-flex; align-items: center; justify-content: center;
        flex: 0 0 24px; width: 24px; height: 24px; margin: 0 7px 0 0;
        padding: 0 !important; color: currentColor !important; font-size: 0 !important;
    }
    .voicer-shorts .sidebarvid .shortcut-links a:not(#menu-icon) > span::before {
        content: '' !important; width: 21px; height: 21px; background: currentColor;
        -webkit-mask: var(--voicer-sidebar-icon) center / contain no-repeat;
        mask: var(--voicer-sidebar-icon) center / contain no-repeat;
    }
    .voicer-shorts .sidebarvid #public { --voicer-sidebar-icon: url('/icons/outline-users.svg'); }
    .voicer-shorts .sidebarvid #shorts { --voicer-sidebar-icon: url('/icons/outline-video.svg'); }
    .voicer-shorts .sidebarvid #following { --voicer-sidebar-icon: url('/icons/outline-user-plus.svg'); }
    .voicer-shorts .sidebarvid #myuploads { --voicer-sidebar-icon: url('/icons/outline-upload.svg'); }
    .voicer-shorts .sidebarvid #favorites { --voicer-sidebar-icon: url('/icons/outline-bookmark.svg'); }
    .voicer-shorts .sidebarvid #menu-icon { margin-bottom: 8px; border-bottom: 1px solid #dce7f5; border-radius: 0; }
    .voicer-shorts .sidebarvid #menu-icon > span { width: 24px; margin: 0 7px 0 0; padding: 0 !important; }
    .voicer-shorts .sidebarvid #menu-icon > span i { display: inline-flex; width: 22px; height: 22px; color: #395675; font-size: 0 !important; }
    .voicer-shorts .sidebarvid #menu-icon > span i::before { content: '' !important; width: 21px; height: 21px; background: currentColor; -webkit-mask: url('/icons/outline-menu.svg') center / contain no-repeat; mask: url('/icons/outline-menu.svg') center / contain no-repeat; }
    .voicer-shorts .sidebarvid #menu-icon p { display: flex; align-items: center; gap: 5px; }
    .voicer-shorts .sidebarvid #menu-icon p img { width: 25px; height: 25px; margin: 0 !important; object-fit: contain; }
    .voicer-shorts .sidebarvid #menu-icon p span { width: auto; margin: 0; padding: 0; color: #183859 !important; font-size: 14px; }
    .voicer-shorts .sidebarvid hr { width: 100%; margin: 12px 0 15px; background: #dce7f5; }
    .voicer-shorts .sidebarvid .subscribed-list h3 { margin: 6px 10px 11px; color: #7286a0; font-size: 11px; font-weight: 750; letter-spacing: .07em; }
    .voicer-shorts .sidebarvid .subscribed-list a { width: 100%; min-height: 42px; margin: 0; padding: 5px 10px; border-radius: 10px; color: #395675; text-decoration: none; }
    .voicer-shorts .sidebarvid .subscribed-list a:hover { background: #e9f3ff; }
    .voicer-shorts .sidebarvid .subscribed-list a img { width: 30px; height: 30px; margin-right: 11px; object-fit: cover; }
    .voicer-shorts .sidebarvid .subscribed-list a p { margin: 0; font-size: 13px; font-weight: 600; }
    .voicer-shorts .sidebarvid.small-sidebar .shortcut-links a p,
    .voicer-shorts .sidebarvid.small-sidebar .subscribed-list { display: none !important; }
    body.theme-dark .voicer-shorts .sidebarvid { background: #1b2b40 !important; border-color: #334a68; }
    body.theme-dark .voicer-shorts .sidebarvid .shortcut-links a { color: #cad9ec !important; }
    body.theme-dark .voicer-shorts .sidebarvid .shortcut-links a:hover,
    body.theme-dark .voicer-shorts .sidebarvid .shortcut-links a[aria-current="page"] { background: #284665; color: #a9cfff !important; }
    body.theme-dark .voicer-shorts .sidebarvid #menu-icon p span { color: #e8f2ff !important; }
}
@media (max-width: 700px) {
    .voicer-shorts #vidcontainer { margin-top: 30px !important; padding: 0 !important; }
    .voicer-shorts .snapcontainer, .voicer-shorts .shortsContainer { height: calc(100dvh - 110px) !important; }
    .voicer-shorts .shortsContainer { padding: 0; }
    .voicer-shorts .shortsBoxVideo {
        width: 100%; max-width: 100%; height: 100%; aspect-ratio: auto;
        border-radius: 0; box-shadow: none;
    }
    .voicer-shorts .shortsBoxVideo .shortsBoxInfo { padding-right: 76px !important; padding-bottom: 22px !important; }
    .voicer-shorts .shortsBoxTools {
        position: absolute; right: 8px; bottom: 14px; z-index: 3;
        width: 58px; color: #fff;
    }
    .voicer-shorts .shortsBoxTools > div.text-center span { color: #fff !important; text-shadow: 0 1px 5px #10223e; }
    .voicer-shorts .shortsBoxTools :is(.fa-thumbs-up, .fa-paper-plane, .fa-comments, .fa-ellipsis-v),
    .voicer-shorts .shortsBoxTools [id^="StatusFavorite"] :is(.fa-heart, .fa-star) {
        background: rgba(11, 24, 42, .68) !important; color: #fff !important;
    }
    .voicer-shorts .shorts-favorite-action,
    body.theme-dark .voicer-shorts .shorts-favorite-action { background: rgba(11, 24, 42, .68); color: #fff; }
    .voicer-shorts .shorts-favorite-action[aria-pressed="true"] { background: #155cc7; color: #fff; }
}