/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-iw67xh7dtm] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
    --uni-bar-height: 3.35rem;
}

main[b-iw67xh7dtm] {
    flex: 1;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
}

.sidebar[b-iw67xh7dtm] {
    background: var(--surface-sidebar);
    backdrop-filter: blur(16px);
    border-right: 1px solid var(--border-subtle);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* ── Universal bar ── */

.uni-bar[b-iw67xh7dtm] {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.6rem 1.5rem;
    background: var(--surface-topbar);
    backdrop-filter: blur(var(--glass-blur));
    border-bottom: 1px solid var(--border-subtle);
    pointer-events: auto;
}

.uni-bar-transparent[b-iw67xh7dtm] {
    background: transparent;
    backdrop-filter: none;
    border-bottom: none;
}

.uni-bar-input-wrap[b-iw67xh7dtm] {
    position: relative;
    width: 50%;
    min-width: 240px;
    max-width: 560px;
}

.uni-bar-icon[b-iw67xh7dtm] {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--on-surface-faint);
    font-size: 0.82rem;
    pointer-events: none;
    opacity: 0.5;
    width: auto;
    height: auto;
    margin: 0;
}

.uni-bar-input[b-iw67xh7dtm] {
    width: 100%;
    background: rgba(var(--interactive-primary-rgb), 0.06);
    border: 1px solid var(--border-medium);
    border-radius: var(--radius-full);
    color: var(--on-surface);
    padding: 0.5rem 2.5rem 0.5rem 2.5rem;
    font-size: 0.85rem;
    transition: border-color var(--duration-short) var(--ease-standard),
                background var(--duration-short) var(--ease-standard),
                box-shadow var(--duration-short) var(--ease-standard);
    outline: none;
}
.uni-bar-input:focus[b-iw67xh7dtm] {
    border-color: var(--interactive-accent);
    background: var(--surface-input);
    box-shadow: 0 0 0 3px rgba(var(--interactive-accent-rgb), 0.12);
}
.uni-bar-input[b-iw67xh7dtm]::placeholder {
    color: var(--on-surface-faint);
}

.uni-bar-transparent .uni-bar-input[b-iw67xh7dtm] {
    background: rgba(0, 0, 0, 0.3);
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.uni-bar-transparent .uni-bar-input[b-iw67xh7dtm]::placeholder {
    color: rgba(255, 255, 255, 0.4);
}
.uni-bar-transparent .uni-bar-input:focus[b-iw67xh7dtm] {
    background: rgba(0, 0, 0, 0.5);
    border-color: var(--interactive-accent);
    box-shadow: 0 0 0 3px rgba(var(--interactive-accent-rgb), 0.2);
}
.uni-bar-transparent .uni-bar-icon[b-iw67xh7dtm] {
    color: rgba(255, 255, 255, 0.4);
}

.uni-bar-clear[b-iw67xh7dtm] {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--on-surface-faint);
    cursor: pointer;
    padding: 0;
    font-size: 0.7rem;
    display: flex;
    align-items: center;
    transition: color 0.12s;
}
.uni-bar-clear:hover[b-iw67xh7dtm] { color: var(--on-surface); }

.uni-bar-transparent .uni-bar-clear[b-iw67xh7dtm] {
    color: rgba(255, 255, 255, 0.4);
}
.uni-bar-transparent .uni-bar-clear:hover[b-iw67xh7dtm] {
    color: #fff;
}

.content-library[b-iw67xh7dtm],
.content-fullbleed[b-iw67xh7dtm] {
    padding: 0 !important;
}

@media (max-width: 640.98px) {
    .uni-bar[b-iw67xh7dtm] { padding: 0.5rem 0.75rem; }
    .uni-bar-input-wrap[b-iw67xh7dtm] { width: 100%; max-width: none; }
    main.main-library[b-iw67xh7dtm] {
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
        overflow: hidden;
    }
    main.main-library article.content-library[b-iw67xh7dtm] {
        flex: 1;
        min-height: 0;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }
}

@media (min-width: 641px) {
    .page[b-iw67xh7dtm] { flex-direction: row; height: 100vh; overflow: hidden; }
    .sidebar[b-iw67xh7dtm] { width: 220px; height: 100vh; flex-shrink: 0; }
    main[b-iw67xh7dtm] {
        width: calc(100vw - 220px);
        max-width: calc(100vw - 220px);
        height: 100vh;
        overflow-y: auto;
    }
    /* Library: search bar + hero stay fixed; only Library’s .lib-page scrolls */
    main.main-library[b-iw67xh7dtm] {
        display: flex;
        flex-direction: column;
        overflow: hidden;
        overflow-y: hidden;
    }
    main.main-library article.content-library[b-iw67xh7dtm] {
        flex: 1;
        min-height: 0;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }
    article[b-iw67xh7dtm] { padding: 1.5rem; }
    .content-library[b-iw67xh7dtm], .content-fullbleed[b-iw67xh7dtm] { padding: 0 !important; }
}

/* ── Build progress bar ── */
.build-progress-bar[b-iw67xh7dtm] {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: linear-gradient(90deg, var(--interactive-primary), var(--interactive-accent));
    padding: 0.35rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.8rem;
    color: #fff;
    box-shadow: var(--shadow-elevation-1);
}
.build-progress-spinner[b-iw67xh7dtm] {
    width: 0.9rem;
    height: 0.9rem;
    border-width: 2px;
}
.build-progress-link[b-iw67xh7dtm] {
    margin-left: auto;
    color: #fff;
    opacity: 0.8;
    text-decoration: none;
    font-size: 0.75rem;
}
.build-progress-link:hover[b-iw67xh7dtm] { opacity: 1; }

#blazor-error-ui[b-iw67xh7dtm] {
    background: var(--surface-modal);
    color: var(--status-warning);
    bottom: 0;
    box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.4);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    border-top: 2px solid var(--status-warning);
}
#blazor-error-ui .dismiss[b-iw67xh7dtm] { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-y34cwtcxvt] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid var(--border-medium);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem var(--surface-card);
    border-radius: var(--radius-sm);
}
.navbar-toggler:checked[b-y34cwtcxvt] { background-color: var(--surface-elevated); }

.top-row[b-y34cwtcxvt] {
    height: 3.5rem;
    background: transparent;
    padding: 0.5rem 0.75rem;
    position: relative;
}
.brand-row[b-y34cwtcxvt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    justify-content: space-between;
}
.navbar-brand[b-y34cwtcxvt] {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--interactive-accent);
    margin: 0;
    padding: 0;
}

.user-badge[b-y34cwtcxvt] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 2px solid var(--border-medium);
    background: linear-gradient(135deg, var(--interactive-accent), var(--interactive-primary));
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.1s;
    padding: 0;
    flex-shrink: 0;
}
.user-badge:hover[b-y34cwtcxvt] {
    border-color: var(--interactive-accent);
    box-shadow: 0 0 0 3px rgba(var(--interactive-accent-rgb), 0.2);
    transform: scale(1.08);
}
.user-badge-initial[b-y34cwtcxvt] { line-height: 1; }

.user-menu-overlay[b-y34cwtcxvt] {
    position: fixed;
    inset: 0;
    z-index: 199;
}
.user-menu[b-y34cwtcxvt] {
    position: absolute;
    top: 3.2rem;
    right: 0.5rem;
    min-width: 210px;
    background: var(--surface-modal);
    border: 1px solid var(--border-medium);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-elevation-3);
    overflow: hidden;
    z-index: 200;
    animation: user-menu-in-b-y34cwtcxvt 0.12s var(--ease-decelerate);
}
@keyframes user-menu-in-b-y34cwtcxvt {
    from { opacity: 0; transform: translateY(-6px) scale(0.96); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
.user-menu-header[b-y34cwtcxvt] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.75rem 0.85rem;
}
.user-menu-avatar[b-y34cwtcxvt] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--interactive-accent), var(--interactive-primary));
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.user-menu-info[b-y34cwtcxvt] { display: flex; flex-direction: column; gap: 0.05rem; min-width: 0; }
.user-menu-name[b-y34cwtcxvt] { font-size: 0.82rem; font-weight: 600; color: var(--on-surface); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-menu-role[b-y34cwtcxvt] { font-size: 0.68rem; color: var(--on-surface-muted); }
.user-menu-divider[b-y34cwtcxvt] { height: 1px; background: var(--border-medium); }
.user-menu-item[b-y34cwtcxvt] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.5rem 0.85rem;
    font-size: 0.8rem;
    color: var(--on-surface-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background 0.1s, color 0.1s;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
}
.user-menu-item:hover[b-y34cwtcxvt] { background: var(--surface-card-hover); color: var(--on-surface); }
.user-menu-item .bi[b-y34cwtcxvt] { font-size: 0.85rem; opacity: 0.6; width: auto; height: auto; margin: 0; top: 0; }
.user-menu-logout[b-y34cwtcxvt] { color: var(--status-error); }
.user-menu-logout:hover[b-y34cwtcxvt] { background: rgba(var(--status-error-rgb), 0.1); color: var(--status-error); }

.bi[b-y34cwtcxvt] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.6rem;
    top: -10px;
    background-size: cover;
    opacity: 0.7;
}

.nav-section-label[b-y34cwtcxvt] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--on-surface-faint);
    padding: 1rem 1.25rem 0.3rem;
    user-select: none;
}
.nav-section-label:first-of-type[b-y34cwtcxvt] { padding-top: 0.75rem; }

.nav-item[b-y34cwtcxvt] {
    font-size: 0.85rem;
    padding-bottom: 0.15rem;
}
.nav-item:last-of-type[b-y34cwtcxvt] { padding-bottom: 0.5rem; }

.nav-item[b-y34cwtcxvt]  .nav-link {
    color: var(--on-surface-medium);
    background: none;
    border: none;
    border-radius: var(--radius-sm);
    height: 2.6rem;
    display: flex;
    align-items: center;
    line-height: 2.6rem;
    width: 100%;
    font-weight: 400;
    transition: all var(--duration-short) var(--ease-standard);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.nav-item[b-y34cwtcxvt]  a.active {
    background: rgba(var(--interactive-accent-rgb), 0.12);
    color: var(--interactive-accent);
}
.nav-item[b-y34cwtcxvt]  a.active .bi { opacity: 1; }

.nav-item[b-y34cwtcxvt]  .nav-link:hover {
    background: var(--surface-card);
    color: var(--on-surface);
}

.nav-lib-btn[b-y34cwtcxvt] {
    color: var(--on-surface-medium);
    background: none;
    border: none;
    border-radius: var(--radius-sm);
    height: 2.6rem;
    display: flex;
    align-items: center;
    line-height: 2.6rem;
    width: 100%;
    font-size: 0.85rem;
    font-weight: 400;
    cursor: pointer;
    padding-left: 0.5rem;
    transition: all var(--duration-short) var(--ease-standard);
}
.nav-lib-btn:hover[b-y34cwtcxvt] {
    background: var(--surface-card);
    color: var(--on-surface);
}
.nav-lib-btn.active[b-y34cwtcxvt] {
    background: rgba(var(--interactive-accent-rgb), 0.12);
    color: var(--interactive-accent);
}
.nav-lib-btn.active .bi[b-y34cwtcxvt] { opacity: 1; }

.nav-scrollable[b-y34cwtcxvt] { display: none; }
.navbar-toggler:checked ~ .nav-scrollable[b-y34cwtcxvt] { display: block; }

@media (min-width: 641px) {
    .navbar-toggler[b-y34cwtcxvt] { display: none; }
    .nav-scrollable[b-y34cwtcxvt] {
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: rgba(255,255,255,0.08) transparent;
    }
    .nav-scrollable[b-y34cwtcxvt]::-webkit-scrollbar { width: 4px; }
    .nav-scrollable[b-y34cwtcxvt]::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 2px; }
}
/* /Components/Pages/Bandwidth.razor.rz.scp.css */
.bw-page[b-ocp9agu39l] { max-width: var(--content-width-wide); margin: auto; }

.bw-header[b-ocp9agu39l] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 1.5rem; }
.bw-title-group h1[b-ocp9agu39l] { font-size: 1.35rem; font-weight: 700; margin: 0; color: var(--on-surface); }
.bw-subtitle[b-ocp9agu39l] { font-size: 0.8rem; color: var(--on-surface-muted); margin: 0.15rem 0 0; }
.bw-controls[b-ocp9agu39l] { display: flex; align-items: center; gap: 0.75rem; padding-top: 0.3rem; }

.bw-hero[b-ocp9agu39l] { margin-bottom: 1.25rem; overflow: hidden; }
.bw-hero-header[b-ocp9agu39l] { padding: 1rem 1.25rem 0; }
.bw-hero-chart[b-ocp9agu39l] { padding: 0.5rem 1rem 1rem; height: 280px; }

.bw-grid[b-ocp9agu39l] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (max-width: 900px) { .bw-grid[b-ocp9agu39l] { grid-template-columns: 1fr; } }

.bw-card[b-ocp9agu39l] { overflow: hidden; }
.bw-card-header[b-ocp9agu39l] { display: flex; align-items: center; gap: 0.6rem; padding: 0.8rem 1rem 0.4rem; }
.bw-icon[b-ocp9agu39l] { font-size: 1rem; display: flex; align-items: center; }
.bw-card-title[b-ocp9agu39l] { font-size: 0.85rem; font-weight: 500; color: var(--on-surface); }
.bw-card-unit[b-ocp9agu39l] { margin-left: 0.5rem; font-size: 0.7rem; color: var(--on-surface-muted); font-weight: 400; }
.bw-chart-wrap[b-ocp9agu39l] { padding: 0.25rem 0.75rem 0.75rem; height: 180px; }
/* /Components/Pages/Calendar.razor.rz.scp.css */
.cal-page[b-6z3sco79e7] { max-width: var(--content-width-narrow); margin: 0 auto; }

.cal-header[b-6z3sco79e7] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 0.75rem; }
.cal-header h1[b-6z3sco79e7] { font-size: 1.35rem; font-weight: 700; margin: 0; }
.cal-controls[b-6z3sco79e7] { display: flex; gap: 0.5rem; align-items: center; }
.cal-empty[b-6z3sco79e7] { text-align: center; padding: 4rem 1rem; color: var(--on-surface-faint); }

.cal-date-group[b-6z3sco79e7] { margin-bottom: 1.5rem; }
.cal-date-label[b-6z3sco79e7] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--on-surface-faint);
    border-bottom: 1px solid var(--border-medium);
    padding-bottom: 0.4rem;
    margin-bottom: 0.5rem;
}
.cal-items[b-6z3sco79e7] { display: flex; flex-direction: column; gap: 0.4rem; }

.cal-card-right[b-6z3sco79e7] { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
.cal-time[b-6z3sco79e7] { font-size: 0.75rem; color: var(--on-surface-faint); font-family: monospace; }
.cal-source[b-6z3sco79e7] { font-size: 0.6rem; font-weight: 600; text-transform: uppercase; padding: 0.1rem 0.3rem; border-radius: 0.2rem; }
.cal-source.sonarr[b-6z3sco79e7] { background: rgba(var(--status-info-rgb), 0.25); color: var(--status-info); }
.cal-source.radarr[b-6z3sco79e7] { background: rgba(var(--status-warning-rgb), 0.2); color: var(--status-warning); }
.cal-available[b-6z3sco79e7] { color: var(--status-success); font-size: 0.9rem; }
.cal-expand-meta[b-6z3sco79e7] { display: flex; flex-wrap: wrap; gap: 0.5rem; font-size: 0.72rem; color: var(--on-surface-faint); }

.cal-grid-view[b-6z3sco79e7] { width: 100%; overflow: hidden; }
.cal-grid-header[b-6z3sco79e7] { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; margin-bottom: 0.4rem; }
.cal-grid-dow[b-6z3sco79e7] { text-align: center; font-size: 0.7rem; text-transform: uppercase; color: var(--on-surface-faint); letter-spacing: 0.05em; padding: 0.3rem 0; }
.cal-grid-body[b-6z3sco79e7] { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
.cal-grid-cell[b-6z3sco79e7] { min-height: 80px; background: var(--surface-card); border: 1px solid var(--border-medium); border-radius: 0.3rem; padding: 0.3rem; overflow: hidden; }
.cal-grid-cell.empty[b-6z3sco79e7] { background: transparent; border-color: transparent; }
.cal-grid-cell.today[b-6z3sco79e7] { border-color: var(--interactive-accent); background: rgba(var(--interactive-primary-rgb), 0.05); }
.cal-grid-day[b-6z3sco79e7] { font-size: 0.7rem; font-weight: 600; color: var(--on-surface-faint); display: block; margin-bottom: 0.2rem; }
.cal-grid-item[b-6z3sco79e7] {
    font-size: 0.6rem;
    padding: 0.1rem 0.25rem;
    border-radius: 0.15rem;
    margin-bottom: 0.15rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    transition: background 0.15s;
}
.cal-grid-item:hover[b-6z3sco79e7] { filter: brightness(1.3); }
.cal-grid-item.episode[b-6z3sco79e7] { background: rgba(var(--status-info-rgb), 0.2); color: var(--status-info); }
.cal-grid-item.movie[b-6z3sco79e7] { background: rgba(var(--md-primary-rgb), 0.2); color: var(--md-primary-light); }
.cal-grid-more[b-6z3sco79e7] { font-size: 0.55rem; color: var(--on-surface-faint); }
/* /Components/Pages/Dashboard.razor.rz.scp.css */
.dashboard[b-dphbatsb2s] {
    color: var(--on-surface);
    min-height: 100vh;
    padding: 1.5rem 2rem;
}

.dash-header[b-dphbatsb2s] { margin-bottom: 1.75rem; }

.dash-brand h1[b-dphbatsb2s] {
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.dash-brand h1 .bi[b-dphbatsb2s] { opacity: 0.5; }

.dash-kpis[b-dphbatsb2s] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

.section[b-dphbatsb2s] { margin-bottom: 1.75rem; }

.dash-build-banner[b-dphbatsb2s] {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.75rem 1rem; margin-bottom: 1rem;
    border-color: rgba(var(--interactive-accent-rgb), 0.2);
}
.dash-build-info[b-dphbatsb2s] { flex: 1; }
.dash-build-title[b-dphbatsb2s] { font-weight: 600; font-size: 0.85rem; }
.dash-build-phases[b-dphbatsb2s] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.25rem; }
.dash-build-link[b-dphbatsb2s] { font-size: 0.8rem; color: var(--interactive-accent); text-decoration: none; }
.dash-build-link:hover[b-dphbatsb2s] { color: var(--interactive-accent-hover); }

.host-row[b-dphbatsb2s] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.75rem;
}

.host-card[b-dphbatsb2s] {
    background: var(--surface-card);
    backdrop-filter: blur(var(--glass-blur));
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 0.75rem;
    transition: background var(--duration-short) var(--ease-standard), border-color var(--duration-short);
}
.host-card:hover[b-dphbatsb2s] { background: var(--surface-card-hover); border-color: var(--border-medium); }

.host-top[b-dphbatsb2s] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.25rem; }
.host-name[b-dphbatsb2s] { font-weight: 600; font-size: 0.875rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.host-addr[b-dphbatsb2s] { font-size: 0.7rem; color: var(--on-surface-muted); margin-bottom: 0.5rem; }
.host-roles[b-dphbatsb2s] { display: flex; gap: 0.3rem; flex-wrap: wrap; margin-bottom: 0.4rem; }
.host-role-badge[b-dphbatsb2s] {
    font-size: 0.55rem; font-weight: 600; padding: 0.1rem 0.35rem;
    border-radius: 0.2rem; text-transform: uppercase; letter-spacing: 0.04em;
    background: rgba(var(--interactive-accent-rgb), 0.1); color: var(--interactive-accent);
}
.host-metrics-source[b-dphbatsb2s] {
    font-size: 0.6rem; color: var(--on-surface-muted); margin-top: 0.35rem;
    padding-top: 0.25rem; border-top: 1px solid var(--border-subtle);
    font-style: italic;
}
.host-metric[b-dphbatsb2s] { display: flex; justify-content: space-between; font-size: 0.75rem; padding: 0.15rem 0; }
.hm-label[b-dphbatsb2s] { color: var(--on-surface-muted); }
.hm-value[b-dphbatsb2s] { font-weight: 500; }

.svc-grid[b-dphbatsb2s] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 0.75rem;
}

.svc-card-dh[b-dphbatsb2s] {
    padding: 0.75rem 1rem;
    border-left: 3px solid var(--on-surface-muted);
}
.svc-card-dh.dh-has-warn[b-dphbatsb2s] {
    border-left-color: var(--status-warning);
}
.dh-top[b-dphbatsb2s] { margin-bottom: 0.35rem; }
.dh-rel[b-dphbatsb2s] {
    font-size: 0.72rem;
    color: var(--on-surface-muted);
    margin: 0 0 0.5rem;
    line-height: 1.3;
}
.dh-empty[b-dphbatsb2s] {
    font-size: 0.75rem;
    color: var(--on-surface-muted);
    margin: 0 0 0.5rem;
    font-style: italic;
}
.badge.dh-warn[b-dphbatsb2s] {
    background: rgba(var(--status-warning-rgb, 255, 152, 0), 0.18);
    color: var(--status-warning, #ff9800);
    border: 1px solid rgba(var(--status-warning-rgb, 255, 152, 0), 0.35);
}
.dh-metrics[b-dphbatsb2s] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.5rem;
}
.dh-metric[b-dphbatsb2s] {
    display: flex;
    flex-direction: column;
    min-width: 72px;
}
.dh-metric-wide[b-dphbatsb2s] { min-width: 100%; flex-basis: 100%; }
.dh-metric-val[b-dphbatsb2s] {
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1.2;
}
.dh-metric-lbl[b-dphbatsb2s] {
    font-size: 0.55rem;
    color: var(--on-surface-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.dh-actions-h[b-dphbatsb2s] {
    font-size: 0.6rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--on-surface-muted);
    margin: 0.35rem 0 0.2rem;
}
.dh-actions[b-dphbatsb2s] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 5.5rem;
    overflow-y: auto;
}
.dh-act[b-dphbatsb2s] {
    font-size: 0.68rem;
    color: var(--on-surface-medium);
    padding: 0.15rem 0;
    border-bottom: 1px solid var(--border-subtle);
    line-height: 1.35;
    word-break: break-word;
}
.dh-act:last-child[b-dphbatsb2s] { border-bottom: none; }
.dh-foot[b-dphbatsb2s] { padding-top: 0.4rem; margin-top: 0.25rem; }

.svc-card[b-dphbatsb2s] {
    background: var(--surface-card);
    backdrop-filter: blur(var(--glass-blur));
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 1rem;
    transition: background var(--duration-short) var(--ease-standard), border-color var(--duration-short);
}
.svc-card:hover[b-dphbatsb2s] { background: var(--surface-card-hover); border-color: var(--border-medium); }
.svc-card.ok[b-dphbatsb2s] { border-left: 3px solid var(--status-success); }
.svc-card.critical[b-dphbatsb2s] { border-left: 3px solid var(--status-error); }
.svc-card.pending[b-dphbatsb2s] { border-left: 3px solid var(--on-surface-muted); }

