/**
 * tarane-social — custom.css
 * استایل عمومی سایت + فید اجتماعی (templates/home.php)
 */

body { background: var(--bg); color: var(--t); }

::selection { background: color-mix(in srgb, var(--ts-cyan) 32%, transparent); }

/* ─────────────────────────────────────────────
   ۱) دکمه‌ها
────────────────────────────────────────────── */
.btn, button.btn, a.btn,
button[type="submit"], .btn-primary, .btn-secondary {
    border-radius: 12px;
    font-weight: 700;
    transition: transform .12s, box-shadow .2s, filter .2s;
}
.btn:active { transform: scale(.97); }

.btn-primary, button.btn-primary, input[type="submit"].btn-primary {
    background: var(--ts-grad) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--ts-violet) 35%, transparent);
}
.btn-primary:hover { filter: brightness(1.08); box-shadow: 0 6px 22px color-mix(in srgb, var(--ts-pink) 40%, transparent); }

.btn-secondary, .btn-outline {
    background: var(--w);
    border: 1.5px solid var(--b2) !important;
    color: var(--t) !important;
}
.btn-secondary:hover, .btn-outline:hover { border-color: var(--p) !important; color: var(--p) !important; }

/* ─────────────────────────────────────────────
   ۲) فرم‌ها
────────────────────────────────────────────── */
input[type="text"], input[type="email"], input[type="password"],
input[type="search"], input[type="url"], input[type="tel"], input[type="number"],
textarea, select {
    background: var(--w2);
    border: 1.5px solid var(--b);
    border-radius: 12px;
    color: var(--t);
    transition: border-color .18s, box-shadow .18s;
}
input:focus, textarea:focus, select:focus {
    outline: none;
    border-color: var(--p);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--p) 20%, transparent);
}
input::placeholder, textarea::placeholder { color: var(--tt); }

/* ─────────────────────────────────────────────
   ۳) کارت‌های عمومی (اسلایدر/بلاگ/کاوش)
────────────────────────────────────────────── */
.post-card, .blog-card, .category-card, .user-card {
    background: var(--w);
    border: 1px solid var(--b);
    border-radius: var(--ts-card-radius);
    box-shadow: var(--sh);
    overflow: hidden;
    transition: transform .22s cubic-bezier(.2,.8,.3,1), box-shadow .22s, border-color .22s;
}
.post-card:hover, .blog-card:hover, .category-card:hover, .user-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--sh-lg);
    border-color: var(--b2);
}

.post-card .post-title, .blog-card h3 { color: var(--t); }
.post-card p, .blog-card p { color: var(--ts); }

/* نشان گرادیانی ویژه */
.featured-badge, .slider-badge {
    background: var(--ts-grad) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
}

/* ─────────────────────────────────────────────
   ۴) مودال‌ها و توست‌ها
────────────────────────────────────────────── */
.ms-cms-modal-overlay, .modal-overlay {
    background: rgba(8, 10, 20, .55) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}
.ms-cms-confirm-modal, .modal-content {
    background: var(--w) !important;
    border: 1px solid var(--b) !important;
    border-radius: var(--rl) !important;
    box-shadow: var(--ctx-shadow) !important;
    color: var(--t);
}

.toast-notification {
    background: var(--w) !important;
    color: var(--t) !important;
    border: 1px solid var(--b) !important;
    border-radius: 14px !important;
    box-shadow: var(--ctx-shadow) !important;
    padding: 12px 18px !important;
    display: flex; align-items: center; gap: 8px;
}
.toast-notification.success i { color: var(--s); }
.toast-notification.error   i { color: var(--d); }
.toast-notification.info    i { color: var(--p); }

/* ─────────────────────────────────────────────
   ۵) پروفایل
────────────────────────────────────────────── */
.profile-cover, .profile-header { border-radius: 0 0 var(--rl) var(--rl); }
.profile-avatar img, .profile-avatar {
    outline: 3px solid var(--w);
    box-shadow: 0 0 0 2px var(--b2), var(--sh-lg);
}
.profile-tabs .tab.active, .profile-tab.active {
    color: var(--p) !important;
    border-color: var(--p) !important;
    font-weight: 800;
}

/* ─────────────────────────────────────────────
   ۶) فهرست کاربران (users.php) و جستجو
────────────────────────────────────────────── */
.users-grid, .members-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 16px;
}
.search-page-wrapper, .users-page-wrapper { max-width: 1000px; margin-inline: auto; }

/* ─────────────────────────────────────────────
   ۷) ══ فید اجتماعی (home.php تم) ══
────────────────────────────────────────────── */
/* T33 — چیدمان موبایل‌فرست:
   <820px   : تک‌ستون (فید کامل + سایدبارها زیر فید)
   820-1199 : دو ستون — سایدبار اطلاعات (راست) + فید؛ ستون کاربران زیر فید
   ≥1200px  : سه ستون — اطلاعات (راست) | فید | کاربران (چپ) — فرمول سیال بدون سرریز
*/
.ts-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-content: center;
    gap: 24px;
    max-width: 660px;
    margin: 0 auto;
    /* [T60] هدر sticky در جریان صفحه است؛ فقط فاصلهٔ طراحی */
    padding: 20px 16px 80px;
    align-items: start;
}

