@import '_content/Yapi.Player/Yapi.Player.rysqrxmoi5.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* ===========================
   GLOBAL (NO PAGE SCROLL)
   =========================== */

html[b-1rdprym4le], body[b-1rdprym4le] {
    height: 100%;
    margin: 0;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    overflow: hidden; /* прибить общий скролл */
}

/* В Blazor это важно — иначе #app может жить своей жизнью */
#app[b-1rdprym4le] {
    height: 100%;
    overflow: hidden;
}

/*body {
    overflow: hidden;*/ /* ❗ body НЕ скроллится */
    /* Дополнительно можно зафиксировать размер */
    /*height: 100vh;
    width: 100%;
}*/

/* ===========================
   ROOT
   =========================== */

:root[b-1rdprym4le] {
    --sidebar-width: 240px;
}

.app-root[b-1rdprym4le] {
    overflow: hidden;
    background-color: #202020;
    color: #f1f1f1;
    height: 100dvh;      /* вместо 100vh */
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* ===========================
   TOP BAR (YouTube-like)
   =========================== */

.yt-topbar[b-1rdprym4le] {
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    box-sizing: border-box;
    background-color: #202020;
    border-bottom: 1px solid #303030;
    position: sticky;
    top: 0;
    z-index: 100;

    /*
      Keep the search visually centered in viewport.
      Adding items to left/right (e.g. 🔔) must NOT shift it.
    */
}

.yt-topbar-left[b-1rdprym4le],
.yt-topbar-center[b-1rdprym4le],
.yt-topbar-right[b-1rdprym4le] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.yt-user-area[b-1rdprym4le] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.yt-topbar-center[b-1rdprym4le] {
    /* Remove from flex flow; center relative to the topbar itself */
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: min(760px, calc(100% - 360px));
    justify-content: center;
    pointer-events: none; /* allow logo/user area click-through */
}

.yt-topbar-center > *[b-1rdprym4le] {
    pointer-events: auto; /* keep search interactive */
}

/* ===========================
   LOGO & ICONS
   =========================== */

.yt-logo[b-1rdprym4le] {
    display: inline-flex;
    align-items: baseline;
    cursor: pointer;
    font-size: 18px;
    font-weight: 700;
}

.yt-logo-main[b-1rdprym4le] {
    color: #ffffff;
}

.yt-logo-suffix[b-1rdprym4le] {
    margin-left: 2px;
    color: #ff0000;
    font-size: 14px;
}

.yt-icon-button[b-1rdprym4le] {
    border: none;
    background: transparent;
    color: #ffffff;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    transition: background-color 0.15s ease, transform 0.1s ease;
}

.yt-icon-button:hover[b-1rdprym4le] {
    background-color: rgba(255, 255, 255, 0.12);
}

.yt-icon-button:active[b-1rdprym4le] {
    transform: scale(0.96);
}

/* ☰ MENU ICON */
.yt-menu-icon[b-1rdprym4le] {
    width: 16px;
    height: 12px;
    display: inline-block;
    background: linear-gradient(#fff 0 0) 0 0 / 100% 2px no-repeat, linear-gradient(#fff 0 0) 0 50% / 100% 2px no-repeat, linear-gradient(#fff 0 0) 0 100% / 100% 2px no-repeat;
    border-radius: 999px;
}

.yt-menu-icon[b-1rdprym4le]::before,
.yt-menu-icon[b-1rdprym4le]::after,
.yt-menu-icon[b-1rdprym4le]::marker { /* marker тут не нужен, можно убрать; оставил как напоминание */
    content: "";
}

/* верхняя */
.yt-menu-icon[b-1rdprym4le]::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 2px;
    background: #fff;
    border-radius: 999px;
}

/* нижняя */
.yt-menu-icon[b-1rdprym4le]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: #fff;
    border-radius: 999px;
}

/* средняя (правильный способ вместо ::middle) */
.yt-menu-icon[b-1rdprym4le] {
    /* рисуем среднюю линию отдельным inset-shadow */
    box-shadow: 0 5px 0 0 #fff;
}



/* ===========================
   SEARCH
   =========================== */

.yt-search-box[b-1rdprym4le] {
    position: relative;
    display: flex;
    align-items: stretch;
    max-width: 640px;
    width: 100%;
}

.yt-search-input[b-1rdprym4le] {
    flex: 1;
    background-color: #121212;
    border: 1px solid #303030;
    border-right: none;
    border-radius: 999px 0 0 999px;
    color: #ffffff;
    padding: 6px 12px;
    font-size: 14px;
}

    .yt-search-input:focus-visible[b-1rdprym4le] {
        outline: none;
        border-color: #3ea6ff;
    }

.yt-search-button[b-1rdprym4le] {
    min-width: 64px;
    border-radius: 0 999px 999px 0;
    border: 1px solid #303030;
    background-color: #303030;
    color: #ffffff;
    cursor: pointer;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .yt-search-button:hover[b-1rdprym4le] {
        background-color: #3a3a3a;
    }

.yt-search-suggestions[b-1rdprym4le] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 1200;
    max-height: min(50vh, 420px);
    overflow-y: auto;
    padding: 6px;
    border: 1px solid #303030;
    border-radius: 12px;
    background: #181818;
    box-shadow: 0 10px 28px rgba(0,0,0,.45);
}

.yt-search-suggestion[b-1rdprym4le] {
    display: block;
    width: 100%;
    padding: 9px 12px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #f1f1f1;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.yt-search-suggestion:hover[b-1rdprym4le],
.yt-search-suggestion.selected[b-1rdprym4le] {
    background: #303030;
}


/* ===========================
   USER
   =========================== */

.yt-user-name[b-1rdprym4le] {
    font-size: 14px;
}

.yt-login-button[b-1rdprym4le],
.yt-logout-button[b-1rdprym4le] {
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid #3ea6ff;
    background-color: transparent;
    color: #3ea6ff;
    font-size: 13px;
    cursor: pointer;
}

    .yt-login-button:hover[b-1rdprym4le],
    .yt-logout-button:hover[b-1rdprym4le] {
        background-color: rgba(62, 166, 255, 0.1);
    }

/* ===========================
   SHELL (SIDEBAR + CONTENT)
   =========================== */

.yt-shell[b-1rdprym4le] {
    position: relative;
    overflow: hidden;
    display: flex;
    flex: 1 1 auto;
    min-height: 0; /* важно для внутренних скроллов */
}

/* ===========================
   SIDEBAR
   =========================== */

.yt-sidebar[b-1rdprym4le] {
    flex: 0 0 var(--sidebar-width);
    width: var(--sidebar-width);
    min-width: 180px;
    max-width: 360px;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    scrollbar-gutter: stable;
    overflow-x: hidden;
    min-height: 0;
    border-right: 1px solid rgba(255,255,255,0.08);
    background: linear-gradient(to right, #181818, #151515);
    position: relative;
    z-index: 10;
    transition: transform .18s ease, box-shadow .18s ease;
}

.yt-sidebar-toolbar[b-1rdprym4le] {
    position: sticky;
    top: 0;
    z-index: 20;
    height: 34px;
    flex: 0 0 34px;
    padding: 3px 8px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    background: rgba(24,24,24,.94);
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.yt-sidebar-pin[b-1rdprym4le] {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: rgba(255,255,255,.78);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.yt-sidebar-pin:hover[b-1rdprym4le],
.yt-sidebar-pin:focus-visible[b-1rdprym4le] {
    color: #fff;
    background: rgba(255,255,255,.12);
}

.yt-sidebar-pin:focus-visible[b-1rdprym4le] {
    outline: 2px solid #3ea6ff;
    outline-offset: -2px;
}

.yt-sidebar-pin svg[b-1rdprym4le] {
    width: 18px;
    height: 18px;
    transition: transform .18s ease;
}


/* ===========================
   RESIZER
   =========================== */

.yt-sidebar-resizer[b-1rdprym4le] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--sidebar-width);
    width: 6px;
    cursor: col-resize;
    background: transparent;
    z-index: 200;
    pointer-events: auto;
}

.yt-sidebar-resizer[b-1rdprym4le]::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 1px;
    background: rgba(255,255,255,.08);
    transition: background .15s ease, box-shadow .15s ease;
}

.yt-sidebar-resizer:hover[b-1rdprym4le]::before {
    background: rgba(255,255,255,.34);
    box-shadow: 0 0 0 1px rgba(255,255,255,.04);
}

.yt-sidebar-resizer:active[b-1rdprym4le]::before {
    background: rgba(255,255,255,.50);
}



/* Watch temporarily gets the full content width without changing the saved sidebar pin preference. */
.app-root.watch-mode .yt-sidebar[b-1rdprym4le] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 250;
    transform: translateX(calc(-100% + 10px));
    box-shadow: 8px 0 22px rgba(0,0,0,0);
}