.svc-top[b-dphbatsb2s] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.svc-identity[b-dphbatsb2s] { display: flex; align-items: center; gap: 0.5rem; }
.svc-dot[b-dphbatsb2s] { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.dot-green[b-dphbatsb2s] { background: var(--status-success); box-shadow: 0 0 6px rgba(var(--status-success-rgb), 0.4); }
.dot-red[b-dphbatsb2s] { background: var(--status-error); box-shadow: 0 0 6px rgba(var(--status-error-rgb), 0.4); }
.dot-gray[b-dphbatsb2s] { background: var(--on-surface-muted); }
.svc-name[b-dphbatsb2s] { font-size: 0.9rem; font-weight: 600; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.svc-ver[b-dphbatsb2s] { font-size: 0.65rem; color: var(--status-success); font-weight: 500; }

.badge[b-dphbatsb2s] {
    font-size: 0.6rem; font-weight: 600; padding: 0.15rem 0.4rem;
    border-radius: 0.25rem; text-transform: uppercase; letter-spacing: 0.05em;
    background: var(--surface-card); color: var(--on-surface-muted);
}
.badge.app[b-dphbatsb2s] { background: rgba(var(--status-info-rgb), 0.12); color: var(--status-info); }
.badge.mediaserver[b-dphbatsb2s] { background: rgba(var(--interactive-accent-rgb), 0.12); color: var(--interactive-accent); }
.badge.downloader[b-dphbatsb2s] { background: rgba(var(--status-success-rgb), 0.12); color: var(--status-success); }
.badge.indexer[b-dphbatsb2s] { background: rgba(var(--md-primary-rgb), 0.15); color: var(--md-primary-light); }
.badge.proxy[b-dphbatsb2s], .badge.hostcontrol[b-dphbatsb2s] { background: rgba(var(--status-success-rgb), 0.08); color: var(--status-success); }
.badge.host[b-dphbatsb2s], .badge.ssh[b-dphbatsb2s], .badge.linux[b-dphbatsb2s] { background: var(--surface-card); color: var(--on-surface-muted); }
.badge.winrm[b-dphbatsb2s], .badge.windows[b-dphbatsb2s] { background: rgba(var(--status-info-rgb), 0.12); color: var(--status-info); }
.badge.synology[b-dphbatsb2s] { background: rgba(var(--status-info-rgb), 0.1); color: #4fc3f7; }
.badge.unraid[b-dphbatsb2s] { background: rgba(255,152,0,0.1); color: #ff9800; }
.badge.truenas[b-dphbatsb2s] { background: rgba(var(--status-info-rgb), 0.1); color: #29b6f6; }
.badge.qnap[b-dphbatsb2s] { background: rgba(var(--status-success-rgb), 0.1); color: var(--status-success); }
.badge.worker[b-dphbatsb2s] { background: rgba(var(--md-primary-rgb), 0.12); color: var(--md-primary-light); }

.svc-msg[b-dphbatsb2s] { font-size: 0.8rem; color: var(--on-surface-medium); margin: 0 0 0.75rem; line-height: 1.4; word-break: break-word; }

.svc-metrics[b-dphbatsb2s] { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 0.75rem; }
.sm[b-dphbatsb2s] { display: flex; flex-direction: column; min-width: 60px; }
.sm-val[b-dphbatsb2s] { font-size: 1rem; font-weight: 700; line-height: 1.2; }
.sm-label[b-dphbatsb2s] { font-size: 0.6rem; color: var(--on-surface-muted); text-transform: uppercase; letter-spacing: 0.05em; }

.svc-actions[b-dphbatsb2s] { display: flex; gap: 0.5rem; padding-top: 0.5rem; border-top: 1px solid var(--border-subtle); }

.btn-link[b-dphbatsb2s] {
    font-size: 0.7rem; padding: 0.25rem 0.5rem;
    background: rgba(var(--interactive-accent-rgb), 0.1); color: var(--interactive-accent);
    border: 1px solid rgba(var(--interactive-accent-rgb), 0.2); border-radius: var(--radius-sm);
    text-decoration: none; cursor: pointer;
}
.btn-link:hover[b-dphbatsb2s] { background: rgba(var(--interactive-accent-rgb), 0.18); }

.btn-fix[b-dphbatsb2s] {
    font-size: 0.85rem; padding: 0.25rem 0.5rem;
    background: rgba(var(--status-warning-rgb, 255,152,0), 0.1); color: var(--status-warning, #ff9800);
    border: 1px solid rgba(var(--status-warning-rgb, 255,152,0), 0.2); border-radius: var(--radius-sm);
    cursor: pointer; text-decoration: none; display: inline-flex; align-items: center;
}
.btn-fix:hover[b-dphbatsb2s] { background: rgba(var(--status-warning-rgb, 255,152,0), 0.25); color: var(--status-warning, #ff9800); text-decoration: none; }

.btn-settings[b-dphbatsb2s] {
    font-size: 0.85rem; padding: 0.25rem 0.5rem;
    background: rgba(255,255,255,0.05); color: var(--on-surface-muted);
    border: 1px solid var(--border-subtle); border-radius: var(--radius-sm);
    cursor: pointer; text-decoration: none; display: inline-flex; align-items: center;
}
.btn-settings:hover[b-dphbatsb2s] { background: rgba(255,255,255,0.1); color: var(--on-surface-medium); text-decoration: none; }

.activity-feed[b-dphbatsb2s] {
    background: var(--surface-card);
    backdrop-filter: blur(var(--glass-blur));
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    max-height: 250px; overflow-y: auto;
}
.activity-row[b-dphbatsb2s] { display: flex; gap: 0.75rem; padding: 0.4rem 0.75rem; font-size: 0.75rem; border-bottom: 1px solid var(--border-subtle); }
.activity-row:last-child[b-dphbatsb2s] { border-bottom: none; }
.act-time[b-dphbatsb2s] { color: var(--on-surface-muted); font-family: 'SF Mono', 'Fira Code', monospace; min-width: 65px; }
.act-action[b-dphbatsb2s] { font-weight: 600; min-width: 80px; }
.act-target[b-dphbatsb2s] { color: var(--interactive-accent); min-width: 80px; }
.act-result[b-dphbatsb2s] { color: var(--on-surface-muted); }
.act-empty[b-dphbatsb2s] { color: var(--on-surface-muted); font-style: italic; }

.fix-modal-overlay[b-dphbatsb2s] {
    position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 1000;
    display: flex; align-items: center; justify-content: center;
}
.fix-modal[b-dphbatsb2s] {
    background: var(--surface-card); border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md); width: min(480px, 90vw); max-height: 80vh;
    overflow-y: auto; padding: 1.25rem;
}
.fix-modal-header[b-dphbatsb2s] {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--border-subtle);
}
.fix-modal-header h3[b-dphbatsb2s] { font-size: 1rem; font-weight: 600; margin: 0; display: flex; align-items: center; gap: 0.5rem; }
.fix-steps[b-dphbatsb2s] { display: flex; flex-direction: column; gap: 0.4rem; }
.fix-step[b-dphbatsb2s] {
    display: flex; align-items: center; gap: 0.5rem; font-size: 0.8rem;
    padding: 0.4rem 0.5rem; border-radius: var(--radius-sm);
}
.fix-step.running[b-dphbatsb2s] { background: rgba(var(--status-info-rgb), 0.06); }
.fix-step.done[b-dphbatsb2s] { color: var(--status-success); }
.fix-step.failed[b-dphbatsb2s] { color: var(--status-error); }
.fix-step.skipped[b-dphbatsb2s] { color: var(--on-surface-muted); }
.fix-step-icon[b-dphbatsb2s] { flex-shrink: 0; width: 16px; display: flex; align-items: center; justify-content: center; }
.fix-step-name[b-dphbatsb2s] { font-weight: 500; }
.fix-step-detail[b-dphbatsb2s] { color: var(--on-surface-muted); font-size: 0.7rem; margin-left: auto; }
.fix-modal-footer[b-dphbatsb2s] {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: 1rem; padding-top: 0.75rem; border-top: 1px solid var(--border-subtle);
}
.fix-summary[b-dphbatsb2s] { font-size: 0.8rem; font-weight: 500; }
.fix-summary.ok[b-dphbatsb2s] { color: var(--status-success); }
.fix-summary.warn[b-dphbatsb2s] { color: var(--status-warning); }

.vol-bars[b-dphbatsb2s] { margin-top: 0.4rem; display: flex; flex-direction: column; gap: 0.35rem; }

.vol-bar[b-dphbatsb2s] { display: flex; flex-direction: column; gap: 0.1rem; }

.vol-bar-label[b-dphbatsb2s] {
    font-size: 0.6rem;
    color: var(--on-surface-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vol-bar-track[b-dphbatsb2s] {
    height: 6px;
    background: rgba(255,255,255,0.06);
    border-radius: 3px;
    overflow: hidden;
}

.vol-bar-fill[b-dphbatsb2s] {
    height: 100%;
    border-radius: 3px;
    transition: width var(--duration-short) var(--ease-standard);
}

.vol-ok[b-dphbatsb2s] { background: var(--status-success); }
.vol-warn[b-dphbatsb2s] { background: var(--status-warning); }
.vol-crit[b-dphbatsb2s] { background: var(--status-error); }

.vol-unavailable[b-dphbatsb2s] {
    font-size: 0.6rem;
    color: var(--on-surface-muted);
    font-style: italic;
    margin-top: 0.35rem;
}
/* /Components/Pages/Docker.razor.rz.scp.css */
.docker-page[b-r3gqaj6vlr] {
    background: var(--surface-base);
    color: var(--on-surface);
    min-height: 100vh;
    padding: 1.5rem;
}

.docker-header[b-r3gqaj6vlr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; }
.docker-header h1[b-r3gqaj6vlr] { font-size: 1.25rem; font-weight: 700; margin: 0; }

.docker-btn[b-r3gqaj6vlr] {
    background: rgba(var(--interactive-accent-rgb), 0.15); color: var(--interactive-accent);
    border: 1px solid rgba(var(--interactive-accent-rgb), 0.3); border-radius: var(--radius-xs);
    padding: 0.35rem 0.75rem; font-size: 0.8rem; cursor: pointer;
}

.host-section[b-r3gqaj6vlr] { margin-bottom: 1.5rem; }
.host-label[b-r3gqaj6vlr] {
    font-size: 0.75rem; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.1em; color: var(--on-surface-muted); margin: 0 0 0.5rem;
    padding-bottom: 0.3rem; border-bottom: 1px solid var(--border-medium);
}
.host-count[b-r3gqaj6vlr] { font-weight: 400; color: var(--on-surface-muted); }

.container-grid[b-r3gqaj6vlr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0.5rem; }

.ctr-card[b-r3gqaj6vlr] {
    background: var(--surface-card); border: 1px solid var(--border-medium);
    border-radius: var(--radius-sm); padding: 0.75rem; cursor: pointer;
    transition: border-color var(--duration-short), background var(--duration-short);
}
.ctr-card:hover[b-r3gqaj6vlr] { background: var(--surface-card-hover); }
.ctr-card.running[b-r3gqaj6vlr] { border-left: 3px solid var(--status-success); }
.ctr-card.stopped[b-r3gqaj6vlr] { border-left: 3px solid var(--status-error); }
.ctr-card.selected[b-r3gqaj6vlr] { border-color: var(--interactive-accent); background: var(--surface-card-hover); }

.ctr-top[b-r3gqaj6vlr] { display: flex; align-items: center; gap: 0.4rem; margin-bottom: 0.25rem; }
.ctr-dot[b-r3gqaj6vlr] { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.ctr-dot.green[b-r3gqaj6vlr] { background: var(--status-success); box-shadow: 0 0 4px rgba(var(--status-success-rgb), 0.5); }
.ctr-dot.red[b-r3gqaj6vlr] { background: var(--status-error); box-shadow: 0 0 4px rgba(var(--status-error-rgb), 0.5); }
.ctr-name[b-r3gqaj6vlr] { font-weight: 600; font-size: 0.85rem; }
.ctr-image[b-r3gqaj6vlr] { font-size: 0.7rem; color: var(--interactive-accent); word-break: break-all; }
.ctr-status[b-r3gqaj6vlr] { font-size: 0.7rem; color: var(--on-surface-muted); margin-top: 0.2rem; }

.ctr-controls[b-r3gqaj6vlr] {
    display: flex; flex-wrap: wrap; gap: 0.35rem;
    margin-top: 0.5rem; padding-top: 0.5rem; border-top: 1px solid var(--border-medium);
}

.ctl[b-r3gqaj6vlr] {
    font-size: 0.7rem; padding: 0.25rem 0.5rem; border-radius: var(--radius-xs);
    cursor: pointer; font-weight: 600; border: 1px solid var(--border-medium);
    background: var(--surface-elevated); color: var(--on-surface);
}
.ctl.start[b-r3gqaj6vlr] { background: rgba(var(--status-success-rgb), 0.12); color: var(--status-success); border-color: rgba(var(--status-success-rgb), 0.3); }
.ctl.stop[b-r3gqaj6vlr] { background: rgba(var(--status-warning-rgb), 0.12); color: var(--status-warning); border-color: rgba(var(--status-warning-rgb), 0.3); }
.ctl.restart[b-r3gqaj6vlr] { background: rgba(var(--status-info-rgb), 0.12); color: var(--status-info); border-color: rgba(var(--status-info-rgb), 0.3); }
.ctl.logs[b-r3gqaj6vlr] { background: rgba(var(--interactive-accent-rgb), 0.12); color: var(--interactive-accent); border-color: rgba(var(--interactive-accent-rgb), 0.3); }
.ctl.versions[b-r3gqaj6vlr] { background: rgba(var(--md-primary-rgb), 0.12); color: var(--md-primary-light); border-color: rgba(var(--md-primary-rgb), 0.3); }
.ctl.danger[b-r3gqaj6vlr] { background: rgba(var(--status-error-rgb), 0.12); color: var(--status-error); border-color: rgba(var(--status-error-rgb), 0.3); }
.ctl.rollback[b-r3gqaj6vlr] { background: rgba(var(--md-primary-rgb), 0.12); color: var(--md-primary-light); border-color: rgba(var(--md-primary-rgb), 0.3); }
.ctl:hover[b-r3gqaj6vlr] { filter: brightness(1.2); }
.ctl:disabled[b-r3gqaj6vlr] { opacity: 0.5; cursor: wait; }

.action-banner[b-r3gqaj6vlr] {
    margin: 0.75rem 0; padding: 0.5rem 0.75rem; border-radius: var(--radius-xs);
    font-size: 0.8rem; word-break: break-word;
}
.action-banner.ok[b-r3gqaj6vlr] { background: rgba(var(--status-success-rgb), 0.1); color: var(--status-success); border: 1px solid rgba(var(--status-success-rgb), 0.25); }
.action-banner.err[b-r3gqaj6vlr] { background: rgba(var(--status-error-rgb), 0.1); color: var(--status-error); border: 1px solid rgba(var(--status-error-rgb), 0.25); }

.panel[b-r3gqaj6vlr] {
    background: var(--surface-card); border: 1px solid var(--border-medium);
    border-radius: var(--radius-sm); margin: 0.75rem 0; overflow: hidden;
}
.panel-header[b-r3gqaj6vlr] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.5rem 0.75rem; background: var(--surface-elevated);
    font-size: 0.8rem; font-weight: 600;
}
.panel-close[b-r3gqaj6vlr] {
    background: none; border: none; color: var(--on-surface-muted); cursor: pointer;
    font-size: 0.75rem;
}

.log-output[b-r3gqaj6vlr] {
    padding: 0.5rem; margin: 0; font-size: 0.7rem; line-height: 1.5;
    max-height: 400px; overflow: auto; color: var(--on-surface);
    font-family: 'Cascadia Code', 'Fira Code', Consolas, monospace;
    background: var(--surface-base); white-space: pre-wrap; word-break: break-all;
}

.tag-note[b-r3gqaj6vlr] { padding: 0.5rem 0.75rem; font-size: 0.75rem; color: var(--on-surface-muted); }
.tag-note code[b-r3gqaj6vlr] { color: var(--interactive-accent); }

.tag-list[b-r3gqaj6vlr] { max-height: 350px; overflow-y: auto; }
.tag-row[b-r3gqaj6vlr] {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.35rem 0.75rem; border-bottom: 1px solid var(--border-medium);
    font-size: 0.75rem;
}
.tag-row:hover[b-r3gqaj6vlr] { background: var(--surface-card-hover); }
.tag-name[b-r3gqaj6vlr] { font-weight: 600; min-width: 180px; color: var(--on-surface); }
.tag-date[b-r3gqaj6vlr] { color: var(--on-surface-muted); min-width: 80px; }
.tag-size[b-r3gqaj6vlr] { color: var(--on-surface-muted); min-width: 60px; }

.confirm-overlay[b-r3gqaj6vlr] {
    position: fixed; inset: 0; background: var(--surface-overlay);
    display: flex; align-items: center; justify-content: center; z-index: 1000;
}
.confirm-box[b-r3gqaj6vlr] {
    background: var(--surface-modal); border: 1px solid var(--border-medium);
    border-radius: var(--radius-sm); padding: 1.5rem; max-width: 400px; width: 90%;
}
.confirm-box h3[b-r3gqaj6vlr] { margin: 0 0 0.5rem; font-size: 1rem; }
.confirm-box p[b-r3gqaj6vlr] { font-size: 0.8rem; color: var(--on-surface-muted); margin: 0 0 1rem; }
.confirm-actions[b-r3gqaj6vlr] { display: flex; gap: 0.5rem; }

.docker-empty[b-r3gqaj6vlr] { text-align: center; color: var(--on-surface-muted); padding: 2rem; font-style: italic; }
.table-wrap[b-r3gqaj6vlr] { overflow-x: auto; }
.docker-table[b-r3gqaj6vlr] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.docker-table th[b-r3gqaj6vlr], .docker-table td[b-r3gqaj6vlr] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--border-medium); text-align: left; }
.docker-table th[b-r3gqaj6vlr] { color: var(--on-surface-muted); font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; }
.docker-table code[b-r3gqaj6vlr] { font-size: 0.7rem; color: var(--interactive-accent); }
/* /Components/Pages/Downloads.razor.rz.scp.css */
.dl-page[b-8x3dql4kr2] { max-width: var(--content-width-default); margin: 0 auto; }

.dl-header[b-8x3dql4kr2] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 0.5rem; }
.dl-header h1[b-8x3dql4kr2] { font-size: 1.35rem; font-weight: 700; margin: 0; }
.dl-watchdog-status[b-8x3dql4kr2] { font-size: 0.75rem; color: var(--on-surface-muted); display: flex; align-items: center; gap: 0.3rem; }
.dl-stuck-banner[b-8x3dql4kr2] {
    display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;
    padding: 0.75rem 1rem; margin-bottom: 1rem; border-radius: var(--radius-sm);
    background: rgba(var(--status-warning-rgb), 0.1); border: 1px solid rgba(var(--status-warning-rgb), 0.3);
    color: var(--status-warning); font-size: 0.85rem; font-weight: 500;
}
.dl-fix-btn[b-8x3dql4kr2] {
    display: inline-flex; align-items: center; gap: 0.3rem;
    padding: 0.35rem 0.75rem; border: 1px solid rgba(var(--status-warning-rgb), 0.4); border-radius: var(--radius-xs);
    background: rgba(var(--status-warning-rgb), 0.15); color: var(--status-warning); font-size: 0.8rem; font-weight: 600;
    cursor: pointer; transition: background 0.15s;
}
.dl-fix-btn:hover:not(:disabled)[b-8x3dql4kr2] { background: rgba(var(--status-warning-rgb), 0.25); }
.dl-fix-btn:disabled[b-8x3dql4kr2] { opacity: 0.5; cursor: not-allowed; }
.dl-fix-result[b-8x3dql4kr2] { font-size: 0.75rem; color: var(--on-surface-muted); }
.dl-error-banner[b-8x3dql4kr2] {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.75rem 1rem; margin-bottom: 1rem; border-radius: var(--radius-sm);
    background: rgba(var(--status-error-rgb), 0.1); border: 1px solid rgba(var(--status-error-rgb), 0.3);
    color: var(--status-error); font-size: 0.85rem; font-weight: 500;
}
.dl-empty[b-8x3dql4kr2] { text-align: center; padding: 4rem 1rem; color: var(--on-surface-faint); }

.dl-section[b-8x3dql4kr2] { margin-bottom: 2rem; }
.dl-list[b-8x3dql4kr2] { display: flex; flex-direction: column; gap: 0.4rem; }

.dl-row[b-8x3dql4kr2] { padding: 0.6rem 0.8rem; }
.dl-row-main[b-8x3dql4kr2] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.4rem; }
.dl-name[b-8x3dql4kr2] { font-weight: 500; font-size: 0.85rem; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dl-torrent-state[b-8x3dql4kr2] { font-size: 0.7rem; color: var(--on-surface-medium); }
.dl-label[b-8x3dql4kr2] { font-size: 0.6rem; background: var(--surface-card); padding: 0.1rem 0.3rem; border-radius: 0.2rem; }

.dl-state-dot[b-8x3dql4kr2] { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.dl-state-dot.seeding[b-8x3dql4kr2] { background: var(--status-success); }
.dl-state-dot.downloading[b-8x3dql4kr2] { background: var(--status-info); animation: pulse-dot 1.5s ease-in-out infinite; }
.dl-state-dot.paused[b-8x3dql4kr2] { background: var(--status-warning); }
.dl-state-dot.error[b-8x3dql4kr2] { background: var(--status-error); }
.dl-state-dot.queued[b-8x3dql4kr2] { background: var(--on-surface-faint); }

.dl-row-progress[b-8x3dql4kr2] { display: flex; align-items: center; gap: 0.5rem; min-width: 180px; }
.dl-bar[b-8x3dql4kr2] { flex: 1; height: 4px; background: var(--surface-card); border-radius: 2px; overflow: hidden; min-width: 60px; }
.dl-bar-fill[b-8x3dql4kr2] { height: 100%; background: var(--status-info); border-radius: 2px; transition: width 0.3s; }
.dl-bar-fill.done[b-8x3dql4kr2] { background: var(--status-success); }
.dl-pct[b-8x3dql4kr2] { font-size: 0.72rem; font-weight: 600; min-width: 40px; }
.dl-size[b-8x3dql4kr2] { font-size: 0.68rem; color: var(--on-surface-faint); }
.dl-eta[b-8x3dql4kr2] { font-size: 0.68rem; color: var(--interactive-accent); }

.dl-detail[b-8x3dql4kr2] { font-size: 0.78rem; }
.dl-detail-row[b-8x3dql4kr2] { margin-bottom: 0.2rem; }
.dl-detail-label[b-8x3dql4kr2] { color: var(--on-surface-faint); margin-right: 0.3rem; }
.dl-detail-messages[b-8x3dql4kr2] { margin-top: 0.4rem; }
.dl-detail-msg[b-8x3dql4kr2] { padding: 0.3rem 0.5rem; background: rgba(var(--status-warning-rgb), 0.08); border-radius: 0.3rem; margin-bottom: 0.3rem; border-left: 2px solid var(--status-warning); }
.dl-detail-submsg[b-8x3dql4kr2] { font-size: 0.72rem; color: var(--on-surface-medium); padding-left: 0.5rem; }
/* /Components/Pages/Library.razor.rz.scp.css */
    /* Single flex child of article.content-library so height/min-height chain works */
    .lib-article-fill[b-p29edtj7e1] {
        flex: 1;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        position: relative;
    }
    .lib-backdrop[b-p29edtj7e1] { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
    .lib-backdrop-img[b-p29edtj7e1] {
        position: absolute; inset: 0; width: 100%; height: 100%;
        object-fit: cover; object-position: center 20%;
        opacity: var(--lib-backdrop-opacity, .18);
        transition: opacity 1.2s ease, filter .6s ease;
    }
    .lib-backdrop-active[b-p29edtj7e1] { opacity: var(--lib-backdrop-opacity, .18); z-index: 1; }
    .lib-backdrop-fading[b-p29edtj7e1] { opacity: 0; z-index: 0; transition: opacity 1.5s ease; }
    .lib-backdrop-blur[b-p29edtj7e1] { filter: blur(40px) brightness(.4); transform: scale(1.15); opacity: .25; }
    .lib-backdrop-gradient[b-p29edtj7e1] {
        position: absolute; inset: 0; z-index: 2;
        background: linear-gradient(180deg, transparent 0%, rgba(var(--md-background-rgb,10,15,30),.7) 50%, rgba(var(--md-background-rgb,10,15,30),1) 100%);
    }

    /* Fills article.content-library (flex column); hero fixed, .lib-page is the only vertical scroll */
    .lib-layout[b-p29edtj7e1] {
        outline: none;
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
        overflow: hidden;
    }
    .lib-hero-region[b-p29edtj7e1] {
        flex-shrink: 0;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 1rem 1.25rem 1rem;
        border-bottom: 1px solid var(--border-subtle);
        background: var(--md-background, #0a0f1e);
        box-sizing: border-box;
    }
    .lib-page[b-p29edtj7e1] {
        flex: 1;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 1rem 1.25rem 1.5rem;
        width: 100%;
        max-width: none;
        margin: 0;
        position: relative;
        outline: none;
        box-sizing: border-box;
    }
    .lib-home-feed[b-p29edtj7e1] {
        position: relative;
        z-index: 1;
        overflow-x: hidden;
    }
    @supports (overflow: clip) {
        .lib-home-feed[b-p29edtj7e1] { overflow-x: clip; }
    }
    .lib-empty[b-p29edtj7e1] { text-align: center; padding: 4rem 1rem; color: var(--on-surface-muted); }
    .lib-hero-sticky[b-p29edtj7e1] { position: relative; z-index: 1; }
    .lib-hero-dock[b-p29edtj7e1] {
        position: relative;
        z-index: 1;
        background: transparent;
        padding-bottom: 0;
        margin-bottom: 0;
        box-shadow: none;
    }
    .lib-hero-browse[b-p29edtj7e1] { position: relative; z-index: 1; box-shadow: none; background: transparent; }
    .lib-stage-posters[b-p29edtj7e1] {
        display: flex; gap: var(--lib-card-gap); overflow-x: auto; padding: .5rem 0 1rem;
        scroll-snap-type: x mandatory; scrollbar-width: thin;
    }
    .st-poster-card[b-p29edtj7e1] {
        flex: 0 0 140px; scroll-snap-align: start; cursor: pointer;
        border-radius: var(--lib-card-radius); overflow: hidden; position: relative;
        border: 2px solid transparent; transition: transform .2s, border-color .2s, box-shadow .2s;
    }
    .st-poster-card img[b-p29edtj7e1] { width: 100%; aspect-ratio: 2/3; object-fit: cover; display: block; }
    .st-poster-card:hover[b-p29edtj7e1], .st-poster-card:focus[b-p29edtj7e1] { transform: scale(1.05); border-color: var(--lib-focus-ring-color); }
    .st-poster-active[b-p29edtj7e1] { border-color: var(--interactive-primary); box-shadow: 0 0 12px rgba(var(--interactive-primary-rgb),.4); }
    .st-poster-title[b-p29edtj7e1] { display: block; font-size: .7rem; padding: .25rem .4rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--on-surface); }
    .lib-grid[b-p29edtj7e1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--lib-grid-min-width), 1fr)); gap: var(--lib-card-gap); }
    .lib-grid-container[b-p29edtj7e1] { overflow: visible; }
    .lib-grid-row[b-p29edtj7e1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--lib-grid-min-width), 1fr)); gap: var(--lib-card-gap); height: 276px; overflow: hidden; margin-bottom: 12px; }
    .lib-wall-container[b-p29edtj7e1] { overflow: visible; }
    .lib-wall-row[b-p29edtj7e1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--lib-wall-min-width), 1fr)); gap: 2px; height: 188px; overflow: hidden; margin-bottom: 2px; }
    .lib-hub-section[b-p29edtj7e1] { margin-bottom: 2rem; }
    .lib-hub-title[b-p29edtj7e1] { font-size: .95rem; font-weight: 700; color: var(--on-surface); margin-bottom: .75rem; display: flex; align-items: center; gap: .5rem; letter-spacing: .02em; }
    .lib-hub-title .bi[b-p29edtj7e1] { font-size: .9rem; opacity: .4; }
    .hub-row[b-p29edtj7e1] {
        display: flex; gap: var(--lib-card-gap); overflow-x: auto; padding-bottom: .75rem;
        scrollbar-width: thin; scrollbar-color: rgba(var(--interactive-primary-rgb), 0.12) transparent;
        scroll-behavior: smooth; scroll-snap-type: x proximity;
    }
    .hub-row[b-p29edtj7e1]::-webkit-scrollbar { height: 4px; }
    .hub-row[b-p29edtj7e1]::-webkit-scrollbar-thumb { background: rgba(var(--interactive-primary-rgb), 0.12); border-radius: 2px; }
    .hub-row-landscape[b-p29edtj7e1] { gap: var(--lib-card-gap); }
    .lib-hub-sentinel[b-p29edtj7e1] { min-width: 1px; flex-shrink: 0; }

    .hub-card[b-p29edtj7e1] {
        flex: 0 0 var(--lib-hub-card-width); scroll-snap-align: start; cursor: pointer; outline: none;
        border-radius: var(--lib-card-radius); overflow: hidden;
        background: var(--lib-card-bg); border: 2px solid transparent;
        transition: border-color var(--lib-transition-speed), box-shadow var(--lib-transition-speed);
    }
    .hub-card:hover[b-p29edtj7e1], .hub-card:focus[b-p29edtj7e1] { border-color: var(--lib-focus-ring-color); box-shadow: var(--lib-focus-shadow); z-index: 5; position: relative; }
    .hub-card-active[b-p29edtj7e1] { border-color: var(--lib-focus-ring-color); }
    .hub-card-poster[b-p29edtj7e1] { aspect-ratio: var(--lib-poster-ratio); width: 100%; overflow: hidden; position: relative; background: var(--surface-base); }
    .hub-card-poster img[b-p29edtj7e1] { width: 100%; height: 100%; object-fit: cover; display: block; }
    .hub-card-play[b-p29edtj7e1] {
        position: absolute; bottom: .4rem; right: .4rem; width: 36px; height: 36px;
        display: flex; align-items: center; justify-content: center; border-radius: 50%;
        background: rgba(0,0,0,.7); border: none; opacity: 0; transition: opacity .2s;
        font-size: 1.2rem; color: #fff; cursor: pointer; z-index: 3;
    }
    .hub-card:hover .hub-card-play[b-p29edtj7e1], .hub-card:focus .hub-card-play[b-p29edtj7e1] { opacity: 1; }
    .hub-card-play:hover[b-p29edtj7e1] { background: var(--interactive-accent); }
    .hub-card-info[b-p29edtj7e1] {
        position: absolute; bottom: 0; left: 0; right: 0; z-index: 2;
        padding: .6rem .5rem .45rem;
        background: linear-gradient(transparent, rgba(0,0,0,.88));
        opacity: 0; transition: opacity .2s;
        pointer-events: none;
    }
    .hub-card:hover .hub-card-info[b-p29edtj7e1], .hub-card:focus .hub-card-info[b-p29edtj7e1],
    .hub-card-active .hub-card-info[b-p29edtj7e1] { opacity: 1; }
    .hub-card-title[b-p29edtj7e1] { display: block; font-size: .78rem; font-weight: 600; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 1px 3px rgba(0,0,0,.6); }
    .hub-card-year[b-p29edtj7e1] { font-size: .65rem; color: rgba(255,255,255,.6); }

    .section-header[b-p29edtj7e1] { display: flex; align-items: center; justify-content: space-between; margin-bottom: .8rem; }
    .section-title[b-p29edtj7e1] { font-size: 1.1rem; font-weight: 600; margin: 0; display: flex; align-items: baseline; gap: .5rem; }
    .section-count[b-p29edtj7e1] { font-size: .8rem; font-weight: 400; color: var(--on-surface-faint); }
    .section-letter[b-p29edtj7e1] { font-size: .7rem; font-weight: 700; color: var(--interactive-accent); background: rgba(var(--interactive-accent-rgb), 0.1); padding: .15rem .4rem; border-radius: .2rem; }
    .section-header-actions[b-p29edtj7e1] { display: flex; align-items: center; gap: .5rem; }

    .filter-toggle-btn[b-p29edtj7e1] {
        background: var(--surface-card); border: 1px solid var(--border-medium); color: var(--on-surface-faint);
        padding: .35rem .5rem; border-radius: var(--radius-xs); cursor: pointer; font-size: .82rem;
        transition: color .15s, background .15s, border-color .15s; position: relative;
    }
    .filter-toggle-btn:hover[b-p29edtj7e1] { color: var(--on-surface); border-color: var(--border-strong); }
    .filter-toggle-btn.active[b-p29edtj7e1] { color: var(--interactive-accent); background: rgba(var(--interactive-accent-rgb),.08); border-color: var(--interactive-accent); }
    .filter-toggle-btn.has-filters .filter-badge[b-p29edtj7e1] {
        position: absolute; top: -3px; right: -3px; width: 8px; height: 8px;
        background: var(--interactive-accent); border-radius: 50%; border: 1.5px solid var(--md-background, #0a0f1e);
    }

    .lib-filter-bar[b-p29edtj7e1] {
        display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1rem;
        padding: .6rem .8rem; margin-bottom: .8rem;
        background: var(--surface-card); border: 1px solid var(--border-medium); border-radius: var(--radius-xs);
    }
    .filter-group[b-p29edtj7e1] { display: flex; flex-direction: column; gap: .25rem; }
    .filter-group-genres[b-p29edtj7e1] { flex: 1; min-width: 200px; }
    .filter-label[b-p29edtj7e1] { font-size: .65rem; font-weight: 600; color: var(--on-surface-faint); text-transform: uppercase; letter-spacing: .06em; }
    .filter-select[b-p29edtj7e1] {
        background: var(--md-background, #0a0f1e); color: var(--on-surface); border: 1px solid var(--border-medium);
        padding: .3rem .5rem; border-radius: var(--radius-xs); font-size: .78rem; min-width: 160px; cursor: pointer;
    }
    .filter-select:focus[b-p29edtj7e1] { border-color: var(--interactive-accent); outline: none; }
    .filter-input[b-p29edtj7e1] {
        background: var(--md-background, #0a0f1e); color: var(--on-surface); border: 1px solid var(--border-medium);
        padding: .3rem .5rem; border-radius: var(--radius-xs); font-size: .78rem; width: 70px; text-align: center;
    }
    .filter-input:focus[b-p29edtj7e1] { border-color: var(--interactive-accent); outline: none; }
    .filter-year-range[b-p29edtj7e1] { display: flex; align-items: center; gap: .3rem; }
    .filter-dash[b-p29edtj7e1] { color: var(--on-surface-faint); font-size: .8rem; }
    .genre-chips[b-p29edtj7e1] { display: flex; flex-wrap: wrap; gap: .3rem; max-height: 4.5rem; overflow-y: auto; scrollbar-width: thin; }
    .genre-chip[b-p29edtj7e1] {
        background: rgba(var(--interactive-primary-rgb), .06); border: 1px solid var(--border-medium);
        color: var(--on-surface-medium); padding: .15rem .5rem; border-radius: 1rem; font-size: .7rem;
        cursor: pointer; transition: all .12s; white-space: nowrap;
    }
    .genre-chip:hover[b-p29edtj7e1] { border-color: var(--interactive-accent); color: var(--on-surface); }
    .genre-chip-active[b-p29edtj7e1] {
        background: rgba(var(--interactive-accent-rgb), .18); border-color: var(--interactive-accent);
        color: var(--interactive-accent); font-weight: 600;
    }
    .filter-reset-btn[b-p29edtj7e1] {
        align-self: flex-end; background: none; border: 1px solid var(--border-medium);
        color: var(--on-surface-faint); padding: .3rem .6rem; border-radius: var(--radius-xs);
        font-size: .72rem; cursor: pointer; transition: color .12s, border-color .12s;
        display: flex; align-items: center; gap: .3rem;
    }
    .filter-reset-btn:hover[b-p29edtj7e1] { color: var(--status-danger); border-color: var(--status-danger); }

    .lib-browse-wrap[b-p29edtj7e1] { display: flex; gap: .25rem; align-items: flex-start; }
    .lib-browse-main[b-p29edtj7e1] { flex: 1; min-width: 0; }

    /* ── Grid view ── */
    .lg-card[b-p29edtj7e1] {
        border-radius: var(--lib-card-radius); overflow: hidden; cursor: pointer;
        background: var(--lib-card-bg); transition: transform var(--lib-transition-speed), border-color var(--lib-transition-speed);
        border: var(--lib-card-border); outline: none;
    }
    .lg-card:hover[b-p29edtj7e1], .lg-card:focus-within[b-p29edtj7e1] { transform: translateY(-4px); border-color: var(--border-strong); box-shadow: var(--shadow-elevation-1); }
    .lg-card:focus[b-p29edtj7e1] { border-color: var(--lib-focus-ring-color); box-shadow: var(--lib-focus-shadow); }
    .lg-card-cover[b-p29edtj7e1] { display: flex; flex-direction: column; }
    .lg-card-cover .lg-poster[b-p29edtj7e1] { flex: 1; min-height: 0; }
    .lg-poster[b-p29edtj7e1] { aspect-ratio: var(--lib-poster-ratio); width: 100%; background: var(--surface-card); overflow: hidden; position: relative; }
    .lg-poster img[b-p29edtj7e1] { width: 100%; height: 100%; object-fit: cover; display: block; }
    .lg-title[b-p29edtj7e1] { display: block; padding: .35rem .5rem; font-size: .72rem; color: var(--on-surface-medium); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .lg-watched[b-p29edtj7e1] { position: absolute; bottom: 8px; left: 8px; color: var(--status-success); font-size: .9rem; filter: drop-shadow(0 1px 2px rgba(0,0,0,.6)); z-index: 4; pointer-events: none; }
    .lg-poster-hover[b-p29edtj7e1] {
        position: absolute; inset: 0; z-index: 2;
        display: flex; align-items: flex-end; justify-content: stretch;
        padding: .5rem;
        background: linear-gradient(180deg, transparent 35%, rgba(0,0,0,.5) 100%);
        opacity: 0; pointer-events: none;
        transition: opacity .18s var(--ease-standard);
    }
    .lg-card-cover:hover .lg-poster-hover[b-p29edtj7e1], .lg-card-cover:focus-within .lg-poster-hover[b-p29edtj7e1] { opacity: 1; pointer-events: auto; }
    .lg-hover-pop[b-p29edtj7e1] {
        width: 100%; padding: .55rem .65rem; text-align: left;
        background: rgba(0,0,0,.78) !important;
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius-sm);
        box-shadow: 0 8px 24px rgba(0,0,0,.45);
    }
    .lg-pop-head[b-p29edtj7e1] { display: flex; align-items: baseline; justify-content: space-between; gap: .4rem; margin-bottom: .25rem; }
    .lg-pop-title[b-p29edtj7e1] { font-size: .78rem; font-weight: 700; color: var(--on-surface); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; flex: 1; min-width: 0; }
    .lg-pop-year[b-p29edtj7e1] { font-size: .65rem; color: var(--on-surface-muted); flex-shrink: 0; }
    .lg-pop-summary[b-p29edtj7e1] {
        font-size: .62rem; line-height: 1.35; color: rgba(255,255,255,.9); margin: 0 0 .4rem;
        display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
        text-shadow: 0 1px 3px rgba(0,0,0,.85);
    }
    .lg-pop-meta[b-p29edtj7e1] { font-size: .58rem; color: rgba(255,255,255,.6); margin: 0 0 .35rem; text-shadow: 0 1px 2px rgba(0,0,0,.7); }
    .lg-pop-play[b-p29edtj7e1] {
        width: 100%; margin-top: .15rem;
        display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
        padding: .35rem .5rem; border-radius: var(--radius-xs); border: none; cursor: pointer;
        font-size: .72rem; font-weight: 600; color: #fff;
        background: linear-gradient(135deg, rgba(var(--status-success-rgb),.95), rgba(var(--interactive-accent-rgb),.88));
        transition: filter .12s, transform .12s;
    }
    .lg-pop-play:hover[b-p29edtj7e1] { filter: brightness(1.08); transform: scale(1.02); }
    .lg-play-fab[b-p29edtj7e1] {
        position: absolute; bottom: 10px; right: 10px; z-index: 5;
        width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        font-size: 1.25rem; color: #fff;
        background: rgba(0,0,0,.55); border: 2px solid rgba(255,255,255,.35);
        box-shadow: 0 4px 14px rgba(0,0,0,.4);
        opacity: 0; transform: scale(.92); transition: opacity .18s, transform .18s, background .12s;
    }
    .lg-card-cover:hover .lg-play-fab[b-p29edtj7e1], .lg-card-cover:focus-within .lg-play-fab[b-p29edtj7e1] { opacity: 1; transform: scale(1); }
    .lg-play-fab:hover[b-p29edtj7e1] { background: rgba(var(--status-success-rgb),.85); border-color: rgba(255,255,255,.55); }
    .lg-empty[b-p29edtj7e1] { aspect-ratio: 2/3; background: rgba(255,255,255,.03); border-radius: var(--lib-card-radius); }
    .lg-no-poster[b-p29edtj7e1] { display: flex; align-items: center; justify-content: center; background: var(--surface-card); }
    .lg-poster-icon[b-p29edtj7e1] { font-size: 2rem; color: var(--on-surface-faint); opacity: .3; }

    .view-switcher[b-p29edtj7e1] { display: flex; gap: 2px; background: var(--surface-card); border-radius: var(--radius-xs); padding: 2px; border: 1px solid var(--border-medium); }
    .view-btn[b-p29edtj7e1] { background: none; border: none; color: var(--on-surface-faint); padding: .3rem .45rem; border-radius: var(--radius-xs); cursor: pointer; font-size: .85rem; transition: color .15s, background .15s; }
    .view-btn:hover[b-p29edtj7e1] { color: var(--on-surface); }
    .view-btn.active[b-p29edtj7e1] { color: var(--interactive-accent); background: rgba(var(--interactive-accent-rgb),.12); }

    /* ── List view ── */
    .lib-list[b-p29edtj7e1] { display: flex; flex-direction: column; gap: 1px; }
    .ll-row[b-p29edtj7e1] {
        display: flex; align-items: center; gap: .6rem; padding: .3rem .6rem;
        background: var(--lib-card-bg); cursor: pointer;
        border: 1px solid transparent; border-radius: 2px; outline: none;
        transition: background .1s, border-color .1s;
    }
    .ll-row:nth-child(even)[b-p29edtj7e1] { background: rgba(var(--interactive-primary-rgb), .03); }
    .ll-row:hover[b-p29edtj7e1], .ll-row:focus[b-p29edtj7e1] { background: var(--lib-card-hover-bg); border-color: var(--border-medium); }
    .ll-row:nth-child(even):hover[b-p29edtj7e1], .ll-row:nth-child(even):focus[b-p29edtj7e1] { background: var(--lib-card-hover-bg); }
    .ll-thumb[b-p29edtj7e1] { width: 32px; height: 48px; object-fit: cover; border-radius: 3px; flex-shrink: 0; }
    .ll-title[b-p29edtj7e1] { flex: 1; font-size: .8rem; font-weight: 500; color: var(--on-surface); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .ll-year[b-p29edtj7e1] { font-size: .72rem; color: var(--on-surface-muted); width: 38px; text-align: center; flex-shrink: 0; }
    .ll-res[b-p29edtj7e1] { font-size: .68rem; color: var(--on-surface-faint); width: 46px; text-align: center; flex-shrink: 0; }
    .ll-runtime[b-p29edtj7e1] { font-size: .68rem; color: var(--on-surface-faint); width: 50px; text-align: center; flex-shrink: 0; }
    .ll-check[b-p29edtj7e1] { color: var(--status-success); font-size: .75rem; flex-shrink: 0; }
    .ll-play[b-p29edtj7e1] { background: none; border: none; color: var(--interactive-accent); font-size: 1rem; cursor: pointer; padding: .15rem; opacity: 0; transition: opacity .12s; flex-shrink: 0; }
    .ll-row:hover .ll-play[b-p29edtj7e1], .ll-row:focus .ll-play[b-p29edtj7e1] { opacity: 1; }
    .ll-watched[b-p29edtj7e1] { opacity: .55; }
    .ll-empty[b-p29edtj7e1] { height: 48px; }
    .ll-no-poster[b-p29edtj7e1] { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 48px; background: var(--surface-card); border-radius: 3px; font-size: .9rem; color: var(--on-surface-faint); opacity: .3; flex-shrink: 0; }

    /* ── Wall view ── */
    .lib-wall[b-p29edtj7e1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--lib-wall-min-width), 1fr)); gap: 0; }
    .lib-wall-row[b-p29edtj7e1] { gap: 0 !important; }
    .lw-tile[b-p29edtj7e1] {
        aspect-ratio: var(--lib-poster-ratio); border-radius: 0; overflow: visible; position: relative; cursor: pointer; outline: none;
        transition: transform .25s cubic-bezier(.4,0,.2,1), box-shadow .25s, z-index 0s;
    }
    .lw-tile-cover:hover[b-p29edtj7e1], .lw-tile-cover:focus-within[b-p29edtj7e1] {
        transform: scale(1.25); z-index: 20;
        box-shadow: 0 12px 40px rgba(0,0,0,.6), 0 0 0 2px rgba(var(--interactive-primary-rgb),.35);
    }
    .lw-tile > img[b-p29edtj7e1] { width: 100%; height: 100%; object-fit: cover; display: block; }
    .lw-poster-fallback[b-p29edtj7e1] { font-size: 2rem; color: var(--on-surface-faint); opacity: .35; }
    .lw-poster-hover[b-p29edtj7e1] {
        position: absolute; inset: 0; z-index: 2;
        display: flex; align-items: flex-end; padding: .4rem;
        opacity: 0; pointer-events: none; transition: opacity .2s;
        overflow: hidden;
    }
    .lw-hover-backdrop[b-p29edtj7e1] {
        position: absolute; inset: 0; width: 100%; height: 100%;
        object-fit: cover; opacity: .35;
        filter: blur(8px) brightness(.5); transform: scale(1.15);
        z-index: 0;
    }
    .lw-tile-cover:hover .lw-poster-hover[b-p29edtj7e1], .lw-tile-cover:focus-within .lw-poster-hover[b-p29edtj7e1] { opacity: 1; pointer-events: auto; }
    .lw-hover-pop[b-p29edtj7e1] {
        width: 100%; padding: .45rem .55rem; position: relative; z-index: 1;
        background: rgba(0,0,0,.75) !important;
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-sm);
    }
    .lw-pop-head[b-p29edtj7e1] { display: flex; align-items: baseline; justify-content: space-between; gap: .35rem; margin-bottom: .2rem; }
    .lw-pop-title[b-p29edtj7e1] {
        font-size: .72rem; font-weight: 700; color: #fff; line-height: 1.2;
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
        flex: 1; min-width: 0; text-shadow: 0 1px 3px rgba(0,0,0,.8);
    }
    .lw-pop-year[b-p29edtj7e1] { font-size: .58rem; color: rgba(255,255,255,.7); flex-shrink: 0; }
    .lw-pop-rating[b-p29edtj7e1] { font-size: .6rem; color: #f5c518; font-weight: 700; margin-bottom: .15rem; display: block; }
    .lw-pop-genres[b-p29edtj7e1] { font-size: .55rem; color: rgba(255,255,255,.55); margin: 0 0 .2rem; font-style: italic; }
    .lw-pop-summary[b-p29edtj7e1] {
        font-size: .58rem; line-height: 1.3; color: rgba(255,255,255,.85); margin: 0 0 .35rem;
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
        text-shadow: 0 1px 3px rgba(0,0,0,.85);
    }
    .lw-pop-meta[b-p29edtj7e1] { font-size: .52rem; color: rgba(255,255,255,.5); margin: 0 0 .3rem; }
    .lw-pop-play[b-p29edtj7e1] {
        width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: .3rem;
        padding: .28rem .4rem; border: none; border-radius: var(--radius-xs); cursor: pointer;
        font-size: .65rem; font-weight: 600; color: #fff;
        background: linear-gradient(135deg, rgba(var(--status-success-rgb),.92), rgba(var(--interactive-accent-rgb),.85));
    }
    .lw-pop-play:hover[b-p29edtj7e1] { filter: brightness(1.06); }
    .lw-play-fab[b-p29edtj7e1] {
        position: absolute; bottom: 8px; right: 8px; z-index: 5;
        width: 40px; height: 40px; border-radius: 50%; cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        font-size: 1.1rem; color: #fff;
        background: rgba(0,0,0,.55); border: 2px solid rgba(255,255,255,.3);
        opacity: 0; transform: scale(.9); transition: opacity .18s, transform .18s;
    }
    .lw-tile-cover:hover .lw-play-fab[b-p29edtj7e1], .lw-tile-cover:focus-within .lw-play-fab[b-p29edtj7e1] { opacity: 1; transform: scale(1); }
    .lw-play-fab:hover[b-p29edtj7e1] { background: rgba(var(--status-success-rgb),.82); }
    .lw-empty[b-p29edtj7e1] { aspect-ratio: var(--lib-poster-ratio); background: rgba(255,255,255,.03); }
    .lw-no-poster[b-p29edtj7e1] { display: flex; align-items: center; justify-content: center; background: var(--surface-card); }

    /* ── Stage view ── */
    .lib-stage[b-p29edtj7e1] {
        display: flex; flex-direction: column; gap: var(--lib-stage-gap);
        scroll-snap-type: y var(--lib-stage-snap);
    }
    .st-card[b-p29edtj7e1] {
        position: relative; width: 100%; min-height: var(--lib-stage-card-height);
        border-radius: var(--lib-card-radius); overflow: hidden; cursor: pointer; outline: none;
        border: 2px solid transparent;
        transition: border-color var(--lib-transition-speed), box-shadow var(--lib-transition-speed);
        scroll-snap-align: start;
    }
    .st-card:hover[b-p29edtj7e1], .st-card:focus[b-p29edtj7e1] {
        border-color: var(--lib-focus-ring-color);
        box-shadow: var(--lib-focus-shadow);
    }
    .st-backdrop[b-p29edtj7e1] {
        position: absolute; inset: 0; z-index: 0; overflow: hidden;
    }
    .st-backdrop img[b-p29edtj7e1] {
        width: 100%; height: 100%; object-fit: cover;
        filter: blur(24px) brightness(0.28) saturate(1.3);
        transform: scale(1.25);
    }
    .st-gradient[b-p29edtj7e1] {
        position: absolute; inset: 0;
        background:
            linear-gradient(to right, rgba(0,0,0,.85) 0%, rgba(0,0,0,.5) 40%, rgba(0,0,0,.2) 100%),
            linear-gradient(to top, rgba(0,0,0,.4) 0%, transparent 30%);
        z-index: 1;
    }
    .st-content[b-p29edtj7e1] {
        position: relative; z-index: 2;
        display: flex; gap: 1.2rem; padding: 1.2rem 1.5rem;
        align-items: center; min-height: var(--lib-stage-card-height);
    }
    .st-poster[b-p29edtj7e1] {
        width: var(--lib-stage-poster-width); flex-shrink: 0;
        aspect-ratio: var(--lib-poster-ratio);
        border-radius: var(--radius-xs);
        object-fit: cover;
        box-shadow: 0 4px 20px rgba(0,0,0,.5);
    }
    .st-info[b-p29edtj7e1] {
        flex: 1; min-width: 0;
        display: flex; flex-direction: column; gap: .3rem;
    }
    .st-title[b-p29edtj7e1] {
        font-size: 1.3rem; font-weight: 700; color: #fff; margin: 0;
        text-shadow: 0 1px 6px rgba(0,0,0,.5);
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .st-meta[b-p29edtj7e1] {
        display: flex; gap: .6rem; align-items: center;
        font-size: .78rem; color: rgba(255,255,255,.65); flex-wrap: wrap;
    }
    .st-badge[b-p29edtj7e1] {
        font-size: .68rem; background: rgba(var(--interactive-accent-rgb),.2);
        color: var(--interactive-accent); padding: .08rem .35rem; border-radius: .2rem;
    }
    .st-watched-badge[b-p29edtj7e1] {
        font-size: .68rem; color: var(--status-success);
        display: flex; align-items: center; gap: .2rem;
    }
    .st-watched-badge .bi[b-p29edtj7e1] { font-size: .7rem; }
    .st-overview[b-p29edtj7e1] {
        font-size: .8rem; color: rgba(255,255,255,.55); line-height: 1.5; margin: .1rem 0 0;
        display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
        max-width: 600px;
    }
    .st-actions[b-p29edtj7e1] {
        display: flex; gap: .5rem; margin-top: .4rem;
    }
    .st-btn[b-p29edtj7e1] {
        display: inline-flex; align-items: center; gap: .35rem;
        padding: .4rem .9rem; border-radius: var(--radius-xs);
        font-size: .78rem; font-weight: 600; border: none; cursor: pointer;
        transition: background .12s, transform .08s;
    }
    .st-btn:hover[b-p29edtj7e1] { transform: scale(1.04); }
    .st-btn-play[b-p29edtj7e1] {
        background: var(--interactive-accent); color: #fff;
    }
    .st-btn-play:hover[b-p29edtj7e1] { background: var(--interactive-accent-hover); }
    .st-btn-info[b-p29edtj7e1] {
        background: rgba(255,255,255,.12); color: rgba(255,255,255,.85);
        border: 1px solid rgba(255,255,255,.15);
    }
    .st-btn-info:hover[b-p29edtj7e1] { background: rgba(255,255,255,.2); }
    .st-empty[b-p29edtj7e1] { min-height: var(--lib-stage-card-height); background: rgba(255,255,255,.02); border-radius: var(--lib-card-radius); }
    .st-no-poster[b-p29edtj7e1] { display: flex; align-items: center; justify-content: center; background: var(--surface-card); aspect-ratio: var(--lib-poster-ratio); }
    .st-no-poster .bi[b-p29edtj7e1] { font-size: 1.5rem; color: var(--on-surface-faint); opacity: .3; }

    /* ── Stage browse view (poster strip + hero) ── */
    .stage-view[b-p29edtj7e1] { display: flex; flex-direction: column; gap: 0; min-height: 0; }
    .stage-strip[b-p29edtj7e1] {
        flex: 0 0 auto; display: flex; gap: .5rem; overflow-x: auto; padding: .75rem 0 1rem;
        scroll-snap-type: x mandatory; scrollbar-width: thin;
        scrollbar-color: rgba(var(--interactive-primary-rgb),.12) transparent;
    }
    .stage-strip[b-p29edtj7e1]::-webkit-scrollbar { height: 4px; }
    .stage-strip[b-p29edtj7e1]::-webkit-scrollbar-thumb { background: rgba(var(--interactive-primary-rgb),.12); border-radius: 2px; }
    .stage-poster-card[b-p29edtj7e1] {
        flex: 0 0 130px; scroll-snap-align: start; cursor: pointer; outline: none;
        border-radius: var(--radius-sm); overflow: hidden; position: relative;
        border: 2px solid transparent; transition: transform .2s, border-color .2s, box-shadow .2s;
    }
    .stage-poster-card img[b-p29edtj7e1] { width: 100%; aspect-ratio: 2/3; object-fit: cover; display: block; }
    .stage-poster-card:hover[b-p29edtj7e1], .stage-poster-card:focus[b-p29edtj7e1] { transform: scale(1.06); border-color: var(--border-strong); }
    .stage-poster-active[b-p29edtj7e1] {
        border-color: var(--interactive-primary); transform: scale(1.06);
        box-shadow: 0 0 14px rgba(var(--interactive-primary-rgb),.4);
    }
    .stage-poster-label[b-p29edtj7e1] {
        display: block; font-size: .65rem; padding: .25rem .4rem; white-space: nowrap;
        overflow: hidden; text-overflow: ellipsis; color: var(--on-surface-muted); text-align: center;
    }
    .stage-poster-empty[b-p29edtj7e1] {
        width: 100%; aspect-ratio: 2/3; display: flex; align-items: center; justify-content: center;
        background: var(--surface-card); color: var(--on-surface-faint); font-size: 1.5rem; opacity: .3;
    }
    .stage-hero[b-p29edtj7e1] {
        flex: 1; position: relative; min-height: 44vh; overflow: hidden;
        border-radius: var(--radius-md); opacity: 0;
        transform: translateY(16px);
        transition: opacity .35s ease, transform .35s ease;
    }
    .stage-hero-visible[b-p29edtj7e1] { opacity: 1; transform: translateY(0); }
    .stage-hero-inner[b-p29edtj7e1] { position: relative; min-height: 44vh; }
    .stage-hero-backdrop[b-p29edtj7e1] {
        position: absolute; inset: 0; z-index: 0; overflow: hidden;
    }
    .stage-hero-backdrop img[b-p29edtj7e1] {
        width: 100%; height: 100%; object-fit: cover; object-position: center 20%;
        opacity: .4; filter: saturate(1.2);
    }
    .stage-hero-backdrop-fade[b-p29edtj7e1] {
        position: absolute; inset: 0;
        background:
            linear-gradient(180deg, transparent 0%, rgba(var(--md-background-rgb,10,15,30),.5) 50%, rgba(var(--md-background-rgb,10,15,30),.95) 100%),
            linear-gradient(90deg, rgba(var(--md-background-rgb,10,15,30),.7) 0%, transparent 60%);
    }
    .stage-hero-content[b-p29edtj7e1] {
        position: relative; z-index: 1; display: flex; gap: 1.5rem;
        padding: 2rem; align-items: flex-end; min-height: 44vh;
    }
    .stage-hero-poster[b-p29edtj7e1] {
        width: 160px; flex-shrink: 0; border-radius: var(--radius-sm);
        box-shadow: 0 8px 28px rgba(0,0,0,.55); aspect-ratio: 2/3; object-fit: cover;
    }
    .stage-hero-info[b-p29edtj7e1] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .45rem; }
    .stage-hero-title[b-p29edtj7e1] {
        font-size: 1.8rem; font-weight: 800; color: #fff; margin: 0; line-height: 1.15;
        text-shadow: 0 2px 10px rgba(0,0,0,.5);
    }
    .stage-hero-meta[b-p29edtj7e1] {
        display: flex; flex-wrap: wrap; gap: .5rem; align-items: center;
        font-size: .82rem; color: rgba(255,255,255,.7);
    }
    .stage-meta-badge[b-p29edtj7e1] {
        background: rgba(255,255,255,.12); padding: .1rem .4rem; border-radius: .25rem;
        font-size: .72rem; font-weight: 600;
    }
    .stage-meta-rating[b-p29edtj7e1] { color: #f5c518; font-weight: 700; }
    .stage-hero-genres[b-p29edtj7e1] { display: flex; gap: .35rem; flex-wrap: wrap; }
    .stage-genre-chip[b-p29edtj7e1] {
        font-size: .68rem; background: rgba(var(--interactive-primary-rgb),.15);
        color: var(--interactive-primary); padding: .12rem .5rem; border-radius: 1rem; font-weight: 500;
    }
    .stage-hero-overview[b-p29edtj7e1] {
        margin: .2rem 0 0; font-size: .85rem; color: rgba(255,255,255,.75); line-height: 1.55;
        max-width: 600px; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;
        text-shadow: 0 1px 4px rgba(0,0,0,.5);
    }
    .stage-hero-cast[b-p29edtj7e1] { font-size: .75rem; color: rgba(255,255,255,.45); }
    .stage-hero-actions[b-p29edtj7e1] { display: flex; gap: .5rem; margin-top: .35rem; }
    .stage-btn[b-p29edtj7e1] {
        display: inline-flex; align-items: center; gap: .4rem;
        padding: .5rem 1rem; border: none; border-radius: var(--radius-sm);
        cursor: pointer; font-size: .82rem; font-weight: 600;
        transition: background .15s, transform .08s;
    }
    .stage-btn:hover[b-p29edtj7e1] { transform: scale(1.03); }
    .stage-btn-play[b-p29edtj7e1] { background: var(--interactive-primary); color: #fff; }
    .stage-btn-play:hover[b-p29edtj7e1] { background: var(--interactive-primary-hover); }
    .stage-btn-info[b-p29edtj7e1] {
        background: rgba(255,255,255,.1); color: rgba(255,255,255,.85);
        border: 1px solid rgba(255,255,255,.15);
    }
    .stage-btn-info:hover[b-p29edtj7e1] { background: rgba(255,255,255,.18); }

    .lib-scroll-ring[b-p29edtj7e1] {
        position: fixed; bottom: 1.5rem; right: 1rem;
        width: 3rem; height: 3rem; border-radius: 50%;
        background: rgba(var(--surface-base-rgb, 15,15,20), .75);
        backdrop-filter: blur(12px);
        border: none; padding: 0;
        display: flex; align-items: center; justify-content: center;
        cursor: pointer; z-index: 50;
        box-shadow: 0 2px 12px rgba(0,0,0,.4);
        opacity: 0; pointer-events: none;
        transform: translateY(10px) scale(.9);
        transition: opacity .25s, transform .25s, box-shadow .2s;
    }
    .lib-scroll-ring-visible[b-p29edtj7e1] { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }
    .lib-scroll-ring:hover[b-p29edtj7e1] { box-shadow: 0 4px 20px rgba(var(--interactive-primary-rgb, 99,102,241), .35); transform: translateY(-2px) scale(1.05); }
    .lib-scroll-svg[b-p29edtj7e1] { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
    .lib-scroll-track[b-p29edtj7e1] { fill: none; stroke: rgba(255,255,255,.08); stroke-width: 2; }
    .lib-scroll-fill[b-p29edtj7e1] { fill: none; stroke: var(--interactive-primary, #818cf8); stroke-width: 2.5; stroke-linecap: round; transition: stroke-dasharray .15s; }
    .lib-scroll-icon[b-p29edtj7e1] { position: relative; z-index: 1; font-size: .85rem; color: var(--on-surface, #fff); transition: transform .15s; }
    .lib-scroll-ring:hover .lib-scroll-icon[b-p29edtj7e1] { transform: translateY(-1px); }

    .alpha-sidebar[b-p29edtj7e1] {
        position: fixed; right: 1rem; top: 50%; transform: translateY(-50%);
        display: flex; flex-direction: column; align-items: center;
        padding: .4rem .2rem;
        background: var(--surface-sidebar); backdrop-filter: blur(var(--glass-blur));
        border: 1px solid var(--border-medium); border-radius: .5rem;
        user-select: none; touch-action: none; z-index: 50;
        box-shadow: var(--shadow-elevation-2);
    }
    .alpha-letter[b-p29edtj7e1] {
        background: none; border: none; color: var(--on-surface-faint);
        font-size: .58rem; font-weight: 600; line-height: 1;
        padding: 2px 5px; cursor: pointer; border-radius: 2px;
        transition: color .12s, background .12s;
    }
    .alpha-letter:hover[b-p29edtj7e1] { color: var(--on-surface); background: var(--surface-card); }
    .alpha-letter.active[b-p29edtj7e1] { color: var(--interactive-accent); background: rgba(var(--interactive-accent-rgb), 0.12); }
    .alpha-preview[b-p29edtj7e1] {
        position: absolute; left: -3.5rem; top: 50%; transform: translateY(-50%);
        background: var(--interactive-accent); color: var(--md-text-on-primary);
        font-size: 1.6rem; font-weight: 800;
        width: 2.8rem; height: 2.8rem; border-radius: .5rem;
        display: flex; align-items: center; justify-content: center;
        pointer-events: none; box-shadow: var(--shadow-elevation-2);
    }

    @media (max-width: 768px) {
        .lib-page[b-p29edtj7e1] { padding: .75rem; }
        .lib-hero-region[b-p29edtj7e1] { padding: .75rem .75rem 1rem; margin-bottom: .5rem; }
        .lib-header[b-p29edtj7e1] { flex-direction: column; align-items: stretch; }
        .lib-controls[b-p29edtj7e1] { flex-wrap: wrap; }
        .lib-search[b-p29edtj7e1] { width: 100%; }
        .lib-grid[b-p29edtj7e1] { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: .5rem; }
        .hub-card[b-p29edtj7e1] { flex: 0 0 130px; }
        .hub-row[b-p29edtj7e1] { gap: .5rem; }
        .lib-wall[b-p29edtj7e1] { grid-template-columns: repeat(2, 1fr); }
        .st-poster[b-p29edtj7e1] { display: none; }
        .st-content[b-p29edtj7e1] { padding: .8rem 1rem; }
        .st-title[b-p29edtj7e1] { font-size: 1rem; }
        .st-overview[b-p29edtj7e1] { -webkit-line-clamp: 1; font-size: .75rem; }
        .st-actions[b-p29edtj7e1] { gap: .3rem; }
        .st-btn[b-p29edtj7e1] { padding: .3rem .65rem; font-size: .72rem; }
        .ll-thumb[b-p29edtj7e1] { width: 32px; height: 48px; }
        .ll-year[b-p29edtj7e1], .ll-res[b-p29edtj7e1], .ll-runtime[b-p29edtj7e1] { display: none; }
        .section-header[b-p29edtj7e1] { flex-direction: column; gap: .5rem; align-items: flex-start; }
        .alpha-sidebar[b-p29edtj7e1] { padding: .2rem .1rem; }
        .alpha-letter[b-p29edtj7e1] { font-size: .5rem; padding: 1px 3px; }
        .stage-poster-card[b-p29edtj7e1] { flex: 0 0 90px; }
        .stage-hero[b-p29edtj7e1] { min-height: 35vh; }
        .stage-hero-inner[b-p29edtj7e1] { min-height: 35vh; }
        .stage-hero-content[b-p29edtj7e1] { flex-direction: column; align-items: center; text-align: center; padding: 1rem; min-height: 35vh; }
        .stage-hero-poster[b-p29edtj7e1] { width: 100px; }
        .stage-hero-title[b-p29edtj7e1] { font-size: 1.2rem; }
        .stage-hero-overview[b-p29edtj7e1] { -webkit-line-clamp: 2; max-width: none; }
        .stage-hero-meta[b-p29edtj7e1] { justify-content: center; }
        .stage-hero-genres[b-p29edtj7e1] { justify-content: center; }
        .stage-hero-actions[b-p29edtj7e1] { justify-content: center; }
    }

    @media (min-width: 769px) and (max-width: 1200px) {
        .lib-grid[b-p29edtj7e1] { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
        .hub-card[b-p29edtj7e1] { flex: 0 0 155px; }
        .lib-wall[b-p29edtj7e1] { grid-template-columns: repeat(3, 1fr); }
        .st-title[b-p29edtj7e1] { font-size: 1.15rem; }
        .st-overview[b-p29edtj7e1] { -webkit-line-clamp: 2; }
    }

    @media (min-width: 1201px) and (max-width: 1600px) {
        .lib-grid[b-p29edtj7e1] { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
        .lib-wall[b-p29edtj7e1] { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
    }

    @media (min-width: 1601px) {
        .lib-page[b-p29edtj7e1] { padding: 1.25rem 1.5rem 2rem; }
        .lib-hero-region[b-p29edtj7e1] { padding: 1.25rem 1.5rem 1.1rem; }
        .lib-grid[b-p29edtj7e1] { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 1rem; }
        .hub-card[b-p29edtj7e1] { flex: 0 0 190px; }
        .lg-title[b-p29edtj7e1] { font-size: .8rem; padding: .4rem .5rem; }
        .lib-wall[b-p29edtj7e1] { grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); }
        .lw-title[b-p29edtj7e1] { font-size: 1.1rem; }
        .ll-title[b-p29edtj7e1] { font-size: .9rem; }
        .st-poster[b-p29edtj7e1] { width: 120px; }
        .st-title[b-p29edtj7e1] { font-size: 1.5rem; }
        .st-overview[b-p29edtj7e1] { max-width: 700px; }
        .section-title[b-p29edtj7e1] { font-size: 1.3rem; }
        .lib-hub-title[b-p29edtj7e1] { font-size: 1.05rem; }
    }

    /* ── Music grid ─────────────────────────────────────────────── */

    .music-artist-grid[b-p29edtj7e1] {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: .75rem;
        padding: .5rem 0;
    }

    .music-artist-card[b-p29edtj7e1] {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: .5rem;
        padding: .75rem .5rem;
        border-radius: 8px;
        background: rgba(255,255,255,.03);
        cursor: pointer;
        transition: background .15s, box-shadow .15s;
        border: 2px solid transparent;
    }

    .music-artist-card:hover[b-p29edtj7e1] {
        background: rgba(255,255,255,.07);
    }

    .music-artist-card.selected[b-p29edtj7e1] {
        border-color: var(--accent, #646cff);
        background: rgba(100,108,255,.08);
    }

    .music-artist-icon[b-p29edtj7e1] {
        width: 80px;
        height: 80px;
        border-radius: 50%;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(255,255,255,.06);
        flex-shrink: 0;
    }

    .music-artist-icon img[b-p29edtj7e1] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .music-artist-icon .bi[b-p29edtj7e1] {
        font-size: 2rem;
        opacity: .3;
    }

    .music-artist-name[b-p29edtj7e1] {
        font-size: .85rem;
        font-weight: 500;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .music-album-grid[b-p29edtj7e1] {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        gap: .75rem;
        padding: .5rem 0;
    }

    .music-album-card[b-p29edtj7e1] {
        display: flex;
        flex-direction: column;
        border-radius: 8px;
        background: rgba(255,255,255,.04);
        overflow: hidden;
        transition: background .15s;
    }

    .music-album-card[b-p29edtj7e1] { cursor: pointer; }
    .music-album-card:hover[b-p29edtj7e1] {
        background: rgba(255,255,255,.08);
    }

    .music-album-poster[b-p29edtj7e1] {
        width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 6px 6px 0 0;
    }
    .music-album-no-poster[b-p29edtj7e1] {
        width: 100%; aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
        background: rgba(255,255,255,.03); color: rgba(255,255,255,.15); font-size: 2.5rem;
        border-radius: 6px 6px 0 0;
    }
    .music-album-title[b-p29edtj7e1] { padding: .4rem .6rem 0; }
    .music-album-year[b-p29edtj7e1] { padding: 0 .6rem .4rem; }

    .music-album-art[b-p29edtj7e1] {
        aspect-ratio: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(255,255,255,.03);
    }

    .music-album-art img[b-p29edtj7e1] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .music-album-art .bi[b-p29edtj7e1] {
        font-size: 3rem;
        opacity: .15;
    }

    .music-album-info[b-p29edtj7e1] {
        padding: .6rem .7rem;
    }

    .music-album-title[b-p29edtj7e1] {
        font-size: .85rem;
        font-weight: 500;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .music-album-year[b-p29edtj7e1] {
        font-size: .75rem;
        opacity: .5;
    }

    .music-album-tracks[b-p29edtj7e1] {
        font-size: .75rem;
        opacity: .4;
        margin-top: .15rem;
    }
/* /Components/Pages/Logs.razor.rz.scp.css */
.logs-page[b-u35xwtdzgj] {
    background: var(--surface-base);
    color: var(--on-surface);
    min-height: 100vh;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.logs-toolbar[b-u35xwtdzgj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.logs-toolbar h1[b-u35xwtdzgj] {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
}

.logs-controls[b-u35xwtdzgj] {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    flex-wrap: wrap;
}

.log-select[b-u35xwtdzgj] {
    background: var(--surface-card);
    color: var(--on-surface);
    border: 1px solid var(--border-medium);
    border-radius: var(--radius-xs);
    padding: 0.3rem 0.5rem;
    font-size: 0.75rem;
}

.log-btn[b-u35xwtdzgj] {
    background: var(--surface-card);
    color: var(--on-surface);
    border: 1px solid var(--border-medium);
    border-radius: var(--radius-xs);
    padding: 0.3rem 0.6rem;
    font-size: 0.75rem;
    cursor: pointer;
}

.log-btn.primary[b-u35xwtdzgj] {
    background: rgba(var(--interactive-accent-rgb), 0.15);
    color: var(--interactive-accent);
    border-color: rgba(var(--interactive-accent-rgb), 0.3);
}

.log-check[b-u35xwtdzgj] {
    font-size: 0.75rem;
    color: var(--on-surface-muted);
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.log-console[b-u35xwtdzgj] {
    flex: 1;
    min-height: 400px;
    max-height: 75vh;
    overflow-y: auto;
    background: var(--surface-card);
    border: 1px solid var(--border-medium);
    border-radius: var(--radius-sm);
    padding: 0.25rem;
    font-family: 'Cascadia Code', 'Fira Code', Consolas, monospace;
    font-size: 0.72rem;
    line-height: 1.6;
}

.log-empty[b-u35xwtdzgj] {
    color: var(--on-surface-muted);
    padding: 2rem;
    text-align: center;
    font-style: italic;
}

.log-line[b-u35xwtdzgj] {
    display: flex;
    gap: 0.75rem;
    padding: 0.1rem 0.5rem;
    border-bottom: 1px solid var(--border-subtle);
}

.log-line:hover[b-u35xwtdzgj] { background: var(--surface-card-hover); }
.log-line.error[b-u35xwtdzgj] { background: rgba(var(--status-error-rgb), 0.05); }
.log-line.warn[b-u35xwtdzgj] { background: rgba(var(--status-warning-rgb), 0.03); }

.log-ts[b-u35xwtdzgj] {
    color: var(--on-surface-muted);
    min-width: 85px;
    flex-shrink: 0;
}

.log-level[b-u35xwtdzgj] {
    min-width: 45px;
    font-weight: 700;
    flex-shrink: 0;
    text-transform: uppercase;
}

.log-level.error[b-u35xwtdzgj] { color: var(--status-error); }
.log-level.warn[b-u35xwtdzgj] { color: var(--status-warning); }
.log-level.info[b-u35xwtdzgj] { color: var(--status-info); }

.log-src[b-u35xwtdzgj] {
    color: var(--status-success);
    min-width: 70px;
    flex-shrink: 0;
}

.log-msg[b-u35xwtdzgj] {
    word-break: break-word;
    flex: 1;
}

.log-footer[b-u35xwtdzgj] {
    display: flex;
    justify-content: space-between;
    font-size: 0.7rem;
    color: var(--on-surface-muted);
    padding: 0.25rem 0.5rem;
}
/* /Components/Pages/MediaDetail.razor.rz.scp.css */
/* Collection strip: fixed slot size — intrinsic poster dimensions must not expand the flex row */
.md-collection-strip[b-qq5nz4mkdq] {
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    gap: 0.75rem;
    overflow-x: auto;
    padding: 0 2rem 0.5rem 0;
    scroll-snap-type: x proximity;
}

.md-collection-strip[b-qq5nz4mkdq]::-webkit-scrollbar {
    height: 4px;
}

.md-collection-strip[b-qq5nz4mkdq]::-webkit-scrollbar-thumb {
    background: var(--border-medium);
    border-radius: 2px;
}

.md-coll-card[b-qq5nz4mkdq] {
    flex: none;
    width: 130px;
    max-width: 130px;
    min-width: 0;
    box-sizing: border-box;
    overflow: hidden;
    cursor: pointer;
    scroll-snap-align: start;
    transition: transform 0.15s;
}

.md-coll-card:hover[b-qq5nz4mkdq] {
    transform: translateY(-3px);
}

/* 2:3 frame without relying on aspect-ratio (padding % is always vs width) */
.md-coll-poster[b-qq5nz4mkdq] {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 150%;
    margin-bottom: 0.35rem;
    border-radius: var(--radius-xs);
    overflow: hidden;
    background: var(--surface-raised);
    box-sizing: border-box;
}

.md-coll-poster img[b-qq5nz4mkdq] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.md-coll-no-poster[b-qq5nz4mkdq] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--surface-raised);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--on-surface-faint);
}

.md-coll-title[b-qq5nz4mkdq] {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--on-surface);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.md-coll-year[b-qq5nz4mkdq] {
    display: block;
    font-size: 0.65rem;
    color: var(--on-surface-faint);
}

@media (max-width: 768px) {
    .md-coll-card[b-qq5nz4mkdq] {
        width: 110px;
        max-width: 110px;
    }
}
/* /Components/Pages/MediaLifecycle.razor.rz.scp.css */
.lifecycle-page[b-9m81ldoxju] { max-width: var(--content-width-default); margin: 0 auto; }

.lc-header[b-9m81ldoxju] { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.lc-header h1[b-9m81ldoxju] { font-size: 1.35rem; font-weight: 700; margin: 0; color: var(--on-surface); }
.lc-controls[b-9m81ldoxju] { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.lc-search[b-9m81ldoxju] { width: 200px; background: var(--surface-card); border-color: var(--border-medium); color: var(--on-surface); }
.lc-filter[b-9m81ldoxju] { width: 130px; background: var(--surface-card); border-color: var(--border-medium); color: var(--on-surface); }
.lc-live[b-9m81ldoxju] { font-size: 0.7rem; letter-spacing: 0.05em; }
.lc-empty[b-9m81ldoxju] { text-align: center; padding: 4rem 1rem; color: var(--on-surface-faint); }

.lc-tabs[b-9m81ldoxju] { display: flex; gap: 2px; background: var(--surface-card); border-radius: 0.4rem; padding: 2px; }
.lc-tab[b-9m81ldoxju] {
    border: none; background: transparent; color: var(--on-surface-faint);
    font-size: 0.8rem; font-weight: 600; padding: 0.35rem 0.8rem; border-radius: 0.3rem;
    cursor: pointer; display: flex; align-items: center; gap: 0.35rem; transition: all 0.15s;
}
.lc-tab:hover[b-9m81ldoxju] { color: var(--on-surface); background: rgba(255, 255, 255, 0.05); }
.lc-tab.active[b-9m81ldoxju] { background: var(--interactive-accent); color: var(--md-text-primary); }
.lc-tab-badge[b-9m81ldoxju] { font-size: 0.6rem; background: rgba(255, 255, 255, 0.25); padding: 0.05rem 0.35rem; border-radius: 1rem; min-width: 1.2rem; text-align: center; }

.lc-date-group[b-9m81ldoxju] { margin-bottom: 1.5rem; }
.lc-date-label[b-9m81ldoxju] {
    font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--on-surface-faint); border-bottom: 1px solid var(--border-medium);
    padding-bottom: 0.4rem; margin-bottom: 0.6rem;
}

.lc-stage-track[b-9m81ldoxju] { display: flex; align-items: center; flex-shrink: 0; }
.lc-dot[b-9m81ldoxju] { display: flex; flex-direction: column; align-items: center; gap: 0.15rem; min-width: 36px; }
.lc-dot-inner[b-9m81ldoxju] {
    width: 10px; height: 10px; border-radius: 50%;
    background: var(--surface-card); border: 2px solid var(--border-medium);
    transition: all 0.2s;
}
.lc-dot.done .lc-dot-inner[b-9m81ldoxju] { background: var(--status-success); border-color: var(--status-success); box-shadow: 0 0 5px rgba(var(--status-success-rgb), 0.35); }
.lc-dot.current .lc-dot-inner[b-9m81ldoxju] { background: var(--status-info); border-color: var(--status-info); box-shadow: 0 0 6px rgba(var(--status-info-rgb), 0.5); animation: lc-pulse-b-9m81ldoxju 1.5s ease-in-out infinite; }
.lc-dot.failed .lc-dot-inner[b-9m81ldoxju] { background: var(--status-error); border-color: var(--status-error); box-shadow: 0 0 5px rgba(var(--status-error-rgb), 0.35); }
.lc-dot-label[b-9m81ldoxju] { font-size: 0.48rem; color: var(--on-surface-faint); text-transform: uppercase; letter-spacing: 0.02em; }
.lc-dot.done .lc-dot-label[b-9m81ldoxju], .lc-dot.current .lc-dot-label[b-9m81ldoxju] { color: var(--on-surface-medium); }
.lc-dot-line[b-9m81ldoxju] {
    flex: 1; height: 2px; background: var(--surface-card);
    min-width: 10px; margin: 0 1px; margin-bottom: 0.9rem; transition: background 0.2s;
}
.lc-dot-line.done[b-9m81ldoxju] { background: var(--status-success); }
@keyframes lc-pulse-b-9m81ldoxju { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.2); } }

.lc-detail[b-9m81ldoxju] { margin-top: 0.4rem; }
.lc-overview[b-9m81ldoxju] { font-size: 0.75rem; color: var(--on-surface-faint); line-height: 1.4; margin: 0 0 0.5rem 0; font-style: italic; }
.lc-detail-header[b-9m81ldoxju] { display: flex; justify-content: space-between; font-size: 0.7rem; color: var(--on-surface-faint); margin-bottom: 0.4rem; }
.lc-detail-key[b-9m81ldoxju] { font-family: monospace; font-size: 0.6rem; }
.lc-event-row[b-9m81ldoxju] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4rem; padding: 0.25rem 0; font-size: 0.8rem; }
.lc-ev-time[b-9m81ldoxju] { color: var(--on-surface-faint); font-family: monospace; font-size: 0.7rem; min-width: 110px; }
.lc-ev-service[b-9m81ldoxju] { font-size: 0.6rem; font-weight: 700; text-transform: uppercase; padding: 0.08rem 0.35rem; border-radius: 0.2rem; letter-spacing: 0.03em; }
.lc-ev-service.sonarr[b-9m81ldoxju] { background: rgba(var(--status-info-rgb), 0.25); color: var(--status-info); }
.lc-ev-service.radarr[b-9m81ldoxju] { background: rgba(var(--status-warning-rgb), 0.2); color: var(--status-warning); }
.lc-ev-service.deluge[b-9m81ldoxju] { background: rgba(var(--status-info-rgb), 0.2); color: var(--status-info); }
.lc-ev-service.plex[b-9m81ldoxju] { background: rgba(var(--interactive-accent-rgb), 0.2); color: var(--interactive-accent); }
.lc-ev-service.import-engine[b-9m81ldoxju] { background: rgba(var(--status-success-rgb), 0.15); color: var(--status-success); }
.lc-ev-service.sabnzbd[b-9m81ldoxju] { background: rgba(var(--status-warning-rgb), 0.2); color: var(--status-warning); }
.lc-ev-service.qbittorrent[b-9m81ldoxju] { background: rgba(var(--status-info-rgb), 0.2); color: var(--status-info); }
.lc-ev-service.transmission[b-9m81ldoxju] { background: rgba(var(--status-error-rgb), 0.15); color: var(--status-error); }
.lc-ev-stage[b-9m81ldoxju] { font-size: 0.65rem; font-weight: 600; padding: 0.08rem 0.3rem; border-radius: 0.2rem; }
.lc-ev-stage.stage-green[b-9m81ldoxju] { background: rgba(var(--status-success-rgb), 0.15); color: var(--status-success); }
.lc-ev-stage.stage-blue[b-9m81ldoxju] { background: rgba(var(--status-info-rgb), 0.15); color: var(--status-info); }
.lc-ev-stage.stage-red[b-9m81ldoxju] { background: rgba(var(--status-error-rgb), 0.15); color: var(--status-error); }
.lc-ev-stage.stage-gray[b-9m81ldoxju] { background: var(--surface-card); color: var(--on-surface-faint); }
.lc-ev-details[b-9m81ldoxju] { display: flex; flex-wrap: wrap; gap: 0.2rem 0.6rem; width: 100%; padding-left: 110px; }
.lc-ev-detail[b-9m81ldoxju] { font-size: 0.68rem; color: var(--on-surface-faint); }
.lc-ev-detail em[b-9m81ldoxju] { font-style: normal; color: var(--on-surface-medium); }

/* Import Pipeline */
.ip-section[b-9m81ldoxju] { margin-bottom: 2rem; }
.ip-section-title[b-9m81ldoxju] { font-size: 1rem; font-weight: 600; color: var(--on-surface); margin: 0 0 0.8rem; display: flex; align-items: center; gap: 0.4rem; }

.ip-jobs-grid[b-9m81ldoxju] { display: grid; gap: 0.75rem; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
.ip-job-card[b-9m81ldoxju] { background: var(--surface-card); border: 1px solid var(--border-medium); border-radius: 0.5rem; padding: 0.8rem 1rem; }
.ip-job-head[b-9m81ldoxju] { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; margin-bottom: 0.4rem; }
.ip-job-title[b-9m81ldoxju] { font-weight: 600; font-size: 0.85rem; color: var(--on-surface); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.ip-job-meta[b-9m81ldoxju] { display: flex; gap: 0.5rem; font-size: 0.7rem; color: var(--on-surface-faint); margin-bottom: 0.3rem; align-items: center; }
.ip-job-duration[b-9m81ldoxju] { display: flex; align-items: center; gap: 0.2rem; }
.ip-job-source[b-9m81ldoxju] { background: var(--surface-card); border: 1px solid var(--border-medium); padding: 0.05rem 0.3rem; border-radius: 0.2rem; font-size: 0.6rem; }
.ip-job-retry[b-9m81ldoxju] { color: var(--status-warning); font-weight: 600; }
.ip-job-path[b-9m81ldoxju] { font-family: monospace; font-size: 0.65rem; color: var(--on-surface-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 0.4rem; }
.ip-job-error[b-9m81ldoxju] { font-size: 0.7rem; color: var(--status-error); padding: 0.3rem 0.5rem; background: rgba(var(--status-error-rgb), 0.08); border-radius: 0.3rem; margin-bottom: 0.4rem; display: flex; align-items: center; gap: 0.3rem; }
.ip-pipeline-track[b-9m81ldoxju] { display: flex; align-items: center; margin-top: 0.2rem; }

.ip-state-badge[b-9m81ldoxju] { font-size: 0.6rem; font-weight: 700; text-transform: uppercase; padding: 0.1rem 0.4rem; border-radius: 0.25rem; letter-spacing: 0.03em; white-space: nowrap; }
.ip-state-badge.state-wait[b-9m81ldoxju] { background: rgba(var(--status-warning-rgb), 0.15); color: var(--status-warning); }
.ip-state-badge.state-process[b-9m81ldoxju] { background: rgba(var(--status-info-rgb), 0.15); color: var(--status-info); }
.ip-state-badge.state-verify[b-9m81ldoxju] { background: rgba(168, 85, 247, 0.15); color: #a855f7; }
.ip-state-badge.state-done[b-9m81ldoxju] { background: rgba(var(--status-success-rgb), 0.15); color: var(--status-success); }
.ip-state-badge.state-fail[b-9m81ldoxju] { background: rgba(var(--status-error-rgb), 0.15); color: var(--status-error); }

.ip-ledger-table[b-9m81ldoxju] { border: 1px solid var(--border-medium); border-radius: 0.5rem; overflow: hidden; }
.ip-ledger-hdr[b-9m81ldoxju] {
    display: grid; grid-template-columns: 2fr 1fr 1fr 0.8fr 1fr 1fr; gap: 0.5rem;
    padding: 0.5rem 0.8rem; background: rgba(255, 255, 255, 0.03);
    font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--on-surface-faint); border-bottom: 1px solid var(--border-medium);
}
.ip-ledger-row[b-9m81ldoxju] { border-bottom: 1px solid var(--border-medium); cursor: pointer; transition: background 0.1s; }
.ip-ledger-row:last-child[b-9m81ldoxju] { border-bottom: none; }
.ip-ledger-row:hover[b-9m81ldoxju] { background: rgba(255, 255, 255, 0.02); }
.ip-ledger-row.expanded[b-9m81ldoxju] { background: rgba(255, 255, 255, 0.03); }
.ip-ledger-row.ip-row-failed[b-9m81ldoxju] { border-left: 3px solid var(--status-error); }
.ip-ledger-main[b-9m81ldoxju] { display: grid; grid-template-columns: 2fr 1fr 1fr 0.8fr 1fr 1fr; gap: 0.5rem; padding: 0.6rem 0.8rem; align-items: center; font-size: 0.8rem; }
.ip-col-title[b-9m81ldoxju] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--on-surface); font-weight: 500; }
.ip-col-source[b-9m81ldoxju], .ip-col-client[b-9m81ldoxju] { font-size: 0.75rem; color: var(--on-surface-faint); }
.ip-col-time[b-9m81ldoxju] { font-size: 0.7rem; color: var(--on-surface-faint); font-family: monospace; }

.ip-ledger-detail[b-9m81ldoxju] { padding: 0.6rem 0.8rem 1rem; border-top: 1px solid var(--border-medium); }
.ip-error-block[b-9m81ldoxju] { display: flex; gap: 0.6rem; padding: 0.6rem 0.8rem; background: rgba(var(--status-error-rgb), 0.08); border-radius: 0.4rem; margin-bottom: 0.6rem; font-size: 0.8rem; color: var(--status-error); align-items: flex-start; }
.ip-error-block strong[b-9m81ldoxju] { display: block; margin-bottom: 0.15rem; }
.ip-error-action[b-9m81ldoxju] { font-size: 0.72rem; color: var(--on-surface-faint); margin: 0; font-style: italic; }
.ip-paths[b-9m81ldoxju] { margin-bottom: 0.6rem; }
.ip-path-row[b-9m81ldoxju] { display: flex; gap: 0.5rem; align-items: center; padding: 0.15rem 0; font-size: 0.72rem; }
.ip-path-label[b-9m81ldoxju] { font-size: 0.6rem; font-weight: 700; text-transform: uppercase; padding: 0.05rem 0.3rem; border-radius: 0.2rem; background: var(--surface-card); color: var(--on-surface-faint); min-width: 42px; text-align: center; }
.ip-path-label.ip-path-final[b-9m81ldoxju] { background: rgba(var(--status-success-rgb), 0.15); color: var(--status-success); }
.ip-path-val[b-9m81ldoxju] { font-family: monospace; font-size: 0.68rem; color: var(--on-surface-medium); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ip-ids[b-9m81ldoxju] { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 0.6rem; }
.ip-id-tag[b-9m81ldoxju] { font-size: 0.6rem; font-family: monospace; padding: 0.1rem 0.35rem; border-radius: 0.2rem; background: var(--surface-card); border: 1px solid var(--border-medium); color: var(--on-surface-faint); }
.ip-events-timeline[b-9m81ldoxju] { margin-top: 0.4rem; }
.ip-events-timeline h4[b-9m81ldoxju] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--on-surface-faint); margin: 0 0 0.3rem; }
.ip-ev-type[b-9m81ldoxju] { font-size: 0.65rem; font-weight: 600; padding: 0.08rem 0.3rem; border-radius: 0.2rem; background: rgba(255, 255, 255, 0.06); color: var(--on-surface-medium); }
.ip-ev-files[b-9m81ldoxju] { font-size: 0.6rem; color: var(--on-surface-faint); }
/* /Components/Pages/NowPlaying.razor.rz.scp.css */
.np-page[b-3f1j4u66mn] { max-width: var(--content-width-default); margin: 0 auto; }

.np-header[b-3f1j4u66mn] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; }
.np-header h1[b-3f1j4u66mn] { font-size: 1.35rem; font-weight: 700; margin: 0; }
.np-controls[b-3f1j4u66mn] { display: flex; align-items: center; gap: 0.75rem; }
.np-count[b-3f1j4u66mn] { font-size: 0.8rem; color: var(--on-surface-muted); }
.np-live[b-3f1j4u66mn] { font-size: 0.65rem; letter-spacing: 0.05em; }
.np-empty[b-3f1j4u66mn] { text-align: center; padding: 4rem 1rem; color: var(--on-surface-faint); }

.np-grid[b-3f1j4u66mn] { display: flex; flex-direction: column; gap: 1rem; }
.np-session-right[b-3f1j4u66mn] { display: flex; flex-direction: column; gap: 0.3rem; min-width: 200px; }

.np-meta-row[b-3f1j4u66mn] { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; }
.np-chip[b-3f1j4u66mn] {
    font-size: 0.65rem;
    background: var(--surface-card);
    border: 1px solid var(--border-medium);
    padding: 0.12rem 0.4rem;
    border-radius: 0.2rem;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--on-surface-muted);
}
.np-chip.res[b-3f1j4u66mn] { background: rgba(var(--interactive-accent-rgb), 0.1); border-color: rgba(var(--interactive-accent-rgb), 0.2); color: var(--interactive-accent); }
.np-chip.transcode[b-3f1j4u66mn] { background: rgba(var(--status-info-rgb), 0.1); border-color: rgba(var(--status-info-rgb), 0.2); color: var(--status-info); }

.np-progress[b-3f1j4u66mn] { margin: 0.3rem 0; }
.np-progress-bar[b-3f1j4u66mn] { width: 100%; height: 6px; background: var(--surface-card); border-radius: 3px; overflow: hidden; }
.np-progress-fill[b-3f1j4u66mn] { height: 100%; border-radius: 3px; transition: width 0.5s linear; }
.np-progress-fill.playing[b-3f1j4u66mn] { background: var(--status-success); }
.np-progress-fill.paused[b-3f1j4u66mn] { background: var(--status-warning); }
.np-progress-fill.buffering[b-3f1j4u66mn] { background: var(--status-info); }
.np-progress-times[b-3f1j4u66mn] { display: flex; justify-content: space-between; font-size: 0.65rem; color: var(--on-surface-faint); margin-top: 0.15rem; font-family: monospace; }

.np-controls-row[b-3f1j4u66mn] { display: flex; gap: 0.4rem; margin-top: 0.2rem; }
.np-ctrl-btn[b-3f1j4u66mn] {
    width: 32px; height: 32px; border-radius: 50%;
    border: 1px solid var(--border-medium);
    background: var(--surface-card);
    color: var(--on-surface-medium);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: background var(--duration-short), color var(--duration-short);
    font-size: 0.8rem;
}
.np-ctrl-btn:hover[b-3f1j4u66mn] { background: var(--surface-card-hover); color: var(--on-surface); }
.np-ctrl-btn.primary[b-3f1j4u66mn] { border-color: rgba(var(--status-info-rgb), 0.4); color: var(--status-info); }
.np-ctrl-btn.primary:hover[b-3f1j4u66mn] { background: rgba(var(--status-info-rgb), 0.2); }
.np-ctrl-btn.danger[b-3f1j4u66mn] { border-color: rgba(var(--status-error-rgb), 0.3); color: var(--status-error); }
.np-ctrl-btn.danger:hover[b-3f1j4u66mn] { background: rgba(var(--status-error-rgb), 0.15); }
.np-ctrl-btn.info[b-3f1j4u66mn] { border-color: rgba(var(--md-primary-rgb), 0.3); color: var(--md-primary-light); }
.np-ctrl-btn.info:hover[b-3f1j4u66mn] { background: rgba(var(--md-primary-rgb), 0.15); }
/* /Components/Pages/PersonDetail.razor.rz.scp.css */
.pd-empty[b-k3924w4lur], .pd-loading[b-k3924w4lur] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    min-height: 60vh; color: var(--on-surface-muted); gap: .5rem;
}
.pd-loading .spin[b-k3924w4lur] {
    width: 32px; height: 32px; border: 3px solid var(--border-medium);
    border-top-color: var(--interactive-accent); border-radius: 50%;
    animation: mo-spin 1s linear infinite;
}

.pd-page[b-k3924w4lur] {
    position: relative; min-height: 100vh; padding-bottom: 2rem;
}

.pd-backdrop[b-k3924w4lur] {
    position: fixed; inset: 0; z-index: -1; overflow: hidden;
}
.pd-backdrop-img[b-k3924w4lur] {
    width: 100%; height: 100%; object-fit: cover;
    opacity: .15; filter: blur(20px) saturate(1.4);
}
.pd-backdrop-gradient[b-k3924w4lur] {
    position: absolute; inset: 0;
    background: linear-gradient(to bottom, rgba(var(--surface-base-rgb, 15,15,20), .6) 0%,
        rgba(var(--surface-base-rgb, 15,15,20), .95) 60%,
        var(--surface-base, #0f0f14) 100%);
}

.pd-hero[b-k3924w4lur] {
    padding: 2rem 2rem 1rem;
}
.pd-hero-inner[b-k3924w4lur] {
    display: flex; gap: 2rem; align-items: flex-start; max-width: 1400px; margin: 0 auto;
}
.pd-profile[b-k3924w4lur] {
    flex-shrink: 0;
}
.pd-profile-img[b-k3924w4lur] {
    width: 180px; height: 180px; border-radius: 50%; object-fit: cover;
    border: 3px solid var(--border-medium);
    box-shadow: 0 8px 32px rgba(0,0,0,.5);
}
.pd-profile-placeholder[b-k3924w4lur] {
    width: 180px; height: 180px; border-radius: 50%;
    background: var(--surface-card); border: 3px solid var(--border-medium);
    display: flex; align-items: center; justify-content: center;
    font-size: 4rem; color: var(--on-surface-faint);
}
.pd-hero-info[b-k3924w4lur] {
    flex: 1; min-width: 0; padding-top: .5rem;
}
.pd-name[b-k3924w4lur] {
    font-size: 2.4rem; font-weight: 800; color: #fff; margin: 0 0 .5rem;
    text-shadow: 0 2px 8px rgba(0,0,0,.5);
}
.pd-department-badge[b-k3924w4lur] {
    display: inline-flex; align-items: center; gap: .3rem;
    background: rgba(var(--interactive-accent-rgb), .15);
    color: var(--interactive-accent); padding: .25rem .7rem;
    border-radius: 1rem; font-size: .8rem; font-weight: 600;
    margin-bottom: .75rem;
}
.pd-department-badge .bi[b-k3924w4lur] { font-size: .7rem; }

.pd-meta[b-k3924w4lur] {
    display: flex; flex-wrap: wrap; gap: .75rem 1.5rem;
    font-size: .85rem; color: var(--on-surface-medium); margin-bottom: 1rem;
}
.pd-meta-item[b-k3924w4lur] {
    display: inline-flex; align-items: center; gap: .35rem;
}
.pd-meta-item .bi[b-k3924w4lur] { font-size: .75rem; opacity: .7; }

.pd-back-btn[b-k3924w4lur] {
    display: inline-flex; align-items: center; gap: .4rem;
    background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15);
    color: rgba(255,255,255,.8); padding: .45rem 1rem; border-radius: var(--radius-xs);
    font-size: .8rem; font-weight: 600; cursor: pointer;
    transition: background .15s, color .15s;
}
.pd-back-btn:hover[b-k3924w4lur] { background: rgba(255,255,255,.18); color: #fff; }

.pd-section[b-k3924w4lur] {
    max-width: 1400px; margin: 0 auto; padding: 0 2rem 1.5rem;
}
.pd-section-title[b-k3924w4lur] {
    font-size: 1.15rem; font-weight: 700; color: var(--on-surface);
    display: flex; align-items: center; gap: .5rem; margin: 0 0 1rem;
}
.pd-section-title .bi[b-k3924w4lur] { font-size: .95rem; opacity: .7; }
.pd-section-count[b-k3924w4lur] {
    font-size: .8rem; font-weight: 500; color: var(--on-surface-muted);
}

.pd-bio[b-k3924w4lur] {
    font-size: .9rem; color: var(--on-surface-medium); line-height: 1.7;
    display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
    overflow: hidden; position: relative;
    transition: max-height .3s ease;
}
.pd-bio-expanded[b-k3924w4lur] { -webkit-line-clamp: unset; }
.pd-bio p[b-k3924w4lur] { margin: 0; }
.pd-bio-toggle[b-k3924w4lur] {
    background: none; border: none; color: var(--interactive-accent);
    font-size: .8rem; font-weight: 600; cursor: pointer; padding: .3rem 0;
    transition: opacity .15s;
}
.pd-bio-toggle:hover[b-k3924w4lur] { opacity: .8; }

.pd-known-for[b-k3924w4lur] {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem;
}
.pd-known-card[b-k3924w4lur] {
    background: var(--surface-card); border-radius: var(--radius-sm);
    overflow: hidden; cursor: pointer; transition: transform .15s, box-shadow .15s;
    border: 1px solid var(--border-subtle);
}
.pd-known-card:hover[b-k3924w4lur], .pd-known-card:focus-visible[b-k3924w4lur] {
    transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.4);
}
.pd-known-poster[b-k3924w4lur] {
    position: relative; aspect-ratio: 2/3; overflow: hidden;
}
.pd-known-poster img[b-k3924w4lur] {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .3s;
}
.pd-known-card:hover .pd-known-poster img[b-k3924w4lur] { transform: scale(1.05); }
.pd-known-overlay[b-k3924w4lur] {
    position: absolute; inset: 0; background: rgba(0,0,0,.4);
    display: flex; align-items: center; justify-content: center;
    opacity: 0; transition: opacity .2s;
    font-size: 2rem; color: #fff;
}
.pd-known-card:hover .pd-known-overlay[b-k3924w4lur] { opacity: 1; }
.pd-known-no-poster[b-k3924w4lur] {
    width: 100%; height: 100%; background: var(--surface-raised);
    display: flex; align-items: center; justify-content: center;
    font-size: 2rem; color: var(--on-surface-faint);
}
.pd-known-info[b-k3924w4lur] {
    padding: .6rem .75rem; display: flex; flex-direction: column; gap: .15rem;
}
.pd-known-title[b-k3924w4lur] {
    font-size: .85rem; font-weight: 600; color: var(--on-surface);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pd-known-role[b-k3924w4lur] {
    font-size: .75rem; color: var(--on-surface-muted); font-style: italic;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pd-known-year[b-k3924w4lur] {
    font-size: .72rem; color: var(--on-surface-faint);
}

.pd-filmography-strip[b-k3924w4lur] {
    display: flex; align-items: flex-start;
    gap: .75rem; overflow-x: auto; padding-bottom: .5rem;
    scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
}
.pd-filmography-strip[b-k3924w4lur]::-webkit-scrollbar { height: 4px; }
.pd-filmography-strip[b-k3924w4lur]::-webkit-scrollbar-thumb {
    background: var(--border-medium); border-radius: 2px;
}
/* Fixed slot width + 2:3 frame (padding trick) so poster intrinsic sizes never stretch the strip */
.pd-film-card[b-k3924w4lur] {
    flex: none;
    width: 130px;
    max-width: 130px;
    min-width: 0;
    box-sizing: border-box;
    cursor: pointer;
    scroll-snap-align: start;
    transition: transform .15s;
    overflow: hidden;
}
.pd-film-card:hover[b-k3924w4lur], .pd-film-card:focus-visible[b-k3924w4lur] { transform: translateY(-3px); }
/* Same 2:3 frame as .pd-known-poster; beats global img { height: auto } from Bootstrap */
.pd-film-poster[b-k3924w4lur] {
    position: relative;
    width: 100%;
    aspect-ratio: 2 / 3;
    flex-shrink: 0;
    border-radius: var(--radius-xs);
    overflow: hidden;
    margin-bottom: .35rem;
    background: var(--surface-raised);
}
.pd-film-poster img[b-k3924w4lur] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.pd-film-no-poster[b-k3924w4lur] {
    position: absolute;
    inset: 0;
    background: var(--surface-raised);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--on-surface-faint);
}
.pd-film-title[b-k3924w4lur] {
    display: block; font-size: .75rem; font-weight: 600; color: var(--on-surface);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pd-film-role[b-k3924w4lur] {
    display: block; font-size: .68rem; color: var(--on-surface-muted);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pd-film-year[b-k3924w4lur] {
    display: block; font-size: .65rem; color: var(--on-surface-faint);
}

@media (max-width: 768px) {
    .pd-hero-inner[b-k3924w4lur] { flex-direction: column; align-items: center; text-align: center; gap: 1rem; }
    .pd-profile-img[b-k3924w4lur], .pd-profile-placeholder[b-k3924w4lur] { width: 120px; height: 120px; }
    .pd-name[b-k3924w4lur] { font-size: 1.6rem; }
    .pd-meta[b-k3924w4lur] { justify-content: center; }
    .pd-section[b-k3924w4lur] { padding: 0 1rem 1.5rem; }
    .pd-hero[b-k3924w4lur] { padding: 1.5rem 1rem 1rem; }
    .pd-known-for[b-k3924w4lur] { grid-template-columns: repeat(2, 1fr); }
    .pd-film-card[b-k3924w4lur] { width: 110px; max-width: 110px; }
}
/* /Components/Pages/Plugins.razor.rz.scp.css */
.plugins-page[b-0wnsu9k617] {
    color: var(--on-surface);
    min-height: 100vh;
    padding: 1.5rem 2rem;
}

.plugins-header[b-0wnsu9k617] {
    margin-bottom: 1.75rem;
}

.plugins-brand h1[b-0wnsu9k617] {
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin: 0 0 0.35rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.plugins-brand h1 .bi[b-0wnsu9k617] {
    opacity: 0.55;
    font-size: 1.35rem;
}

.plugins-lead[b-0wnsu9k617] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--on-surface-muted);
    max-width: 42rem;
    line-height: 1.45;
}

.plugins-spinner.page-spinner[b-0wnsu9k617] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 2rem 0;
    color: var(--on-surface-muted);
    font-size: 0.875rem;
}

.plugins-section[b-0wnsu9k617] {
    margin-bottom: 2rem;
}

.plugins-section-title[b-0wnsu9k617] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--on-surface-muted);
    margin: 0 0 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-subtle);
}

.plugins-summary-grid[b-0wnsu9k617] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem;
}

.plugins-stat-card[b-0wnsu9k617] {
    background: var(--surface-card);
    backdrop-filter: blur(var(--glass-blur));
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 0.85rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    transition: background var(--duration-short) var(--ease-standard), border-color var(--duration-short);
}

.plugins-stat-card:hover[b-0wnsu9k617] {
    background: var(--surface-card-hover);
    border-color: var(--border-medium);
}

.plugins-stat-value[b-0wnsu9k617] {
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--on-surface);
}

.plugins-stat-label[b-0wnsu9k617] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--on-surface-muted);
}

.plugins-empty[b-0wnsu9k617] {
    padding: 1.25rem;
    border-radius: var(--radius-md);
    border: 1px dashed var(--border-medium);
    color: var(--on-surface-muted);
    font-size: 0.875rem;
    text-align: center;
}

.plugins-surface-block[b-0wnsu9k617] {
    margin-bottom: 1.25rem;
}

.plugins-surface-head[b-0wnsu9k617] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}

.plugins-surface-head .bi[b-0wnsu9k617] {
    font-size: 1.1rem;
    color: var(--interactive-accent);
    opacity: 0.9;
}

.plugins-surface-head h3[b-0wnsu9k617] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--on-surface);
}