/* ── سایدبار دو بخشی (T17) ── */
.ts-sides { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.ts-side  { display: flex; flex-direction: column; gap: 18px; min-width: 0; }

/* ── دو ستون (≥820px): سایدبار-آ راست + فید؛ سایدبار-ب زیر فید منتقل می‌شود ── */
@media (min-width: 820px) {
    .ts-shell {
        grid-template-columns:
            clamp(240px, calc(100vw - var(--ts-feed-w) - 96px), 300px)
            minmax(0, var(--ts-feed-w));
        max-width: 1000px;
        justify-content: center;
        gap: 24px;
    }
    .ts-sides { display: contents; }
    .ts-side--a  { grid-column: 1; grid-row: 1; }
    .ts-feed-col { grid-column: 2; grid-row: 1; }
    .ts-side--b  { grid-column: 2; grid-row: 2; }
    .ts-side--a {
        position: sticky;
        top: calc(var(--ts-header-h) + 16px);
        max-height: calc(100vh - var(--ts-header-h) - 32px);
        max-height: calc(100dvh - var(--ts-header-h) - 32px);
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        padding-inline: 2px;
    }
}

/* ── سه ستون (≥1200px): اطلاعات (راست) | فید | کاربران (چپ) ──
   فرمول سیال: فید همیشه تا 640px کامل می‌ماند؛ سایدبارها فضای باقی‌مانده را
   بین 240 تا 320 پیکسل جذب می‌کنند — در 1200px دقیقاً جا می‌شود، بدون سرریز */
@media (min-width: 1200px) {
    .ts-shell {
        grid-template-columns:
            clamp(240px, calc((100vw - var(--ts-feed-w) - 80px) / 2), var(--ts-side-w))
            minmax(0, var(--ts-feed-w))
            clamp(240px, calc((100vw - var(--ts-feed-w) - 80px) / 2), var(--ts-side-w));
        max-width: 1400px;
        gap: 24px;
    }
    .ts-sides { display: contents; }
    /* ردیف صریح: بدون آن، الگوریتم جای‌گذاری خودکار گرید به‌خاطر ترتیب DOM ستون‌ها را به ردیف بعدی می‌راند */
    .ts-side--a  { grid-column: 1; grid-row: 1; }
    .ts-feed-col { grid-column: 2; grid-row: 1; }
    .ts-side--b  { grid-column: 3; grid-row: 1; }
    /* هر دو ستون کناری چسبان با اسکرول مستقل */
    .ts-side--a, .ts-side--b {
        position: sticky;
        top: calc(var(--ts-header-h) + 16px);
        max-height: calc(100vh - var(--ts-header-h) - 32px);
        max-height: calc(100dvh - var(--ts-header-h) - 32px);
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        padding-inline: 2px;
    }
}

/* ── استوری‌بار فعالان ── */
.ts-stories {
    background: var(--w);
    border: 1px solid var(--b);
    border-radius: var(--ts-card-radius);
    box-shadow: var(--sh);
    padding: 12px 14px;
    margin-bottom: 16px;
    display: flex; gap: 16px;
    align-items: center;
    overflow-x: auto;
    scrollbar-width: none;
}
.ts-stories::-webkit-scrollbar { display: none; }

.ts-story {
    display: flex; flex-direction: column; align-items: center; gap: 7px;
    text-decoration: none !important;
    flex: 0 0 auto;
    width: 72px;
}
.ts-story-ring {
    width: 62px; height: 62px; border-radius: 50%;
    padding: 3px;
    background: var(--ts-grad);
    transition: transform .2s, filter .2s;
}
.ts-story:hover .ts-story-ring { transform: scale(1.07); filter: saturate(1.25); }
.ts-story-ring img {
    width: 100%; height: 100%; border-radius: 50%;
    object-fit: cover;
    border: 2.5px solid var(--w);
    display: block;
    background: var(--gray-200);
}
.ts-story-name {
    font-size: .72rem; color: var(--ts);
    max-width: 72px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-weight: 600;
}
.ts-story--me .ts-story-ring { background: var(--b2); position: relative; }
.ts-story--me .ts-story-ring::after {
    content: '+';
    position: absolute; inset: auto 0 -2px 0;
    margin: auto;
    width: 20px; height: 20px; line-height: 18px;
    background: var(--p); color: #fff;
    border-radius: 50%; font-weight: 900; text-align: center;
    border: 2px solid var(--w);
    font-size: 14px;
}

/* ── کارت پست فید ── */
.ts-card {
    background: var(--w);
    border: 1px solid var(--b);
    border-radius: var(--ts-card-radius);
    box-shadow: var(--sh);
    margin-bottom: 22px;
    overflow: hidden;
    animation: tsCardIn .4s cubic-bezier(.2,.8,.3,1) both;
}
@keyframes tsCardIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

.ts-card-head {
    display: flex; align-items: center; gap: 12px;
    padding: 13px 16px;
}
.ts-card-ava {
    width: 42px; height: 42px; border-radius: 50%;
    padding: 2.5px;
    background: var(--ts-grad);
    flex: 0 0 auto;
}
.ts-card-ava img {
    width: 100%; height: 100%; border-radius: 50%;
    object-fit: cover; border: 2px solid var(--w); display: block;
    background: var(--gray-200);
}
.ts-card-who { flex: 1; min-width: 0; line-height: 1.35; }
.ts-card-who a {
    color: var(--t); font-weight: 800; font-size: .92rem;
    text-decoration: none;
}
.ts-card-who a:hover { color: var(--p); }
.ts-card-meta {
    color: var(--tt); font-size: .75rem;
    display: flex; align-items: center; gap: 6px;
}
/* [T86cg] مخفی‌سازی موقت زمان پست فقط در فید صفحهٔ اول (دستور مدیر: id=49) */
.ts-feed-col .ts-card-meta > span:first-child { display: none; }
.ts-card-chip {
    font-size: .7rem; font-weight: 700;
    color: var(--st); background: var(--sb);
    padding: 2.5px 9px; border-radius: 999px;
    text-decoration: none !important;
    white-space: nowrap;
}

.ts-card-body { padding: 0 16px; }
.ts-card-title {
    color: var(--t); font-size: 1.06rem; font-weight: 800;
    margin: 2px 0 6px; line-height: 1.6;
}
.ts-card-title a { color: inherit; text-decoration: none; }
.ts-card-title a:hover { color: var(--p); }
.ts-card-text { color: var(--ts); font-size: .92rem; line-height: 2; margin: 0; }

.ts-card-img { margin: 12px 0 0; }
.ts-card-img img {
    width: 100%; max-height: 560px; object-fit: cover; display: block;
    background: var(--gray-100);
}

/* ── نوار اکشن ── */
.ts-card-actions {
    display: flex; align-items: center; gap: 4px;
    padding: 9px 10px 4px;
}
.ts-act {
    display: inline-flex; align-items: center; gap: 7px;
    background: transparent; border: none; cursor: pointer;
    color: var(--ts);
    font: inherit; font-size: .88rem; font-weight: 700;
    padding: 8px 12px;
    border-radius: 10px;
    text-decoration: none !important;
    transition: background .15s, color .15s, transform .08s;
    user-select: none;
}
.ts-act:hover { background: var(--gray-100); color: var(--t); }
.ts-act:active { transform: scale(.92); }
.ts-act i { font-size: 1.12rem; }
.ts-act--like.liked { color: var(--ts-pink); }
.ts-act--like.liked i { font-weight: 900; filter: drop-shadow(0 0 7px rgba(255,0,110,.55)); }
.ts-act--save.saved { color: var(--ts-cyan); }
.ts-act--comment:hover { color: var(--p); }

/* درخشش دابل‌کلیک */
.ts-heart-burst {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    pointer-events: none; z-index: 3;
}
.ts-heart-burst i {
    color: #fff; font-size: 96px;
    filter: drop-shadow(0 4px 24px rgba(255,0,110,.85));
    animation: tsBurst .85s cubic-bezier(.17,.89,.32,1.28) forwards;
}
@keyframes tsBurst {
    0% { opacity: 0; transform: scale(.3); }
    28% { opacity: 1; transform: scale(1.18); }
    62% { opacity: 1; transform: scale(1); }
    100% { opacity: 0; transform: scale(1.32); }
}

.ts-card-foot {
    padding: 6px 16px 13px;
    color: var(--tt); font-size: .78rem;
    display: flex; align-items: center; justify-content: space-between;
}

/* ── اسکلتون و لودینگ ── */
.ts-loader {
    text-align: center; padding: 26px; color: var(--tt);
}
.ts-loader i { font-size: 1.5rem; color: var(--p); }
.ts-end {
    text-align: center; color: var(--tt); padding: 22px;
    font-size: .85rem;
}

/* ── سایدبار ── */

.ts-panel {
    background: var(--w);
    border: 1px solid var(--b);
    border-radius: var(--ts-card-radius);
    box-shadow: var(--sh);
    padding: 16px 18px;
}
.ts-panel h4 {
    color: var(--t); font-size: .92rem; font-weight: 800;
    margin: 0 0 12px;
    display: flex; align-items: center; gap: 8px;
}
.ts-panel h4 i { color: var(--ts-cyan); }

.ts-stat-row { display: flex; justify-content: space-between; padding: 7px 0; border-bottom: 1px dashed var(--b); }
.ts-stat-row:last-child { border-bottom: none; }
.ts-stat-row span:first-child { color: var(--ts); font-size: .84rem; }
.ts-stat-row b { color: var(--t); font-weight: 800; }

/* پیشنهادها */
.ts-sug { display: flex; align-items: center; gap: 11px; padding: 7px 0; }
.ts-sug img {
    width: 42px; height: 42px; border-radius: 50%; object-fit: cover;
    border: 2px solid var(--w);
    outline: 2px solid var(--b2);
    background: var(--gray-200);
}
.ts-sug-info { flex: 1; min-width: 0; }
.ts-sug-info a { color: var(--t); font-weight: 700; font-size: .86rem; text-decoration: none; display: block; }
.ts-sug-info a:hover { color: var(--p); }
.ts-sug-info span { color: var(--tt); font-size: .72rem; display: block; }
.ts-follow {
    background: var(--sb); color: var(--st);
    border: none; border-radius: 999px;
    font: inherit; font-size: .76rem; font-weight: 800;
    padding: 6.5px 14px; cursor: pointer;
    transition: all .18s;
    flex: 0 0 auto;
}
.ts-follow:hover { background: var(--p); color: #fff; }
.ts-follow.following { background: var(--gray-100); color: var(--ts); }
.ts-follow.following:hover { background: var(--d); color: #fff; }

/* ترندها */
.ts-trend { display: flex; gap: 12px; padding: 8px 0; border-bottom: 1px dashed var(--b); text-decoration: none !important; }
.ts-trend:last-child { border-bottom: none; }
.ts-trend-rank {
    font-size: 1.05rem; font-weight: 900; font-style: italic;
    color: transparent; background: var(--ts-grad);
    -webkit-background-clip: text; background-clip: text;
    min-width: 22px; text-align: center;
}
.ts-trend-t { color: var(--t); font-size: .84rem; font-weight: 700; line-height: 1.6;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ts-trend:hover .ts-trend-t { color: var(--p); }
.ts-trend-c { color: var(--tt); font-size: .72rem; margin-top: 2px; }

/* دسته‌ها */
.ts-cats { display: flex; flex-wrap: wrap; gap: 8px; }
.ts-cats a {
    font-size: .78rem; font-weight: 700; color: var(--ts);
    background: var(--w2); border: 1px solid var(--b);
    padding: 5.5px 13px; border-radius: 999px;
    text-decoration: none !important;
    transition: all .16s;
}
.ts-cats a:hover { background: var(--sb); color: var(--st); border-color: var(--p); }

/* [T33] ریسپانسیو فید — پایهٔ موبایل‌فرست بالای فایل جایگزین این بلاک شد */@media (max-width: 560px) {
    .ts-shell { padding: 12px 10px 90px; gap: 0; }/*[T60]*/
    .ts-stories { gap: 13px; padding: 12px; }
    .ts-story { width: 62px; }
    .ts-story-ring { width: 54px; height: 54px; }
    .ts-card { margin-bottom: 14px; border-radius: 0; border-inline: none; }
    .ts-shell .ts-feed-col { padding-inline: 0; }
    .ts-side { gap: 12px; }
}

/* ── ستون فید ── */
.ts-feed-col { min-width: 0; }

/* ── T61: هدر sticky در جریان است؛ فاصلهٔ فشردهٔ پست تکی با هدر (۱۲px) ── */
.single-post-wrapper { padding-top: 12px !important; }/*[T61]*/


/* ── [T86dg] رندر تنبل کارت‌ها (content-visibility) حذف شد — کادر خالیِ placeholder حین اسکرول تند مثل «کارت خالی» دیده می‌شد؛ گزارش کاربر ۱۰ نوامبر ── */

/* ── کارت بدون تصویر: جای‌نگهدار گرادیانی با حرف اول عنوان ── */
.recent-tile-ph {
    width: 100%; height: 100%;
    flex-direction: column;
    align-items: center; justify-content: center;
    gap: 3px;
    background:
        linear-gradient(135deg, rgba(0,212,255,.14), rgba(124,58,237,.14) 55%, rgba(255,0,110,.14)),
        var(--w2);
}
.recent-tile-ph b {
    font-size: 1.55rem; font-weight: 900; line-height: 1.1;
    background: var(--ts-grad);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
}
.recent-tile-ph i { font-size: .85rem; opacity: .7; color: var(--ts); }

/* ─────────────────────────────────────────────
   [T19] خوانایی موبایل — فونت‌های درشت‌تر برای چشم راحت
   کاربر: «در حالت موبایل فونت‌ها کمی ریز است و چشم اذیت می‌شه»
────────────────────────────────────────────── */
@media (max-width: 768px) {
    html { -webkit-text-size-adjust: 100%; }
    body { font-size: 16px; }
    .ts-card-who a      { font-size: 1rem; }
    .ts-card-meta       { font-size: .84rem; }
    .ts-card-title      { font-size: 1.1rem; }
    .ts-card-text       { font-size: 1.01rem; line-height: 2.05; }
    .ts-act             { font-size: .95rem; }
    .ts-act i           { font-size: 1.22rem; }
    .ts-card-foot       { font-size: .86rem; }
    .ts-story-name      { font-size: .8rem; }
    .ts-panel h4        { font-size: 1rem; }
    .ts-stat-row span:first-child { font-size: .92rem; }
    .ts-sug-info a      { font-size: .95rem; }
    .ts-sug-info span   { font-size: .8rem; }
    .ts-follow          { font-size: .82rem; }
    .ts-trend-t         { font-size: .93rem; }
    .ts-trend-c         { font-size: .8rem; }
    .ts-cats a          { font-size: .86rem; }
    .ts-end             { font-size: .92rem; }
    .ts-bday            { font-size: .92rem; }
    .ts-bday-empty      { font-size: .88rem; }
    .ts-panel-link      { font-size: .86rem; }
    .ts-count-chip      { font-size: .78rem; }
    /* نظرات و تک‌پست */
    .comment-text, .comment-body { font-size: 15.5px !important; line-height: 1.9 !important; }
    .comment-author, .comment-user { font-size: 14.5px !important; }
    .single-post-wrapper .post-content,
    .post-content, .post-body { font-size: 16.5px !important; line-height: 2.1 !important; }
    .single-post-wrapper h1, .post-title { font-size: 1.35rem !important; }
}

@media (max-width: 400px) {
    .ts-card-text { font-size: 1.04rem; }
    .ts-card-title { font-size: 1.14rem; }
    .ts-story-name { font-size: .84rem; }
}

/* ── [T19] صفحهٔ دسته‌بندی شبیه ایندکس (category.php جدید) ── */

/* قهرمان دسته */
.ts-cat-hero {
    background: var(--w);
    border: 1px solid var(--b);
    border-radius: var(--ts-card-radius);
    box-shadow: var(--sh);
    padding: 18px 20px 16px;
    margin-bottom: 14px;
}
.ts-cat-hero--grad { position: relative; overflow: hidden; }
.ts-cat-hero--grad::before {
    content: '';
    position: absolute; inset: 0;
    background: var(--ts-grad-soft);
    pointer-events: none;
}
.ts-cat-bc {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px;
    color: var(--tt); font-size: .78rem; font-weight: 700;
    margin-bottom: 8px; position: relative;
}
.ts-cat-bc a { color: var(--st); text-decoration: none !important; }
.ts-cat-bc a:hover { text-decoration: underline; }
.ts-cat-bc i { font-size: .6rem; opacity: .6; }
.ts-cat-title {
    margin: 0 0 4px; font-size: 1.5rem; font-weight: 900; color: var(--t);
    background: var(--ts-grad);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
    position: relative; line-height: 1.5;
}
.ts-cat-desc { color: var(--ts); font-size: .9rem; line-height: 1.9; margin: 0; position: relative; }
.ts-cat-stats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; position: relative; }
.ts-cat-stat {
    display: inline-flex; align-items: center; gap: 6px;
    background: var(--w2); border: 1px solid var(--b);
    color: var(--ts); font-size: .78rem; font-weight: 800;
    padding: 5px 12px; border-radius: 999px;
}
.ts-cat-stat i { color: var(--ts-cyan); font-size: .85rem; }
.ts-cat-stat b { color: var(--t); }

/* نوار فیلتر چسبان */
.ts-filters {
    position: sticky;
    top: var(--ts-header-h);
    z-index: 20;
    background: color-mix(in srgb, var(--w) 88%, transparent);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid var(--b);
    border-radius: var(--ts-card-radius);
    box-shadow: var(--sh);
    padding: 10px 14px;
    margin-bottom: 16px;
    display: flex; flex-direction: column; gap: 9px;
}

/* [T86cj] نوار فیلتر چسبان: هنگام مخفی‌شدن هدر با اسکرول، بدون فاصله به بالای صفحه می‌چسبد
   (قبلاً top:var(--ts-header-h) با هدرِ پنهان 64px گپ خالی می‌گذاشت) */
.ts-filters { transition: top .3s ease; }
html.hdr-hidden .ts-filters { top: 0; }
.ts-filter-row { display: flex; align-items: center; gap: 7px; overflow-x: auto; scrollbar-width: none; }
.ts-filter-row::-webkit-scrollbar { display: none; }
.ts-filter-label {
    flex: 0 0 auto; color: var(--tt); font-size: .74rem; font-weight: 800;
    display: inline-flex; align-items: center; gap: 5px;
}
.ts-chip {
    flex: 0 0 auto;
    display: inline-flex; align-items: center; gap: 6px;
    background: var(--w2); border: 1.5px solid var(--b);
    color: var(--ts); font-size: .8rem; font-weight: 800;
    padding: 6px 14px; border-radius: 999px;
    text-decoration: none !important;
    cursor: pointer; font-family: inherit;
    transition: all .16s;
    white-space: nowrap;
}
.ts-chip:hover { border-color: var(--p); color: var(--st); }
.ts-chip.on {
    background: var(--ts-grad); border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px color-mix(in srgb, var(--ts-violet) 30%, transparent);
}
.ts-chip .n {
    font-size: .68rem; opacity: .75;
    background: rgba(0,0,0,.08); border-radius: 999px; padding: 1px 7px;
}
.ts-chip.on .n { background: rgba(255,255,255,.25); opacity: 1; }

/* حالت خالی */
.ts-cat-empty {
    background: var(--w); border: 1px dashed var(--b2);
    border-radius: var(--ts-card-radius);
    padding: 34px 20px; text-align: center; color: var(--ts);
}
.ts-cat-empty i { font-size: 2rem; color: var(--tt); margin-bottom: 10px; display: block; }
.ts-cat-empty .t { font-weight: 800; color: var(--t); margin-bottom: 4px; }

/* زیردسته‌ها در سایدبار */
.ts-subcat { display: flex; align-items: center; gap: 9px; padding: 7px 2px; border-bottom: 1px dashed var(--b); text-decoration: none !important; }
.ts-subcat:last-child { border-bottom: none; }
.ts-subcat i { color: var(--ts-cyan); font-size: .8rem; width: 18px; text-align: center; }
.ts-subcat .nm { flex: 1; min-width: 0; color: var(--t); font-size: .84rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ts-subcat:hover .nm { color: var(--p); }
.ts-subcat .ct { color: var(--tt); font-size: .72rem; }

/* موبایل: قهرمان فشرده + فیلتر افقی */
@media (max-width: 560px) {
    .ts-cat-hero { padding: 14px 16px 12px; border-radius: 12px; }
    .ts-cat-title { font-size: 1.22rem; }
    .ts-cat-desc { font-size: .88rem; }
    .ts-filters { padding: 9px 11px; border-radius: 12px; top: var(--ts-header-h); }
    .ts-chip { font-size: .84rem; padding: 7px 15px; }
    .ts-filter-label { font-size: .76rem; }
}

/* ═════════════════════════════════════════════════════════
   [T33b] اصلاحیهٔ ریسپانسیو — متن بلند / لمس / آکاردئون سایدبار موبایل
   ═════════════════════════════════════════════════════════ */

/* ۱) مقاومت به متن فارسی خیلی بلند، لینک طولانی و نام‌های بدون فاصله —
      هیچ‌کجا شکستگی افقی یا بیرون‌زدگی رخ نمی‌دهد */
.ts-card-who a, .ts-card-title, .ts-card-title a, .ts-card-text,
.ts-card-meta span, .ts-sug-info a, .ts-sug-info span, .ts-stat-new,
.ts-trend-t, .ts-panel h4 { overflow-wrap: anywhere; }
.ts-card-meta { flex-wrap: wrap; }

/* ۲) اهداف لمسی موبایل — دکمه‌های اکشن کارت حداقل ~44px (فقط زیر 820px) */
@media (max-width: 819px) {
    .ts-card-actions { flex-wrap: wrap; gap: 2px; padding: 8px 10px 6px; }
    .ts-act { min-height: 44px; padding: 6px 10px; gap: 6px; }
    .ts-follow { padding: 9px 16px; }
    .ts-cats a { padding: 8px 15px; }
    .ts-panel-link { padding: 6px 0; }
    .ts-bday { padding: 9px 2px; }
    .ts-trend { padding: 10px 0; }
    .ts-sug { padding: 9px 0; }

    /* ۳) آکاردئون سایدبار موبایل — پنل‌های کم‌اولویت جمع می‌شوند؛
          باز/بسته با لمس و صفحه‌کلید (h4 نقش دکمه می‌گیرد)؛
          دسته‌ها/آنلاین‌ها/پیشنهادها باز می‌مانند */
    .ts-panel[data-collapsible] { padding: 12px 16px; }
    .ts-panel[data-collapsible] > h4 {
        margin: 0; min-height: 44px; cursor: pointer;
        user-select: none; -webkit-user-select: none;
        -webkit-tap-highlight-color: transparent;
    }
    .ts-panel[data-collapsible] > h4:focus-visible {
        outline: 2px solid var(--p); outline-offset: 3px; border-radius: 8px;
    }
    .ts-panel[data-collapsible] > h4::after {
        content: '\f078';
        /* نکته: قاعدهٔ سراسری vazirmatn.css («* {font-family:Vazirmatn !important}") هر font-family معمولی را می‌شکند؛ مطابق قرارداد همین فایل برای آیکون‌ها، اینجا با !important پس گرفته می‌شود */
        font-family: 'Font Awesome 6 Free' !important;
        font-weight: 900; font-style: normal;
        margin-inline-start: auto;
        font-size: .6rem; color: var(--tt);
        transition: transform .22s ease;
    }
    .ts-panel--closed > h4::after { transform: rotate(90deg); }
    .ts-panel--closed > *:not(h4) { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════
   [T37] سیستم حرفه‌ای نمایش پست — کارت فید v2
   هستهٔ مشترک: templates/post-card.php + assets/js/ts-feed.js
   قواعد: فقط توکن‌های تم · RTL کامل · دو تم بی‌نقص · بدون رنگ هاردکد تم‌شکن
   ═══════════════════════════════════════════════════════════════════ */

/* ── کارت ── */
.ts-card {
    background: var(--w);
    border: 1px solid var(--b);
    border-radius: var(--ts-card-radius);
    box-shadow: var(--sh);
    margin-bottom: 22px;
    overflow: hidden;
    transition: border-color .2s ease, box-shadow .25s ease;
    animation: tsCardIn .38s cubic-bezier(.2,.8,.3,1) both;
}
.ts-card:hover {
    border-color: var(--b2);
    box-shadow: var(--sh-lg);
}
.ts-card:focus-within { border-color: color-mix(in srgb, var(--p) 45%, var(--b)); }

/* ── سربرگ کارت ── */
.ts-card .ts-card-head {
    display: flex; align-items: center; gap: 11px;
    padding: 14px 16px 10px;
}
.ts-card .ts-card-ava {
    width: 44px; height: 44px; border-radius: 50%;
    padding: 2.5px; background: var(--ts-grad);
    flex: 0 0 auto; text-decoration: none !important;
    transition: transform .18s ease;
}
.ts-card .ts-card-ava:hover { transform: scale(1.05); }
.ts-card .ts-card-ava img {
    width: 100%; height: 100%; border-radius: 50%;
    object-fit: cover; border: 2px solid var(--w); display: block;
    background: var(--gray-200);
}
.ts-card .ts-card-who { flex: 1; min-width: 0; line-height: 1.4; }
.ts-card .ts-card-nameline { display: flex; align-items: center; gap: 5px; min-width: 0; }
.ts-card .ts-card-name {
    color: var(--t); font-weight: 800; font-size: 15px;
    text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 100%;
}
.ts-card .ts-card-name:hover { color: var(--p); }
.ts-card .ts-verified {
    flex: 0 0 auto; color: #1d9bf0;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.18));
}
.ts-card .ts-card-meta {
    color: var(--tt); font-size: 12.5px; font-weight: 600;
    display: flex; align-items: center; gap: 6px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ts-card .ts-card-meta i { font-size: 4px; color: var(--tt); flex: 0 0 auto; }
.ts-card .ts-card-typetag {
    color: var(--st); background: var(--sb);
    border-radius: 999px; padding: 0 8px; font-size: 11.5px; font-weight: 800;
}
.ts-card .ts-card-chip {
    flex: 0 0 auto; font-size: .7rem; font-weight: 800;
    color: var(--st); background: var(--sb);
    padding: 3px 10px; border-radius: 999px;
    white-space: nowrap; text-decoration: none !important;
}
.ts-card .ts-card-chip--grad { background: var(--ts-grad); color: #fff; }

/* ── منوی سه‌نقطه ── */
.ts-menu { position: relative; flex: 0 0 auto; }
.ts-card .ts-menu-btn {
    width: 34px; height: 34px; border-radius: 10px;
    background: transparent; border: none; cursor: pointer;
    color: var(--tt); font-size: 15px;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s, color .15s;
}
.ts-card .ts-menu-btn:hover { background: var(--gray-100); color: var(--t); }
.ts-card .ts-menu-btn[aria-expanded="true"] { background: var(--gray-100); color: var(--t); }
.ts-menu-pop {
    position: absolute; top: calc(100% + 6px); left: 0; z-index: 60;
    min-width: 190px;
    background: var(--w);
    border: 1px solid var(--b);
    border-radius: 14px;
    box-shadow: var(--ctx-shadow);
    padding: 6px;
    animation: tsMenuIn .16s ease both;
}
@keyframes tsMenuIn { from { opacity: 0; transform: translateY(-5px) scale(.98); } to { opacity: 1; transform: none; } }
.ts-menu-item {
    display: flex; align-items: center; gap: 10px;
    width: 100%; padding: 9px 12px; border-radius: 9px;
    background: transparent; border: none; cursor: pointer;
    color: var(--t); font: inherit; font-size: .84rem; font-weight: 700;
    text-decoration: none !important; text-align: right;
    transition: background .13s;
}
.ts-menu-item i { width: 18px; text-align: center; color: var(--ts); font-size: .92rem; }
.ts-menu-item:hover { background: var(--gray-100); }
.ts-menu-item--danger, .ts-menu-item--danger i { color: var(--d); }
.ts-menu-item--danger:hover { background: color-mix(in srgb, var(--d) 9%, transparent); }

/* ── بدنه: عنوان و متن ── */
.ts-card .ts-card-body { padding: 0 16px; }
.ts-card .ts-card-title {
    color: var(--t); font-size: 17px; font-weight: 800;
    margin: 2px 0 7px; line-height: 1.65;
    overflow-wrap: anywhere;
}
.ts-card .ts-card-title a { color: inherit; text-decoration: none; }
.ts-card .ts-card-title a:hover { color: var(--p); }
.ts-card .ts-card-text {
    color: var(--ts); font-size: 15.5px; line-height: 1.9; margin: 0;
    overflow-wrap: anywhere; word-break: normal;
    unicode-bidi: plaintext;
    display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden;
}
.ts-card .ts-card-text br + br { display: none; } /* فاصلهٔ پاراگراف‌ها در خلاصه فشرده می‌ماند */
.ts-card .ts-hashtag, .ts-card .ts-mention {
    color: var(--p); font-weight: 700; text-decoration: none !important;
    background: var(--sb); border-radius: 7px; padding: 0 5px;
    transition: background .15s, color .15s;
}
.ts-card .ts-hashtag:hover, .ts-card .ts-mention:hover { color: var(--pd); background: color-mix(in srgb, var(--p) 16%, transparent); }
body.dark-mode .ts-card .ts-hashtag, body.dark-mode .ts-card .ts-mention,
html[data-theme="dark"] .ts-card .ts-hashtag, html[data-theme="dark"] .ts-card .ts-mention { color: var(--st); }

/* ── تصویر شاخص ── */
.ts-card .ts-card-img { margin: 12px 0 0; position: relative; }
.ts-card .ts-card-img img {
    width: 100%; max-height: 560px; object-fit: cover; display: block;
    background: var(--gray-100);
}
.ts-card--gallery .ts-card-img img { max-height: 460px; }

/* ── گالری ── */
.ts-card .ts-card-gallery {
    margin: 12px 0 0; display: grid; gap: 3px;
}
.ts-card .ts-gal--1 { grid-template-columns: 1fr; }
.ts-card .ts-gal--2 { grid-template-columns: 1fr 1fr; }
.ts-card .ts-gal--3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.ts-card .ts-gal--3 .ts-gal-cell:first-child { grid-row: span 2; }
.ts-card .ts-gal--4 { grid-template-columns: 1fr 1fr; }
.ts-card .ts-gal-cell { position: relative; margin: 0; overflow: hidden; background: var(--gray-100); }
.ts-card .ts-gal--2 .ts-gal-cell, .ts-card .ts-gal--3 .ts-gal-cell, .ts-card .ts-gal--4 .ts-gal-cell,
.ts-card .ts-gal--more .ts-gal-cell { aspect-ratio: 1; }
.ts-card .ts-gal--1 .ts-gal-cell img { width: 100%; max-height: 560px; object-fit: cover; display: block; }
.ts-card .ts-gal-cell img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.ts-card .ts-gal-cell:hover img { transform: scale(1.03); }
.ts-card .ts-gal-more {
    position: absolute; inset: 0; z-index: 2;
    display: flex; align-items: center; justify-content: center;
    background: rgba(10, 10, 20, .55); color: #fff;
    font-size: 1.5rem; font-weight: 900; letter-spacing: .02em;
    backdrop-filter: blur(2px);
}

/* ── ویدیو ── */
.ts-card .ts-card-video { margin: 12px 0 0; position: relative; background: #000; }
.ts-card .ts-card-video video { width: 100%; max-height: 560px; display: block; background: #000; }
.ts-card .ts-video-cover {
    position: absolute; inset: 0; z-index: 2;
    display: flex; align-items: center; justify-content: center;
    background:
        radial-gradient(120% 90% at 50% 40%, rgba(124,58,237,.35), rgba(0,0,0,.25) 60%, rgba(0,0,0,.55)),
        var(--gray-200);
    border: none; cursor: pointer;
}
.ts-card .ts-video-cover span {
    width: 72px; height: 72px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--ts-grad); color: #fff; font-size: 1.4rem;
    box-shadow: 0 10px 34px color-mix(in srgb, var(--ts-violet) 45%, transparent);
    transition: transform .2s ease;
}
.ts-card .ts-video-cover:hover span { transform: scale(1.08); }
.ts-card .ts-card-video.is-playing .ts-video-cover { display: none; }

/* ── کارت موسیقی ── */
.ts-card .ts-music {
    margin: 12px 16px 0;
    display: flex; align-items: center; gap: 13px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--ts-cyan) 9%, transparent), color-mix(in srgb, var(--ts-pink) 8%, transparent)),
        var(--w2);
    border: 1px solid var(--b);
    border-radius: 15px;
    padding: 12px 14px;
}
.ts-card .ts-music-cover {
    width: 64px; height: 64px; border-radius: 14px; overflow: hidden;
    flex: 0 0 auto; background: var(--gray-200);
    box-shadow: 0 4px 14px rgba(16,24,40,.14);
}
.ts-card .ts-music-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ts-card .ts-music-cover--ph {
    display: flex; align-items: center; justify-content: center;
    background: var(--ts-grad); color: #fff; font-size: 1.35rem;
}
.ts-card .ts-music-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.ts-card .ts-music-row { display: flex; align-items: center; gap: 12px; }
.ts-card .ts-music-play {
    width: 42px; height: 42px; border-radius: 50%;
    border: none; cursor: pointer; flex: 0 0 auto;
    background: var(--ts-grad); color: #fff; font-size: .95rem;
    display: inline-flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--ts-violet) 40%, transparent);
    transition: transform .15s ease, filter .15s ease;
}
.ts-card .ts-music-play:hover { filter: brightness(1.07); }
.ts-card .ts-music-play:active { transform: scale(.94); }
.ts-card .ts-music-play.is-playing { background: var(--w); color: var(--p); box-shadow: inset 0 0 0 2px var(--p); }
.ts-card .ts-music-times {
    display: flex; align-items: center; gap: 5px;
    color: var(--tt); font-size: 12px; font-weight: 700;
    font-variant-numeric: tabular-nums; min-width: 86px;
}
.ts-card .ts-music-seek {
    -webkit-appearance: none; appearance: none;
    width: 100%; height: 5px; border-radius: 99px; outline: none; cursor: pointer;
    background: linear-gradient(to left, var(--p) 0%, var(--p) var(--val, 0%), var(--b) var(--val, 0%), var(--b) 100%);
}
.ts-card .ts-music-seek::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none;
    width: 14px; height: 14px; border-radius: 50%;
    background: var(--p); border: 2.5px solid var(--w);
    box-shadow: 0 1px 5px rgba(16,24,40,.3);
}
.ts-card .ts-music-seek::-moz-range-thumb {
    width: 14px; height: 14px; border-radius: 50%;
    background: var(--p); border: 2.5px solid var(--w);
    box-shadow: 0 1px 5px rgba(16,24,40,.3);
}

/* ── متن ترانه — بخش مستقل و ادبی ── */
.ts-card .ts-lyrics {
    margin: 12px 16px 0;
    background: var(--w2);
    border: 1px solid var(--b);
    border-inline-start: 3px solid var(--p);
    border-radius: 13px;
    overflow: hidden;
}
.ts-card .ts-lyrics-head {
    display: flex; align-items: center; gap: 8px;
    padding: 10px 14px 0;
    color: var(--st); font-size: .8rem; font-weight: 800; letter-spacing: .02em;
}
.ts-card .ts-lyrics-body { position: relative; padding: 8px 16px 4px; }
.ts-card .ts-lyrics-text {
    font-size: 17.5px; line-height: 2.05; color: var(--t);
    white-space: pre-wrap; overflow-wrap: anywhere;
    max-height: 216px; overflow: hidden; position: relative;
    transition: max-height .35s ease;
}
.ts-card .ts-lyrics-text::after {
    content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 56px;
    background: linear-gradient(to bottom, transparent, var(--w2));
    pointer-events: none;
}
.ts-card .ts-lyrics.is-open .ts-lyrics-text { max-height: 4000px; }
.ts-card .ts-lyrics.is-open .ts-lyrics-text::after { display: none; }
.ts-card .ts-lyrics-toggle, .ts-card .ts-lyrics-full {
    display: inline-flex; align-items: center; gap: 7px;
    margin: 4px 14px 12px; padding: 6px 13px;
    background: transparent; border: 1.5px solid var(--b2); border-radius: 999px;
    color: var(--st); font: inherit; font-size: .78rem; font-weight: 800;
    cursor: pointer; text-decoration: none !important;
    transition: border-color .15s, background .15s;
}
.ts-card .ts-lyrics-toggle:hover, .ts-card .ts-lyrics-full:hover { border-color: var(--p); background: var(--sb); }
.ts-card .ts-lyrics-toggle i { transition: transform .25s ease; }
.ts-card .ts-lyrics.is-open .ts-lyrics-toggle i { transform: rotate(180deg); }

/* ── کارت کالا ── */
.ts-card .ts-product {
    margin: 12px 16px 0;
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--s) 8%, transparent), color-mix(in srgb, var(--warn) 7%, transparent)),
        var(--w2);
    border: 1px solid var(--b);
    border-radius: 15px;
    padding: 13px 15px;
}
.ts-card .ts-product-info { flex: 1; min-width: 170px; }
.ts-card .ts-product-price {
    color: var(--s); font-size: 1.12rem; font-weight: 900;
    font-variant-numeric: tabular-nums;
}
.ts-card .ts-product-price small { font-size: .72rem; font-weight: 800; color: var(--ts); }
.ts-card .ts-product-desc { color: var(--ts); font-size: .82rem; line-height: 1.8; margin-top: 3px; }
.ts-card .ts-product-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--ts-grad); color: #fff;
    padding: 9px 17px; border-radius: 11px;
    font-size: .83rem; font-weight: 800; text-decoration: none !important;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--ts-violet) 35%, transparent);
    transition: filter .15s, transform .12s;
}
.ts-card .ts-product-btn:hover { filter: brightness(1.07); }
.ts-card .ts-product-btn:active { transform: scale(.97); }