.app-root.watch-mode .yt-sidebar:hover[b-1rdprym4le],
.app-root.watch-mode .yt-sidebar:focus-within[b-1rdprym4le] {
    transform: translateX(0);
    box-shadow: 8px 0 22px rgba(0,0,0,.42);
}

.app-root.watch-mode .yt-sidebar-resizer[b-1rdprym4le],
.app-root.watch-mode .yt-sidebar-toolbar[b-1rdprym4le] {
    display: none;
}


body.is-resizing-sidebar[b-1rdprym4le] {
    user-select: none;
    cursor: col-resize;
}


/* ===========================
   CONTENT
   =========================== */

.yt-content[b-1rdprym4le] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow-y: auto; /* ✅ свой скролл */
    overflow-x: hidden;
}

/* optional */
.yt-content--no-sidebar[b-1rdprym4le] {
    padding-top: 16px;
}
/* /Components/Layout/SubscribeDialog.razor.rz.scp.css */
.subdlg-backdrop[b-5zfvjsqc5r] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    display: grid;
    place-items: center;
    z-index: 1000;
}

.subdlg-card[b-5zfvjsqc5r] {
    width: min(720px, calc(100vw - 24px));
    max-height: min(80vh, 720px);
    overflow: auto;
    background: #0f0f0f;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 16px;
    box-shadow: 0 24px 80px rgba(0,0,0,.6);
}

.subdlg-banner img[b-5zfvjsqc5r] {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}

.subdlg-body[b-5zfvjsqc5r] {
    padding: 16px;
}

.subdlg-row[b-5zfvjsqc5r] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.subdlg-avatar[b-5zfvjsqc5r] {
    width: 48px;
    height: 48px;
    border-radius: 999px;
    background-size: cover;
    background-position: center;
    flex: 0 0 auto;
}

.subdlg-title[b-5zfvjsqc5r] {
    font-size: 16px;
    font-weight: 600;
    color: #fff;
}

.subdlg-subtitle[b-5zfvjsqc5r] {
    font-size: 13px;
    color: rgba(255,255,255,.7);
}

.subdlg-actions[b-5zfvjsqc5r] {
    margin-top: 16px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
/* /Components/Pages/Channel.razor.rz.scp.css */
/* Прогресс-бар скролла */
.scroll-progress[b-nrc4h9pob0] {
    position: sticky;
    top: 0;
    height: 4px;
    background: #e0e0e0;
    z-index: 1000;
    margin-bottom: 10px;
}

.progress-bar[b-nrc4h9pob0] {
    height: 100%;
    background: linear-gradient(90deg, #4CAF50, #2196F3);
    transition: width 0.3s ease;
}

.progress-text[b-nrc4h9pob0] {
    position: absolute;
    right: 10px;
    top: -20px;
    font-size: 12px;
    font-weight: bold;
    color: #2196F3;
}

/* Основной контейнер с видео */
.videos-container[b-nrc4h9pob0] {
    /* Высота будет установлена динамически через JS */
    overflow-y: auto;
    scrollbar-gutter: stable;
    position: relative;
}

/* Обертка канала */
.ch-wrap[b-nrc4h9pob0] {
    padding: 16px;
    /* Wider layout: more cards fit on large screens */
    max-width: 1400px;
    margin: 0 auto;
}

.ch-banner[b-nrc4h9pob0] {
    height: 220px;
    border-radius: 16px;
    overflow: hidden;
    background: rgba(255,255,255,.06);
}

    .ch-banner img[b-nrc4h9pob0] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.ch-head[b-nrc4h9pob0] {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.ch-title[b-nrc4h9pob0] {
    font-size: 28px;
    font-weight: 700;
}

.ch-sub[b-nrc4h9pob0] {
    opacity: .8;
}

.ch-sub-btn[b-nrc4h9pob0] {
    width: 250px;
    padding: 10px 16px;
    border-radius: 999px;
    border: 0;
    cursor: pointer;
    background: #ff0000;
    color: #fff;
    font-weight: 700;
}

    .ch-sub-btn.on[b-nrc4h9pob0] {
        background: rgba(255,255,255,.14);
        color: #fff;
    }

.ch-desc[b-nrc4h9pob0] {
    margin-top: 10px;
    opacity: .9;
    white-space: pre-wrap;
}

.ch-videos[b-nrc4h9pob0] {
    margin-top: 16px;
    display: grid;
    /* Slightly smaller min card width so more columns fit */
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
}

.ch-video[b-nrc4h9pob0] {
    display: grid;
    gap: 8px;
    border: 0;
    background: rgba(255,255,255,.06);
    border-radius: 14px;
    overflow: hidden;
    cursor: pointer;
    text-align: left;
    color: inherit;
}

    .ch-video img[b-nrc4h9pob0] {
        width: 100%;
        height: 150px;
        object-fit: cover;
        display: block;
    }

    .ch-video .t[b-nrc4h9pob0] {
        padding: 10px;
    }

    .ch-video .tt[b-nrc4h9pob0] {
        font-weight: 600;
    }

    .ch-video .mm[b-nrc4h9pob0] {
        opacity: .7;
        font-size: 12px;
        margin-top: 4px;
    }

.ch-subscribe-btn[b-nrc4h9pob0] {
    border-radius: 999px;
    font-size: 14px;
    font-weight: 500;
    background: #cc0000;
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background .15s ease, opacity .15s ease;
    height: 36px;
    width: 160px;
    padding: 0 16px;
}

    .ch-subscribe-btn:hover[b-nrc4h9pob0] {
        background: #e60000;
    }

    .ch-subscribe-btn.on[b-nrc4h9pob0] {
        background: #303030;
        color: #fff;
    }

    .ch-subscribe-btn:disabled[b-nrc4h9pob0] {
        opacity: .6;
        cursor: default;
    }

.thumb-wrap[b-nrc4h9pob0] {
    position: relative;
    width: 100%;
}

    .thumb-wrap img[b-nrc4h9pob0] {
        display: block;
        width: 100%;
        height: auto;
    }

.watch-progress[b-nrc4h9pob0] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    background: rgba(255,255,255,0.25);
}

.watch-progress-fill[b-nrc4h9pob0] {
    height: 100%;
    background: #ff0000;
}

.ch-loading-more[b-nrc4h9pob0],
.ch-end[b-nrc4h9pob0] {
    grid-column: 1 / -1;
    text-align: center;
    padding: 30px;
    color: #666;
}

.ch-loading-more[b-nrc4h9pob0] {
    color: #2196F3;
}

.ch-loading[b-nrc4h9pob0] {
    text-align: center;
    padding: 40px;
    color: #666;
}

.ch-error[b-nrc4h9pob0] {
    text-align: center;
    padding: 40px;
    color: #f44336;
    background: #ffebee;
    border-radius: 8px;
    margin: 20px;
}

/* Адаптивность */
@media (max-width: 768px) {
    .ch-videos[b-nrc4h9pob0] {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 8px;
    }

    .ch-title[b-nrc4h9pob0] {
        font-size: 24px;
    }
}

/* --- Duration badge: stable & not breaking thumbnail size --- */

/* 1) Бейдж (один раз, без дублей) */
.video-duration-badge[b-nrc4h9pob0] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    z-index: 5;
    background: rgba(0, 0, 0, 0.86);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 6px;
    line-height: 1.2;
    letter-spacing: 0.2px;
    pointer-events: none;
    box-shadow: 0 1px 2px rgba(0,0,0,.35);
}

/* 2) Привязываем бейдж к превью и фиксируем размер превью (16:9) */
.thumb-wrap[b-nrc4h9pob0],
.video-thumb-wrap[b-nrc4h9pob0],
.video-card-thumb-wrapper[b-nrc4h9pob0],
.search-thumb-wrap[b-nrc4h9pob0] {
    position: relative; /* чтобы absolute бейдж жил внутри */
    aspect-ratio: 16 / 9; /* стабильный размер превью */
    overflow: hidden; /* чтобы cover не вылезал */
}

    /* 3) Картинка заполняет контейнер превью */
    .thumb-wrap img[b-nrc4h9pob0],
    .video-thumb-wrap img[b-nrc4h9pob0],
    .video-card-thumb-wrapper img[b-nrc4h9pob0],
    .search-thumb-wrap img[b-nrc4h9pob0] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }



/* VideoCard integration overrides */
.ch-videos[b-nrc4h9pob0] {
    --card-width: 320px;
    grid-template-columns: repeat(auto-fill, var(--card-width));
    gap: 16px;
    /* Center the grid like YouTube (prevents the whole page from looking “shifted left”) */
    justify-content: center;
    align-content: start;
}

    .ch-videos .video-card[b-nrc4h9pob0] {
        width: var(--card-width);
        max-width: var(--card-width);
        background-color: transparent;
        border-radius: 12px;
        transition: transform 0.12s ease-out, background-color 0.12s ease-out;
    }

        .ch-videos .video-card:hover[b-nrc4h9pob0] {
            transform: translateY(-2px);
            background-color: #181818;
        }


/* Channel header enriched */
.ch-head[b-nrc4h9pob0] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;
}

.ch-head-row[b-nrc4h9pob0] {
    display: grid;
    grid-template-columns: 84px 1fr auto;
    gap: 12px;
    align-items: center;
}

.ch-avatar[b-nrc4h9pob0] {
    width: 84px;
    height: 84px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(255,255,255,.08);
}

    .ch-avatar img[b-nrc4h9pob0] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.ch-head-main[b-nrc4h9pob0] {
    min-width: 0;
}

.ch-title[b-nrc4h9pob0] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ch-verified[b-nrc4h9pob0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    font-size: 12px;
    opacity: .95;
}

.ch-meta[b-nrc4h9pob0],
.ch-subline[b-nrc4h9pob0] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    opacity: .85;
    font-size: 13px;
    margin-top: 4px;
}

.ch-dot[b-nrc4h9pob0] {
    opacity: .6;
}

.ch-actions[b-nrc4h9pob0] {
    display: flex;
    justify-content: flex-end;
}

.ch-links[b-nrc4h9pob0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
}

.ch-link[b-nrc4h9pob0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    opacity: .95;
    transition: background .12s ease, transform .12s ease;
}

    .ch-link:hover[b-nrc4h9pob0] {
        background: rgba(255,255,255,.12);
        transform: translateY(-1px);
    }

.ch-link-title[b-nrc4h9pob0] {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ch-tags[b-nrc4h9pob0] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 2px;
}

.ch-tag[b-nrc4h9pob0] {
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.07);
    font-size: 12px;
    opacity: .9;
}

.ch-tags-more[b-nrc4h9pob0] {
    padding: 6px 10px;
    border-radius: 999px;
    border: 0;
    cursor: pointer;
    background: rgba(255,255,255,.12);
    color: #fff;
    font-size: 12px;
}

@media (max-width: 768px) {
    .ch-head-row[b-nrc4h9pob0] {
        grid-template-columns: 70px 1fr;
        grid-template-rows: auto auto;
        align-items: start;
    }

    .ch-actions[b-nrc4h9pob0] {
        grid-column: 1 / -1;
        justify-content: flex-start;
        margin-top: 6px;
    }

    .ch-avatar[b-nrc4h9pob0] {
        width: 70px;
        height: 70px;
    }
}


/* Channel description links (same behavior as Watch description) */
.ch-desc a[b-nrc4h9pob0],
.ch-desc-link[b-nrc4h9pob0] {
    color: rgba(62, 166, 255, 0.95);
    text-decoration: none;
}

    .ch-desc a:hover[b-nrc4h9pob0],
    .ch-desc-link:hover[b-nrc4h9pob0] {
        text-decoration: underline;
    }

.ch-desc[b-nrc4h9pob0] {
    white-space: normal;
    line-height: 1.35;
}
/* /Components/Pages/Films.razor.rz.scp.css */
/* Прогресс-бар скролла */
.scroll-progress[b-930e8p0j79] {
    position: sticky;
    top: 0;
    height: 4px;
    background: #e0e0e0;
    z-index: 1000;
    margin-bottom: 10px;
}