.plugins-surface-id[b-0wnsu9k617] {
    font-size: 0.65rem;
    font-family: ui-monospace, monospace;
    color: var(--on-surface-muted);
    padding: 0.1rem 0.4rem;
    border-radius: var(--radius-sm);
    background: rgba(var(--interactive-accent-rgb), 0.08);
    border: 1px solid var(--border-subtle);
}

.plugins-wire-list[b-0wnsu9k617] {
    background: var(--surface-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.plugins-wire-row[b-0wnsu9k617] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 0.85rem;
    border-bottom: 1px solid var(--border-subtle);
}

.plugins-wire-row:last-child[b-0wnsu9k617] {
    border-bottom: none;
}

.plugins-wire-row:hover[b-0wnsu9k617] {
    background: var(--surface-card-hover);
}

.plugins-health-dot[b-0wnsu9k617] {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: var(--radius-full);
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.15);
}

.plugins-health-dot.health-ok[b-0wnsu9k617] {
    background: var(--status-success);
}

.plugins-health-dot.health-warn[b-0wnsu9k617] {
    background: var(--status-warning);
}

.plugins-health-dot.health-err[b-0wnsu9k617] {
    background: var(--status-error);
}

.plugins-health-dot.health-muted[b-0wnsu9k617] {
    background: var(--on-surface-muted);
    opacity: 0.45;
}