/* ── نوار تعاملات ── */
.ts-card .ts-card-actions {
    display: flex; align-items: center; gap: 2px;
    padding: 10px 10px 4px;
    margin-top: 12px;
}
.ts-card .ts-act {
    display: inline-flex; align-items: center; gap: 7px;
    background: transparent; border: none; cursor: pointer;
    color: var(--ts);
    font: inherit; font-size: .88rem; font-weight: 700;
    min-height: 44px;
    padding: 8px 13px;
    border-radius: 11px;
    text-decoration: none !important;
    transition: background .15s, color .15s, transform .08s;
    user-select: none; -webkit-tap-highlight-color: transparent;
}
.ts-card .ts-act:hover { background: var(--gray-100); color: var(--t); }
.ts-card .ts-act:active { transform: scale(.92); }
.ts-card .ts-act i { font-size: 1.1rem; }
.ts-card .ts-act--like.liked { color: var(--ts-pink); }
.ts-card .ts-act--like.liked i { font-weight: 900; filter: drop-shadow(0 0 6px rgba(255,0,110,.45)); }
.ts-card .ts-act--like.is-busy { pointer-events: none; opacity: .65; }
.ts-card .ts-act--like.pop i { animation: tsLikePop .38s cubic-bezier(.2,.9,.3,1.4); }
@keyframes tsLikePop { 0% { transform: scale(1); } 40% { transform: scale(1.45); } 100% { transform: scale(1); } }
.ts-card .ts-act--save.saved { color: var(--ts-cyan); }
.ts-card .ts-act--save.is-busy { pointer-events: none; opacity: .65; }
.ts-card .ts-act--comment:hover { color: var(--p); }
.ts-card .ts-act-spacer { flex: 1; }