.progress-bar[b-930e8p0j79] {
    height: 100%;
    background: linear-gradient(90deg, #4CAF50, #2196F3);
    transition: width 0.3s ease;
}

.progress-text[b-930e8p0j79] {
    position: absolute;
    right: 10px;
    top: -20px;
    font-size: 12px;
    font-weight: bold;
    color: #2196F3;
}

/* Основной контейнер */
.home-container[b-930e8p0j79] {
    height: 500px; /* Начальная высота, будет изменена JS */
    overflow-y: auto;
    padding: 16px 24px;
    box-sizing: border-box;
    background-color: #0f0f0f;
    color: #ffffff;
}

.home-grid[b-930e8p0j79] {
    --card-width: 320px;
    display: grid;
    grid-template-columns: repeat(auto-fill, var(--card-width));
    gap: 16px;
    justify-content: start;
    align-content: start;
    padding: 16px;
    box-sizing: border-box;
}

/* Карточка видео */
.video-card[b-930e8p0j79] {
    cursor: pointer;
    border-radius: 12px;
    overflow: hidden;
    background-color: transparent;
    transition: transform 0.12s ease-out, background-color 0.12s ease-out;
    width: var(--card-width);
    max-width: var(--card-width);
}

    .video-card:hover[b-930e8p0j79] {
        transform: translateY(-2px);
        background-color: #181818;
    }

.video-card-thumb-wrapper[b-930e8p0j79] {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.video-card-thumb[b-930e8p0j79] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Бейдж длительности */
.video-duration-badge[b-930e8p0j79] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    background: rgba(0, 0, 0, 0.86);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 6px;
    line-height: 1.2;
    letter-spacing: 0.2px;
    pointer-events: none;
    box-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.video-card-body[b-930e8p0j79] {
    padding: 8px 10px 12px 10px;
}

.video-card-title[b-930e8p0j79] {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.video-card-channel[b-930e8p0j79] {
    font-size: 13px;
    color: #aaaaaa;
}

/* Состояния загрузки */
.home-loading[b-930e8p0j79],
.home-error[b-930e8p0j79],
.home-empty[b-930e8p0j79],
.home-loading-more[b-930e8p0j79] {
    padding: 16px 0;
    font-size: 14px;
    color: #cccccc;
    text-align: center;
}

.home-loading-more[b-930e8p0j79] {
    grid-column: 1 / -1;
    padding: 30px;
}

/* Адаптивность */
@media (max-width: 768px) {
    .home-grid[b-930e8p0j79] {
        --card-width: calc(50% - 16px);
        grid-template-columns: repeat(auto-fill, var(--card-width));
        gap: 12px;
        padding: 8px;
    }

    .home-container[b-930e8p0j79] {
        padding: 12px 16px;
    }
}

@media (max-width: 480px) {
    .home-grid[b-930e8p0j79] {
        --card-width: 100%;
        grid-template-columns: 1fr;
        gap: 8px;
    }
}

/* Диагностика Home */
.home-diag[b-930e8p0j79] {
    margin: 6px 0 12px 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,0.06);
    color: #eaeaea;
}

.home-diag summary[b-930e8p0j79] {
    cursor: pointer;
    font-weight: 600;
    user-select: none;
}

.home-diag-grid[b-930e8p0j79] {
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(2, minmax(200px, 1fr));
    gap: 8px 14px;
    font-size: 13px;
}

.home-diag-full[b-930e8p0j79] {
    grid-column: 1 / -1;
}

.home-diag-list[b-930e8p0j79] {
    margin: 6px 0 0 18px;
}

.home-diag-muted[b-930e8p0j79] {
    margin-top: 8px;
    color: #bdbdbd;
    font-size: 13px;
}

.home-diag-error[b-930e8p0j79] {
    color: #ffb4b4;
}

.mono[b-930e8p0j79] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
/* /Components/Pages/History.razor.rz.scp.css */
/* Reuse Search page look for History */

.history-container[b-eksqqwwt8l] {
    height: 500px; /* will be overridden by JS */
    overflow-y: auto;
    padding: 16px 24px;
    background-color: #0f0f0f;
    color: #ffffff;
}

.page-title[b-eksqqwwt8l] {
    margin-bottom: 24px;
    font-size: 28px;
    font-weight: 700;
    color: #fff;
}

.search-hint[b-eksqqwwt8l] {
    padding: 60px 20px;
    text-align: center;
    color: #aaa;
    font-size: 16px;
}

.search-results[b-eksqqwwt8l] {
    max-width: 1200px;
    margin: 0 auto;
}

.search-card[b-eksqqwwt8l] {
    display: flex;
    gap: 16px;
    padding: 16px 0;
    cursor: default;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

    .search-card:last-child[b-eksqqwwt8l] {
        border-bottom: none;
    }

.search-thumb-wrap[b-eksqqwwt8l] {
    flex: 0 0 320px;
    cursor: pointer;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.2s ease;
    position: relative; /* для бейджа длительности */
}

    .search-thumb-wrap:hover[b-eksqqwwt8l] {
        transform: scale(1.02);
    }

.search-thumb[b-eksqqwwt8l] {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 12px;
    display: block;
}

/* Бейдж длительности */
.video-duration-badge[b-eksqqwwt8l] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    background: rgba(0, 0, 0, 0.86);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 6px;
    line-height: 1.2;
    letter-spacing: 0.2px;
    pointer-events: none;
    box-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.search-meta[b-eksqqwwt8l] {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 4px 0;
}

.search-title[b-eksqqwwt8l] {
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    line-height: 1.4;
    margin-bottom: 8px;
    color: #fff;
    text-decoration: none;
    transition: color 0.2s ease;
}

    .search-title:hover[b-eksqqwwt8l] {
        color: #4285f4;
    }

.search-channel[b-eksqqwwt8l] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 8px 0 12px 0;
    color: #aaa;
    font-size: 14px;
    cursor: pointer;
    text-decoration: none;
    transition: color 0.2s ease;
}

    .search-channel:hover[b-eksqqwwt8l] {
        color: #fff;
    }

.search-channel-avatar[b-eksqqwwt8l] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
}

    .search-channel-avatar.placeholder[b-eksqqwwt8l] {
        background: #444;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        color: #fff;
        font-weight: 500;
    }

.search-channel-name[b-eksqqwwt8l] {
    font-weight: 500;
}

.search-sep[b-eksqqwwt8l] {
    opacity: 0.6;
}

.app-loading[b-eksqqwwt8l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    text-align: center;
}

.spinner[b-eksqqwwt8l] {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-top: 3px solid #4285f4;
    border-radius: 50%;
    animation: spin-b-eksqqwwt8l 1s linear infinite;
    margin-bottom: 16px;
}

@keyframes spin-b-eksqqwwt8l {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.watch-error[b-eksqqwwt8l] {
    padding: 40px 20px;
    text-align: center;
    color: #f44336;
    background: rgba(244, 67, 54, 0.1);
    border-radius: 8px;
    margin: 20px;
}

.search-loading-more[b-eksqqwwt8l],
.search-end[b-eksqqwwt8l] {
    text-align: center;
    padding: 40px 20px;
    color: #aaa;
    font-size: 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin-top: 20px;
}

@media (max-width: 768px) {
    .history-container[b-eksqqwwt8l] {
        padding: 12px 16px;
    }

    .search-card[b-eksqqwwt8l] {
        flex-direction: column;
        gap: 12px;
    }

    .search-thumb-wrap[b-eksqqwwt8l] {
        flex: 0 0 auto;
        width: 100%;
    }

    .search-thumb[b-eksqqwwt8l] {
        height: 200px;
    }

    .page-title[b-eksqqwwt8l] {
        font-size: 24px;
    }
}

@media (max-width: 480px) {
    .search-thumb[b-eksqqwwt8l] {
        height: 160px;
    }

    .search-title[b-eksqqwwt8l] {
        font-size: 16px;
    }

    .search-channel[b-eksqqwwt8l] {
        font-size: 13px;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Прогресс-бар скролла */
.scroll-progress[b-pg9rna570e] {
    position: sticky;
    top: 0;
    height: 4px;
    background: #e0e0e0;
    z-index: 1000;
    margin-bottom: 10px;
}

.progress-bar[b-pg9rna570e] {
    height: 100%;
    background: linear-gradient(90deg, #4CAF50, #2196F3);
    transition: width 0.3s ease;
}

.progress-text[b-pg9rna570e] {
    position: absolute;
    right: 10px;
    top: -20px;
    font-size: 12px;
    font-weight: bold;
    color: #2196F3;
}

/* Основной контейнер */
.home-container[b-pg9rna570e] {
    height: 500px; /* Начальная высота, будет изменена JS */
    overflow-y: auto;
    padding: 16px 24px;
    box-sizing: border-box;
    background-color: #0f0f0f;
    color: #ffffff;
}

.home-grid[b-pg9rna570e] {
    --card-width: 320px;
    display: grid;
    grid-template-columns: repeat(auto-fill, var(--card-width));
    gap: 16px;
    justify-content: start;
    align-content: start;
    padding: 16px;
    box-sizing: border-box;
}

/* Карточка видео */
.video-card[b-pg9rna570e] {
    cursor: pointer;
    border-radius: 12px;
    overflow: hidden;
    background-color: transparent;
    transition: transform 0.12s ease-out, background-color 0.12s ease-out;
    width: var(--card-width);
    max-width: var(--card-width);
}

    .video-card:hover[b-pg9rna570e] {
        transform: translateY(-2px);
        background-color: #181818;
    }

.video-card-thumb-wrapper[b-pg9rna570e] {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.video-card-thumb[b-pg9rna570e] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Бейдж длительности */
.video-duration-badge[b-pg9rna570e] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    background: rgba(0, 0, 0, 0.86);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 6px;
    line-height: 1.2;
    letter-spacing: 0.2px;
    pointer-events: none;
    box-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.video-card-body[b-pg9rna570e] {
    padding: 8px 10px 12px 10px;
}

.video-card-title[b-pg9rna570e] {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.video-card-channel[b-pg9rna570e] {
    font-size: 13px;
    color: #aaaaaa;
}

/* Состояния загрузки */
.home-loading[b-pg9rna570e],
.home-error[b-pg9rna570e],
.home-empty[b-pg9rna570e],
.home-loading-more[b-pg9rna570e] {
    padding: 16px 0;
    font-size: 14px;
    color: #cccccc;
    text-align: center;
}

.home-loading-more[b-pg9rna570e] {
    grid-column: 1 / -1;
    padding: 30px;
}

/* Адаптивность */
@media (max-width: 768px) {
    .home-grid[b-pg9rna570e] {
        --card-width: calc(50% - 16px);
        grid-template-columns: repeat(auto-fill, var(--card-width));
        gap: 12px;
        padding: 8px;
    }

    .home-container[b-pg9rna570e] {
        padding: 12px 16px;
    }
}

@media (max-width: 480px) {
    .home-grid[b-pg9rna570e] {
        --card-width: 100%;
        grid-template-columns: 1fr;
        gap: 8px;
    }
}

/* Диагностика Home */
.home-diag[b-pg9rna570e] {
    margin: 6px 0 12px 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(255,255,255,0.06);
    color: #eaeaea;
}

.home-diag summary[b-pg9rna570e] {
    cursor: pointer;
    font-weight: 600;
    user-select: none;
}

.home-diag-grid[b-pg9rna570e] {
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(2, minmax(200px, 1fr));
    gap: 8px 14px;
    font-size: 13px;
}

.home-diag-full[b-pg9rna570e] {
    grid-column: 1 / -1;
}

.home-diag-list[b-pg9rna570e] {
    margin: 6px 0 0 18px;
}

.home-diag-muted[b-pg9rna570e] {
    margin-top: 8px;
    color: #bdbdbd;
    font-size: 13px;
}

.home-diag-error[b-pg9rna570e] {
    color: #ffb4b4;
}

.mono[b-pg9rna570e] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
/* /Components/Pages/Logon.razor.rz.scp.css */
.logon-root[b-iungqe6yi8] {
    position: relative;
    min-height: calc(100vh - 56px);
    padding: 32px 16px 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.logon-bg[b-iungqe6yi8] {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, #0f0f0f, #090909);
}

.logon-blob[b-iungqe6yi8] {
    position: absolute;
    width: 520px;
    height: 520px;
    border-radius: 999px;
    filter: blur(40px);
    opacity: 0.55;
    animation: blobMove-b-iungqe6yi8 14s ease-in-out infinite;
}

.logon-blob.b1[b-iungqe6yi8] {
    left: -160px;
    top: -140px;
    background: radial-gradient(circle at 30% 30%, rgba(255, 0, 0, 0.75), rgba(255, 0, 0, 0.0) 60%);
}

.logon-blob.b2[b-iungqe6yi8] {
    right: -200px;
    top: -120px;
    background: radial-gradient(circle at 30% 30%, rgba(0, 150, 255, 0.55), rgba(0, 150, 255, 0.0) 60%);
    animation-duration: 16s;
}

.logon-blob.b3[b-iungqe6yi8] {
    left: 10%;
    bottom: -240px;
    background: radial-gradient(circle at 30% 30%, rgba(0, 255, 180, 0.35), rgba(0, 255, 180, 0.0) 60%);
    animation-duration: 18s;
}

@keyframes blobMove-b-iungqe6yi8 {
    0% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(70px, 40px, 0) scale(1.08); }
    100% { transform: translate3d(0, 0, 0) scale(1); }
}

.logon-card[b-iungqe6yi8] {
    position: relative;
    width: min(520px, 100%);
    background: rgba(18, 18, 18, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    box-shadow: 0 18px 70px rgba(0, 0, 0, 0.65);
    padding: 22px 22px 20px;
    backdrop-filter: blur(10px);
}

.logon-header[b-iungqe6yi8] {
    margin-bottom: 16px;
}

.logon-title[b-iungqe6yi8] {
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.2px;
}

.logon-title .brand[b-iungqe6yi8] {
    color: #ff3b30;
}

.logon-subtitle[b-iungqe6yi8] {
    margin-top: 6px;
    font-size: 13px;
    color: #bdbdbd;
}

.logon-form[b-iungqe6yi8] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.logon-label[b-iungqe6yi8] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    color: #d6d6d6;
}

.logon-input[b-iungqe6yi8] {
    width: 96%;
    padding: 12px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(10, 10, 10, 0.7);
    color: #fff;
    outline: none;
    font-size: 15px;
}

.logon-input:focus[b-iungqe6yi8] {
    border-color: rgba(255, 0, 0, 0.55);
    box-shadow: 0 0 0 3px rgba(255, 0, 0, 0.15);
}

.logon-button[b-iungqe6yi8] {
    margin-top: 4px;
    border: none;
    border-radius: 999px;
    padding: 12px 16px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    background: #ff0000;
    color: #fff;
}

.logon-button:hover[b-iungqe6yi8] {
    background: #cc0000;
}

.logon-button:disabled[b-iungqe6yi8] {
    opacity: 0.7;
    cursor: default;
}

.logon-error[b-iungqe6yi8] {
    margin: 2px 0 0;
    color: #ff8080;
    font-size: 13px;
}
/* /Components/Pages/Search.razor.rz.scp.css */
/* Прогресс-бар скролла */
.scroll-progress[b-nssl39e1bn] {
    position: sticky;
    top: 0;
    height: 4px;
    background: #e0e0e0;
    z-index: 1000;
    margin-bottom: 10px;
}

.progress-bar[b-nssl39e1bn] {
    height: 100%;
    background: linear-gradient(90deg, #4CAF50, #2196F3);
    transition: width 0.3s ease;
}

.progress-text[b-nssl39e1bn] {
    position: absolute;
    right: 10px;
    top: -20px;
    font-size: 12px;
    font-weight: bold;
    color: #2196F3;
}

 /* Search page: make it visually same as Home grid */
.search-container[b-nssl39e1bn] {
    height: 500px; /* начальная высота, будет изменена JS */
    overflow-y: auto;
    padding: 16px 24px;
    box-sizing: border-box;
    background-color: #0f0f0f;
    color: #ffffff;
}

.page-title[b-nssl39e1bn] {
    margin: 0 0 12px 0;
    font-size: 28px;
    font-weight: 700;
}

.search-hint[b-nssl39e1bn] {
    color: rgba(255, 255, 255, 0.75);
    padding: 8px 0 16px 0;
}

/* Grid exactly like Home (fixed card width) */
.search-grid[b-nssl39e1bn] {
    --card-width: 320px;
    display: grid;
    grid-template-columns: repeat(auto-fill, var(--card-width));
    gap: 16px;
    justify-content: start;
    align-content: start;
    padding: 16px;
    box-sizing: border-box;
}

/* Constrain VideoCard size inside the grid (important!) */
.video-card[b-nssl39e1bn] {
    width: var(--card-width);
    max-width: var(--card-width);
    background-color: transparent;
    transition: transform 0.12s ease-out, background-color 0.12s ease-out;
    border-radius: 12px;
}

    .video-card:hover[b-nssl39e1bn] {
        transform: translateY(-2px);
        background-color: #181818;
    }

/* Paging text */
.search-loading-more[b-nssl39e1bn],
.search-end[b-nssl39e1bn] {
    padding: 16px;
    text-align: center;
    color: rgba(255,255,255,0.75);
}

/* Responsive like Home */
@media (max-width: 768px) {
    .search-grid[b-nssl39e1bn] {
        --card-width: calc(50% - 16px);
        grid-template-columns: repeat(auto-fill, var(--card-width));
        gap: 12px;
        padding: 8px;
    }

    .search-container[b-nssl39e1bn] {
        padding: 12px 16px;
    }
}

@media (max-width: 480px) {
    .search-grid[b-nssl39e1bn] {
        --card-width: 100%;
        grid-template-columns: 1fr;
        gap: 8px;
    }
}
/* /Components/Pages/Settings.razor.rz.scp.css */
/*
  Moved Settings styles to /wwwroot/css/settings.css (scoped via .settings-container).
  Keeping this file intentionally minimal to avoid accidental global CSS impact.
*/
/* /Components/Pages/SubscriptionsSidebar.razor.rz.scp.css */
.subscriptions-sidebar[b-esjcbc19yg] {
    width: 100%;
    background: linear-gradient(to right, #181818, #151515);
    color: #fff;
    padding: 12px 0;
    box-sizing: border-box;
    border-right: 1px solid rgba(255,255,255,0.08);
    box-shadow: inset -1px 0 0 rgba(255,255,255,0.05);
}

.sidebar-section[b-esjcbc19yg] {
    min-width: 0;
    padding: 0 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-flow: row;
    gap: 0.5rem;
}

.sidebar-resizer[b-esjcbc19yg] {
    width: 6px;
    cursor: col-resize;
    background: transparent;
    z-index: 50;
    position: relative;
}

.sidebar-title[b-esjcbc19yg] {
    font-size: 14px;
    font-weight: 600;
    opacity: .8;
    margin: 12px 0 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

    .sidebar-title[b-esjcbc19yg]::after {
        content: "";
        display: block;
        height: 1px;
        background: rgba(255,255,255,0.08);
        margin-top: 6px;
        width: 100%;
    }

.sidebar-title-badge[b-esjcbc19yg] {
    background: #cc0000;
    color: #fff;
    font-size: 12px;
    padding: 2px 7px;
    border-radius: 999px;
    line-height: 1.2;
    opacity: 1;
}

.sidebar-divider[b-esjcbc19yg] {
    height: 1px;
    background: rgba(255,255,255,.08);
    margin: 12px 0;
}

/* ===== subscription item ===== */

.sub-item[b-esjcbc19yg] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    padding: 6px 8px;
    box-sizing: border-box;
    border-radius: 9px;
    cursor: pointer;
    position: relative;
}

.sub-link[b-esjcbc19yg] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}


    .sub-item:hover[b-esjcbc19yg] {
        background: rgba(255,255,255,.06);
    }

    /* subtle highlight for channels with unwatched videos */
    .sub-item.has-unwatched[b-esjcbc19yg] {
        box-shadow: inset 0 0 0 1px rgba(204,0,0,.35);
    }

.sub-avatar[b-esjcbc19yg] {
    position: relative;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
}

.sub-avatar img[b-esjcbc19yg] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.avatar-placeholder[b-esjcbc19yg] {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
}

.sub-meta[b-esjcbc19yg] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}

.sub-title[b-esjcbc19yg] {
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sub-badge[b-esjcbc19yg] {
    position: absolute;
    top: -4px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    box-sizing: border-box;
    border: 2px solid #181818;
    border-radius: 999px;
    background: #cc0000;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

/* ===== menu ===== */

.sub-more[b-esjcbc19yg] {
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 999px;
    border: 0;
    background: transparent;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    opacity: 0;
}

.sub-item:hover .sub-more[b-esjcbc19yg],
.sub-item.menu-open .sub-more[b-esjcbc19yg] {
    opacity: 1;
}

.sub-menu[b-esjcbc19yg] {
    position: absolute;
    top: calc(100% + 2px);
    right: 4px;
    width: min(190px, calc(100% - 8px));
    min-width: 0;
    box-sizing: border-box;
    background: #1f1f1f;
    border-radius: 9px;
    padding: 6px 0;
    z-index: 20;
    box-shadow: 0 8px 30px rgba(0,0,0,.6);
}

.sub-menu.open-up[b-esjcbc19yg] {
    top: auto;
    bottom: calc(100% + 2px);
}

.sub-menu-item[b-esjcbc19yg] {
    display: block;
    width: 100%;
    padding: 8px 14px;
    background: transparent;
    border: 0;
    color: #fff;
    text-align: left;
    cursor: pointer;
}

    .sub-menu-item:hover[b-esjcbc19yg] {
        background: rgba(255,255,255,.08);
    }

    .sub-menu-item.danger[b-esjcbc19yg] {
        color: #ff4d4d;
    }

/* FORCE: sidebar NavLink colors */
.subscriptions-sidebar a.sidebar-link[b-esjcbc19yg],
.subscriptions-sidebar a.sidebar-link:link[b-esjcbc19yg],
.subscriptions-sidebar a.sidebar-link:visited[b-esjcbc19yg],
.subscriptions-sidebar a.sidebar-link:hover[b-esjcbc19yg],
.subscriptions-sidebar a.sidebar-link:active[b-esjcbc19yg],
.subscriptions-sidebar a.sidebar-link:focus[b-esjcbc19yg] {
    color: #c80000d0 !important;
    text-decoration: none !important;
}

    .subscriptions-sidebar a.sidebar-link.active[b-esjcbc19yg],
    .subscriptions-sidebar a.sidebar-link[aria-current="page"][b-esjcbc19yg] {
        background: rgba(255,255,255,.08) !important;
    }

/* (опционально) чуть менее ярко для второстепенных */
.subscriptions-sidebar .sidebar-link.muted[b-esjcbc19yg] {
    color: rgba(255,255,255,.70);
}
/* /Components/Shared/BlacklistResolvedCard.razor.rz.scp.css */
/*
  Scoped fix: prefix all rules with .settings-container.
  Also rename shimmer keyframes to avoid any global name collisions.
*/

/* ==========================================================
   Blacklist cards
   ========================================================== */

.settings-container .bl-list[b-wjlf0r2mph] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.settings-container .bl-card[b-wjlf0r2mph] {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 10px 10px;
    border-radius: 12px;
    border: 1px solid #262626;
    background: #101010;
}

.settings-container .bl-left[b-wjlf0r2mph] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}

.settings-container .bl-center[b-wjlf0r2mph] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.settings-container .bl-right[b-wjlf0r2mph] {
    flex: 0 0 auto;
}

.settings-container .bl-title[b-wjlf0r2mph] {
    color: inherit;
    text-decoration: none;
    font-weight: 650;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-container a.bl-title:hover[b-wjlf0r2mph] {
    text-decoration: underline;
}

.settings-container .bl-sub[b-wjlf0r2mph] {
    font-size: 12px;
    opacity: 0.8;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-container .bl-raw[b-wjlf0r2mph] {
    font-size: 11px;
    opacity: 0.55;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Channel card */

.settings-container .bl-avatar[b-wjlf0r2mph] {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    object-fit: cover;
    background: #0c0c0c;
    border: 1px solid #262626;
}

.settings-container .bl-avatar-ph[b-wjlf0r2mph] {
    display: inline-block;
}

/* Video card */

.settings-container .bl-thumb-wrap[b-wjlf0r2mph] {
    width: 140px;
    aspect-ratio: 16/9;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    background: #0c0c0c;
    border: 1px solid #262626;
}

.settings-container .bl-thumb[b-wjlf0r2mph] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.settings-container .bl-thumb-ph[b-wjlf0r2mph] {
    background: #0c0c0c;
}

.settings-container .bl-duration[b-wjlf0r2mph] {
    position: absolute;
    bottom: 6px;
    right: 6px;
    padding: 2px 6px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    background: rgba(0, 0, 0, 0.75);
    border: 1px solid rgba(255,255,255,0.15);
}

@media (max-width: 820px) {
    .settings-container .bl-thumb-wrap[b-wjlf0r2mph] {
        width: 120px;
    }
}

@media (max-width: 640px) {
    .settings-container[b-wjlf0r2mph] {
        padding: 14px 14px;
    }

    .settings-container .bl-card[b-wjlf0r2mph] {
        gap: 10px;
        padding: 10px 10px;
    }

    .settings-container .bl-thumb-wrap[b-wjlf0r2mph] {
        width: 110px;
    }
}

/* ==========================================================
   Skeleton loaders (for blacklist cards)
   ========================================================== */

.settings-container .sk-line[b-wjlf0r2mph] {
    height: 12px;
    border-radius: 6px;
    background: #1b1b1b;
}

.settings-container .sk-w70[b-wjlf0r2mph] { width: 70%; }
.settings-container .sk-w50[b-wjlf0r2mph] { width: 50%; }

.settings-container .sk-shimmer[b-wjlf0r2mph] {
    position: relative;
    overflow: hidden;
    background: #1b1b1b;
}

.settings-container .sk-shimmer[b-wjlf0r2mph]::after {
    content: "";
    position: absolute;
    top: 0;
    left: -140px;
    width: 140px;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.08), transparent);
    animation: blSkShimmer-b-wjlf0r2mph 1.2s infinite;
}

@keyframes blSkShimmer-b-wjlf0r2mph {
    0% { transform: translateX(0); }
    100% { transform: translateX(420px); }
}
/* /Components/Shared/BlacklistSubSection.razor.rz.scp.css */
/*
  Scoped fix: prefix all rules with .settings-container.
  This prevents affecting other pages if CSS is ever bundled globally.
*/

.settings-container .settings-subtitle[b-4pak85ti1m] {
    font-weight: 600;
    font-size: 14px;
    margin: 8px 0 6px 0;
    opacity: 0.95;
}

.settings-container .settings-field[b-4pak85ti1m] {
    margin-top: 10px;
}

.settings-container .settings-label[b-4pak85ti1m] {
    font-size: 13px;
    opacity: 0.85;
    margin-bottom: 6px;
}

.settings-container .settings-input[b-4pak85ti1m] {
    width: 100%;
    padding: 10px 10px;
    border-radius: 10px;
    border: 1px solid #2b2b2b;
    background: #0f0f0f;
    color: #fff;
    box-sizing: border-box;
}

.settings-container .settings-inline[b-4pak85ti1m] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.settings-container .settings-inline .settings-input[b-4pak85ti1m] {
    flex: 1;
}

.settings-container .settings-check[b-4pak85ti1m] {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 10px;
    user-select: none;
}

.settings-container .settings-check input[b-4pak85ti1m] {
    transform: scale(1.1);
}

.settings-container .settings-actions[b-4pak85ti1m] {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

.settings-container .settings-btn[b-4pak85ti1m] {
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid #2b2b2b;
    background: #1b1b1b;
    color: #fff;
    cursor: pointer;
}

.settings-container .settings-btn:hover[b-4pak85ti1m] {
    background: #222;
}

.settings-container .settings-btn-primary[b-4pak85ti1m] {
    border-color: #3a3a3a;
    background: #2a2a2a;
}

.settings-container .settings-btn-danger[b-4pak85ti1m] {
    border-color: #3a2b2b;
    background: #2a1b1b;
}

.settings-container .settings-empty[b-4pak85ti1m] {
    margin-top: 8px;
    opacity: 0.75;
    font-size: 13px;
}

.settings-container .settings-hint[b-4pak85ti1m] {
    margin-top: 12px;
    font-size: 12px;
    opacity: 0.7;
}
/* /Components/Shared/FloatWindowFrame.razor.rz.scp.css */
.fw-frame[b-0yliv9sv00] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    width: 100%;
    position: relative;
}

.fw-frame-header[b-0yliv9sv00] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.03);
    color: #fff;
}

/* Drag handle */
.fw-drag-handle[b-0yliv9sv00] {
    cursor: move;
    user-select: none;
    touch-action: none;
}

.fw-frame-title[b-0yliv9sv00] {
    flex: 1;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fw-frame-close[b-0yliv9sv00] {
    border: none;
    background: transparent;
    color: inherit;
    cursor: pointer;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.fw-frame-close:hover[b-0yliv9sv00] {
    background: rgba(255,255,255,0.08);
}

.fw-frame-body[b-0yliv9sv00] {
    padding: 12px;
    overflow: auto;
    min-height: 0;
}

/* Resize handle (bottom-right corner) */
.fw-resize-handle[b-0yliv9sv00] {
    position: absolute;
    right: 4px;
    bottom: 4px;
    width: 14px;
    height: 14px;
    cursor: se-resize;
    touch-action: none;
    opacity: 0.7;
}

.fw-resize-handle[b-0yliv9sv00]::before {
    content: '';
    position: absolute;
    inset: 0;
    border-right: 2px solid rgba(255,255,255,0.35);
    border-bottom: 2px solid rgba(255,255,255,0.35);
    border-bottom-right-radius: 4px;
}
/* /Components/Shared/FloatWindowHost.razor.rz.scp.css */
.fw-overlay[b-q8ry6jlz2x] {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: transparent;
}

.fw-window[b-q8ry6jlz2x] {
    position: fixed;
    display: flex;
    flex-direction: column;
    min-height: 0;
    border-radius: 12px;
    overflow: hidden;
    background: #1a1a1a;
    border: 1px solid rgba(255,255,255,0.10);
    box-shadow: 0 10px 40px rgba(0,0,0,0.55);
}
/* /Components/Shared/NotificationsBell.razor.rz.scp.css */
.nb-wrap[b-y4oofsli1v] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.nb-btn[b-y4oofsli1v] {
    /* IMPORTANT: keep fully self-contained.
       MainLayout uses CSS isolation, so its .yt-icon-button styles don't automatically
       apply inside nested components like NotificationsBell. */
    position: relative;

    border: none;
    background: transparent;
    color: #ffffff;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    transition: background-color 0.15s ease, transform 0.1s ease;
}

.nb-btn:hover[b-y4oofsli1v] {
    background-color: rgba(255, 255, 255, 0.12);
}

.nb-btn:active[b-y4oofsli1v] {
    transform: scale(0.96);
}

.nb-badge[b-y4oofsli1v] {
    position: absolute;

    /* bottom-right with a small overflow outside the circle */
    right: -4px;
    bottom: -4px;

    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: #ff2c2c;
    color: #fff;
    font-size: 10px;
    line-height: 16px;
    font-weight: 700;
    text-align: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.35);
}
/* /Components/Shared/NotificationsPanel.razor.rz.scp.css */
.np-root[b-c0zof9k5fo] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    background: #1a1a1a;
}

.np-header[b-c0zof9k5fo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    background: #141414;
    border-bottom: 1px solid rgba(255,255,255,0.10);
}

.np-title[b-c0zof9k5fo] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
}

.np-bell[b-c0zof9k5fo] {
    color: #fff;
}

.np-close[b-c0zof9k5fo] {
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 10px;
    background: rgba(255,255,255,0.08);
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 32px;
}

.np-close:hover[b-c0zof9k5fo] { background: rgba(255,255,255,0.13); }

.np-state[b-c0zof9k5fo] {
    padding: 14px 12px;
    color: rgba(255,255,255,0.85);
}

.np-error[b-c0zof9k5fo] { color: #ffb3b3; }

.np-list[b-c0zof9k5fo] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 6px;

    /* nicer scrolling */
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.25) transparent;
}

.np-list[b-c0zof9k5fo]::-webkit-scrollbar {
    width: 10px;
}

.np-list[b-c0zof9k5fo]::-webkit-scrollbar-track {
    background: transparent;
}

.np-list[b-c0zof9k5fo]::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.20);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: content-box;
}

.np-list[b-c0zof9k5fo]::-webkit-scrollbar-thumb:hover {
    background: rgba(255,255,255,0.30);
    border: 2px solid transparent;
    background-clip: content-box;
}

.np-item[b-c0zof9k5fo] {
    display: flex;
    gap: 10px;
    padding: 8px;
    border-radius: 12px;
    cursor: pointer;
}

.np-item:hover[b-c0zof9k5fo] { background: rgba(255,255,255,0.06); }

.np-thumb[b-c0zof9k5fo] {
    width: 128px;
    height: 72px;
    border-radius: 10px;
    overflow: hidden;
    background: #0a0a0a;
    flex: 0 0 auto;
}

.np-thumb img[b-c0zof9k5fo] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.np-thumb-fallback[b-c0zof9k5fo] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: rgba(255,255,255,0.6);
}

.np-meta[b-c0zof9k5fo] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 6px;
}

.np-video-title[b-c0zof9k5fo] {
    font-size: 14px;
    line-height: 1.2;
    font-weight: 700;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.np-channel[b-c0zof9k5fo] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255,255,255,0.75);
    font-size: 12px;
}