.plugins-wire-main[b-0wnsu9k617] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.75rem;
    min-width: 0;
}

.plugins-wire-name[b-0wnsu9k617] {
    font-weight: 600;
    font-size: 0.84rem;
    color: var(--on-surface);
}

.plugins-wire-role[b-0wnsu9k617] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--interactive-accent);
    background: rgba(var(--interactive-accent-rgb), 0.1);
    padding: 0.12rem 0.4rem;
    border-radius: var(--radius-sm);
}
/* /Components/Pages/Remediation.razor.rz.scp.css */
.remediation-page[b-zc465i0f4z] {
    background: var(--surface-base);
    color: var(--on-surface);
    min-height: 100vh;
    padding: 1.5rem;
}

.remediation-page h1[b-zc465i0f4z] { font-size: 1.25rem; font-weight: 700; margin: 0 0 1.25rem; }

.status-summary[b-zc465i0f4z] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.stat-card[b-zc465i0f4z] {
    background: var(--surface-card);
    border: 1px solid var(--border-medium);
    border-radius: var(--radius-sm);
    padding: 1rem;
    text-align: center;
}

.stat-card.good[b-zc465i0f4z] { border-top: 3px solid var(--status-success); }
.stat-card.warn[b-zc465i0f4z] { border-top: 3px solid var(--status-warning); }
.stat-card.bad[b-zc465i0f4z] { border-top: 3px solid var(--status-error); }
.stat-card.neutral[b-zc465i0f4z] { border-top: 3px solid var(--on-surface-muted); }