/* ── پانوشت کارت ── */
.ts-card .ts-card-foot {
    display: flex; align-items: center; justify-content: space-between;
    margin: 8px 16px 0; padding: 11px 2px 14px;
    border-top: 1px solid var(--b);
    color: var(--st); font-size: .8rem; font-weight: 800;
    text-decoration: none !important;
    transition: color .15s;
}
.ts-card .ts-card-foot i { transition: transform .2s ease; }
.ts-card .ts-card-foot:hover { color: var(--pd); }
.ts-card .ts-card-foot:hover i { transform: translateX(-3px); }

/* ── اسکلتون بارگذاری ── */
.ts-skel {
    background: var(--w);
    border: 1px solid var(--b);
    border-radius: var(--ts-card-radius);
    margin-bottom: 22px; padding: 16px; overflow: hidden;
}
.ts-skel-row { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; }
.ts-skel-ava { width: 44px; height: 44px; border-radius: 50%; flex: 0 0 auto; }
.ts-skel-line { height: 12px; border-radius: 6px; margin-bottom: 9px; }
.ts-skel-block { height: 120px; border-radius: 12px; margin-top: 12px; }
.ts-skel-ava, .ts-skel-line, .ts-skel-block {
    background: linear-gradient(90deg, var(--gray-100) 25%, var(--gray-50) 45%, var(--gray-100) 65%);
    background-size: 220% 100%;
    animation: tsShimmer 1.15s linear infinite;
}
@keyframes tsShimmer { from { background-position: 220% 0; } to { background-position: -20% 0; } }