.np-avatar[b-c0zof9k5fo] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    overflow: hidden;
    background: #0a0a0a;
    flex: 0 0 auto;
}

.np-avatar img[b-c0zof9k5fo] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.np-avatar-fallback[b-c0zof9k5fo] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: rgba(255,255,255,0.6);
}

.np-channel-title[b-c0zof9k5fo] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.np-footer[b-c0zof9k5fo] {
    padding: 10px 12px;
    border-top: 1px solid rgba(255,255,255,0.10);
    background: #141414;
}

.np-link[b-c0zof9k5fo] {
    border: none;
    background: rgba(255,255,255,0.08);
    color: #fff;
    padding: 8px 10px;
    border-radius: 10px;
    cursor: pointer;
}

.np-link:hover[b-c0zof9k5fo] { background: rgba(255,255,255,0.13); }
/* /Components/Shared/PluginTopbarItem.razor.rz.scp.css */
/* Plugin topbar button styles live in wwwroot/css/global.css because plugin icons are runtime markup. */
/* /Components/Shared/VideoCard.razor.rz.scp.css */
/* VideoCard component styles
   Dark YouTube-like card with ⋯ menu on thumbnail.
*/

.video-card[b-bh0ofmzz8c] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    color: #fff;
    text-decoration: none;
    outline: none;
}

    .video-card:focus-visible[b-bh0ofmzz8c] {
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25);
        border-radius: 12px;
    }

