.catalog-wrap { max-width: 1300px; margin: 0 auto; }

.cat-card {
    background: var(--t-bg-elevated, #1a1c20);
    border-radius: 12px; overflow: hidden;
    box-shadow: var(--t-shadow-sm, 0 1px 4px rgba(0,0,0,.3));
    transition: transform .12s, box-shadow .12s; height: 100%;
    display: flex; flex-direction: column;
}
.cat-card:hover { transform: translateY(-3px); box-shadow: var(--t-shadow, 0 6px 24px rgba(0,0,0,.4)); }
.cat-poster-link { display: block; position: relative; }
.cat-poster { position: relative; aspect-ratio: 2/3; overflow: hidden; background: #000; }
.cat-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* рейтинги на постере */
.cat-ratings { position: absolute; top: 6px; left: 6px; display: flex; flex-direction: column; gap: 4px; z-index: 2; }
.cat-rate { font-size: .72rem; font-weight: 700; padding: 2px 6px; border-radius: 5px; color: #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,.4); backdrop-filter: blur(2px); }
.cat-kp   { background: linear-gradient(135deg,#ff9900,#ff5500); }
.cat-imdb { background: #f5c518; color: #000; }
.cat-torrents { position: absolute; bottom: 6px; right: 6px; font-size: .7rem; font-weight: 600;
    color: #fff; background: rgba(0,0,0,.65); padding: 2px 7px; border-radius: 5px; z-index: 2; }

.cat-info { padding: 8px 10px; flex: 1; display: flex; flex-direction: column; }
.cat-title { font-weight: 600; font-size: .9rem; color: var(--t-text, #e8eaed); text-decoration: none;
    line-height: 1.25; margin-bottom: 3px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cat-title:hover { color: var(--t-accent, #5aa9ff); }
.cat-meta { font-size: .78rem; color: var(--t-text-muted, #9aa0a6); margin-top: auto; }
.cat-upd { font-size: .72rem; color: var(--t-text-faint, #6b7178); margin-top: 3px; }

.cat-list-card {
    display: flex; gap: 16px; padding: 14px;
    background: var(--t-bg-elevated, #1a1c20); border-radius: 12px; margin-bottom: 12px;
    box-shadow: var(--t-shadow-sm, 0 1px 4px rgba(0,0,0,.3)); transition: box-shadow .12s;
}
.cat-list-card:hover { box-shadow: var(--t-shadow, 0 6px 24px rgba(0,0,0,.4)); }
.cat-list-poster { position: relative; flex-shrink: 0; width: 110px; }
.cat-list-poster img { width: 110px; height: 165px; object-fit: cover; border-radius: 8px; display: block; }
.cat-list-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cat-list-title { font-size: 1.1rem; font-weight: 700; color: var(--t-text, #fff); text-decoration: none; }
.cat-list-title:hover { color: var(--t-accent, #5aa9ff); }
.cat-list-year { color: var(--t-text-muted, #9aa0a6); font-weight: 400; }
.cat-list-orig { color: var(--t-text-muted, #9aa0a6); font-size: .85rem; margin-bottom: 4px; }
.cat-list-meta { display: flex; flex-wrap: wrap; gap: 10px; font-size: .82rem; color: var(--t-text-muted,#9aa0a6); margin-bottom: 6px; }
.cat-list-meta span:not(:last-child)::after { content: "·"; margin-left: 10px; opacity: .5; }
.cat-list-descr { font-size: .85rem; color: var(--t-text-muted,#b5bac0); line-height: 1.5; margin-bottom: 8px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cat-list-foot { display: flex; gap: 14px; margin-top: auto; font-size: .8rem; }
.cat-list-torrents { color: var(--t-brand-2, #38ef7d); font-weight: 600; }
.cat-list-upd { color: var(--t-text-faint, #6b7178); }

/* фильтры */
.cat-filters { background: var(--t-bg-elevated,#1a1c20); border-radius: 12px; padding: 16px;
    box-shadow: var(--t-shadow-sm,0 1px 4px rgba(0,0,0,.3)); position: sticky; top: 80px; }

#view-switch button.active { background: var(--t-accent,#4a90e2); color: #fff; border-color: var(--t-accent,#4a90e2); }

@media (max-width: 575px) {
    .cat-list-poster { width: 80px; }
    .cat-list-poster img { width: 80px; height: 120px; }
    .cat-list-descr { display: none; }
}

/* placeholder постера (устарел/удалён) */
.cat-poster-placeholder {
    width: 100%; height: 100%;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 8px; text-align: center;
    background: linear-gradient(135deg, var(--t-bg-elevated,#23262b), var(--t-bg-hover,#2c2f34));
    color: var(--t-text-muted, #9aa0a6); font-size: .72rem; line-height: 1.3; padding: 10px;
}
.cat-list-poster .cat-poster-placeholder { border-radius: 8px; }

.cat-card { position: relative; }
.cat-act {
    position: absolute; top: 8px; right: 8px; z-index: 4;
    width: 30px; height: 30px; padding: 0;
    border: 0; border-radius: 8px;
    background: rgba(0,0,0,.5); color: #fff;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; opacity: 1;
    transition: background .15s, transform .12s;
    backdrop-filter: blur(4px);
}
.cat-act svg { width: 16px; height: 16px; }
.cat-card:hover .cat-act { background: rgba(0,0,0,.7); }
.cat-act:hover { background: rgba(0,0,0,.7); }
/* отмечен: в избранном или со статусом — кнопка видна всегда */
.cat-act.is-marked { opacity: 1; background: rgba(13,110,253,.85); }
 
 
/* ── Метка статуса просмотра: лента снизу постера ──
   Раньше она стояла в левом нижнем углу и налезала на «N раздач».
   Теперь это узкая полоса по низу — накладываться не с чем. */
.cat-status {
    position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
    padding: 4px 8px;
    font-size: .7rem; font-weight: 700; line-height: 1.2;
    color: #fff; text-align: center;
    letter-spacing: .01em;
    backdrop-filter: blur(3px);
}
.cat-status-want     { background: rgba(13,110,253,.88); }
.cat-status-watching { background: rgba(230,138,0,.88); }
.cat-status-watched  { background: rgba(23,138,76,.88); }
.cat-status-dislike  { background: rgba(108,117,125,.88); }
 
/* ── Сортировка: на десктопе ссылками, на мобильном шит ── */
.cat-sort-desktop { display: none; }
 
@media (min-width: 992px) {
    .cat-sort-desktop {
        display: flex; align-items: center; flex-wrap: wrap; gap: 4px;
        margin-right: auto;
    }
    .cat-sort-label {
        font-size: .82rem; color: #6b7280; margin-right: 6px;
    }
    .cat-sort-item {
        padding: 6px 13px; border-radius: 999px;
        font-size: .85rem; font-weight: 500; text-decoration: none;
        color: #4a5058; background: transparent;
        border: 1px solid transparent;
        transition: background .15s, color .15s, border-color .15s;
        white-space: nowrap;
    }
    .cat-sort-item:hover { background: #eef2f8; color: #16181c; }
    .cat-sort-item.is-active {
        background: #e8f1ff; color: #0d5bc4;
        border-color: #c5dcff; font-weight: 700;
    }
    /* мобильная кнопка сортировки на десктопе не нужна */
    .cat-tool-sort-mobile { display: none !important; }
}
 
 
/* ── Шторка действий с релизом ── */
.cat-act-item {
    display: flex; align-items: center; gap: 12px; width: 100%;
    padding: 13px 16px; border: 0; border-radius: 10px;
    background: transparent; color: inherit; text-align: left;
    font-size: .95rem; cursor: pointer;
    transition: background .12s;
}
.cat-act-item:hover { background: rgba(128,128,128,.1); }
.cat-act-ico { width: 20px; height: 20px; flex-shrink: 0; color: #9aa0a6; transition: color .15s; }
.cat-act-item.is-on .cat-act-ico { color: #ff4d6a; }
.cat-act-item.is-on { font-weight: 600; }
 
.cat-act-sep {
    padding: 14px 16px 6px;
    font-size: .74rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .05em; color: #8a9099;
}
.cat-act-dot {
    width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0;
}
.cat-act-check {
    width: 18px; height: 18px; margin-left: auto;
    color: #178a4c; opacity: 0; transition: opacity .15s;
}
.cat-act-status.is-on .cat-act-check { opacity: 1; }
.cat-act-status.is-on { background: rgba(23,138,76,.08); }
 
/* точки статусов используют те же цвета, что метки на карточке */
.cat-act-dot.cat-status-want     { background: #0d6efd; }
.cat-act-dot.cat-status-watching { background: #e68a00; }
.cat-act-dot.cat-status-watched  { background: #178a4c; }
.cat-act-dot.cat-status-skip     { background: #6c757d; }
/* сбрасываем позиционирование от метки на постере */
.cat-act-dot { position: static; padding: 0; box-shadow: none; }
 
/* ══════════════════════════════════════════════════════════
   Шторка действий — собственные стили показа.
   НЕ полагаемся на класс открытия из catalog.js: он свой,
   и без этих правил шторка оставалась невидимой.
   ══════════════════════════════════════════════════════════ */
#actSheet {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1080;
    max-height: 85vh; overflow-y: auto;
    background: #fff; color: #16181c;
    border-top-left-radius: 18px; border-top-right-radius: 18px;
    box-shadow: 0 -10px 40px rgba(16,24,40,.25);
    padding: 6px 10px calc(14px + env(safe-area-inset-bottom));
    transform: translateY(100%);
    transition: transform .25s ease;
    visibility: hidden;
}
#actSheet.is-open { transform: translateY(0); visibility: visible; }
 
/* затемнение фона — отдельным элементом, чтобы ловить клик для закрытия */
.cat-backdrop {
    position: fixed; inset: 0; z-index: 1070;
    background: rgba(0,0,0,.45);
    opacity: 0; pointer-events: none;
    transition: opacity .22s ease;
}
.cat-backdrop.is-open { opacity: 1; pointer-events: auto; }
body.cat-sheet-open { overflow: hidden; }
 
#actSheet .cat-sheet-head {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; padding: 14px 8px 10px;
    border-bottom: 1px solid #eef1f5; margin-bottom: 6px;
}
#actSheet .cat-sheet-title {
    font-size: 1rem; font-weight: 700;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#actSheet .cat-sheet-close {
    flex-shrink: 0; width: 34px; height: 34px; padding: 0;
    border: 0; border-radius: 50%; background: #f1f3f6; color: #4a5058;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
}
#actSheet .cat-sheet-close svg { width: 15px; height: 15px; }
#actSheet .cat-sheet-close:hover { background: #e4e8ee; }
#actSheet .cat-sheet-body { padding-bottom: 6px; }
 
 
 
/* ── Десктоп: то же меню как выпадающее у кнопки ── */
#actSheet.is-dropdown {
    position: fixed;
    left: auto; right: auto; bottom: auto;
    width: 260px; max-height: 70vh;
    border-radius: 14px;
    transform: translateY(-6px);
    box-shadow: 0 10px 34px rgba(16,24,40,.22);
    padding: 4px 6px 8px;
    visibility: hidden; opacity: 0;
    transition: opacity .14s ease, transform .14s ease;
}
#actSheet.is-dropdown.is-open {
    visibility: visible; opacity: 1; transform: translateY(0);
}
/* в дропдауне крестик лишний — закрывается кликом мимо */
#actSheet.is-dropdown .cat-sheet-close { display: none; }
#actSheet.is-dropdown .cat-sheet-head { padding: 10px 12px 8px; }
#actSheet.is-dropdown .cat-sheet-title { font-size: .88rem; }
#actSheet.is-dropdown .cat-act-item { padding: 10px 12px; font-size: .88rem; }
#actSheet.is-dropdown .cat-act-sep { padding: 10px 12px 4px; }
 
/* на десктопе фон не затемняем — меню локальное, но клик вне закрывает */
@media (min-width: 768px) {
    .cat-backdrop.is-open { background: transparent; }
}
 
/* ── Статус в списочном виде ── */
.cat-list-status {
    padding: 2px 9px; border-radius: 7px;
    font-size: .74rem; font-weight: 700; color: #fff;
}
.cat-list-status.cat-status-want     { background: #0d6efd; }
.cat-list-status.cat-status-watching { background: #e68a00; }
.cat-list-status.cat-status-watched  { background: #178a4c; }
.cat-list-status.cat-status-dislike  { background: #6c757d; }
 
/* кнопка действий в списочной карточке */
.cat-list-card { position: relative; }
.cat-list-card .cat-act { top: 10px; right: 10px; background: rgba(0,0,0,.35); }
 
 
/* точка «не буду» в меню */
.cat-act-dot.cat-status-dislike { background: #6c757d; }
 
 
/* пока идёт запрос — меню не принимает клики */
#actSheet.is-busy { pointer-events: none; opacity: .65; }
 
 
/* когда есть лента статуса — счётчик раздач сдвигаем выше */
.cat-poster:has(.cat-status) .cat-torrents { bottom: 28px; }