/* ── حالت خالی فید ── */
.ts-feed-empty {
    background: var(--w); border: 1px dashed var(--b2);
    border-radius: var(--ts-card-radius);
    text-align: center; padding: 46px 20px; margin-bottom: 22px;
}
.ts-feed-empty i { font-size: 2rem; color: var(--tt); margin-bottom: 12px; display: block; }
.ts-feed-empty .t { color: var(--t); font-weight: 800; font-size: 1rem; margin-bottom: 5px; }
.ts-feed-empty .s { color: var(--tt); font-size: .85rem; }

/* ── دسترس‌پذیری و حرکت ── */
.ts-card :focus-visible, .ts-menu-item:focus-visible, .ts-act:focus-visible {
    outline: 2px solid var(--p); outline-offset: 2px; border-radius: 8px;
}
@media (prefers-reduced-motion: reduce) {
    .ts-card, .ts-menu-pop, .ts-card .ts-gal-cell img { animation: none !important; transition: none !important; }
    .ts-skel-ava, .ts-skel-line, .ts-skel-block { animation: none; }
}

/* ── تبلت ── */
@media (max-width: 819px) {
    .ts-card { margin-bottom: 16px; }
    .ts-card .ts-card-text { font-size: 15.5px; }
}

/* ── موبایل ── */
@media (max-width: 560px) {
    .ts-card { margin-bottom: 14px; border-radius: 0; border-inline: none; }
    .ts-card:hover { box-shadow: var(--sh); }
    .ts-card .ts-card-head { padding: 13px 13px 9px; }
    .ts-card .ts-card-body { padding: 0 13px; }
    .ts-card .ts-card-name { font-size: 15px; }
    .ts-card .ts-card-title { font-size: 16.5px; }
    .ts-card .ts-card-text { font-size: 16px; line-height: 2; -webkit-line-clamp: 7; }
    .ts-card .ts-card-meta { font-size: 12px; }
    .ts-card .ts-music { margin-inline: 13px; }
    .ts-card .ts-lyrics { margin-inline: 13px; }
    .ts-card .ts-lyrics-text { font-size: 17px; line-height: 2.1; }
    .ts-card .ts-product { margin-inline: 13px; }
    .ts-card .ts-card-foot { margin-inline: 13px; }
    .ts-card .ts-act { padding: 8px 11px; }
    .ts-card .ts-gal--3 { grid-template-columns: 1fr; grid-template-rows: none; }
    .ts-card .ts-gal--3 .ts-gal-cell { aspect-ratio: 1; }
    .ts-card .ts-gal--3 .ts-gal-cell:first-child { grid-row: auto; }
}
/* اطمینان از غلبهٔ قواعد v2 بر بلوک قدیمی ریسپانسیو */
@media (max-width: 768px) {
    .ts-card .ts-card-name { font-size: 15px; }
    .ts-card .ts-card-meta { font-size: 12.5px; }
    .ts-card .ts-card-title { font-size: 16.5px; }
    .ts-card .ts-card-text { font-size: 15.5px; line-height: 1.9; }
    .ts-card .ts-act { font-size: .9rem; }
    .ts-card .ts-act i { font-size: 1.15rem; }
}
@media (max-width: 560px) {
    .ts-card .ts-card-text { font-size: 16px; line-height: 2; }
}