.video-thumb-wrap[b-bh0ofmzz8c] {
    position: relative;
    width: 100%;
    background: #000;
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}

.video-thumb[b-bh0ofmzz8c] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.video-thumb.is-hidden[b-bh0ofmzz8c] {
    opacity: 0;
}

.video-thumb-preview[b-bh0ofmzz8c] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: none;
    z-index: 1;
}

.video-thumb-preview.is-active[b-bh0ofmzz8c] {
    display: block;
}

    .video-thumb.placeholder[b-bh0ofmzz8c] {
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, #1a1a1a 0%, #101010 60%, #0c0c0c 100%);
    }

.video-duration-badge[b-bh0ofmzz8c] {
    position: absolute;
    right: 8px;
    bottom: 8px;
    background: rgba(0, 0, 0, 0.78);
    color: #fff;
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 6px;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.video-new-badge[b-bh0ofmzz8c] {
    position: absolute;
    left: 8px;
    top: 8px;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 13px;
    padding: 2px 6px;
    border-radius: 999px;
    line-height: 1.2;
    z-index: 4;
}

/* Watch progress overlay (for Channel/History) */
.video-watch-progress[b-bh0ofmzz8c] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    background: rgba(255, 255, 255, 0.18);
    z-index: 2;
}

.video-watch-progress-bar[b-bh0ofmzz8c] {
    height: 100%;
    width: 0%;
    background: rgba(255, 0, 0, 0.92);
}