.stat-num[b-zc465i0f4z] { font-size: 2rem; font-weight: 800; display: block; line-height: 1; }
.stat-card.good .stat-num[b-zc465i0f4z] { color: var(--status-success); }
.stat-card.warn .stat-num[b-zc465i0f4z] { color: var(--status-warning); }
.stat-card.bad .stat-num[b-zc465i0f4z] { color: var(--status-error); }
.stat-label[b-zc465i0f4z] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--on-surface-muted); }

.section-title[b-zc465i0f4z] {
    font-size: 0.75rem; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.1em; color: var(--on-surface-muted); margin: 1.5rem 0 0.5rem;
    padding-bottom: 0.3rem; border-bottom: 1px solid var(--border-medium);
}

.issue-list[b-zc465i0f4z] { display: flex; flex-direction: column; gap: 0.5rem; }

.issue-row[b-zc465i0f4z] {
    display: flex; justify-content: space-between; align-items: center;
    background: var(--surface-card); border: 1px solid var(--border-medium);
    border-left: 3px solid var(--status-error); border-radius: var(--radius-sm); padding: 0.75rem 1rem;
}

.issue-svc[b-zc465i0f4z] { font-weight: 600; font-size: 0.85rem; display: block; }
.issue-msg[b-zc465i0f4z] { font-size: 0.75rem; color: var(--on-surface-muted); word-break: break-word; }

.btn-action[b-zc465i0f4z] {
    background: rgba(var(--status-error-rgb), 0.12); color: var(--status-error);
    border: 1px solid rgba(var(--status-error-rgb), 0.3); border-radius: var(--radius-xs);
    padding: 0.3rem 0.75rem; font-size: 0.75rem; cursor: pointer;
    font-weight: 600;
}
.btn-action:hover[b-zc465i0f4z] { background: rgba(var(--status-error-rgb), 0.2); }

.all-clear[b-zc465i0f4z] {
    background: rgba(var(--status-success-rgb), 0.08); color: var(--status-success);
    border: 1px solid rgba(var(--status-success-rgb), 0.2); border-radius: var(--radius-sm);
    padding: 2rem; text-align: center; font-weight: 600; font-size: 1rem;
}

.result-banner[b-zc465i0f4z] {
    background: var(--surface-card); border: 1px solid var(--border-medium);
    border-radius: var(--radius-xs); padding: 0.5rem 0.75rem;
    font-size: 0.8rem; margin-top: 0.75rem;
}

.audit-table[b-zc465i0f4z] { font-size: 0.75rem; }

.audit-header[b-zc465i0f4z], .audit-row[b-zc465i0f4z] {
    display: grid; grid-template-columns: 100px 100px 80px 60px 1fr;
    gap: 0.5rem; padding: 0.35rem 0.5rem; border-bottom: 1px solid var(--border-medium);
}

.audit-header[b-zc465i0f4z] {
    font-weight: 600; color: var(--on-surface-muted); text-transform: uppercase;
    font-size: 0.65rem; letter-spacing: 0.05em;
}