/* ═══ [T47] نشان سنجاق و مدیر روی کارت‌ها ═══ */
.ts-card .ts-card-chip--pin { background: #fff7ed; color: #c2410c; box-shadow: inset 0 0 0 1px rgba(234,88,12,.25); }
.ts-card .ts-card-chip--pin .fa-thumbtack { font-size: 10px; transform: rotate(35deg); }
body.dark-mode .ts-card .ts-card-chip--pin { background: rgba(234,88,12,.16); color: #fdba74; }
.ts-card .ts-card-chip--admin { background: #eef2ff; color: #4f46e5; box-shadow: inset 0 0 0 1px rgba(79,70,229,.22); }
.ts-card .ts-card-chip--admin .fa-user-shield { font-size: 10px; }
body.dark-mode .ts-card .ts-card-chip--admin { background: rgba(99,102,241,.18); color: #a5b4fc; }
.ts-menu-item .fa-thumbtack { width: 16px; opacity: .75; }
.ts-menu-item .ts-pin-on { color: #ea580c; opacity: 1; }
/* نشان سنجاق پروفایل */
.ts-pin-badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; font-size: .72rem; font-weight: 800; background: #fff7ed; color: #c2410c; box-shadow: inset 0 0 0 1px rgba(234,88,12,.25); white-space: nowrap; }
.ts-pin-badge .fa-thumbtack { font-size: 10px; transform: rotate(35deg); }
body.dark-mode .ts-pin-badge { background: rgba(234,88,12,.16); color: #fdba74; }


/* ═════════════════════════════════════════════════════════
   [T48-فید] تب‌های «همهٔ پست‌ها / دوستان» + جای‌نگهدار تصویر گم‌شده
   ═════════════════════════════════════════════════════════ */
.ts-feed-tabs {
    display: flex; gap: 6px; align-items: center;
    margin: 0 0 14px; padding: 5px;
    background: var(--w2); border: 1px solid var(--b);
    border-radius: 999px; width: fit-content; max-width: 100%;
    overflow-x: auto; scrollbar-width: none;
}
.ts-feed-tabs::-webkit-scrollbar { display: none; }
.ts-ftab {
    flex: 0 0 auto;
    display: inline-flex; align-items: center; gap: 7px;
    padding: 8px 20px; border-radius: 999px;
    font-size: .88rem; font-weight: 800; color: var(--ts);
    text-decoration: none !important; white-space: nowrap;
    border: 1.5px solid transparent; transition: all .18s;
    cursor: pointer; font-family: inherit;
}
.ts-ftab i { font-size: .82rem; opacity: .8 }
.ts-ftab:hover { color: var(--st); }
.ts-ftab.on {
    background: var(--w); color: var(--st);
    border-color: var(--b); box-shadow: var(--sh);
}
.ts-ftab.on i { opacity: 1; color: var(--p, #7c3aed); }

/* جای‌نگهدار تصویر گم‌شدهٔ پست — نتِ موسیقی روی پس‌زمینهٔ لطیف (روشن/تاریک خودکار) */
.ts-card-img.ts-img-missing {
    aspect-ratio: 16 / 10; min-height: 120px;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--gray-50), var(--gray-100));
    border-radius: var(--ts-card-radius);
    position: relative;
}
.ts-card-img.ts-img-missing::after {
    font-family: 'Font Awesome 6 Free'; font-weight: 900;
    content: '\f001'; font-size: 2.3rem; color: var(--gray-400);
    opacity: .6;
}
.ts-gal-cell.ts-img-missing {
    aspect-ratio: 1 / 1; min-height: 90px;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--gray-50), var(--gray-100));
}
.ts-gal-cell.ts-img-missing::after {
    font-family: 'Font Awesome 6 Free'; font-weight: 900;
    content: '\f001'; font-size: 1.4rem; color: var(--gray-400); opacity: .55;
}

@media (max-width: 819px) {
    .ts-feed-tabs { width: 100%; }
    .ts-ftab { padding: 9px 18px; font-size: .9rem; }
    .ts-card-img.ts-img-missing { aspect-ratio: 16 / 11; }
}

/* ═══════════════════════════════════════════════════════════════
   [T62] بازنشر و نقل‌قول به سبک توییتر — کارت فید، پست تکی، منوی بازنشر
   ═══════════════════════════════════════════════════════════════ */

/* دکمهٔ بازنشر در نوار تعاملات کارت */
.ts-card .ts-act--repost { color: var(--ts-mute, #8d99aa); }
.ts-card .ts-act--repost:hover { color: #17bf63; background: rgba(23,191,99,.10); }
.ts-card .ts-act--repost.reposted { color: #17bf63; }
.ts-card .ts-act--repost.reposted i { filter: drop-shadow(0 0 6px rgba(23,191,99,.5)); }
.ts-card .ts-act--repost.is-busy { pointer-events: none; opacity: .65; }
.ts-card .ts-act--repost.pop i { animation: tsRepostSpin .55s cubic-bezier(.2,.9,.3,1.3); }
@keyframes tsRepostSpin { 0% { transform: rotate(0); } 55% { transform: rotate(200deg); } 100% { transform: rotate(360deg); } }

/* برچسب «فلانی بازنشر کرد» — چیپِ سبزِ کم‌رنگ، لینک به نمایهٔ بازنشرکننده [T86c9] */
/* [T86cg] چیپ بازنشر هم‌شکل برچسب سنجاق داخل سربرگ — همان رنگ سبز (دستور مدیر: id=49) */
.ts-repost-flag {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: .7rem; font-weight: 700; line-height: 1.4; color: #17bf63;
    background: rgba(23,191,99,.08); border: 1px solid rgba(23,191,99,.16);
    border-radius: 999px; padding: 2.5px 9px;
    margin: 0; text-decoration: none !important;
    white-space: nowrap; flex-shrink: 0;
    transition: background .15s ease, border-color .15s ease;
}
.ts-repost-flag i { font-size: .78rem; }
a.ts-repost-flag:hover { background: rgba(23,191,99,.15); border-color: rgba(23,191,99,.35); color: #0f9d58; }

/* جعبهٔ نقل‌قول داخل کارت — مینیمال به سبک توییتر [T86c9] */
.ts-quote-box {
    display: flex; flex-direction: column; gap: 5px;
    border: 1px solid var(--gray-200, #e7ebf2); border-radius: 12px;
    padding: 9px 12px 10px; margin: 2px 0;
    background: transparent; text-decoration: none !important; color: inherit;
    transition: background .15s ease, border-color .15s ease;
}
.ts-quote-box:hover { background: rgba(23,191,99,.045); border-color: rgba(23,191,99,.4); }
.ts-quote-head { display: flex; align-items: center; gap: 7px; min-width: 0; }
.ts-quote-head img { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.ts-quote-head b { font-size: .78rem; color: var(--t, #151a24); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ts-quote-ago { font-size: .7rem; color: var(--ts-mute, #8d99aa); white-space: nowrap; }
.ts-quote-mark { display: inline-flex; flex: 0 0 auto; margin-inline-start: auto; color: #17bf63; opacity: .8; }
.ts-quote-text {
    font-size: .82rem; line-height: 1.75; color: var(--tt, #45505f);
    overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
}
.ts-quote-img img {
    width: 100%; max-height: 150px; object-fit: cover;
    border-radius: 8px; display: block;
}

/* منوی کوچک بازنشر/نقل‌قول (توییتری) */
.ts-repost-pop {
    position: fixed; z-index: 999999; min-width: 170px;
    background: var(--w, #fff); border: 1px solid var(--b, #e7ebf2);
    border-radius: 14px; box-shadow: 0 14px 38px rgba(16,24,40,.18);
    overflow: hidden; direction: rtl; font-family: inherit;
    animation: tsRepostPopIn .12s ease-out;
}
@keyframes tsRepostPopIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.ts-repost-opt {
    display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 11px 15px; border: 0; background: transparent; cursor: pointer;
    font: inherit; font-size: .86rem; font-weight: 700; color: var(--t, #151a24);
    text-align: right;
}
.ts-repost-opt:hover { background: rgba(23,191,99,.09); color: #17bf63; }
.ts-repost-opt i { width: 18px; text-align: center; color: #17bf63; }

/* [T63] فلش کارتِ تزریق‌شدهٔ بازنشر — لحظهٔ درج در فید، بدون رفرش */
.ts-card.ts-flash { animation: tsCardFlash 1.5s ease-out; }
@keyframes tsCardFlash {
    0%   { background: rgba(23,191,99,.14); box-shadow: 0 0 0 2px rgba(23,191,99,.35); }
    60%  { background: rgba(23,191,99,.06); box-shadow: 0 0 0 1px rgba(23,191,99,.18); }
    100% { background: transparent; box-shadow: none; }
}
body.dark-mode .ts-card.ts-flash { animation: tsCardFlashDark 1.5s ease-out; }
@keyframes tsCardFlashDark {
    0%   { background: rgba(23,191,99,.20); box-shadow: 0 0 0 2px rgba(23,191,99,.4); }
    100% { background: transparent; box-shadow: none; }
}

/* صفحهٔ پست تکی — دکمهٔ بازنشر در نوار اکشن */
.post-actions .action-btn.repost-btn { color: var(--ts, #64748b); }
.post-actions .action-btn.repost-btn:hover { color: #17bf63; background: rgba(23,191,99,.10); }
.post-actions .action-btn.repost-btn.reposted { color: #17bf63; }
.post-actions .action-btn.repost-btn.reposted i { filter: drop-shadow(0 0 6px rgba(23,191,99,.5)); }
.post-actions .action-btn.repost-btn.is-busy { pointer-events: none; opacity: .65; }

/* صفحهٔ پست تکی — جعبهٔ پست مرجع (بازنشر/نقل‌قول) */
.t62-embed {
    margin: 14px 0 4px; border: 1px solid var(--b2, #e7ebf2);
    border-radius: 16px; overflow: hidden; background: var(--w, #fff);
}
.t62-embed-flag {
    display: flex; align-items: center; gap: 7px;
    padding: 9px 14px; font-size: .78rem; font-weight: 800; color: #17bf63;
    background: rgba(23,191,99,.07); border-bottom: 1px dashed rgba(23,191,99,.3);
}
.t62-embed-flag--quote { color: #0e7490; background: rgba(0,212,255,.07); border-bottom-color: rgba(0,212,255,.3); }
.t62-embed-card {
    display: flex; flex-direction: column; gap: 8px; padding: 12px 14px;
    text-decoration: none !important; color: inherit;
    transition: background .15s ease;
}
.t62-embed-card:hover { background: rgba(23,191,99,.045); }
.t62-embed-head { display: flex; align-items: center; gap: 8px; }
.t62-embed-head img { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; }
.t62-embed-head b { font-size: .84rem; color: var(--t, #151a24); }
.t62-embed-text {
    font-size: .85rem; line-height: 1.9; color: var(--tt, #45505f);
    overflow: hidden; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
}
.t62-embed-img img { width: 100%; max-height: 260px; object-fit: cover; border-radius: 12px; display: block; }

/* تم تاریک */
body.dark-mode .ts-quote-box { border-color: #2b3450; }
body.dark-mode .ts-quote-box:hover { border-color: rgba(23,191,99,.45); }
body.dark-mode .ts-repost-flag { background: rgba(23,191,99,.13); border-color: rgba(23,191,99,.26); }
body.dark-mode .ts-repost-pop { background: #1b2231; border-color: #2b3450; box-shadow: 0 14px 38px rgba(0,0,0,.5); }
body.dark-mode .ts-repost-opt { color: var(--t, #f2f4fa); }
body.dark-mode .t62-embed { background: #1b2231; border-color: #2b3450; }