/* ⋯ button */
.video-card-menu-btn[b-bh0ofmzz8c] {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 20px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 120ms ease, transform 120ms ease;
    z-index: 3;
}

    .video-card-menu-btn:hover[b-bh0ofmzz8c] {
        background: rgba(0, 0, 0, 0.75);
    }

    .video-card-menu-btn:active[b-bh0ofmzz8c] {
        transform: scale(0.98);
    }

/* menu */
.video-card-menu-backdrop[b-bh0ofmzz8c] {
    position: absolute;
    inset: 0;
    background: transparent;
    z-index: 5;
}

.video-card-menu[b-bh0ofmzz8c] {
    position: absolute;
    top: 40px;
    right: 8px;
    z-index: 6;
    min-width: 260px;
    background: rgba(25, 25, 25, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 12px;
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.35);
    padding: 6px;
    backdrop-filter: blur(6px);
}

.video-card-menu-item[b-bh0ofmzz8c] {
    width: 100%;
    border: 0;
    background: transparent;
    color: #fff;
    text-align: left;
    padding: 10px 10px;
    border-radius: 10px;
    cursor: pointer;
    font-size: 14px;
}

    .video-card-menu-item:hover[b-bh0ofmzz8c] {
        background: rgba(255, 255, 255, 0.08);
    }

    .video-card-menu-item:active[b-bh0ofmzz8c] {
        background: rgba(255, 255, 255, 0.12);
    }

/* meta */
.video-meta[b-bh0ofmzz8c] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.video-title[b-bh0ofmzz8c] {
    font-size: 14px;
    line-height: 1.25;
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.video-channel-row[b-bh0ofmzz8c] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.video-channel[b-bh0ofmzz8c] {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.78);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .video-channel:hover[b-bh0ofmzz8c] {
        color: rgba(255, 255, 255, 0.95);
        text-decoration: underline;
    }

.video-secondary[b-bh0ofmzz8c] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.62);
}

/* Small verified badge (reuses same class name as elsewhere) */
.verified-badge[b-bh0ofmzz8c] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.90);
    font-size: 12px;
    line-height: 1;
}