.result-ok[b-zc465i0f4z] { color: var(--status-success); font-weight: 600; }
.result-fail[b-zc465i0f4z] { color: var(--status-error); font-weight: 600; }
.audit-notes[b-zc465i0f4z] { color: var(--on-surface-muted); word-break: break-word; }
/* /Components/Pages/Setup.razor.rz.scp.css */
.setup-layout[b-o5f37jks5o] {
    display: grid;
    grid-template-columns: 240px 1fr;
    min-height: 100vh;
    background: var(--surface-page, #0d1117);
}

.setup-sidebar[b-o5f37jks5o] {
    position: sticky;
    top: 0;
    height: 100vh;
    background: var(--surface-nav, #161b22);
    border-right: 1px solid var(--border-subtle, #21262d);
    padding: 1.5rem 0;
    overflow-y: auto;
    flex-shrink: 0;
}

.setup-sidebar-brand[b-o5f37jks5o] {
    padding: 0 1.25rem 1.25rem;
    border-bottom: 1px solid var(--border-subtle, #21262d);
    margin-bottom: .75rem;
}

.setup-sidebar-brand h2[b-o5f37jks5o] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--on-surface, #e6edf3);
    margin: 0;
    display: flex;
    align-items: center;
    gap: .5rem;
}

.setup-nav-item[b-o5f37jks5o] {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: .5rem 1.25rem;
    cursor: default;
    opacity: .35;
    transition: all .15s ease;
    color: var(--on-surface-medium, #8b949e);
    border-left: 3px solid transparent;
}

.setup-nav-item.completed[b-o5f37jks5o] {
    opacity: .85;
    cursor: pointer;
    color: var(--on-surface, #e6edf3);
}

.setup-nav-item.completed:hover[b-o5f37jks5o] {
    background: rgba(255,255,255,.04);
}

.setup-nav-item.active[b-o5f37jks5o] {
    opacity: 1;
    color: var(--on-surface, #e6edf3);
    border-left-color: var(--interactive-accent, #1565c0);
    background: rgba(21,101,192,.08);
    font-weight: 600;
}

.setup-nav-icon[b-o5f37jks5o] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .65rem;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 2px;
    border: 2px solid var(--border-medium, #30363d);
    color: var(--on-surface-faint, #484f58);
}

.setup-nav-item.completed .setup-nav-icon[b-o5f37jks5o] {
    background: var(--status-success, #2ea043);
    border-color: var(--status-success, #2ea043);
    color: #fff;
}

.setup-nav-item.active .setup-nav-icon[b-o5f37jks5o] {
    border-color: var(--interactive-accent, #1565c0);
    background: var(--interactive-accent, #1565c0);
    color: #fff;
}

.setup-nav-label[b-o5f37jks5o] {
    font-size: .82rem;
    line-height: 1.3;
}

.setup-nav-summary[b-o5f37jks5o] {
    font-size: .65rem;
    font-weight: 400;
    color: var(--on-surface-faint, #484f58);
    margin-top: 1px;
}

.setup-nav-item.completed .setup-nav-summary[b-o5f37jks5o] {
    color: var(--status-success, #2ea043);
}

.setup-content[b-o5f37jks5o] {
    padding: 2rem 2.5rem;
    max-width: 860px;
    overflow-y: auto;
}

.setup-content h2[b-o5f37jks5o] {
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: .25rem;
    color: var(--on-surface, #e6edf3);
}

.setup-content h2 .bi[b-o5f37jks5o] {
    opacity: .5;
    margin-right: .3rem;
}

.setup-step-desc[b-o5f37jks5o] {
    color: var(--on-surface-medium, #8b949e);
    margin-bottom: 1.5rem;
    font-size: .88rem;
}

.setup-footer[b-o5f37jks5o] {
    display: flex;
    gap: .75rem;
    margin-top: 2rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--border-subtle, #21262d);
}

.host-card[b-o5f37jks5o] {
    background: var(--surface-card, #161b22);
    border: 1px solid var(--border-medium, #30363d);
    border-radius: 8px;
    padding: .75rem 1rem;
    margin-bottom: .6rem;
}

.host-card.connected[b-o5f37jks5o] {
    border-color: var(--status-success, #2ea043);
}

.host-card-header[b-o5f37jks5o] {
    display: flex;
    align-items: center;
    gap: .6rem;
}

.host-card-header .host-type-icon[b-o5f37jks5o] {
    font-size: 1.2rem;
    opacity: .6;
}

.host-card-header .host-name[b-o5f37jks5o] {
    font-weight: 600;
    font-size: .9rem;
}

.host-card-header .host-ip[b-o5f37jks5o] {
    font-size: .78rem;
    color: var(--on-surface-faint, #484f58);
    font-family: monospace;
}

.host-card-fields[b-o5f37jks5o] {
    display: grid;
    grid-template-columns: 1fr 70px 1fr 100px auto;
    gap: .5rem;
    margin-top: .6rem;
    align-items: end;
}

.host-card-fields label[b-o5f37jks5o] {
    font-size: .7rem;
    color: var(--on-surface-faint);
    margin-bottom: 2px;
    display: block;
}

.svc-discovered[b-o5f37jks5o] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .6rem .75rem;
    background: var(--surface-card, #161b22);
    border: 1px solid var(--border-medium, #30363d);
    border-radius: 6px;
    margin-bottom: .4rem;
}

.svc-discovered.configured[b-o5f37jks5o] {
    border-color: var(--status-success, #2ea043);
}

.svc-discovered .svc-icon[b-o5f37jks5o] {
    font-size: 1.1rem;
    opacity: .6;
    width: 24px;
    text-align: center;
}

.svc-discovered .svc-info[b-o5f37jks5o] {
    flex: 1;
    min-width: 0;
}

.svc-discovered .svc-name[b-o5f37jks5o] {
    font-weight: 600;
    font-size: .85rem;
}

.svc-discovered .svc-url[b-o5f37jks5o] {
    font-size: .72rem;
    color: var(--on-surface-faint);
    font-family: monospace;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.svc-ui-btn[b-o5f37jks5o] {
    flex-shrink: 0;
    font-size: .7rem;
    padding: .15rem .5rem;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    border-color: var(--border-medium, #30363d);
    color: var(--on-surface-medium, #8b949e);
    text-decoration: none;
}

.svc-ui-btn:hover[b-o5f37jks5o] {
    color: var(--interactive-accent, #58a6ff);
    border-color: var(--interactive-accent, #58a6ff);
    background: rgba(88, 166, 255, .1);
}

.check-item[b-o5f37jks5o] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem 0;
    border-bottom: 1px solid var(--border-subtle, #21262d);
}

.check-item:last-child[b-o5f37jks5o] { border-bottom: none; }

.check-icon[b-o5f37jks5o] { font-size: 1rem; width: 22px; text-align: center; }
.check-icon.pass[b-o5f37jks5o] { color: var(--status-success, #2ea043); }
.check-icon.fail[b-o5f37jks5o] { color: var(--status-error, #f85149); }
.check-icon.pending[b-o5f37jks5o] { color: var(--on-surface-faint, #484f58); }

.review-section[b-o5f37jks5o] {
    background: var(--surface-card, #161b22);
    border: 1px solid var(--border-medium, #30363d);
    border-radius: 8px;
    padding: .75rem 1rem;
    margin-bottom: .75rem;
}

.review-section h5[b-o5f37jks5o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .5rem;
    font-size: .9rem;
}

/* Build progress (Step 8) */

@keyframes build-spin-b-o5f37jks5o {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

[b-o5f37jks5o] .build-spin {
    display: inline-block;
    animation: build-spin-b-o5f37jks5o 1s linear infinite;
}

.build-phase-timeline[b-o5f37jks5o] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 1.25rem 0;
}

.build-phase-row[b-o5f37jks5o] {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .6rem .85rem;
    background: var(--surface-card, #161b22);
    border: 1px solid var(--border-medium, #30363d);
    border-radius: 6px;
    transition: border-color .2s ease;
}

.build-phase-row.active[b-o5f37jks5o] {
    border-color: var(--interactive-accent, #1565c0);
    background: rgba(21,101,192,.06);
}

.build-phase-icon[b-o5f37jks5o] {
    font-size: 1.05rem;
    width: 22px;
    text-align: center;
    flex-shrink: 0;
}

.build-phase-info[b-o5f37jks5o] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.build-phase-name[b-o5f37jks5o] {
    font-weight: 600;
    font-size: .85rem;
    color: var(--on-surface, #e6edf3);
}

.build-phase-desc[b-o5f37jks5o] {
    font-size: .72rem;
    color: var(--on-surface-faint, #484f58);
}

.build-log-panel[b-o5f37jks5o] {
    background: #0d1117;
    border: 1px solid var(--border-medium, #30363d);
    border-radius: 6px;
    padding: .6rem .75rem;
    max-height: 300px;
    overflow-y: auto;
    font-family: 'Cascadia Mono', 'Fira Code', 'Consolas', monospace;
    font-size: .75rem;
    line-height: 1.5;
    color: var(--on-surface-medium, #8b949e);
    margin-bottom: 1rem;
}

.build-log-line[b-o5f37jks5o] {
    white-space: pre-wrap;
    word-break: break-all;
}

.build-stats-bar[b-o5f37jks5o] {
    display: flex;
    gap: 1.5rem;
    padding: .75rem 1rem;
    background: var(--surface-card, #161b22);
    border: 1px solid var(--border-medium, #30363d);
    border-radius: 6px;
    margin-bottom: 1rem;
}

.build-stat[b-o5f37jks5o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 70px;
}

.build-stat-value[b-o5f37jks5o] {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--on-surface, #e6edf3);
    font-variant-numeric: tabular-nums;
}

.build-stat-label[b-o5f37jks5o] {
    font-size: .68rem;
    color: var(--on-surface-faint, #484f58);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.build-report-card[b-o5f37jks5o] {
    background: var(--surface-card, #161b22);
    border: 1px solid var(--border-medium, #30363d);
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-top: 1rem;
}

.build-report-card h5[b-o5f37jks5o] {
    font-size: .9rem;
    font-weight: 600;
    color: var(--on-surface, #e6edf3);
    margin-bottom: .75rem;
}

.build-report-grid[b-o5f37jks5o] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: .75rem;
}

.build-report-item[b-o5f37jks5o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.build-report-value[b-o5f37jks5o] {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--interactive-accent, #58a6ff);
}

.build-report-label[b-o5f37jks5o] {
    font-size: .68rem;
    color: var(--on-surface-faint, #484f58);
    text-transform: uppercase;
    letter-spacing: .04em;
}

@media (max-width: 768px) {
    .setup-layout[b-o5f37jks5o] {
        grid-template-columns: 1fr;
    }
    .setup-sidebar[b-o5f37jks5o] {
        position: relative;
        height: auto;
        display: flex;
        flex-direction: row;
        overflow-x: auto;
        padding: .75rem;
        gap: .25rem;
    }
    .setup-sidebar-brand[b-o5f37jks5o] { display: none; }
    .setup-nav-item[b-o5f37jks5o] {
        padding: .4rem .6rem;
        border-left: none;
        border-bottom: 2px solid transparent;
        white-space: nowrap;
    }
    .setup-nav-item.active[b-o5f37jks5o] {
        border-bottom-color: var(--interactive-accent);
        border-left-color: transparent;
    }
    .setup-nav-summary[b-o5f37jks5o] { display: none; }
    .setup-content[b-o5f37jks5o] { padding: 1rem; }
}
/* /Components/Shared/ContentLayout.razor.rz.scp.css */
.content-layout[b-ehaeh9wkqa] {
    display: grid;
    gap: 1rem;
    width: 100%;
    min-height: 0;
}

/* ── Grid area definitions per layout ── */
.cl-top[b-ehaeh9wkqa] {
    grid-template-areas: "hero" "main";
    grid-template-rows: auto 1fr;
    grid-template-columns: 1fr;
}
.cl-top-left[b-ehaeh9wkqa] {
    grid-template-areas: "hero hero" "panel main";
    grid-template-rows: auto 1fr;
    grid-template-columns: 320px 1fr;
}
.cl-bottom[b-ehaeh9wkqa] {
    grid-template-areas: "main" "hero";
    grid-template-rows: 1fr auto;
    grid-template-columns: 1fr;
}
.cl-left[b-ehaeh9wkqa] {
    grid-template-areas: "panel main";
    grid-template-rows: 1fr;
    grid-template-columns: 320px 1fr;
}
.cl-plain[b-ehaeh9wkqa] {
    grid-template-areas: "main";
    grid-template-rows: 1fr;
    grid-template-columns: 1fr;
}

/* ── Slot assignments ── */
.cl-hero[b-ehaeh9wkqa] { grid-area: hero; }
.cl-main[b-ehaeh9wkqa] { grid-area: main; min-height: 0; overflow: visible; }
.cl-panel[b-ehaeh9wkqa] {
    grid-area: panel;
    position: sticky;
    top: 0;
    align-self: stretch;
    max-height: 100vh;
    overflow-y: auto;
}

/* ── Hero sizing ── */
.cl-hero-lg[b-ehaeh9wkqa] { max-height: 33vh; overflow: hidden; }
.cl-hero-sm[b-ehaeh9wkqa] { max-height: 25vh; overflow: hidden; }

/* ── Sticky hero (top) ── */
.cl-sticky[b-ehaeh9wkqa] {
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--md-background, #0a0f1e);
}

/* ── Sticky hero (bottom) ── */
.cl-sticky-bottom[b-ehaeh9wkqa] {
    position: sticky;
    bottom: 0;
    z-index: 20;
    background: var(--md-background, #0a0f1e);
}

/* ── Responsive: collapse side panel on small screens ── */
@media (max-width: 768px) {
    .cl-top-left[b-ehaeh9wkqa],
    .cl-left[b-ehaeh9wkqa] {
        grid-template-areas: "main";
        grid-template-columns: 1fr;
    }
    .cl-top-left[b-ehaeh9wkqa] { grid-template-areas: "hero" "main"; }
    .cl-panel[b-ehaeh9wkqa] { display: none; }
}
/* /Components/Shared/CoverFlow.razor.rz.scp.css */
.coverflow-section[b-n1uvv2hyac] {
    margin-bottom: 2rem;
}
.coverflow-title[b-n1uvv2hyac] {
    font-size: 1rem; font-weight: 700; color: var(--on-surface);
    display: flex; align-items: center; gap: .5rem;
    margin: 0 0 .75rem; padding: 0 .25rem;
}
.coverflow-title .bi[b-n1uvv2hyac] { font-size: .85rem; opacity: .7; }

.coverflow-viewport[b-n1uvv2hyac] {
    position: relative; overflow: hidden;
    display: flex; align-items: center; justify-content: center;
    height: 320px; perspective: 800px;
    user-select: none;
}

.coverflow-track[b-n1uvv2hyac] {
    display: flex; align-items: center; justify-content: center;
    position: relative; width: 100%; height: 100%;
}

.coverflow-item[b-n1uvv2hyac] {
    position: absolute; width: 200px; aspect-ratio: 2/3;
    border-radius: var(--radius-sm); overflow: hidden;
    cursor: pointer; transition: all .4s cubic-bezier(.4,0,.2,1);
    box-shadow: 0 4px 20px rgba(0,0,0,.4);
    transform-style: preserve-3d;
    backface-visibility: hidden;
}
.coverflow-item img[b-n1uvv2hyac] {
    width: 100%; height: 100%; object-fit: cover;
}
.coverflow-item-center[b-n1uvv2hyac] {
    box-shadow: 0 8px 40px rgba(0,0,0,.6);
    cursor: default;
}
.coverflow-placeholder[b-n1uvv2hyac] {
    width: 100%; height: 100%; background: var(--surface-raised);
    display: flex; align-items: center; justify-content: center;
    font-size: 2.5rem; color: var(--on-surface-faint);
}

.coverflow-arrow[b-n1uvv2hyac] {
    position: absolute; top: 50%; transform: translateY(-50%);
    z-index: 200; width: 2.5rem; height: 2.5rem; border-radius: 50%;
    background: rgba(var(--surface-base-rgb, 15,15,20), .7);
    backdrop-filter: blur(8px);
    border: 1px solid var(--border-medium);
    color: var(--on-surface); font-size: 1.1rem;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; transition: background .15s, opacity .15s;
}
.coverflow-arrow:hover[b-n1uvv2hyac] { background: rgba(var(--surface-base-rgb, 15,15,20), .9); }
.coverflow-arrow:disabled[b-n1uvv2hyac] { opacity: .3; cursor: default; }
.coverflow-arrow-left[b-n1uvv2hyac] { left: 1rem; }
.coverflow-arrow-right[b-n1uvv2hyac] { right: 1rem; }

.coverflow-info[b-n1uvv2hyac] {
    text-align: center; padding: .75rem 1rem; max-width: 500px; margin: 0 auto;
}
.coverflow-info-title[b-n1uvv2hyac] {
    font-size: 1.1rem; font-weight: 700; color: var(--on-surface);
    margin: 0 0 .3rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.coverflow-info-meta[b-n1uvv2hyac] {
    display: flex; gap: .6rem; align-items: center; justify-content: center;
    font-size: .78rem; color: var(--on-surface-muted); margin-bottom: .4rem;
}
.coverflow-info-meta .bi[b-n1uvv2hyac] { font-size: .7rem; }
.coverflow-info-overview[b-n1uvv2hyac] {
    font-size: .8rem; color: var(--on-surface-medium); line-height: 1.5;
    margin: 0 0 .6rem;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.coverflow-info-actions[b-n1uvv2hyac] {
    display: flex; gap: .5rem; justify-content: center;
}
.coverflow-btn[b-n1uvv2hyac] {
    display: inline-flex; align-items: center; gap: .3rem;
    padding: .4rem .85rem; border-radius: var(--radius-xs);
    font-size: .78rem; font-weight: 600; border: none; cursor: pointer;
    transition: background .12s, transform .08s;
}
.coverflow-btn:hover[b-n1uvv2hyac] { transform: scale(1.04); }
.coverflow-btn-play[b-n1uvv2hyac] {
    background: var(--interactive-accent); color: #fff;
}
.coverflow-btn-play:hover[b-n1uvv2hyac] { background: var(--interactive-accent-hover); }
.coverflow-btn-info[b-n1uvv2hyac] {
    background: rgba(255,255,255,.1); color: rgba(255,255,255,.8);
    border: 1px solid rgba(255,255,255,.12);
}
.coverflow-btn-info:hover[b-n1uvv2hyac] { background: rgba(255,255,255,.18); }

@media (max-width: 768px) {
    .coverflow-viewport[b-n1uvv2hyac] { height: 240px; }
    .coverflow-item[b-n1uvv2hyac] { width: 140px; }
    .coverflow-info-title[b-n1uvv2hyac] { font-size: .95rem; }
    .coverflow-arrow[b-n1uvv2hyac] { width: 2rem; height: 2rem; font-size: .9rem; }
}
/* /Components/Shared/LandscapeCard.razor.rz.scp.css */
.lsc-card[b-y9sddbdth3] {
    flex: 0 0 var(--lib-landscape-width);
    border-radius: var(--lib-card-radius);
    overflow: hidden;
    cursor: pointer;
    outline: none;
    background: var(--lib-card-bg);
    border: var(--lib-card-border);
    transition: transform var(--lib-transition-speed) var(--ease-standard),
                border-color var(--lib-transition-speed) var(--ease-standard),
                box-shadow var(--lib-transition-speed) var(--ease-standard);
    scroll-snap-align: start;
    position: relative;
}

.lsc-card:hover[b-y9sddbdth3],
.lsc-card:focus[b-y9sddbdth3],
.lsc-focused[b-y9sddbdth3] {
    transform: scale(var(--lib-focus-scale));
    border: var(--lib-focus-ring-width) solid var(--lib-focus-ring-color);
    box-shadow: var(--lib-focus-shadow);
    z-index: 5;
}

.lsc-backdrop[b-y9sddbdth3] {
    position: relative;
    width: 100%;
    aspect-ratio: var(--lib-landscape-ratio);
    overflow: hidden;
    background: var(--surface-base-alt);
}

.lsc-backdrop img[b-y9sddbdth3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.lsc-poster-fill[b-y9sddbdth3] {
    filter: blur(8px) brightness(0.5);
    transform: scale(1.15);
}

.lsc-gradient[b-y9sddbdth3] {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, transparent 50%);
    pointer-events: none;
}

.lsc-play[b-y9sddbdth3] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    border: 2px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s var(--ease-standard),
                background 0.15s var(--ease-standard);
    z-index: 2;
}

.lsc-card:hover .lsc-play[b-y9sddbdth3],
.lsc-card:focus .lsc-play[b-y9sddbdth3],
.lsc-focused .lsc-play[b-y9sddbdth3] {
    opacity: 1;
}

.lsc-play:hover[b-y9sddbdth3] {
    background: var(--interactive-accent);
    border-color: var(--interactive-accent);
}

.lsc-info[b-y9sddbdth3] {
    padding: 0.5rem 0.65rem;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.lsc-title[b-y9sddbdth3] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--on-surface);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lsc-subtitle[b-y9sddbdth3] {
    font-size: 0.7rem;
    color: var(--on-surface-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lsc-meta[b-y9sddbdth3] {
    display: flex;
    gap: .4rem;
    align-items: center;
}

.lsc-year[b-y9sddbdth3] {
    font-size: 0.65rem;
    color: var(--on-surface-faint);
}

.lsc-res-badge[b-y9sddbdth3] {
    font-size: .58rem;
    background: rgba(var(--interactive-accent-rgb), .15);
    color: var(--interactive-accent);
    padding: .06rem .25rem;
    border-radius: .15rem;
}

.lsc-cast[b-y9sddbdth3] {
    font-size: .6rem;
    color: var(--on-surface-faint);
    display: flex;
    align-items: center;
    gap: .2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lsc-cast .bi[b-y9sddbdth3] {
    font-size: .55rem;
    opacity: .6;
}

.lsc-progress[b-y9sddbdth3] {
    height: var(--lib-progress-height);
    background: var(--lib-progress-bg);
    width: 100%;
}

.lsc-progress-bar[b-y9sddbdth3] {
    height: 100%;
    background: var(--lib-progress-fill);
    border-radius: 0 var(--lib-progress-height) var(--lib-progress-height) 0;
    transition: width 0.3s var(--ease-decelerate);
}

@media (max-width: 768px) {
    .lsc-card[b-y9sddbdth3] {
        flex: 0 0 220px;
    }

    .lsc-info[b-y9sddbdth3] {
        padding: 0.4rem 0.5rem;
    }

    .lsc-title[b-y9sddbdth3] {
        font-size: 0.75rem;
    }
}

@media (min-width: 1601px) {
    .lsc-title[b-y9sddbdth3] {
        font-size: 0.9rem;
    }

    .lsc-subtitle[b-y9sddbdth3] {
        font-size: 0.78rem;
    }

    .lsc-play[b-y9sddbdth3] {
        width: 56px;
        height: 56px;
        font-size: 1.8rem;
    }
}
/* /Components/Shared/LibraryBillboard.razor.rz.scp.css */
.billboard[b-23xqz474u3] {
    position: relative;
    width: 100%;
    height: clamp(240px, 30vh, 400px);
    overflow: hidden;
    border-radius: var(--radius-md);
    margin-bottom: 1.5rem;
    background: var(--surface-base-alt);
}

.billboard:not(.billboard-active)[b-23xqz474u3] {
    display: none;
}

.billboard-slide[b-23xqz474u3] {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity var(--lib-billboard-transition) var(--ease-decelerate);
    pointer-events: none;
    z-index: 0;
}

.billboard-slide.active[b-23xqz474u3] {
    opacity: 1;
    pointer-events: auto;
    z-index: 2;
}

.billboard-slide.prev[b-23xqz474u3] {
    opacity: 0;
    z-index: 1;
}

.billboard-backdrop-img[b-23xqz474u3] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%;
}

.billboard-backdrop-blur[b-23xqz474u3] {
    filter: blur(40px) brightness(0.35);
    transform: scale(1.2);
}

.billboard-gradient[b-23xqz474u3] {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(to right, var(--lib-gradient-from) 0%, rgba(10, 15, 30, 0.7) 35%, var(--lib-gradient-to) 100%),
        linear-gradient(to top, var(--lib-gradient-from) 0%, transparent 40%);
    z-index: 1;
}

.billboard-content[b-23xqz474u3] {
    position: relative;
    z-index: 2;
    display: flex;
    gap: 1.5rem;
    padding: 1rem 2rem;
    align-items: center;
    height: 100%;
    box-sizing: border-box;
}

.billboard-poster[b-23xqz474u3] {
    flex-shrink: 0;
    border-radius: var(--lib-card-radius);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.6);
    object-fit: contain;
    height: 100%;
    width: auto;
    max-width: 140px;
}

.billboard-info[b-23xqz474u3] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-bottom: 0.5rem;
    overflow: hidden;
}

.billboard-title[b-23xqz474u3] {
    font-size: 1.8rem;
    font-weight: 800;
    color: #fff;
    margin: 0;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
    line-height: 1.1;
    max-width: 650px;
}

.billboard-meta[b-23xqz474u3] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    font-size: 0.88rem;
    color: rgba(255, 255, 255, 0.75);
    flex-wrap: wrap;
}

.billboard-badge[b-23xqz474u3] {
    background: rgba(255, 255, 255, 0.15);
    padding: 0.1rem 0.5rem;
    border-radius: var(--radius-xs);
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.billboard-rating[b-23xqz474u3] {
    color: #ffd700;
    font-weight: 600;
}

.billboard-rating[b-23xqz474u3]::before {
    content: "\2605 ";
}

.billboard-overview[b-23xqz474u3] {
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.55;
    margin: 0;
    max-width: 550px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.billboard-actions[b-23xqz474u3] {
    display: flex;
    gap: 0.65rem;
    margin-top: 0.5rem;
}

.billboard-btn[b-23xqz474u3] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 1.4rem;
    border-radius: var(--radius-xs);
    font-size: 0.92rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: background 0.15s var(--ease-standard),
                transform 0.1s var(--ease-standard);
}

.billboard-btn:hover[b-23xqz474u3] {
    transform: scale(1.03);
}

.billboard-btn-primary[b-23xqz474u3] {
    background: var(--interactive-accent);
    color: #fff;
}

.billboard-btn-primary:hover[b-23xqz474u3] {
    background: var(--interactive-accent-hover);
}

.billboard-btn-secondary[b-23xqz474u3] {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.billboard-btn-secondary:hover[b-23xqz474u3] {
    background: rgba(255, 255, 255, 0.22);
}

/* Navigation dots */

.billboard-nav[b-23xqz474u3] {
    position: absolute;
    bottom: 1.2rem;
    right: 2rem;
    z-index: 10;
}

.billboard-dots[b-23xqz474u3] {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}

.billboard-dot[b-23xqz474u3] {
    width: 32px;
    height: 3px;
    border: none;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.3);
    cursor: pointer;
    padding: 0;
    position: relative;
    overflow: hidden;
    transition: background 0.2s var(--ease-standard);
}

.billboard-dot:hover[b-23xqz474u3] {
    background: rgba(255, 255, 255, 0.5);
}

.billboard-dot.active[b-23xqz474u3] {
    background: rgba(255, 255, 255, 0.25);
}

.billboard-dot-progress[b-23xqz474u3] {
    position: absolute;
    inset: 0;
    background: var(--interactive-accent);
    border-radius: 2px;
    animation: billboard-timer-b-23xqz474u3 8s linear forwards;
}

@keyframes billboard-timer-b-23xqz474u3 {
    from { width: 0; }
    to { width: 100%; }
}

/* Responsive */

@media (max-width: 768px) {
    .billboard[b-23xqz474u3] {
        height: clamp(220px, 40vh, 400px);
    }

    .billboard-content[b-23xqz474u3] {
        flex-direction: column;
        align-items: flex-start;
        padding: 1.2rem 1rem;
        height: 100%;
    }

    .billboard-poster[b-23xqz474u3] {
        width: 100px;
    }

    .billboard-title[b-23xqz474u3] {
        font-size: 1.6rem;
    }

    .billboard-overview[b-23xqz474u3] {
        -webkit-line-clamp: 2;
        font-size: 0.82rem;
    }

    .billboard-btn[b-23xqz474u3] {
        padding: 0.5rem 1rem;
        font-size: 0.82rem;
    }

    .billboard-nav[b-23xqz474u3] {
        right: 1rem;
        bottom: 0.8rem;
    }
}

@media (min-width: 769px) and (max-width: 1200px) {
    .billboard-title[b-23xqz474u3] {
        font-size: 2rem;
    }

    .billboard-poster[b-23xqz474u3] {
        width: 140px;
    }
}

@media (min-width: 1601px) {
    .billboard-title[b-23xqz474u3] {
        font-size: 3rem;
    }

    .billboard-poster[b-23xqz474u3] {
        width: 200px;
    }

    .billboard-overview[b-23xqz474u3] {
        font-size: 1rem;
        max-width: 650px;
    }

    .billboard-btn[b-23xqz474u3] {
        padding: 0.75rem 1.8rem;
        font-size: 1rem;
    }
}
/* /Components/Shared/LibraryHero.razor.rz.scp.css */
.hero[b-alsyibjxw1] {
    position: relative;
    width: 100%;
    min-height: clamp(200px, 25vh, 320px);
    overflow: hidden;
    border-radius: var(--radius-md);
    margin-bottom: 1.5rem;
    opacity: 0;
    max-height: 0;
    transition: opacity 0.35s ease, max-height 0.4s ease, margin 0.3s ease;
}

.hero-visible[b-alsyibjxw1] {
    opacity: 1;
    max-height: clamp(200px, 25vh, 320px);
}

.hero-backdrop[b-alsyibjxw1] {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero-backdrop-img[b-alsyibjxw1] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%;
}

.hero-backdrop-blur[b-alsyibjxw1] {
    filter: blur(30px) brightness(0.4);
    transform: scale(1.15);
}

.hero-gradient[b-alsyibjxw1] {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to right,
        rgba(10, 15, 30, 0.95) 0%,
        rgba(10, 15, 30, 0.8) 40%,
        rgba(10, 15, 30, 0.4) 100%
    );
}

.hero-content[b-alsyibjxw1] {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 1.5rem;
    padding: 2rem 2.5rem;
    align-items: flex-start;
    min-height: clamp(200px, 25vh, 320px);
}

.hero-poster[b-alsyibjxw1] {
    width: 180px;
    flex-shrink: 0;
    border-radius: var(--radius-sm);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    object-fit: cover;
}

.hero-info[b-alsyibjxw1] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.5rem 0;
}

.hero-title[b-alsyibjxw1] {
    font-size: 2rem;
    font-weight: 800;
    color: #fff;
    margin: 0 0 0.6rem;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    line-height: 1.15;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
}

.hero-meta[b-alsyibjxw1] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.75);
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.hero-badge[b-alsyibjxw1] {
    background: rgba(255, 255, 255, 0.15);
    padding: 0.1rem 0.5rem;
    border-radius: var(--radius-xs);
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.hero-rating[b-alsyibjxw1] {
    color: #ffd700;
    font-weight: 600;
}

.hero-rating[b-alsyibjxw1]::before {
    content: "\2605 ";
}

.hero-overview[b-alsyibjxw1] {
    font-size: 0.88rem;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.55;
    margin: 0 0 1rem;
    max-width: 600px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.hero-actions[b-alsyibjxw1] {
    display: flex;
    gap: 0.6rem;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.hero-actions[b-alsyibjxw1]  .hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 1.1rem;
    border-radius: var(--radius-xs);
    font-size: 0.88rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: background 0.15s, transform 0.1s;
}

.hero-actions[b-alsyibjxw1]  .hero-btn-primary {
    background: var(--interactive-accent);
    color: var(--md-text-primary);
}

.hero-actions[b-alsyibjxw1]  .hero-btn-primary:hover {
    background: var(--interactive-accent-hover);
    transform: scale(1.03);
}

.hero-actions[b-alsyibjxw1]  .hero-btn-secondary {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.hero-actions[b-alsyibjxw1]  .hero-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.2);
}

.hero-stats[b-alsyibjxw1] {
    display: flex;
    gap: 1rem;
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.45);
}

.hero-close[b-alsyibjxw1] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: rgba(0, 0, 0, 0.5);
    border: none;
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.1rem;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, color 0.15s;
    z-index: 2;
}

.hero-close:hover[b-alsyibjxw1] {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

@media (max-width: 768px) {
    .hero-content[b-alsyibjxw1] {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 1.5rem 1rem;
    }

    .hero-poster[b-alsyibjxw1] {
        width: 140px;
    }

    .hero-title[b-alsyibjxw1] {
        font-size: 1.5rem;
    }

    .hero-meta[b-alsyibjxw1],
    .hero-actions[b-alsyibjxw1],
    .hero-stats[b-alsyibjxw1] {
        justify-content: center;
    }
}

.hero-show-name[b-alsyibjxw1] { font-size: .8rem; color: var(--interactive-accent); margin-bottom: .2rem; font-weight: 500; letter-spacing: .03em; }

.hero-cast[b-alsyibjxw1] { display: flex; flex-wrap: wrap; gap: .3rem .6rem; margin: .5rem 0; }
.hero-cast-link[b-alsyibjxw1] { font-size: .78rem; color: var(--interactive-accent); text-decoration: none; transition: color .15s; }
.hero-cast-link:hover[b-alsyibjxw1] { color: var(--interactive-accent-hover); text-decoration: underline; }

.hero-keywords[b-alsyibjxw1] { display: flex; flex-wrap: wrap; gap: .3rem; margin: .4rem 0; }
.hero-keyword[b-alsyibjxw1] { font-size: .65rem; padding: .1rem .4rem; border-radius: 10px; background: rgba(var(--interactive-accent-rgb),.1); color: var(--interactive-accent); border: 1px solid rgba(var(--interactive-accent-rgb),.2); }
/* /Components/Shared/LibraryHeroBillboardStrip.razor.rz.scp.css */
/* Mirrors LibraryBillboard.razor.css for identical home hero chrome (scoped). */
.billboard[b-12il64ma9t] {
    position: relative;
    width: 100%;
    height: clamp(240px, 30vh, 400px);
    overflow: hidden;
    border-radius: var(--radius-md);
    margin-bottom: 1.5rem;
    background: var(--surface-base-alt);
}

.billboard-single .billboard-slide.active[b-12il64ma9t] {
    transition: none;
}

.bb-strip-close[b-12il64ma9t] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 20;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.5);
    color: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.bb-strip-close:hover[b-12il64ma9t] {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

.billboard-slide[b-12il64ma9t] {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity var(--lib-billboard-transition) var(--ease-decelerate);
    pointer-events: none;
    z-index: 0;
}

.billboard-slide.active[b-12il64ma9t] {
    opacity: 1;
    pointer-events: auto;
    z-index: 2;
}

.billboard-backdrop-img[b-12il64ma9t] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%;
}

.billboard-backdrop-blur[b-12il64ma9t] {
    filter: blur(40px) brightness(0.35);
    transform: scale(1.2);
}

.billboard-gradient[b-12il64ma9t] {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(to right, var(--lib-gradient-from) 0%, rgba(10, 15, 30, 0.7) 35%, var(--lib-gradient-to) 100%),
        linear-gradient(to top, var(--lib-gradient-from) 0%, transparent 40%);
    z-index: 1;
}

.billboard-content[b-12il64ma9t] {
    position: relative;
    z-index: 2;
    display: flex;
    gap: 1.5rem;
    padding: 1rem 2rem;
    align-items: center;
    height: 100%;
    box-sizing: border-box;
}

.billboard-poster[b-12il64ma9t] {
    flex-shrink: 0;
    border-radius: var(--lib-card-radius);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.6);
    object-fit: contain;
    height: 100%;
    width: auto;
    max-width: 140px;
}

.billboard-info[b-12il64ma9t] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-bottom: 0.5rem;
    overflow: hidden;
}

.billboard-title[b-12il64ma9t] {
    font-size: 1.8rem;
    font-weight: 800;
    color: #fff;
    margin: 0;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
    line-height: 1.1;
    max-width: 650px;
}

.billboard-meta[b-12il64ma9t] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    font-size: 0.88rem;
    color: rgba(255, 255, 255, 0.75);
    flex-wrap: wrap;
}

.billboard-badge[b-12il64ma9t] {
    background: rgba(255, 255, 255, 0.15);
    padding: 0.1rem 0.5rem;
    border-radius: var(--radius-xs);
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.billboard-rating[b-12il64ma9t] {
    color: #ffd700;
    font-weight: 600;
}

.billboard-rating[b-12il64ma9t]::before {
    content: "\2605 ";
}

.billboard-overview[b-12il64ma9t] {
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.55;
    margin: 0;
    max-width: 550px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.billboard-actions[b-12il64ma9t] {
    display: flex;
    gap: 0.65rem;
    margin-top: 0.5rem;
    flex-wrap: wrap;
}

.billboard-btn[b-12il64ma9t] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 1.4rem;
    border-radius: var(--radius-xs);
    font-size: 0.92rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: background 0.15s var(--ease-standard),
                transform 0.1s var(--ease-standard);
}

.billboard-btn:hover[b-12il64ma9t] {
    transform: scale(1.03);
}

.billboard-btn-primary[b-12il64ma9t] {
    background: var(--interactive-accent);
    color: #fff;
}

.billboard-btn-primary:hover[b-12il64ma9t] {
    background: var(--interactive-accent-hover);
}

.billboard-btn-secondary[b-12il64ma9t] {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.billboard-btn-secondary:hover[b-12il64ma9t] {
    background: rgba(255, 255, 255, 0.22);
}

@media (max-width: 768px) {
    .billboard[b-12il64ma9t] {
        height: clamp(220px, 40vh, 400px);
    }

    .billboard-content[b-12il64ma9t] {
        flex-direction: column;
        align-items: flex-start;
        padding: 1.2rem 1rem;
        height: 100%;
    }

    .billboard-poster[b-12il64ma9t] {
        width: 100px;
    }

    .billboard-title[b-12il64ma9t] {
        font-size: 1.6rem;
    }

    .billboard-overview[b-12il64ma9t] {
        -webkit-line-clamp: 2;
        font-size: 0.82rem;
    }

    .billboard-btn[b-12il64ma9t] {
        padding: 0.5rem 1rem;
        font-size: 0.82rem;
    }
}

@media (min-width: 769px) and (max-width: 1200px) {
    .billboard-title[b-12il64ma9t] {
        font-size: 2rem;
    }

    .billboard-poster[b-12il64ma9t] {
        width: 140px;
    }
}

@media (min-width: 1601px) {
    .billboard-title[b-12il64ma9t] {
        font-size: 3rem;
    }

    .billboard-poster[b-12il64ma9t] {
        width: 200px;
    }

    .billboard-overview[b-12il64ma9t] {
        font-size: 1rem;
        max-width: 650px;
    }

    .billboard-btn[b-12il64ma9t] {
        padding: 0.75rem 1.8rem;
        font-size: 1rem;
    }
}
/* /Components/Shared/MediaCard.razor.rz.scp.css */
.mc-card[b-ab7ealails] { overflow: hidden; cursor: pointer; transition: transform var(--duration-short) var(--ease-standard), border-color var(--duration-short); }

/* ── Compact (grid poster card) ── */
.mc-compact[b-ab7ealails] { }
.mc-compact:hover[b-ab7ealails] { transform: translateY(-2px); border-color: var(--border-strong); }

.mc-poster[b-ab7ealails] { position: relative; width: 100%; aspect-ratio: 2/3; background: var(--surface-card); overflow: hidden; }
.mc-poster img[b-ab7ealails] { width: 100%; height: 100%; object-fit: cover; }
.mc-type-badge[b-ab7ealails] { position: absolute; top: .3rem; left: .3rem; font-size: .55rem; font-weight: 700; text-transform: uppercase; padding: .1rem .3rem; border-radius: .2rem; background: rgba(0,0,0,.7); }
.mc-type-badge.movie[b-ab7ealails] { color: var(--badge-movie); }
.mc-type-badge.show[b-ab7ealails] { color: var(--badge-show); }
.mc-type-badge.episode[b-ab7ealails] { color: var(--badge-episode); }
.mc-type-badge.season[b-ab7ealails] { color: var(--badge-season); }
.mc-res-badge[b-ab7ealails] { position: absolute; bottom: .3rem; right: .3rem; font-size: .55rem; padding: .1rem .3rem; border-radius: .2rem; background: rgba(var(--interactive-accent-rgb),.2); color: var(--interactive-accent); }
.mc-source-badges[b-ab7ealails] { position: absolute; bottom: .3rem; left: .3rem; display: flex; gap: 2px; }
.mc-src-badge[b-ab7ealails] { font-size: .5rem; font-weight: 700; padding: .05rem .22rem; border-radius: .15rem; line-height: 1; }
.mc-src-next[b-ab7ealails] { background: rgba(16,185,129,.25); color: #10b981; }
.mc-src-plex[b-ab7ealails] { background: rgba(229,160,13,.25); color: #e5a00d; }

.mc-hover-overlay[b-ab7ealails] { position: absolute; inset: 0; background: rgba(0,0,0,.55); display: flex; align-items: center; justify-content: center; gap: .4rem; opacity: 0; transition: opacity var(--duration-short); }
.mc-compact:hover .mc-hover-overlay[b-ab7ealails] { opacity: 1; }
.mc-hover-btn[b-ab7ealails] { background: rgba(var(--interactive-primary-rgb),.2); border: 1px solid rgba(var(--interactive-primary-rgb),.35); color: var(--on-surface); border-radius: 50%; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; cursor: pointer; transition: background var(--duration-short); }
.mc-hover-btn:hover[b-ab7ealails] { background: rgba(var(--interactive-primary-rgb),.4); }
.mc-hover-btn.mc-play-btn:hover[b-ab7ealails] { background: rgba(var(--status-success-rgb),.4); }
.mc-hover-btn.mc-cast-btn:hover[b-ab7ealails] { background: rgba(var(--interactive-accent-rgb),.4); }

.mc-info[b-ab7ealails] { padding: .4rem .5rem; display: flex; flex-direction: column; gap: .15rem; }
.mc-title[b-ab7ealails] { font-size: .78rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mc-year[b-ab7ealails] { font-size: .65rem; color: var(--on-surface-faint); }
.mc-subtitle[b-ab7ealails] { font-size: .65rem; color: var(--on-surface-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mc-desc[b-ab7ealails] { font-size: .6rem; color: var(--on-surface-faint); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mc-se-badge[b-ab7ealails] { font-size: .6rem; background: var(--surface-card); padding: .08rem .3rem; border-radius: .2rem; margin-right: .3rem; font-weight: 600; }
.mc-year-inline[b-ab7ealails] { font-size: .6rem; color: var(--on-surface-faint); }
.mc-extra[b-ab7ealails] { font-size: .6rem; color: var(--on-surface-faint); }
.mc-cast-summary[b-ab7ealails] {
    font-size: .6rem; color: var(--on-surface-faint);
    display: flex; align-items: center; gap: .2rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mc-cast-summary .bi[b-ab7ealails] { font-size: .55rem; opacity: .7; }
.mc-rating[b-ab7ealails] {
    font-size: .6rem; color: var(--on-surface-muted);
    display: flex; align-items: center; gap: .2rem;
}
.mc-rating .bi[b-ab7ealails] { font-size: .5rem; }

/* ── Row mode ── */
.mc-row[b-ab7ealails] { padding: .6rem .8rem; }
.mc-row:hover[b-ab7ealails] { background: var(--surface-card-hover); border-color: var(--border-strong); }
.mc-row.expanded[b-ab7ealails] { border-color: rgba(var(--interactive-accent-rgb),.3); cursor: default; }

.mc-row-main[b-ab7ealails] { display: flex; align-items: center; gap: .8rem; }

.mc-poster-sm[b-ab7ealails] { width: 40px; height: 58px; border-radius: var(--radius-xs); overflow: hidden; flex-shrink: 0; background: var(--surface-card); display: flex; align-items: center; justify-content: center; color: var(--on-surface-faint); font-size: 1.3rem; position: relative; }
.mc-poster-sm img[b-ab7ealails] { width: 100%; height: 100%; object-fit: cover; }

.mc-row-info[b-ab7ealails] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.mc-row-top[b-ab7ealails] { display: flex; align-items: center; gap: .5rem; }
.mc-row-right[b-ab7ealails] { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.mc-row-actions[b-ab7ealails] { display: flex; align-items: center; gap: .3rem; flex-shrink: 0; }

.mc-action-btn[b-ab7ealails] { background: var(--surface-card); border: 1px solid var(--border-medium); color: var(--on-surface-medium); border-radius: var(--radius-xs); width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; font-size: .9rem; cursor: pointer; transition: background var(--duration-short), color var(--duration-short); }
.mc-action-btn:hover[b-ab7ealails] { background: var(--surface-card-hover); color: var(--on-surface); }
.mc-action-btn.mc-play-btn:hover[b-ab7ealails] { background: rgba(var(--status-success-rgb),.3); color: var(--status-success); }
.mc-action-btn.mc-cast-btn:hover[b-ab7ealails] { background: rgba(var(--interactive-accent-rgb),.3); color: var(--interactive-accent); }

.mc-row-detail[b-ab7ealails] { margin-top: .6rem; padding-top: .6rem; border-top: 1px solid var(--border-subtle); }

/* ── Mini mode ── */
.mc-mini[b-ab7ealails] { display: flex; gap: .5rem; padding: .35rem .5rem; align-items: center; min-width: 0; }
.mc-mini:hover[b-ab7ealails] { background: var(--surface-card-hover); border-color: var(--border-strong); }
.mc-mini-poster[b-ab7ealails] { width: 32px; height: 48px; border-radius: .2rem; overflow: hidden; flex-shrink: 0; background: var(--surface-card); position: relative; }
.mc-mini-poster img[b-ab7ealails] { width: 100%; height: 100%; object-fit: cover; }
.mc-mini-info[b-ab7ealails] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.mc-mini .mc-title[b-ab7ealails] { font-size: .7rem; }
.mc-mini .mc-subtitle[b-ab7ealails] { font-size: .58rem; }
.mc-mini .mc-extra[b-ab7ealails] { font-size: .55rem; }

/* ── Inline links ── */
.mc-links[b-ab7ealails] { display: flex; gap: .35rem; margin-top: .15rem; }
.mc-link[b-ab7ealails] { color: var(--on-surface-faint); font-size: .65rem; text-decoration: none; transition: color var(--duration-short); display: inline-flex; align-items: center; }
.mc-link:hover[b-ab7ealails] { color: var(--on-surface-medium); }

/* ── Cast popover ── */
.mc-cast-popover-overlay[b-ab7ealails] { position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 1000; display: flex; align-items: center; justify-content: center; }
.mc-cast-popover[b-ab7ealails] { padding: 1rem; min-width: 220px; max-width: 320px; display: flex; flex-direction: column; gap: .5rem; }
.mc-cast-title[b-ab7ealails] { font-size: .85rem; font-weight: 600; color: var(--on-surface); }
.mc-cast-loading[b-ab7ealails], .mc-cast-empty[b-ab7ealails] { font-size: .75rem; color: var(--on-surface-faint); }
.mc-cast-device[b-ab7ealails] { background: var(--surface-card); border: 1px solid var(--border-medium); color: var(--on-surface); border-radius: var(--radius-xs); padding: .4rem .6rem; font-size: .75rem; cursor: pointer; display: flex; align-items: center; gap: .4rem; transition: background var(--duration-short); text-align: left; }
.mc-cast-device:hover[b-ab7ealails] { background: var(--surface-card-hover); }
.mc-cast-device.cast[b-ab7ealails] { border-color: rgba(var(--interactive-accent-rgb),.3); }
.mc-cast-device.cast:hover[b-ab7ealails] { background: rgba(var(--interactive-accent-rgb),.15); }
.mc-cast-device:disabled[b-ab7ealails] { opacity: .5; cursor: default; }

/* ── Watched badge ── */
.mc-watched[b-ab7ealails] {
    position: absolute; bottom: 6px; right: 6px;
    color: var(--status-success); font-size: .9rem;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.6));
    z-index: 2;
}
.mc-watched-sm[b-ab7ealails] {
    bottom: 3px; right: 3px; font-size: .7rem;
}
/* /Components/Shared/MediaDetailModal.razor.rz.scp.css */
.mdm-overlay[b-q8iqwg9hvi] { position: fixed; inset: 0; z-index: 9000; background: var(--surface-overlay); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; padding: 1rem; }
.mdm-modal[b-q8iqwg9hvi] { background: var(--surface-modal); border: 1px solid var(--border-medium); border-radius: var(--radius-md); max-width: 520px; width: 100%; max-height: 85vh; overflow-y: auto; padding: 1.5rem; position: relative; box-shadow: var(--shadow-elevation-3); }
.mdm-close[b-q8iqwg9hvi] { position: absolute; top: .75rem; right: .75rem; background: var(--surface-card); border: none; color: var(--on-surface-medium); border-radius: 50%; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background var(--duration-short); z-index: 1; }
.mdm-close:hover[b-q8iqwg9hvi] { background: var(--surface-card-hover); color: var(--on-surface); }

.mdm-poster[b-q8iqwg9hvi] { width: 100%; max-height: 300px; object-fit: contain; border-radius: var(--radius-sm); margin-bottom: 1rem; background: var(--surface-card); }
.mdm-title[b-q8iqwg9hvi] { font-size: 1.3rem; font-weight: 700; margin: 0 0 .5rem; color: var(--on-surface); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; }
.mdm-show-title[b-q8iqwg9hvi] { font-size: .85rem; color: var(--on-surface-muted); margin-bottom: .5rem; }

.mdm-meta[b-q8iqwg9hvi] { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .75rem; }
.mdm-tag[b-q8iqwg9hvi] { font-size: .72rem; padding: .15rem .5rem; border-radius: var(--radius-xs); background: var(--surface-card); color: var(--on-surface-medium); }
.mdm-tag.type-movie[b-q8iqwg9hvi] { background: rgba(var(--md-primary-rgb),.2); color: var(--md-primary-light); }
.mdm-tag.type-episode[b-q8iqwg9hvi] { background: rgba(var(--interactive-accent-rgb),.2); color: var(--interactive-accent-hover); }
.mdm-tag.type-show[b-q8iqwg9hvi] { background: rgba(var(--status-info-rgb),.2); color: var(--status-info); }
.mdm-tag.res[b-q8iqwg9hvi] { background: rgba(var(--interactive-accent-rgb),.15); color: var(--interactive-accent); }

.mdm-overview[b-q8iqwg9hvi] { font-size: .82rem; color: var(--on-surface-muted); line-height: 1.5; margin: 0 0 1rem; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }

.mdm-trailers[b-q8iqwg9hvi] { margin-bottom: .75rem; }
.mdm-trailer-links[b-q8iqwg9hvi] { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .35rem; }
.mdm-trailer-link[b-q8iqwg9hvi] {
    display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .55rem; border-radius: var(--radius-xs);
    background: var(--surface-card); border: 1px solid var(--border-subtle); color: var(--interactive-accent);
    font-size: .72rem; font-weight: 600; text-decoration: none;
}
.mdm-trailer-link:hover[b-q8iqwg9hvi] { background: var(--surface-raised); }

.mdm-cast[b-q8iqwg9hvi] { margin-bottom: .75rem; }
.mdm-section-label[b-q8iqwg9hvi] { font-size: .65rem; text-transform: uppercase; letter-spacing: .06em; color: var(--on-surface-faint); display: block; margin-bottom: .4rem; }
.mdm-cast-list[b-q8iqwg9hvi] { display: flex; gap: .6rem; overflow-x: auto; padding-bottom: .25rem; }
.mdm-cast-item[b-q8iqwg9hvi] { display: flex; flex-direction: column; align-items: center; min-width: 56px; max-width: 64px; }
.mdm-cast-photo[b-q8iqwg9hvi] { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; background: var(--surface-card); }
.mdm-cast-placeholder[b-q8iqwg9hvi] { display: flex; align-items: center; justify-content: center; color: var(--on-surface-faint); font-size: 1.2rem; }
.mdm-cast-name[b-q8iqwg9hvi] { font-size: .62rem; color: var(--on-surface-medium); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; margin-top: .2rem; }
.mdm-cast-role[b-q8iqwg9hvi] { font-size: .55rem; color: var(--on-surface-faint); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; }

.mdm-keywords[b-q8iqwg9hvi] { display: flex; flex-wrap: wrap; gap: .3rem; margin-bottom: .75rem; }
.mdm-keyword[b-q8iqwg9hvi] { font-size: .65rem; padding: .1rem .45rem; border-radius: 10px; background: rgba(var(--interactive-accent-rgb),.1); color: var(--interactive-accent); border: 1px solid rgba(var(--interactive-accent-rgb),.2); }

.mdm-tag.rating[b-q8iqwg9hvi] { background: rgba(255,193,7,.15); color: #ffc107; }
.mdm-tag.collection[b-q8iqwg9hvi] { background: rgba(var(--md-primary-rgb),.15); color: var(--md-primary-light); }

.mdm-actions[b-q8iqwg9hvi] { border-top: 1px solid var(--border-medium); padding-top: .75rem; }
.mdm-actions-title[b-q8iqwg9hvi] { font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; color: var(--on-surface-faint); margin: 0 0 .5rem; }

.mdm-action-group[b-q8iqwg9hvi] { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .75rem; align-items: center; }
.mdm-group-label[b-q8iqwg9hvi] { font-size: .65rem; text-transform: uppercase; letter-spacing: .06em; color: var(--on-surface-faint); width: 100%; }

.mdm-btn[b-q8iqwg9hvi] { font-size: .78rem; padding: .35rem .75rem; border-radius: var(--radius-xs); border: 1px solid var(--border-strong); background: var(--surface-card); color: var(--on-surface-medium); cursor: pointer; display: inline-flex; align-items: center; gap: .35rem; transition: background var(--duration-short), border-color var(--duration-short); }
.mdm-btn:hover[b-q8iqwg9hvi] { background: var(--surface-card-hover); border-color: var(--border-strong); }
.mdm-btn:disabled[b-q8iqwg9hvi] { opacity: .5; cursor: not-allowed; }
.mdm-btn.primary[b-q8iqwg9hvi] { background: rgba(var(--interactive-accent-rgb),.2); border-color: rgba(var(--interactive-accent-rgb),.4); color: var(--interactive-accent-hover); }
.mdm-btn.primary:hover[b-q8iqwg9hvi] { background: rgba(var(--interactive-accent-rgb),.35); }
.mdm-btn.cast[b-q8iqwg9hvi] { background: rgba(var(--md-primary-rgb),.15); border-color: rgba(var(--md-primary-rgb),.3); color: var(--md-primary-light); }
.mdm-btn.cast:hover[b-q8iqwg9hvi] { background: rgba(var(--md-primary-rgb),.3); }
.mdm-btn.play[b-q8iqwg9hvi] { background: rgba(var(--status-success-rgb),.15); border-color: rgba(var(--status-success-rgb),.3); color: var(--status-success); }
.mdm-btn.play:hover[b-q8iqwg9hvi] { background: rgba(var(--status-success-rgb),.3); }
.mdm-btn.secondary[b-q8iqwg9hvi] { background: var(--surface-card); }

.mdm-link[b-q8iqwg9hvi] { font-size: .75rem; padding: .3rem .6rem; border-radius: var(--radius-xs); border: 1px solid var(--border-medium); color: var(--interactive-accent); text-decoration: none; display: inline-flex; align-items: center; gap: .3rem; transition: background var(--duration-short); }
.mdm-link:hover[b-q8iqwg9hvi] { background: rgba(var(--interactive-accent-rgb),.15); }

.mdm-note[b-q8iqwg9hvi] { font-size: .72rem; color: var(--on-surface-faint); font-style: italic; }
.mdm-result[b-q8iqwg9hvi] { font-size: .75rem; padding: .4rem .6rem; border-radius: var(--radius-xs); background: var(--surface-card); color: var(--on-surface-medium); margin-top: .25rem; }

.mdm-cast-link[b-q8iqwg9hvi] { cursor: pointer; text-decoration: none; color: var(--interactive-accent); transition: color .15s; }
.mdm-cast-link:hover[b-q8iqwg9hvi] { color: var(--interactive-accent-hover); text-decoration: underline; }
/* /Components/Shared/PlayerBar.razor.rz.scp.css */
.player-bar[b-j8i3yjveab] {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000;
    height: 80px; background: var(--surface-player); backdrop-filter: blur(20px);
    border-top: 1px solid var(--border-subtle);
    display: flex; align-items: center; gap: .75rem; padding: 0 1.25rem;
    box-shadow: 0 -4px 24px rgba(0, 0, 0, .5);
}
.player-bar-progress[b-j8i3yjveab] {
    position: absolute; top: 0; left: 0; right: 0; height: 3px;
    background: rgba(255,255,255,.08);
}
.player-bar-progress-fill[b-j8i3yjveab] {
    height: 100%; background: var(--interactive-accent, #03a9f4);
    border-radius: 0 0 0 0; transition: width .5s linear;
}
.player-bar-poster[b-j8i3yjveab] {
    width: 56px; height: 56px; border-radius: var(--radius-xs); object-fit: cover; flex-shrink: 0;
}
.player-bar-info[b-j8i3yjveab] {
    flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem;
}
.player-bar-title[b-j8i3yjveab] {
    font-size: .88rem; font-weight: 600; color: var(--on-surface);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.player-bar-subtitle[b-j8i3yjveab] {
    font-size: .72rem; color: var(--on-surface-faint);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.player-bar-controls[b-j8i3yjveab] { display: flex; gap: .5rem; flex-shrink: 0; }

.player-btn[b-j8i3yjveab] {
    background: var(--surface-card); border: none; color: var(--on-surface-medium);
    width: 40px; height: 40px; border-radius: 50%; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background var(--duration-short), color var(--duration-short);
    font-size: 1.1rem;
}
.player-btn:hover[b-j8i3yjveab] { background: var(--surface-elevated); color: var(--on-surface); }

.player-expanded[b-j8i3yjveab] {
    position: fixed; inset: 0; z-index: 2000;
    background: #000; display: flex; flex-direction: column;
}
.player-expanded-header[b-j8i3yjveab] {
    display: flex; align-items: center; justify-content: space-between;
    padding: .6rem 1rem; flex-shrink: 0; background: rgba(0,0,0,.8);
    position: absolute; top: 0; left: 0; right: 0; z-index: 1;
    opacity: 0; transition: opacity .3s;
}
.player-expanded:hover .player-expanded-header[b-j8i3yjveab] { opacity: 1; }
.player-expanded-info[b-j8i3yjveab] { font-size: .9rem; color: #fff; }
.player-expanded-video[b-j8i3yjveab] {
    flex: 1; display: flex; align-items: center; justify-content: center;
    flex-direction: column; position: relative; overflow-y: auto;
    background: #000; width: 100%; height: 100%;
}
.player-expanded-video video[b-j8i3yjveab] {
    width: 100%; height: 100%; object-fit: contain;
}

.cast-bar[b-j8i3yjveab] {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000;
    background: var(--surface-player); backdrop-filter: blur(20px);
    border-top: 1px solid var(--border-subtle);
    display: flex; flex-direction: column; padding: 0;
    box-shadow: 0 -2px 16px rgba(0,0,0,.4);
}
.cast-bar-row-top[b-j8i3yjveab] {
    display: flex; align-items: center; gap: .6rem;
    padding: .4rem 1rem;
    min-height: 48px;
}
.cast-bar-row-seek[b-j8i3yjveab] {
    display: flex; align-items: center; gap: .5rem;
    padding: 0 1rem .4rem;
}
.cast-bar-poster[b-j8i3yjveab] {
    width: 34px; height: 34px; border-radius: var(--radius-xs); object-fit: cover; flex-shrink: 0;
}
.cast-bar-poster-ph[b-j8i3yjveab] {
    background: var(--surface-card); display: flex; align-items: center; justify-content: center;
    font-size: .9rem; color: var(--on-surface-faint);
}
.cast-bar-info[b-j8i3yjveab] {
    flex: 1; min-width: 0;
    display: flex; flex-direction: column; gap: .05rem;
}
.cast-bar-title[b-j8i3yjveab] {
    font-size: .78rem; font-weight: 600; color: var(--on-surface);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cast-bar-target[b-j8i3yjveab] {
    font-size: .65rem; color: var(--interactive-accent);
    display: flex; align-items: center; gap: .25rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cast-bar-target .bi[b-j8i3yjveab] { font-size: .55rem; }
.cast-bar-time[b-j8i3yjveab] {
    font-size: .65rem; color: var(--on-surface-faint); flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}
.cast-bar-seek[b-j8i3yjveab] {
    flex: 1; min-width: 60px; height: 24px; cursor: pointer;
    display: flex; align-items: center;
}
.cast-bar-seek-track[b-j8i3yjveab] {
    width: 100%; height: 3px; background: var(--border-medium); border-radius: 2px;
    position: relative; overflow: visible;
}
.cast-bar-seek-fill[b-j8i3yjveab] {
    position: absolute; top: 0; left: 0; height: 100%;
    background: var(--interactive-accent); border-radius: 2px;
    transition: width .3s linear;
}
.cast-bar-seek-thumb[b-j8i3yjveab] {
    position: absolute; top: 50%; width: 10px; height: 10px;
    background: #fff; border-radius: 50%; transform: translate(-50%, -50%);
    box-shadow: 0 1px 3px rgba(0,0,0,.5); opacity: 0;
    transition: opacity .15s;
}
.cast-bar-seek:hover .cast-bar-seek-track[b-j8i3yjveab] { height: 5px; }
.cast-bar-seek:hover .cast-bar-seek-thumb[b-j8i3yjveab] { opacity: 1; }
.cast-bar-progress[b-j8i3yjveab] {
    position: absolute; top: 0; left: 0; right: 0; height: 3px;
    background: rgba(255,255,255,.06);
}
.cast-bar-progress-fill[b-j8i3yjveab] {
    height: 100%; background: var(--interactive-accent, #03a9f4);
    transition: width .5s linear;
}
.cast-bar-controls[b-j8i3yjveab] { display: flex; gap: .25rem; flex-shrink: 0; align-items: center; }
.cast-bar-controls .player-btn[b-j8i3yjveab] { width: 34px; height: 34px; font-size: .95rem; }
.cast-btn-sm[b-j8i3yjveab] { width: 28px !important; height: 28px !important; font-size: .75rem !important; }
.cast-bar-divider[b-j8i3yjveab] {
    width: 1px; height: 1.2rem; background: rgba(255,255,255,.12); margin: 0 .1rem; flex-shrink: 0;
}
.cast-volume-slider[b-j8i3yjveab] {
    -webkit-appearance: none; appearance: none;
    width: 70px; height: 4px; background: rgba(255,255,255,.15);
    border-radius: 2px; outline: none; cursor: pointer;
    margin: 0;
}
.cast-volume-slider[b-j8i3yjveab]::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none;
    width: 12px; height: 12px; background: var(--interactive-accent, #03a9f4);
    border-radius: 50%; cursor: pointer;
}
.cast-volume-slider[b-j8i3yjveab]::-moz-range-thumb {
    width: 12px; height: 12px; background: var(--interactive-accent, #03a9f4);
    border-radius: 50%; border: none; cursor: pointer;
}

@media (max-width: 640px) {
    .cast-bar-row-top[b-j8i3yjveab] { gap: .4rem; padding: .35rem .75rem; }
    .cast-bar-row-seek[b-j8i3yjveab] { padding: 0 .75rem .35rem; }
    .cast-bar-info[b-j8i3yjveab] { max-width: none; }
    .cast-btn-desktop[b-j8i3yjveab] { display: none !important; }
    .cast-bar-controls .player-btn[b-j8i3yjveab] { width: 32px; height: 32px; font-size: .9rem; }
    .cast-btn-sm[b-j8i3yjveab] { width: 26px !important; height: 26px !important; }
}
@media (min-width: 641px) {
    .cast-btn-desktop[b-j8i3yjveab] { display: inline-flex; }
}

/* ── Audio visual (music player artwork) ────────────────────── */
.audio-backdrop[b-j8i3yjveab] {
    position: absolute; inset: 0; z-index: 0; overflow: hidden;
}
.audio-backdrop img[b-j8i3yjveab] {
    width: 100%; height: 100%; object-fit: cover;
    filter: blur(60px) saturate(1.4) brightness(0.25);
    transform: scale(1.4);
}
.audio-visual[b-j8i3yjveab] {
    position: relative; z-index: 1;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 1.25rem; padding: 2rem; flex: 1;
}
.audio-cover[b-j8i3yjveab] {
    width: min(50vh, 340px); height: min(50vh, 340px); border-radius: var(--radius-md);
    object-fit: cover; box-shadow: 0 20px 60px rgba(0,0,0,.7);
}
.audio-cover-placeholder[b-j8i3yjveab] {
    background: var(--surface-elevated); display: flex; align-items: center; justify-content: center;
    font-size: 4rem; color: var(--on-surface-faint);
}
.audio-now-playing[b-j8i3yjveab] {
    text-align: center; max-width: 400px;
}
.audio-track-title[b-j8i3yjveab] {
    font-size: 1.25rem; font-weight: 700; color: var(--on-surface);
    margin: 0; text-shadow: 0 2px 8px rgba(0,0,0,.5);
}
.audio-track-artist[b-j8i3yjveab] {
    font-size: .88rem; color: var(--on-surface-medium); margin: .25rem 0 0;
    text-shadow: 0 1px 4px rgba(0,0,0,.4);
}
/* ── Audio seek bar ─────────────────────────────────────────── */
.audio-seek-bar[b-j8i3yjveab] {
    position: relative; z-index: 1;
    display: flex; align-items: center; gap: .5rem;
    width: 100%; max-width: 420px; padding: 0 .5rem;
}
.audio-seek-time[b-j8i3yjveab] {
    font-size: .72rem; color: var(--on-surface-muted);
    font-variant-numeric: tabular-nums; min-width: 3rem; text-align: center;
    text-shadow: 0 1px 4px rgba(0,0,0,.4);
}
.audio-seek-track[b-j8i3yjveab] {
    flex: 1; height: 5px; background: rgba(255,255,255,.15);
    border-radius: 3px; position: relative; cursor: pointer;
    transition: height .1s ease;
}
.audio-seek-track:hover[b-j8i3yjveab] { height: 8px; }
.audio-seek-fill[b-j8i3yjveab] {
    position: absolute; top: 0; left: 0; height: 100%;
    background: var(--interactive-accent, #03a9f4); border-radius: inherit;
    pointer-events: none;
}
.audio-seek-thumb[b-j8i3yjveab] {
    position: absolute; top: 50%; width: 14px; height: 14px;
    background: #fff; border-radius: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 1px 4px rgba(0,0,0,.5);
    opacity: 0; pointer-events: none;
    transition: opacity .15s;
}
.audio-seek-track:hover .audio-seek-thumb[b-j8i3yjveab] { opacity: 1; }

.audio-controls[b-j8i3yjveab] {
    display: flex; align-items: center; gap: .5rem;
}
.audio-controls .player-btn[b-j8i3yjveab] {
    width: 44px; height: 44px; font-size: 1.15rem;
    background: rgba(255,255,255,.08); border-radius: 50%;
}
.audio-controls .player-btn:hover[b-j8i3yjveab] {
    background: rgba(255,255,255,.15);
}
.audio-btn-play[b-j8i3yjveab] {
    width: 56px !important; height: 56px !important; font-size: 1.5rem !important;
    background: var(--interactive-accent, #03a9f4) !important;
    color: #fff !important;
}
.audio-btn-play:hover[b-j8i3yjveab] {
    background: var(--interactive-accent-hover, #0288d1) !important;
}
.audio-queue-info[b-j8i3yjveab] {
    font-size: .72rem; color: var(--on-surface-muted); margin: 0;
}
.audio-bar[b-j8i3yjveab] {
    position: absolute; top: .75rem; right: .75rem; z-index: 2;
    display: flex; gap: .35rem;
}
.audio-bar-btn[b-j8i3yjveab] {
    background: rgba(0,0,0,.4); border: none; color: rgba(255,255,255,.6);
    width: 32px; height: 32px; border-radius: 50%; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    font-size: .85rem; transition: background .15s, color .15s;
    backdrop-filter: blur(8px);
}
.audio-bar-btn:hover[b-j8i3yjveab] {
    background: rgba(0,0,0,.6); color: #fff;
}

/* ── Lyrics panel ───────────────────────────────────────────── */
.lyrics-panel[b-j8i3yjveab] {
    position: relative; z-index: 1;
    max-height: 40vh; width: 100%; max-width: 600px;
    overflow-y: auto; padding: 1rem 1.25rem;
    background: rgba(0,0,0,.45); backdrop-filter: blur(12px);
    border-radius: var(--radius-sm); margin: 0 auto;
    scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.15) transparent;
}
.lyrics-header[b-j8i3yjveab] {
    font-size: .78rem; font-weight: 600; color: var(--on-surface-muted);
    text-transform: uppercase; letter-spacing: .05em; margin-bottom: .75rem;
    display: flex; align-items: center; gap: .4rem;
}
.lyrics-source[b-j8i3yjveab] {
    margin-left: auto; font-size: .65rem; opacity: .5; text-transform: none;
}
.lyrics-body[b-j8i3yjveab] { line-height: 1.7; }
.lyrics-line[b-j8i3yjveab] {
    margin: 0; font-size: .92rem; color: var(--on-surface);
    transition: color var(--duration-short);
}
.lyrics-status[b-j8i3yjveab] {
    font-size: .85rem; color: var(--on-surface-muted); font-style: italic;
    text-align: center; padding: 1rem 0;
}

/* ── Cast target popover (fixed overlay) ───────────────────── */
.player-cast-overlay[b-j8i3yjveab] {
    position: fixed; inset: 0; z-index: 3000;
    background: rgba(0,0,0,.5);
    display: flex; align-items: center; justify-content: center;
    animation: castOverlayIn-b-j8i3yjveab .15s ease;
}
@keyframes castOverlayIn-b-j8i3yjveab {
    from { opacity: 0; }
    to { opacity: 1; }
}
.player-cast-popover[b-j8i3yjveab] {
    background: var(--surface-modal, #161b2e); backdrop-filter: blur(20px);
    border: 1px solid var(--border-medium, rgba(197,202,233,.12));
    border-radius: var(--radius-md, 12px);
    padding: .75rem; min-width: 280px; max-width: 360px; width: 90vw;
    max-height: 70vh; overflow-y: auto;
    box-shadow: 0 16px 48px rgba(0,0,0,.7);
    animation: castPopoverIn-b-j8i3yjveab .2s ease;
}
@keyframes castPopoverIn-b-j8i3yjveab {
    from { opacity: 0; transform: scale(.95) translateY(10px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}
.player-cast-title[b-j8i3yjveab] {
    font-size: .82rem; font-weight: 600; color: var(--on-surface-muted);
    text-transform: uppercase; letter-spacing: .04em;
    padding: .25rem .4rem .6rem; border-bottom: 1px solid var(--border-subtle, rgba(197,202,233,.06));
    margin-bottom: .35rem;
    display: flex; align-items: center; gap: .4rem;
}
.player-cast-title .bi[b-j8i3yjveab] { font-size: 1rem; color: var(--interactive-accent, #03a9f4); }
.player-cast-loading[b-j8i3yjveab] {
    font-size: .82rem; color: var(--on-surface-muted); padding: 1.5rem .5rem; text-align: center;
}
.player-cast-target[b-j8i3yjveab] {
    display: flex; align-items: center; gap: .6rem;
    width: 100%; padding: .6rem .7rem; border: none; border-radius: 8px;
    background: transparent; color: var(--on-surface, #ecedf0);
    font-size: .88rem; cursor: pointer;
    transition: background .15s;
}
.player-cast-target:hover[b-j8i3yjveab] {
    background: var(--surface-card-hover, rgba(63,81,181,.14));
}
.player-cast-target .bi[b-j8i3yjveab] { font-size: 1.1rem; color: var(--interactive-accent, #03a9f4); flex-shrink: 0; }
.player-cast-target-name[b-j8i3yjveab] { flex: 1; }
.player-cast-target-room[b-j8i3yjveab] { font-size: .72rem; color: var(--on-surface-muted); flex-shrink: 0; }

/* /Components/Shared/SectionInfoPanel.razor.rz.scp.css */
.sip[b-7vibhroe1g] {
    container-type: inline-size;
    overflow: hidden;
    transition: max-height .35s ease, opacity .25s ease;
}
.sip-open[b-7vibhroe1g] { max-height: 95vh; opacity: 1; }
.sip-closed[b-7vibhroe1g] { max-height: 0; opacity: 0; pointer-events: none; }

:global(.cl-panel) .sip-open[b-7vibhroe1g] {
    max-height: none;
    height: 100%;
}
:global(.cl-panel) .sip-inner[b-7vibhroe1g] {
    height: 100%;
    display: flex;
    flex-direction: column;
}
:global(.cl-panel) .sip-content[b-7vibhroe1g] {
    flex: 1;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.1) transparent;
}

.sip-inner[b-7vibhroe1g] {
    position: relative;
    border-radius: var(--radius-md, .5rem);
    overflow: hidden;
    background: var(--surface-container, #111827);
}

/* ── Backdrop ── */
.sip-backdrop[b-7vibhroe1g] {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.sip-backdrop img[b-7vibhroe1g] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%;
    opacity: .35;
}
.sip-backdrop-fade[b-7vibhroe1g] {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        rgba(var(--md-background-rgb, 10,15,30), .95) 0%,
        rgba(var(--md-background-rgb, 10,15,30), .6) 50%,
        transparent 100%);
}

/* ── Content: horizontal by default (hero slots) ── */
.sip-content[b-7vibhroe1g] {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 1.25rem;
    padding: 1.5rem;
    align-items: flex-start;
}

.sip-poster[b-7vibhroe1g] {
    width: 140px;
    flex-shrink: 0;
    border-radius: var(--radius-sm, .375rem);
    box-shadow: 0 4px 20px rgba(0,0,0,.5);
}

.sip-info[b-7vibhroe1g] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.sip-title[b-7vibhroe1g] {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--on-surface, #fff);
    margin: 0;
    line-height: 1.2;
}

.sip-meta[b-7vibhroe1g] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    font-size: .85rem;
    color: var(--on-surface-muted, #9ca3af);
}

.sip-badge[b-7vibhroe1g] {
    background: rgba(var(--interactive-primary-rgb, 99,102,241), .15);
    color: var(--interactive-primary, #818cf8);
    padding: .1rem .5rem;
    border-radius: .25rem;
    font-size: .75rem;
    font-weight: 600;
}

.sip-rating[b-7vibhroe1g] {
    color: var(--interactive-primary, #818cf8);
    font-weight: 700;
}

.sip-studio[b-7vibhroe1g] {
    font-size: .78rem;
    color: var(--on-surface-muted, #9ca3af);
    font-weight: 500;
}

.sip-genres[b-7vibhroe1g] {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.sip-genre-chip[b-7vibhroe1g] {
    font-size: .72rem;
    padding: .15rem .5rem;
    border-radius: 1rem;
    background: rgba(255,255,255,.07);
    color: rgba(255,255,255,.7);
    font-weight: 500;
}

.sip-overview[b-7vibhroe1g] {
    margin: 0;
    font-size: .84rem;
    color: var(--on-surface-secondary, #d1d5db);
    line-height: 1.55;
}

.sip-cast[b-7vibhroe1g] {
    font-size: .78rem;
    color: var(--on-surface-muted, #9ca3af);
    line-height: 1.45;
}

.sip-cast-label[b-7vibhroe1g] {
    font-weight: 600;
    color: rgba(255,255,255,.5);
    margin-right: .3rem;
}

.sip-actions[b-7vibhroe1g] {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: .15rem;
}

.sip-btn[b-7vibhroe1g] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .45rem .85rem;
    border: none;
    border-radius: var(--radius-sm, .375rem);
    cursor: pointer;
    font-size: .82rem;
    font-weight: 600;
    transition: background .15s, transform .08s;
}
.sip-btn:hover[b-7vibhroe1g] { transform: scale(1.03); }

.sip-btn-play[b-7vibhroe1g] {
    background: var(--interactive-primary, #818cf8);
    color: #fff;
}
.sip-btn-play:hover[b-7vibhroe1g] { background: var(--interactive-primary-hover, #6366f1); }

.sip-btn-secondary[b-7vibhroe1g] {
    background: rgba(255,255,255,.08);
    color: rgba(255,255,255,.85);
}
.sip-btn-secondary:hover[b-7vibhroe1g] { background: rgba(255,255,255,.15); }

.sip-btn-close[b-7vibhroe1g] {
    background: rgba(255,255,255,.08);
    color: var(--on-surface-muted, #9ca3af);
}
.sip-btn-close:hover[b-7vibhroe1g] { background: rgba(255,255,255,.15); }

/* ── Vertical layout via container query (narrow panels ~320px) ── */
@container (max-width: 400px) {
    .sip-content[b-7vibhroe1g] {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .sip-poster[b-7vibhroe1g] { width: 55%; max-width: 180px; }
    .sip-meta[b-7vibhroe1g] { justify-content: center; }
    .sip-genres[b-7vibhroe1g] { justify-content: center; }
    .sip-actions[b-7vibhroe1g] { justify-content: center; }
    .sip-backdrop-fade[b-7vibhroe1g] {
        background: linear-gradient(180deg,
            transparent 0%,
            rgba(var(--md-background-rgb, 10,15,30), .8) 60%,
            rgba(var(--md-background-rgb, 10,15,30), 1) 100%);
    }
}
/* /Components/Shared/ShowcaseRow.razor.rz.scp.css */
.showcase-section[b-pze1g4ptgo] {
    position: relative;
    margin-bottom: 1.5rem;
    /* Was overflow:visible — negative inset backdrop drew above the section when scrolling past the hero */
    overflow-x: clip;
    overflow-y: visible;
}
.showcase-title[b-pze1g4ptgo] {
    font-size: 1rem; font-weight: 700; color: var(--on-surface);
    display: flex; align-items: center; gap: .5rem;
    margin: 0 0 .75rem; padding: 0 .5rem;
}
.showcase-title .bi[b-pze1g4ptgo] { font-size: .85rem; opacity: .7; }

.showcase-backdrop[b-pze1g4ptgo] {
    position: absolute; inset: -2rem -3rem; z-index: 0;
    overflow: hidden; border-radius: var(--radius-sm);
    transition: opacity .4s ease;
    pointer-events: none;
}
.showcase-backdrop-img[b-pze1g4ptgo] {
    width: 100%; height: 100%; object-fit: cover;
    opacity: .12; filter: blur(30px) saturate(1.3);
}
.showcase-backdrop-fade[b-pze1g4ptgo] {
    position: absolute; inset: 0;
    background: linear-gradient(to right,
        var(--surface-base, #0f0f14) 0%,
        transparent 30%, transparent 70%,
        var(--surface-base, #0f0f14) 100%);
}

.showcase-strip[b-pze1g4ptgo] {
    position: relative; z-index: 1;
    display: flex; gap: .6rem; overflow-x: auto;
    padding: .5rem .5rem 1rem; scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
}
.showcase-strip[b-pze1g4ptgo]::-webkit-scrollbar { height: 3px; }
.showcase-strip[b-pze1g4ptgo]::-webkit-scrollbar-thumb { background: var(--border-medium); border-radius: 2px; }

.showcase-card[b-pze1g4ptgo] {
    flex: 0 0 268px; border-radius: var(--radius-sm);
    overflow: hidden; cursor: pointer; position: relative;
    transition: flex .35s cubic-bezier(.4,0,.2,1), transform .25s, box-shadow .25s;
    scroll-snap-align: start;
}
.showcase-card:hover:not(.showcase-card-active)[b-pze1g4ptgo] {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,.4);
}
.showcase-card-active[b-pze1g4ptgo] {
    flex: 0 0 380px;
    box-shadow: 0 8px 32px rgba(0,0,0,.5);
    z-index: 2;
}

.showcase-card-img[b-pze1g4ptgo] {
    position: relative; aspect-ratio: 16/9; overflow: hidden;
}
.showcase-card-img img[b-pze1g4ptgo] {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .3s;
}
.showcase-card:hover .showcase-card-img img[b-pze1g4ptgo] { transform: scale(1.05); }
.showcase-card-gradient[b-pze1g4ptgo] {
    position: absolute; bottom: 0; left: 0; right: 0; height: 60%;
    background: linear-gradient(transparent, rgba(0,0,0,.8));
}
.showcase-card-placeholder[b-pze1g4ptgo] {
    width: 100%; height: 100%; background: var(--surface-raised);
    display: flex; align-items: center; justify-content: center;
    font-size: 2rem; color: var(--on-surface-faint);
}

.showcase-card-label[b-pze1g4ptgo] {
    position: absolute; bottom: 0; left: 0; right: 0; padding: .5rem .65rem;
    font-size: .78rem; font-weight: 600; color: #fff;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    text-shadow: 0 1px 4px rgba(0,0,0,.6);
}

.showcase-expand[b-pze1g4ptgo] {
    padding: .6rem .75rem .75rem;
    background: var(--surface-card);
    border-top: 1px solid var(--border-subtle);
}
.showcase-expand-title[b-pze1g4ptgo] {
    font-size: .9rem; font-weight: 700; color: var(--on-surface);
    margin: 0 0 .3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.showcase-expand-meta[b-pze1g4ptgo] {
    display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
    font-size: .72rem; color: var(--on-surface-muted); margin-bottom: .3rem;
}
.showcase-expand-meta .bi[b-pze1g4ptgo] { font-size: .65rem; color: #f5c518; }
.showcase-res-badge[b-pze1g4ptgo] {
    font-size: .65rem; background: rgba(var(--interactive-accent-rgb),.18);
    color: var(--interactive-accent); padding: .08rem .3rem; border-radius: .15rem;
}
.showcase-expand-cast[b-pze1g4ptgo] {
    font-size: .68rem; color: var(--on-surface-faint); margin-bottom: .4rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.showcase-expand-actions[b-pze1g4ptgo] {
    display: flex; gap: .4rem;
}
.showcase-btn[b-pze1g4ptgo] {
    display: inline-flex; align-items: center; gap: .25rem;
    padding: .3rem .65rem; border-radius: var(--radius-xs);
    font-size: .72rem; font-weight: 600; border: none; cursor: pointer;
    transition: background .12s, transform .08s;
}
.showcase-btn:hover[b-pze1g4ptgo] { transform: scale(1.04); }
.showcase-btn-play[b-pze1g4ptgo] {
    background: var(--interactive-accent); color: #fff;
}
.showcase-btn-play:hover[b-pze1g4ptgo] { background: var(--interactive-accent-hover); }
.showcase-btn-info[b-pze1g4ptgo] {
    background: rgba(255,255,255,.1); color: rgba(255,255,255,.8);
    border: 1px solid rgba(255,255,255,.12);
}
.showcase-btn-info:hover[b-pze1g4ptgo] { background: rgba(255,255,255,.18); }

@media (max-width: 768px) {
    .showcase-card[b-pze1g4ptgo] { flex: 0 0 175px; }
    .showcase-card-active[b-pze1g4ptgo] { flex: 0 0 280px; }
    .showcase-expand-title[b-pze1g4ptgo] { font-size: .8rem; }
    .showcase-expand-meta[b-pze1g4ptgo] { font-size: .65rem; }
}
/* /Components/Shared/SpotlightPanel.razor.rz.scp.css */
.spotlight-section[b-r7xea2x0ya] {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
}

/* ── Hero area (top 55-60% of viewport) ── */
.spotlight-hero[b-r7xea2x0ya] {
    position: relative;
    min-height: 50vh;
    max-height: 60vh;
    overflow: hidden;
    border-radius: var(--radius-md, .5rem);
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .4s ease, transform .4s ease;
}
.spotlight-hero-visible[b-r7xea2x0ya] {
    opacity: 1;
    transform: translateY(0);
}

.spotlight-hero-bg[b-r7xea2x0ya] {
    position: absolute;
    inset: 0;
    z-index: 0;
    transition: opacity .5s ease;
}
.spotlight-hero-bg-img[b-r7xea2x0ya] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 20%;
    opacity: .45;
    filter: saturate(1.2);
}
.spotlight-hero-fade[b-r7xea2x0ya] {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, transparent 0%, rgba(var(--md-background-rgb, 10,15,30), .4) 40%, rgba(var(--md-background-rgb, 10,15,30), .95) 100%),
        linear-gradient(90deg, rgba(var(--md-background-rgb, 10,15,30), .7) 0%, transparent 60%);
}

.spotlight-hero-content[b-r7xea2x0ya] {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 1.5rem;
    padding: 2rem 2rem 1.5rem;
    align-items: flex-end;
    min-height: 50vh;
    max-height: 60vh;
}

.spotlight-hero-poster[b-r7xea2x0ya] {
    width: 180px;
    flex-shrink: 0;
    border-radius: var(--radius-sm, .375rem);
    box-shadow: 0 8px 32px rgba(0,0,0,.6);
    aspect-ratio: 2/3;
    object-fit: cover;
}

.spotlight-hero-info[b-r7xea2x0ya] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.spotlight-hero-title[b-r7xea2x0ya] {
    font-size: 2rem;
    font-weight: 800;
    color: #fff;
    margin: 0;
    line-height: 1.15;
    text-shadow: 0 2px 12px rgba(0,0,0,.6);
}

.spotlight-hero-meta[b-r7xea2x0ya] {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    align-items: center;
    font-size: .85rem;
    color: rgba(255,255,255,.7);
}

.spotlight-meta-badge[b-r7xea2x0ya] {
    background: rgba(255,255,255,.12);
    padding: .1rem .45rem;
    border-radius: .25rem;
    font-size: .75rem;
    font-weight: 600;
}

.spotlight-meta-rating[b-r7xea2x0ya] {
    color: #f5c518;
    font-weight: 700;
}

.spotlight-hero-genres[b-r7xea2x0ya] {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
}

.spotlight-genre-chip[b-r7xea2x0ya] {
    font-size: .72rem;
    background: rgba(var(--interactive-primary-rgb, 99,102,241), .15);
    color: var(--interactive-primary, #818cf8);
    padding: .15rem .55rem;
    border-radius: 1rem;
    font-weight: 500;
}

.spotlight-hero-overview[b-r7xea2x0ya] {
    margin: .25rem 0 0;
    font-size: .88rem;
    color: rgba(255,255,255,.75);
    line-height: 1.55;
    max-width: 600px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-shadow: 0 1px 4px rgba(0,0,0,.5);
}

.spotlight-hero-cast[b-r7xea2x0ya] {
    font-size: .78rem;
    color: rgba(255,255,255,.5);
}

.spotlight-hero-actions[b-r7xea2x0ya] {
    display: flex;
    gap: .6rem;
    margin-top: .4rem;
}

.spotlight-btn[b-r7xea2x0ya] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .55rem 1.1rem;
    border: none;
    border-radius: var(--radius-sm, .375rem);
    cursor: pointer;
    font-size: .85rem;
    font-weight: 600;
    transition: background .15s, transform .1s;
}
.spotlight-btn:hover[b-r7xea2x0ya] { transform: scale(1.03); }

.spotlight-btn-play[b-r7xea2x0ya] {
    background: var(--interactive-primary, #818cf8);
    color: #fff;
}
.spotlight-btn-play:hover[b-r7xea2x0ya] { background: var(--interactive-primary-hover, #6366f1); }

.spotlight-btn-info[b-r7xea2x0ya] {
    background: rgba(255,255,255,.1);
    color: rgba(255,255,255,.85);
    border: 1px solid rgba(255,255,255,.15);
}
.spotlight-btn-info:hover[b-r7xea2x0ya] { background: rgba(255,255,255,.18); }

/* ── Tile strip (bottom) ── */
.spotlight-strip[b-r7xea2x0ya] {
    padding: .75rem 0;
    overflow: visible;
}

.spotlight-grid[b-r7xea2x0ya] {
    display: flex;
    gap: .5rem;
    overflow-x: auto;
    padding: .5rem .25rem;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--interactive-primary-rgb, 99,102,241), .12) transparent;
}
.spotlight-grid[b-r7xea2x0ya]::-webkit-scrollbar { height: 4px; }
.spotlight-grid[b-r7xea2x0ya]::-webkit-scrollbar-thumb {
    background: rgba(var(--interactive-primary-rgb, 99,102,241), .12);
    border-radius: 2px;
}

.spotlight-tile[b-r7xea2x0ya] {
    flex: 0 0 120px;
    scroll-snap-align: start;
    aspect-ratio: 2/3;
    border-radius: var(--radius-sm, .375rem);
    overflow: hidden;
    position: relative;
    cursor: pointer;
    border: 2px solid transparent;
    transition: transform .2s, border-color .2s, box-shadow .2s;
    outline: none;
}
.spotlight-tile img[b-r7xea2x0ya] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.spotlight-tile:hover[b-r7xea2x0ya],
.spotlight-tile:focus[b-r7xea2x0ya] {
    transform: scale(1.05);
    border-color: var(--border-strong, rgba(255,255,255,.2));
}
.spotlight-tile-selected[b-r7xea2x0ya] {
    border-color: var(--interactive-primary, #818cf8);
    box-shadow: 0 0 16px rgba(var(--interactive-primary-rgb, 99,102,241), .4);
    transform: scale(1.05);
}

.spotlight-tile-empty[b-r7xea2x0ya] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--surface-card, #1a1a2e);
    color: var(--on-surface-faint, #555);
    font-size: 1.5rem;
}

.spotlight-watched[b-r7xea2x0ya] {
    position: absolute;
    bottom: 6px;
    left: 6px;
    color: var(--status-success, #22c55e);
    font-size: .75rem;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.6));
    z-index: 2;
}

.spotlight-progress[b-r7xea2x0ya] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: rgba(0,0,0,.5);
    z-index: 2;
}
.spotlight-progress-fill[b-r7xea2x0ya] {
    height: 100%;
    background: var(--interactive-primary, #818cf8);
    border-radius: 0 3px 0 0;
}

/* ── Browse mode adjustments ── */
.spotlight-browse .spotlight-hero[b-r7xea2x0ya] {
    min-height: 45vh;
}
.spotlight-browse .spotlight-strip[b-r7xea2x0ya] {
    position: sticky;
    bottom: 0;
    z-index: 10;
    background: linear-gradient(180deg, transparent, rgba(var(--md-background-rgb, 10,15,30), .95) 20%);
    padding-top: 1.5rem;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
    .spotlight-hero-content[b-r7xea2x0ya] { padding: 1.25rem; }
    .spotlight-hero-poster[b-r7xea2x0ya] { width: 140px; }
    .spotlight-hero-title[b-r7xea2x0ya] { font-size: 1.5rem; }
    .spotlight-hero-overview[b-r7xea2x0ya] { -webkit-line-clamp: 3; }
    .spotlight-tile[b-r7xea2x0ya] { flex: 0 0 100px; }
}

@media (max-width: 768px) {
    .spotlight-hero[b-r7xea2x0ya] { min-height: 40vh; }
    .spotlight-hero-content[b-r7xea2x0ya] {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 1rem;
    }
    .spotlight-hero-poster[b-r7xea2x0ya] { width: 100px; }
    .spotlight-hero-title[b-r7xea2x0ya] { font-size: 1.2rem; }
    .spotlight-hero-meta[b-r7xea2x0ya] { justify-content: center; }
    .spotlight-hero-genres[b-r7xea2x0ya] { justify-content: center; }
    .spotlight-hero-actions[b-r7xea2x0ya] { justify-content: center; }
    .spotlight-hero-overview[b-r7xea2x0ya] { -webkit-line-clamp: 2; max-width: none; }
    .spotlight-tile[b-r7xea2x0ya] { flex: 0 0 80px; }
}