/* ============================================================
   SAREVO — استایل مستقل (جدا از ARADES، هم‌خانواده در رنگ و حس)
   ============================================================ */
:root{
  /* ارتفاع واقعیِ بار بالا با جاوااسکریپت اندازه‌گیری و اینجا ست می‌شود (رفع باگ:
     عدد ثابت ۶۰px با ارتفاع واقعیِ .sv-topbar در مرورگرها/فونت‌های مختلف یکی نبود
     و همین باعث می‌شد در لپ‌تاپ کل صفحه کمی اسکرول بخورد و قسمت پیام‌ها/کامپوزر
     از پایین صفحه بیرون بزند یا کمی پایین‌تر از حد انتظار بنشیند) */
  --topbar-h:60px;
  --bg:#06070c;
  --bg-soft:#0d1120;
  --surface: rgba(255,255,255,0.055);
  --surface-strong: rgba(255,255,255,0.095);
  --border: rgba(255,255,255,0.09);
  --border-strong: rgba(255,255,255,0.2);
  --text:#f6f7fd;
  --text-dim:#aab0c6;
  --text-faint:#6a6f83;
  --blue:#2fd8ff;
  --violet:#b34fff;
  --cyan:#00ffc2;
  --danger:#ff6b81;
  --success:#4be3a8;
  --grad-1: linear-gradient(135deg,var(--blue) 0%, var(--violet) 100%);
  --r-sm:14px; --r-md:20px; --r-lg:28px;
  --ease: cubic-bezier(.16,.84,.32,1);
  --ease-back: cubic-bezier(.34,1.56,.64,1);
  --font: 'Vazirmatn', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
/* رفع باگ موبایل: روی گوشی، لمس نزدیک لبه‌ی صفحه (مثلا دکمه‌های کوچک ویرایش عکس/کاور در
   صفحه‌ی ویرایش پروفایل) گاهی به‌اشتباه به‌عنوان اسوایپ «برگشت» توسط خودِ مرورگر گوشی
   تفسیر می‌شود و کاربر حس می‌کند «صفحه بسته شد». این تنظیم آن رفتار را مهار می‌کند بدون
   اینکه روی اسکرول افقی نوارهای دیگر (استوری‌ها، دسته‌بندی برنامه‌ها و...) اثر بگذارد. */
html, body{overscroll-behavior-x:contain;}
body{
  background:var(--bg); color:var(--text); font-family:var(--font);
  font-size:16.5px; line-height:1.8; min-height:100vh; -webkit-font-smoothing:antialiased;
  overscroll-behavior-x:contain;
}
body::before{
  content:''; position:fixed; inset:-10%; z-index:0; pointer-events:none;
  background:
    radial-gradient(900px 600px at 85% -5%, rgba(47,216,255,0.16), transparent 60%),
    radial-gradient(800px 700px at 0% 30%, rgba(179,79,255,0.12), transparent 60%);
}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer; border:none; background:none; color:inherit;}
img,svg{display:block; max-width:100%;}
::-webkit-scrollbar{width:9px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--blue),var(--violet)); border-radius:10px;}
.hidden{display:none !important;}

/* ============ قفلِ اسکرولِ صفحه — فقط وقتی پیام‌رسان باز است ============
   با این کلاس، خودِ body دیگر اسکرول نمی‌خورد (نه با دست کشیدن، نه با اسکرول موس)؛
   اسکرول همیشه داخل لیست پیام‌ها (.sv-dm-messages) می‌ماند و هیچ فضای خالی‌ای
   زیرِ کارتِ چت دیده نمی‌شود. */
body.sv-scroll-locked{
  position:fixed; inset:0; width:100%; overflow:hidden; overscroll-behavior:none;
}

/* ============ لودر اولیه ============ */
#sv-loading{position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:50; color:var(--text-faint); font-size:14px;}

/* ============ بار بالای برنامه ============ */
.sv-topbar{
  position:sticky; top:0; z-index:40; display:flex; align-items:center; justify-content:space-between;
  padding:12px 22px; background:rgba(13,17,32,.85); backdrop-filter:blur(14px); border-bottom:1px solid var(--border);
}
.sv-brand{display:flex; align-items:center; gap:8px; font-weight:800; font-size:18px;}
.sv-brand svg{width:26px; height:26px;}
.sv-topbar-actions{display:flex; align-items:center; gap:10px;}
.sv-back-link{
  padding:clamp(5px,1.8vw,8px) clamp(8px,3.2vw,16px); border-radius:999px; background:var(--surface); border:1px solid var(--border);
  font-size:clamp(10px,3vw,12.5px); font-weight:600; transition:.2s; white-space:nowrap; flex-shrink:0;
}
.sv-back-link:hover{border-color:var(--cyan);}
.sv-admin-btn{
  padding:clamp(5px,1.8vw,8px) clamp(10px,3.2vw,16px); border-radius:999px; background:var(--grad-1); color:#06070c;
  font-size:clamp(10px,3vw,12.5px); font-weight:800; white-space:nowrap; flex-shrink:0; transition:.2s; box-shadow:0 0 0 1px rgba(255,255,255,.08) inset;
}
.sv-admin-btn:hover{filter:brightness(1.1); transform:translateY(-1px);}
.sv-user-chip{display:flex; align-items:center; gap:8px; font-size:13px;}
.sv-user-chip .sv-avatar-sm{width:30px;height:30px;border-radius:50%;background:var(--grad-1);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#fff;flex-shrink:0;}
.sv-logout-btn{font-size:12px; color:var(--text-faint); padding:6px 10px; border-radius:999px; border:1px solid var(--border);}
.sv-logout-btn:hover{color:var(--danger); border-color:var(--danger);}

/* ============ صفحه‌ی ورود / پروفایل — گیت تمام‌صفحه، مثل ورود به یک سایت جدید ============ */
.sv-gate{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:40px 16px; position:relative; z-index:1;
}
.sv-gate-card{
  width:100%; max-width:420px; background:var(--bg-soft); border:1px solid var(--border-strong);
  border-radius:var(--r-lg); padding:34px 30px; animation:svPop .5s var(--ease-back);
}
@keyframes svPop{ from{opacity:0; transform:translateY(16px);} to{opacity:1; transform:translateY(0);} }
.sv-gate-brand{display:flex; flex-direction:column; align-items:center; gap:10px; margin-bottom:22px; text-align:center;}
.sv-gate-brand svg{width:44px; height:44px;}
.sv-gate-brand b{font-size:22px; font-weight:800;}
.sv-gate-brand span{font-size:13px; color:var(--text-faint);}
.sv-tabs{display:flex; gap:6px; background:var(--surface); border-radius:999px; padding:5px; margin-bottom:22px;}
.sv-tab{flex:1; text-align:center; padding:9px; border-radius:999px; font-size:13.5px; font-weight:700; color:var(--text-dim);}
.sv-tab.active{background:var(--grad-1); color:#fff;}
.sv-field{margin-bottom:14px; display:flex; flex-direction:column; gap:7px;}
.sv-field label{font-size:12.5px; color:var(--text-dim);}
.sv-field input, .sv-field textarea, .sv-field select{
  background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:12px; padding:12px 14px;
  color:var(--text); font-size:14px; font-family:inherit; width:100%;
}
/* رفع باگ: پنجره‌ی بازشوی select (مثلا انتخاب دسته‌بندی برنامه) در اکثر مرورگرها با پس‌زمینه‌ی
   سفیدِ پیش‌فرض سیستم رندر می‌شود؛ چون رنگ متن از والد سفید (var(--text)) به ارث می‌رسید،
   نتیجه متن سفید روی زمینه‌ی سفید و نامرئی بود. این‌جا برای خودِ گزینه‌ها پس‌زمینه و رنگِ
   مشخص و تیره تنظیم می‌شود تا در حالت باز هم خوانا بمانند. */
.sv-field select option{ background:var(--bg-soft); color:var(--text); }
.sv-compose-poll-box select option{ background:var(--bg-soft); color:var(--text); }
.sv-field input:focus, .sv-field textarea:focus{outline:none; border-color:var(--cyan); background:rgba(255,255,255,.06);}
.sv-field-row{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.sv-counter{font-size:11px; color:var(--text-faint); font-family:var(--font-mono);}
.sv-counter.warn{color:var(--danger);}
.sv-btn{
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:13px; border-radius:999px;
  font-weight:700; font-size:14.5px; background:var(--grad-1); color:#fff; transition:.25s;
}
.sv-btn:hover{transform:translateY(-2px); box-shadow:0 12px 28px -10px rgba(179,79,255,.55);}
.sv-btn:disabled{opacity:.6; cursor:default; transform:none;}
.sv-btn-ghost{background:var(--surface); border:1px solid var(--border-strong); color:var(--text);}
.sv-msg{min-height:18px; font-size:13px; text-align:center; margin:4px 0 10px;}
.sv-msg.error{color:var(--danger);}
.sv-msg.success{color:var(--success);}
.sv-switch{text-align:center; font-size:13px; color:var(--text-dim); margin-top:16px;}
.sv-switch a{color:var(--cyan); font-weight:700; cursor:pointer;}
.sv-gate-note{font-size:12px; color:var(--text-faint); text-align:center; margin-top:16px; line-height:1.9;}

/* اضافه‌شده: دکمه‌ی نمایش/مخفی‌کردن رمز عبور (فرم ثبت‌نام) */
.sv-pass-wrap{position:relative; display:flex;}
.sv-pass-wrap input{width:100%; padding-left:44px;}
.sv-pass-toggle{
  position:absolute; left:6px; top:50%; transform:translateY(-50%);
  width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  border-radius:8px; font-size:15px; color:var(--text-dim); background:transparent;
}
.sv-pass-toggle:hover{color:var(--cyan); background:rgba(255,255,255,.06);}

/* اضافه‌شده: کپچای ریاضی (فرم ثبت‌نام) */
.sv-captcha-field label{line-height:1.7;}
.sv-captcha-row{display:flex; gap:8px;}
.sv-captcha-row input{flex:1;}
.sv-captcha-refresh{
  width:44px; flex-shrink:0; border-radius:12px; border:1px solid var(--border);
  background:rgba(255,255,255,.04); color:var(--text-dim); font-size:16px;
}
.sv-captcha-refresh:hover{color:var(--cyan); border-color:var(--cyan);}

/* ============ شل اصلی اپ ============ */
.sv-shell{display:flex; min-height:calc(100vh - var(--topbar-h)); min-height:calc(100dvh - var(--topbar-h)); position:relative; z-index:1;}
.sv-nav{
  width:230px; flex-shrink:0; border-left:1px solid var(--border); padding:20px 12px;
  display:flex; flex-direction:column; justify-content:flex-start; gap:4px;
  position:sticky; top:var(--topbar-h); align-self:flex-start;
  max-height:calc(100vh - var(--topbar-h)); max-height:calc(100dvh - var(--topbar-h));
  overflow-y:auto;
}
.sv-nav-item{
  display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:999px; font-size:14px; font-weight:600;
  color:var(--text-dim); transition:.2s;
}
.sv-nav-item svg{width:20px;height:20px; fill:none; stroke:currentColor; stroke-width:1.8; flex-shrink:0;}
.sv-nav-item:hover{background:var(--surface); color:var(--text);}
.sv-nav-item.active{background:var(--surface-strong); color:var(--cyan);}
.sv-nav-compose{margin-top:10px; background:var(--grad-1); color:#fff;}
.sv-nav-compose:hover{opacity:.92; color:#fff;}
/* امکان جدید: نقطه‌ی نشان‌دهنده‌ی تعداد اعلان‌های خوانده‌نشده */
.sv-nav-notif{position:relative;}
.sv-nav-badge{margin-right:auto; background:var(--danger); color:#fff; font-size:11px; font-weight:800; min-width:19px; height:19px; padding:0 5px; border-radius:999px; display:flex; align-items:center; justify-content:center; font-family:var(--font-mono);}

/* ============ امکان جدید: پیام‌رسان مستقیم (DM) ============ */
.sv-dm-wrap{display:flex; height:calc(100vh - var(--topbar-h)); height:calc(100dvh - var(--topbar-h)); border-radius:18px; overflow:hidden; border:1px solid var(--border); background:var(--surface); box-shadow:0 20px 50px -20px rgba(0,0,0,.45);}
.sv-dm-list-pane{width:320px; flex-shrink:0; border-left:1px solid var(--border); display:flex; flex-direction:column; min-width:0; background:var(--surface);}
.sv-dm-list-head{padding:18px 18px 10px;}
.sv-dm-list-head h2{font-size:18px; font-weight:900; letter-spacing:-.3px;}
.sv-dm-list{flex:1; overflow-y:auto; padding:6px;}
.sv-dm-conv-row{display:flex; align-items:center; gap:10px; padding:10px; border-radius:14px; cursor:pointer; transition:.15s; position:relative;}
.sv-dm-conv-row:hover{background:var(--surface-strong);}
.sv-dm-conv-row.active{background:var(--surface-strong); box-shadow:inset 0 0 0 1.5px var(--cyan);}
.sv-dm-conv-avatar{width:46px;height:46px;border-radius:50%; background:var(--grad-1); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:15px; flex-shrink:0; box-shadow:0 4px 14px -4px rgba(47,216,255,.4);}
.sv-dm-conv-body{min-width:0; display:flex; flex-direction:column; gap:2px;}
.sv-dm-conv-body b{font-size:13.5px;}
.sv-dm-conv-body span{font-size:12px; color:var(--text-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:190px;}
.sv-dm-conv-row.unread .sv-dm-conv-body span{color:var(--text); font-weight:600;}
.sv-dm-conv-badge{margin-right:auto; background:var(--grad-1); color:#fff; font-size:10.5px; font-weight:800; min-width:18px; height:18px; padding:0 5px; border-radius:999px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.sv-dm-chat-pane{flex:1; min-width:0; display:flex; flex-direction:column; background:
    radial-gradient(700px 400px at 100% -10%, rgba(47,216,255,.05), transparent 60%),
    radial-gradient(600px 500px at 0% 110%, rgba(179,79,255,.05), transparent 60%),
    var(--bg);}
.sv-dm-chat-head{display:flex; align-items:center; gap:10px; padding:12px 16px; border-bottom:1px solid var(--border); flex-shrink:0; background:var(--surface); backdrop-filter:blur(6px);}
.sv-dm-back-btn{display:none; width:32px; height:32px; border-radius:50%; align-items:center; justify-content:center; color:var(--text-dim); flex-shrink:0;}
.sv-dm-back-btn:hover{background:var(--surface-strong);}
.sv-dm-back-btn svg{width:18px;height:18px;}
.sv-dm-chat-user{display:flex; align-items:center; gap:10px; color:var(--text); min-width:0;}
.sv-dm-chat-user b{font-size:14px;}
.sv-dm-chat-user span{display:block; font-size:11.5px; color:var(--text-faint); font-family:var(--font-mono);}
.sv-dm-messages{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; padding:16px; display:flex; flex-direction:column; gap:4px;}
.sv-dm-load-older{text-align:center; font-size:12px; color:var(--cyan); cursor:pointer; padding:8px; font-weight:700;}
.sv-dm-msg-row{display:flex; align-items:flex-end; gap:6px; max-width:78%; margin-bottom:6px; animation:svDmIn .18s ease;}
@keyframes svDmIn{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);} }
.sv-dm-msg-row.mine{align-self:flex-end; flex-direction:row-reverse;}
.sv-dm-msg-row.theirs{align-self:flex-start;}
.sv-dm-bubble{background:var(--surface-strong); border-radius:16px; padding:9px 13px; position:relative; min-width:40px; box-shadow:0 2px 10px -4px rgba(0,0,0,.3);}
.sv-dm-msg-row.mine .sv-dm-bubble{background:var(--grad-1); color:#fff; box-shadow:0 6px 18px -8px rgba(47,216,255,.45);}
.sv-dm-msg-row.mine .sv-dm-bubble{border-bottom-left-radius:5px;}
.sv-dm-msg-row.theirs .sv-dm-bubble{border-bottom-right-radius:5px;}
.sv-dm-text{font-size:13.5px; line-height:1.7; white-space:pre-wrap; word-break:break-word;}
.sv-dm-img{width:auto; max-width:min(320px,72vw); max-height:380px; min-width:140px; border-radius:12px; display:block; margin-bottom:6px; cursor:zoom-in; transition:.15s; object-fit:cover;}
.sv-dm-img:hover{filter:brightness(.92);}
/* ============ لایت‌باکس نمایش تمام‌صفحه‌ی عکس پیام (جدید) ============ */
.sv-img-lightbox{position:fixed; inset:0; background:rgba(0,0,0,.92); z-index:500; display:flex; align-items:center; justify-content:center; padding:20px; animation:svFadeIn .15s ease;}
.sv-img-lightbox img{max-width:100%; max-height:100%; object-fit:contain; border-radius:8px; user-select:none; -webkit-user-drag:none;}
.sv-img-lightbox-close{position:absolute; top:16px; left:16px; width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; font-size:20px; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(6px);}
.sv-img-lightbox-close:hover{background:rgba(255,255,255,.22);}
.sv-img-lightbox-download{position:absolute; top:16px; right:16px; width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; font-size:18px; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(6px); text-decoration:none;}
.sv-img-lightbox-download:hover{background:rgba(255,255,255,.22);}
@keyframes svFadeIn{from{opacity:0} to{opacity:1}}
.sv-dm-deleted{font-size:12.5px; font-style:italic; opacity:.7;}
.sv-dm-meta{font-size:10px; opacity:.7; margin-top:3px; display:flex; gap:6px; justify-content:flex-end;}
.sv-dm-reply-quote{font-size:11.5px; opacity:.8; border-right:2px solid currentColor; padding-right:8px; margin-bottom:5px; max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.sv-dm-msg-menu{display:flex; gap:2px; opacity:0; transition:.15s;}
.sv-dm-msg-row:hover .sv-dm-msg-menu{opacity:1;}
.sv-dm-msg-menu button{width:26px;height:26px;border-radius:50%; font-size:12px; display:flex; align-items:center; justify-content:center; color:var(--text-dim);}
.sv-dm-msg-menu button:hover{background:var(--surface-strong);}
.sv-dm-reply-bar{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 14px; background:var(--surface-strong); font-size:12px; border-top:1px solid var(--border);}
.sv-dm-reply-bar button{color:var(--text-faint); font-size:14px;}
.sv-dm-image-preview{padding:10px 14px 0; position:relative; display:inline-flex;}
.sv-dm-image-preview img{max-height:90px; border-radius:10px; box-shadow:0 4px 14px -4px rgba(0,0,0,.4);}
.sv-dm-image-preview button{position:absolute; top:4px; left:18px; width:20px;height:20px; border-radius:50%; background:rgba(0,0,0,.6); color:#fff; font-size:11px; display:flex; align-items:center; justify-content:center;}
.sv-dm-composer{display:flex; align-items:flex-end; gap:8px; padding:12px 14px; border-top:1px solid var(--border); position:relative; flex-shrink:0; background:var(--surface); padding-bottom:calc(12px + env(safe-area-inset-bottom));}
.sv-dm-tool-btn{width:36px;height:36px; border-radius:50%; font-size:18px; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--text-dim); transition:.15s;}
.sv-dm-tool-btn:hover{background:var(--surface-strong); color:var(--cyan);}
.sv-dm-composer textarea{flex:1; resize:none; background:var(--surface-strong); border:1.5px solid transparent; border-radius:20px; padding:9px 16px; font-family:inherit; font-size:13.5px; color:var(--text); max-height:120px; line-height:1.6; outline:none; transition:border-color .15s, background .15s;}
.sv-dm-composer textarea:focus{border-color:var(--cyan); background:var(--surface);}
.sv-dm-send-btn{width:38px;height:38px; border-radius:50%; background:var(--grad-1); color:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:transform .12s ease, box-shadow .12s ease;}
.sv-dm-send-btn:hover:not(:disabled){transform:scale(1.06); box-shadow:0 6px 16px -4px rgba(47,216,255,.5);}
.sv-dm-send-btn:active:not(:disabled){transform:scale(.94);}
.sv-dm-send-btn svg{width:17px;height:17px;}
.sv-dm-send-btn:disabled{opacity:.5;}
.sv-dm-char-counter{position:absolute; top:-20px; left:16px; font-size:11px; color:var(--text-faint); background:var(--bg-soft); padding:2px 8px; border-radius:8px; pointer-events:none; transition:color .15s;}
.sv-dm-char-counter-warn{color:var(--danger); font-weight:700;}
.sv-emoji-panel{position:absolute; bottom:56px; right:14px; background:var(--surface-strong); border:1px solid var(--border); border-radius:14px; padding:10px; display:grid; grid-template-columns:repeat(8,1fr); gap:4px; width:280px; max-height:200px; overflow-y:auto; box-shadow:0 10px 30px rgba(0,0,0,.4); z-index:5;}
.sv-emoji-panel span{cursor:pointer; font-size:18px; text-align:center; padding:4px; border-radius:8px;}
.sv-emoji-panel span:hover{background:var(--surface);}
.sv-dm-img-counter{text-align:center; font-size:10.5px; color:var(--text-faint); padding-bottom:8px;}
.sv-dm-locked{padding:20px; text-align:center; font-size:13px; color:var(--text-faint); border-top:1px solid var(--border);}
@media (max-width:860px){
  /* روی موبایل، ارتفاعِ گفتگو دیگر به 100dvh (که با کیبورد در همه‌ی مرورگرها درست
     آپدیت نمی‌شود) متکی نیست؛ متغیرِ ‎--sv-vvh که با جاوااسکریپت از visualViewport
     زنده محاسبه می‌شود اولویت دارد، و اگر جاوااسکریپت هنوز اجرا نشده بود، همان
     100dvh قبلی به‌عنوان مقدارِ پیش‌فرض/پشتیبان استفاده می‌شود. */
  .sv-dm-wrap{height:calc(100vh - var(--topbar-h)); height:calc(100dvh - var(--topbar-h)); height:calc(var(--sv-vvh, 100dvh) - var(--topbar-h)); border-radius:0; border:none; position:relative;}
  .sv-dm-list-pane{width:100%; border-left:none;}
  .sv-dm-chat-pane{position:absolute; inset:0; background:var(--bg); transform:translateX(100%); transition:.2s; display:flex;}
  .sv-dm-wrap.sv-dm-chat-active .sv-dm-list-pane{display:none;}
  .sv-dm-wrap.sv-dm-chat-active .sv-dm-chat-pane{transform:translateX(0);}
  .sv-dm-back-btn{display:flex;}
  .sv-main{padding:0 !important;}
  .sv-dm-msg-row{max-width:86%;}
}
/* امکان جدید: صفحه‌ی مرکز اعلان‌ها با دسته‌بندی */
.sv-notif-tabs{display:flex; gap:6px; overflow-x:auto; margin-bottom:16px; padding-bottom:4px;}
.sv-notif-tab{flex-shrink:0; display:flex; align-items:center; gap:6px; padding:8px 15px; border-radius:999px; background:var(--surface); border:1px solid var(--border); font-size:12.5px; font-weight:700; color:var(--text-dim); transition:.15s;}
.sv-notif-tab:hover{border-color:var(--border-strong); color:var(--text);}
.sv-notif-tab.active{background:var(--grad-1); color:#fff; border-color:transparent;}
.sv-notif-tab .sv-notif-tab-dot{background:var(--danger); color:#fff; font-size:10px; font-weight:800; min-width:16px; height:16px; padding:0 4px; border-radius:999px; display:flex; align-items:center; justify-content:center;}
.sv-notif-list{display:flex; flex-direction:column; gap:2px;}
.sv-notif-row{display:flex; align-items:flex-start; gap:12px; padding:14px 10px; border-radius:14px; transition:.15s; position:relative;}
.sv-notif-row:hover{background:var(--surface);}
.sv-notif-row.unread{background:rgba(47,216,255,.06);}
.sv-notif-row.unread::before{content:''; position:absolute; right:2px; top:20px; width:8px; height:8px; border-radius:50%; background:var(--cyan);}
.sv-notif-icon{width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:16px; background:var(--surface-strong);}
.sv-notif-icon.follow{background:rgba(47,216,255,.14); color:var(--cyan);}
.sv-notif-icon.like{background:rgba(255,72,101,.14); color:var(--danger);}
.sv-notif-icon.dislike{background:rgba(160,160,170,.14); color:var(--text-faint);}
.sv-notif-icon.comment,.sv-notif-icon.reply{background:rgba(47,216,255,.14); color:var(--cyan);}
.sv-notif-icon.repost{background:rgba(45,209,140,.14); color:var(--success);}
.sv-notif-icon.quote{background:rgba(179,79,255,.14); color:var(--violet);}
.sv-notif-icon.referral{background:rgba(255,196,0,.14); color:#ffc400;}
.sv-notif-body{flex:1; min-width:0;}
.sv-notif-body b{font-weight:800;}
.sv-notif-text{font-size:13.5px; color:var(--text); line-height:1.7;}
.sv-notif-preview{font-size:12px; color:var(--text-faint); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.sv-notif-time{font-size:11px; color:var(--text-faint); font-family:var(--font-mono); margin-top:4px;}
.sv-notif-avatar{width:38px;height:38px;border-radius:50%;background:var(--grad-1);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:13px;flex-shrink:0;}
.sv-main{flex:1; min-width:0; padding:26px 26px 70px;}
/* رفع باگ: صفحه‌ی پیام‌رسان چون خودش ارتفاعش را دقیقاً به‌اندازه‌ی صفحه (viewport)
   تنظیم می‌کند، این padding اضافی (۲۶ بالا + ۷۰ پایین) باعث می‌شد کل صفحه حدود
   ۹۶ پیکسل از ارتفاع صفحه بلندتر شود؛ کاربر با اسکرول کمی به پایین، یک فضای
   خالی زیر قسمت چت می‌دید. برای صفحه‌ی پیام‌ها این padding حذف می‌شود. */
.sv-main-dm{padding:0 !important;}
.sv-main-inner{max-width:620px; margin:0 auto;}
/* عرض نوار سمت راستی دیگر ثابت نیست: با اندازه‌ی صفحه‌ی دستگاه (بین ۲۲۰ تا ۲۹۰ پیکسل) بزرگ/کوچک می‌شود */
.sv-aside{width:clamp(220px, 20vw, 290px); flex-shrink:0; border-right:1px solid var(--border); padding:22px 18px; align-self:flex-start;}
.sv-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md); padding:16px; margin-bottom:16px;}
.sv-card h4{font-size:13.5px; margin-bottom:8px;}
.sv-card p{font-size:12px; color:var(--text-faint); line-height:1.85;}

/* ============ عنوان صفحه + دکمه‌ی «پست جدید» (به‌جای فرم بالای فید) ============ */
.sv-page-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; gap:12px;}
.sv-page-head h2{font-size:19px; font-weight:800;}
.sv-page-sub{font-size:13px; color:var(--text-faint); margin-top:2px;}
.sv-compose-cta{
  display:flex; align-items:center; gap:8px; padding:11px 20px; border-radius:999px; background:var(--grad-1);
  color:#fff; font-weight:700; font-size:13.5px; flex-shrink:0; transition:.25s;
}
.sv-compose-cta:hover{transform:translateY(-2px); box-shadow:0 10px 24px -8px rgba(47,216,255,.5);}
.sv-compose-cta svg{width:16px;height:16px;}

/* ============ استوری‌ها ============ */
.sv-stories{display:flex; gap:14px; overflow-x:auto; padding-bottom:16px; margin-bottom:8px;}
.sv-story{display:flex; flex-direction:column; align-items:center; gap:6px; flex-shrink:0; width:66px; cursor:pointer; background:none; border:none;}
.sv-story-ring{width:60px;height:60px;border-radius:50%; padding:3px; background:var(--border-strong); position:relative; transition:.2s;}
.sv-story-ring.has-story{background:linear-gradient(135deg,#2fd8ff,#b34fff);}
.sv-story-ring.seen{background:var(--border-strong);}
.sv-story-ring div{width:100%;height:100%;border-radius:50%; background-color:var(--bg); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:16px; border:2px solid var(--bg);}
.sv-story span{font-size:11px; color:var(--text-dim); max-width:66px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.sv-story-add-badge{position:absolute; bottom:-1px; left:-1px; width:20px; height:20px; border-radius:50%; background:var(--cyan); color:#04070e; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:900; border:2.5px solid var(--bg);}
.sv-story-empty-hint{font-size:12px; color:var(--text-faint); padding:6px 2px 14px;}

/* ============ ویوئر تمام‌صفحه‌ی استوری ============ */
.sv-story-viewer-backdrop{position:fixed; inset:0; background:#000; z-index:200; display:flex; align-items:center; justify-content:center;}
.sv-story-viewer{position:relative; width:100%; max-width:420px; height:100%; max-height:100vh; display:flex; flex-direction:column; background:#000;}
@media (min-width:520px){ .sv-story-viewer{max-height:92vh; border-radius:16px; overflow:hidden; margin:auto;} }
.sv-story-progress-row{display:flex; gap:5px; padding:10px 10px 0;}
.sv-story-progress-track{flex:1; height:3px; border-radius:3px; background:rgba(255,255,255,.28); overflow:hidden;}
.sv-story-progress-fill{height:100%; width:0%; background:#fff; border-radius:3px;}
.sv-story-progress-fill.done{width:100% !important;}
.sv-story-viewer-head{display:flex; align-items:center; gap:10px; padding:12px 14px; color:#fff;}
.sv-story-viewer-avatar{width:34px;height:34px;border-radius:50%; background:var(--grad-1); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; flex-shrink:0;}
.sv-story-viewer-names{flex:1; min-width:0;}
.sv-story-viewer-names b{display:block; font-size:13.5px;}
.sv-story-viewer-names span{font-size:11px; opacity:.75;}
.sv-story-viewer-close{color:#fff; font-size:22px; opacity:.85; padding:4px 8px; flex-shrink:0;}
.sv-story-viewer-del{color:#fff; opacity:.85; padding:4px 8px; flex-shrink:0; font-size:18px;}
.sv-story-viewer-body{flex:1; position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#000;}
.sv-story-viewer-body img{max-width:100%; max-height:100%; object-fit:contain; user-select:none; -webkit-user-drag:none;}
.sv-story-viewer-tap-l, .sv-story-viewer-tap-r{position:absolute; top:0; bottom:0; width:35%; z-index:2;}
.sv-story-viewer-tap-l{left:0;} .sv-story-viewer-tap-r{right:0;}
.sv-story-viewer-caption{position:absolute; bottom:0; left:0; right:0; padding:16px 16px 20px; color:#fff; font-size:13.5px; background:linear-gradient(to top, rgba(0,0,0,.6), transparent); text-align:center;}
.sv-story-viewer-views{position:absolute; bottom:10px; right:14px; color:#fff; font-size:11.5px; opacity:.8; display:flex; align-items:center; gap:4px;}

/* ============ کارت پست ============ */
.sv-feed{display:flex; flex-direction:column; gap:14px;}
.sv-post{border:1px solid var(--border); border-radius:var(--r-md); background:var(--surface); padding:16px; transition:border-color .2s;}
.sv-post:hover{border-color:var(--border-strong);}
.sv-post-head{display:flex; align-items:center; gap:10px; margin-bottom:10px;}
.sv-post-avatar{width:40px; height:40px; border-radius:50%; background:var(--grad-1); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:14px; flex-shrink:0;}
.sv-post-names{min-width:0; flex:1;}
.sv-post-names b{display:block; font-size:16px; font-weight:900; letter-spacing:-.2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text);}
.sv-post-names span{font-size:11.5px; color:var(--text-faint); font-family:var(--font-mono);}
.sv-post-foot-time{display:block; margin-top:10px; font-size:11.5px; color:var(--text-faint); font-family:var(--font-mono);}
.sv-post-del{color:var(--text-faint); font-size:12px; flex-shrink:0;}
.sv-post-del:hover{color:var(--danger);}
.sv-post h3{font-size:15.5px; font-weight:700; margin-bottom:6px; cursor:pointer;}
.sv-post h3:hover{color:var(--cyan);}
.sv-post p{font-size:14.5px; line-height:1.9; color:var(--text-dim); white-space:pre-wrap; word-break:break-word;}
.sv-post-actions{display:flex; align-items:center; justify-content:flex-start; gap:clamp(4px,2.6vw,28px); margin-top:12px; border-top:1px solid var(--border); padding-top:10px; flex-wrap:nowrap; width:100%; max-width:100%;}
.sv-post-actions button, .sv-post-actions a{display:flex; align-items:center; gap:clamp(2px,1vw,5px); font-size:clamp(10.5px,3.1vw,12.5px); font-weight:700; color:var(--text-dim); padding:clamp(4px,1.6vw,7px) clamp(4px,2.2vw,10px); border-radius:999px; transition:.18s; flex-shrink:1; min-width:0; white-space:nowrap;}
.sv-post-actions button:hover, .sv-post-actions a:hover{background:var(--surface-strong); color:var(--text); transform:translateY(-1px);}
.sv-post-actions button:active, .sv-post-actions a:active{transform:translateY(0) scale(.94);}
.sv-post-actions .active{color:var(--cyan);}
.sv-post-actions .sv-like.active{color:var(--danger);}
.sv-post-actions .sv-like.active:hover{background:rgba(255,72,101,.12);}
.sv-post-actions .sv-save.active{color:var(--violet);}
.sv-post-actions .sv-save.active:hover{background:rgba(179,79,255,.12);}
.sv-post-actions svg{width:clamp(13px,3.6vw,15px); height:clamp(13px,3.6vw,15px); fill:none; stroke:currentColor; stroke-width:1.8; flex-shrink:0;}
.sv-empty{text-align:center; padding:60px 20px; color:var(--text-faint); font-size:14px;}

/* ============ امکانات جدید پست: دیسلایک/بازنشر/نقل‌قول/سنجاق/نظرسنجی ============ */
.sv-post-actions .sv-dislike.active{color:var(--text-faint); }
.sv-post-actions .sv-dislike.active svg{fill:currentColor;}
.sv-post-actions .sv-repost{position:relative;}
.sv-post-actions .sv-repost.active{color:var(--success);}
.sv-post-actions .sv-repost.active:hover{background:rgba(45,209,140,.12);}
.sv-post-actions .sv-copy-post:hover{color:var(--cyan);}
.sv-post-actions .sv-stats{margin-right:auto; color:var(--text-faint); flex-shrink:0;}
.sv-post-actions .sv-stats:hover{color:var(--amber, #f5a623); background:rgba(245,166,35,.12);}
.sv-copy-toast{position:fixed; bottom:26px; left:50%; transform:translateX(-50%) translateY(12px); background:var(--bg-soft); border:1px solid var(--border-strong); color:var(--text); font-size:13px; font-weight:700; padding:11px 18px; border-radius:999px; box-shadow:0 14px 34px -8px rgba(0,0,0,.6); z-index:3000; opacity:0; transition:opacity .2s ease, transform .2s ease; display:flex; align-items:center; gap:8px; pointer-events:none;}
.sv-copy-toast.show{opacity:1; transform:translateX(-50%) translateY(0);}
.sv-copy-toast svg{width:16px;height:16px; stroke:var(--success); fill:none; stroke-width:2.4; flex-shrink:0;}
/* امکان جدید: منوی بازنشر/نقل‌قول با موقعیت fixed (نه absolute) تا هرگز زیر پست بعدی یا داخل کارت گم نشود و همیشه دیده شود */
.sv-repost-menu{position:fixed; background:var(--bg-soft); border:1px solid var(--border-strong); border-radius:14px; box-shadow:0 18px 40px -8px rgba(0,0,0,.55); min-width:190px; z-index:2000; padding:7px; display:none; opacity:0; transform:translateY(6px) scale(.97); transition:opacity .16s ease, transform .16s ease;}
.sv-repost-menu.show{display:block; opacity:1; transform:translateY(0) scale(1);}
.sv-repost-menu button{display:flex; align-items:center; gap:9px; width:100%; text-align:right; padding:10px 11px; border-radius:10px; font-size:13px; font-weight:700; color:var(--text);}
.sv-repost-menu button:hover{background:var(--surface-strong); color:var(--cyan);}
.sv-pin-tag{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; color:var(--cyan); font-weight:700; margin-bottom:8px;}
.sv-repost-tag{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; color:var(--text-faint); font-weight:600; margin-bottom:8px;}
.sv-embed-post{border:1px solid var(--border); border-radius:var(--r-sm); padding:12px; margin-top:8px; background:rgba(255,255,255,.03);}
.sv-embed-post .sv-embed-head{display:flex; align-items:center; gap:8px; margin-bottom:6px;}
.sv-embed-post .sv-embed-head b{font-size:12.5px;}
.sv-embed-post .sv-embed-head span{font-size:11px; color:var(--text-faint); font-family:var(--font-mono);}
.sv-embed-post .sv-post-avatar{width:26px; height:26px; font-size:11px;}
.sv-embed-post h4{font-size:13.5px; font-weight:700; margin-bottom:4px;}
.sv-embed-post p{font-size:12.5px; color:var(--text-dim); white-space:pre-wrap; word-break:break-word;}
.sv-embed-post img{border-radius:10px; margin-top:8px; max-height:260px; object-fit:cover; width:100%;}
.sv-embed-deleted{font-size:12px; color:var(--text-faint); font-style:italic; padding:10px; border:1px dashed var(--border); border-radius:var(--r-sm); margin-top:8px;}
.sv-poll{display:flex; flex-direction:column; gap:8px; margin-top:10px;}
.sv-poll-option{position:relative; border:1px solid var(--border); border-radius:12px; padding:10px 14px; font-size:13px; font-weight:600; overflow:hidden; text-align:right; transition:.2s;}
.sv-poll-option:hover{border-color:var(--cyan);}
.sv-poll-option .sv-poll-fill{position:absolute; inset:0; background:linear-gradient(90deg, rgba(47,216,255,.18), rgba(179,79,255,.14)); z-index:0; transition:width .4s var(--ease);}
.sv-poll-option .sv-poll-label{position:relative; z-index:1; display:flex; justify-content:space-between; gap:10px;}
.sv-poll-option.voted{border-color:var(--cyan);}
.sv-poll-meta{font-size:11.5px; color:var(--text-faint);}
.sv-compose-poll-box{border:1px solid var(--border); border-radius:var(--r-sm); padding:14px; margin:10px 0; display:none;}
.sv-compose-poll-box.show{display:block;}
.sv-compose-poll-box input{width:100%; margin-bottom:8px; padding:9px 12px; border-radius:10px; border:1px solid var(--border); background:var(--surface); color:var(--text); font-family:inherit; font-size:13px;}
.sv-compose-poll-box select{padding:8px 12px; border-radius:10px; border:1px solid var(--border); background:var(--surface); color:var(--text); font-family:inherit; font-size:12.5px;}
.sv-compose-poll-actions{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:6px;}
.sv-compose-poll-actions button{font-size:12px; color:var(--text-dim); font-weight:600;}
.sv-compose-comments-toggle{display:flex; align-items:center; gap:8px; margin-top:16px; padding:12px 14px; background:var(--surface); border:1px solid var(--border); border-radius:12px; font-size:13px; color:var(--text-dim); cursor:pointer;}
.sv-compose-comments-toggle input{width:16px; height:16px; accent-color:var(--cyan); cursor:pointer;}
.sv-compose-toolbar{display:flex; gap:8px; margin:10px 0; flex-wrap:wrap;}
.sv-compose-toolbar button{display:flex; align-items:center; gap:6px; padding:8px 14px; border-radius:999px; background:var(--surface); border:1px solid var(--border); font-size:12.5px; font-weight:600; transition:.2s;}
.sv-compose-toolbar button:hover, .sv-compose-toolbar button.active{border-color:var(--cyan); color:var(--cyan);}
.sv-quote-modal-overlay{position:fixed; inset:0; z-index:60; background:rgba(4,5,10,.7); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; padding:16px;}
.sv-quote-modal{background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--r-md); padding:20px; width:100%; max-width:480px; max-height:85vh; overflow-y:auto;}
.sv-quote-modal h3{font-size:15px; margin-bottom:12px;}
.sv-quote-modal textarea{width:100%; min-height:80px; padding:10px 12px; border-radius:12px; border:1px solid var(--border); background:var(--surface); color:var(--text); font-family:inherit; font-size:13.5px; resize:vertical;}
.sv-quote-modal input[type=text]{width:100%; margin-bottom:8px; padding:10px 12px; border-radius:12px; border:1px solid var(--border); background:var(--surface); color:var(--text); font-family:inherit; font-size:13.5px;}
.sv-quote-modal-actions{display:flex; justify-content:flex-end; gap:8px; margin-top:14px;}

/* ============ کامنت‌ها (داخل کارت فید و صفحه‌ی تک‌پست) — بازطراحی‌شده ============ */
.sv-comments{margin-top:12px; display:none; flex-direction:column; gap:2px; border-top:1px solid var(--border); padding-top:12px; animation:svCommentsIn .22s var(--ease);}
.sv-comments.show{display:flex;}
@keyframes svCommentsIn{from{opacity:0; transform:translateY(-6px);} to{opacity:1; transform:translateY(0);}}
.sv-comments-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
.sv-comments-head-title{font-size:12.5px; font-weight:800; color:var(--text-dim);}
.sv-comments-sort{display:flex; gap:4px; background:var(--surface); border:1px solid var(--border); border-radius:999px; padding:3px;}
.sv-comments-sort button{font-size:11px; font-weight:700; color:var(--text-faint); padding:4px 10px; border-radius:999px; transition:.15s;}
.sv-comments-sort button.active{background:var(--grad-1); color:#fff;}
.sv-comment-list{display:flex; flex-direction:column; gap:2px;}
.sv-comment-empty{display:flex; flex-direction:column; align-items:center; gap:6px; padding:22px 10px; color:var(--text-faint); font-size:12.5px; text-align:center;}
.sv-comment-empty .em{font-size:26px;}
.sv-comment{display:flex; gap:10px; font-size:12.5px; align-items:flex-start; padding:9px 8px; border-radius:14px; transition:.15s; position:relative;}
.sv-comment:hover{background:var(--surface);}
.sv-comment b{font-weight:700;}
.sv-comment span{color:var(--text-dim);}
.sv-comment-avatar{width:34px;height:34px;border-radius:50%;background:var(--grad-1);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#fff;flex-shrink:0;box-shadow:0 0 0 2px var(--bg-soft), 0 0 0 3.5px rgba(47,216,255,.35);}
.sv-comment-body{flex:1; min-width:0;}
.sv-comment-name-row{display:flex; align-items:baseline; gap:6px; margin:0 2px 3px; text-decoration:none;}
a.sv-comment-avatar,a.sv-comment-name-row{cursor:pointer;}
a.sv-comment-avatar:hover .sv-comment-name,a.sv-comment-name-row:hover .sv-comment-name{text-decoration:underline;}
.sv-comment-name{font-weight:800; font-size:12.5px; color:var(--text);}
.sv-comment-bubble{background:var(--surface-strong); border-radius:4px 14px 14px 14px; padding:9px 13px; display:inline-block; max-width:100%;}
.sv-comment-bubble span{color:var(--text); font-size:13px; line-height:1.8; word-break:break-word;}
.sv-comment-meta{display:flex; align-items:center; gap:14px; margin-top:5px; padding:0 4px; font-size:11.5px; color:var(--text-faint);}
.sv-comment-meta button{font-weight:700; color:var(--text-faint); display:flex; align-items:center; gap:3px; transition:.15s;}
.sv-comment-meta button:hover{color:var(--text);}
.sv-comment-meta .liked{color:var(--danger);}
.sv-comment-meta .sv-cmt-del{opacity:0; transition:.15s;}
.sv-comment:hover .sv-cmt-del{opacity:1;}
.sv-comment-meta .sv-cmt-del:hover{color:var(--danger);}
/* دکمه‌ی «دیدن پاسخ‌ها» — فقط وقتی کامنتی حداقل یک پاسخ دارد نمایش داده می‌شود */
.sv-comment-view-replies{display:flex; align-items:center; gap:4px; color:var(--cyan)!important;}
.sv-comment-view-replies svg{width:12px; height:12px; transition:transform .18s var(--ease);}
.sv-comment-view-replies.open svg{transform:rotate(180deg);}
/* لیست پاسخ‌ها: به‌صورت پیش‌فرض بسته است تا با دکمه‌ی بالا باز شود؛ فقط همین یک خط
   راهنما (border-right) روی کل جعبه کشیده می‌شود، نه روی تک‌تک پاسخ‌ها — به همین
   خاطر پاسخ‌ها هرگز خط‌های تودرتو/روی‌هم نمی‌سازند و مرتب زیر هم می‌چینند. */
.sv-comment-replies{margin-top:8px; margin-right:20px; padding-right:14px; border-right:2px solid var(--border); display:none; flex-direction:column; gap:10px;}
.sv-comment-replies.show{display:flex;}
.sv-comment-replies .sv-comment{padding:6px 8px;}
.sv-comment-replies .sv-comment-replies{display:none!important;} /* بی‌احتیاطی را می‌بندد: پاسخ به پاسخ خط جدید نمی‌سازد */
.sv-comment-reply-form{display:flex; gap:6px; margin-top:8px;}
.sv-comment-reply-form input{flex:1; background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:8px 12px; color:var(--text); font-size:12.5px;}
.sv-comment-reply-form button{padding:0 14px; border-radius:10px; background:var(--grad-1); color:#fff; font-size:12px; font-weight:700;}
.sv-comment-form{display:flex; align-items:flex-end; gap:8px; margin-top:6px; background:var(--surface); border:1.5px solid var(--border); border-radius:18px; padding:6px 6px 6px 14px; transition:border-color .15s;}
.sv-comment-form:focus-within{border-color:var(--cyan);}
.sv-comment-form textarea{flex:1; resize:none; max-height:110px; background:transparent; border:none; outline:none; color:var(--text); font-family:inherit; font-size:12.5px; line-height:1.7; padding:6px 0;}
.sv-comment-form-actions{display:flex; align-items:center; gap:6px; flex-shrink:0;}
.sv-comment-form-count{font-size:10.5px; color:var(--text-faint); min-width:26px; text-align:left;}
.sv-comment-form button.sv-cmt-send{padding:0 16px; height:32px; border-radius:999px; background:var(--grad-1); color:#fff; font-size:12.5px; font-weight:700; transition:.15s;}
.sv-comment-form button.sv-cmt-send:disabled{opacity:.4;}
.sv-comment-form button.sv-cmt-send:not(:disabled):hover{transform:translateY(-1px); box-shadow:0 6px 16px -6px rgba(47,216,255,.5);}

/* ============ شیت اشتراک‌گذاری (پست/پروفایل/برنامه) — پایین‌صفحه، مثل اینستاگرام ============ */
.sv-share-overlay{position:fixed; inset:0; z-index:80; background:rgba(4,5,10,.6); backdrop-filter:blur(4px); display:flex; align-items:flex-end; justify-content:center; animation:svFadeIn .15s ease;}
@keyframes svFadeIn{from{opacity:0;} to{opacity:1;}}
.sv-share-sheet{width:100%; max-width:480px; background:var(--bg-soft); border:1px solid var(--border-strong); border-radius:22px 22px 0 0; padding:18px 16px calc(18px + env(safe-area-inset-bottom)); animation:svSheetUp .22s var(--ease);}
@keyframes svSheetUp{from{transform:translateY(100%);} to{transform:translateY(0);}}
.sv-share-sheet-handle{width:38px; height:4px; border-radius:99px; background:var(--border-strong); margin:0 auto 14px;}
.sv-share-sheet h4{font-size:13.5px; font-weight:800; color:var(--text-dim); margin-bottom:14px; text-align:center;}
.sv-share-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px 6px; margin-bottom:8px;}
.sv-share-opt{display:flex; flex-direction:column; align-items:center; gap:7px; font-size:11px; font-weight:700; color:var(--text-dim);}
.sv-share-opt .ic{width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; transition:.15s; background:var(--surface-strong);}
.sv-share-opt:hover .ic{transform:translateY(-2px) scale(1.06);}
.sv-share-opt.tg .ic{background:linear-gradient(135deg,#2AABEE,#229ED9); color:#fff;}
.sv-share-opt.wa .ic{background:linear-gradient(135deg,#25D366,#128C7E); color:#fff;}
.sv-share-opt.x .ic{background:#000; color:#fff;}
.sv-share-opt.dm .ic{background:var(--grad-1); color:#fff;}
.sv-share-opt.copy .ic{background:var(--surface-strong); color:var(--text);}
.sv-share-link-row{display:flex; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:10px 12px; margin-top:4px;}
.sv-share-link-row span{flex:1; font-size:11.5px; color:var(--text-faint); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; direction:ltr; text-align:right;}
.sv-share-link-row button{font-size:11.5px; font-weight:800; color:var(--cyan); flex-shrink:0;}
.sv-share-cancel{width:100%; text-align:center; padding:12px; margin-top:10px; border-radius:14px; background:var(--surface); font-size:13px; font-weight:700; color:var(--text-dim);}

/* ============ انتخاب مخاطب برای ارسال پست در پیام مستقیم ============ */
.sv-dm-pick-list{max-height:52vh; overflow-y:auto; display:flex; flex-direction:column; gap:2px; margin-top:4px;}
.sv-dm-pick-row{display:flex; align-items:center; gap:10px; padding:9px 6px; border-radius:14px; cursor:pointer; transition:.15s;}
.sv-dm-pick-row:hover{background:var(--surface-strong);}
.sv-dm-pick-avatar{width:40px;height:40px;border-radius:50%; background:var(--grad-1); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:14px; flex-shrink:0;}
.sv-dm-pick-body{min-width:0; flex:1;}
.sv-dm-pick-body b{font-size:13px; display:block;}
.sv-dm-pick-body span{font-size:11.5px; color:var(--text-faint);}
.sv-dm-pick-sent{font-size:11px; font-weight:800; color:var(--success); flex-shrink:0;}
.sv-dm-pick-empty{padding:20px; text-align:center; color:var(--text-faint); font-size:12.5px;}

/* ============ کارت پست ضمیمه‌شده داخل حباب پیام مستقیم — با ابعاد استاندارد پست ============ */
.sv-dm-shared-post{width:250px; max-width:72vw; border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--bg-soft); cursor:pointer; transition:.15s; margin-bottom:2px;}
.sv-dm-msg-row.mine .sv-dm-shared-post{border-color:rgba(255,255,255,.25);}
.sv-dm-shared-post:hover{transform:translateY(-2px); box-shadow:0 10px 24px -10px rgba(0,0,0,.5);}
.sv-dm-shared-post-img{width:100%; height:140px; object-fit:cover; display:block; background:var(--surface-strong);}
.sv-dm-shared-post-body{padding:10px 12px;}
.sv-dm-shared-post-head{display:flex; align-items:center; gap:6px; margin-bottom:4px;}
.sv-dm-shared-post-avatar{width:18px;height:18px;border-radius:50%; background:var(--grad-1); background-size:cover; background-position:center; flex-shrink:0;}
.sv-dm-shared-post-head b{font-size:11px; color:var(--text-dim); font-weight:700;}
.sv-dm-shared-post-title{font-size:12.5px; font-weight:800; color:var(--text); margin-bottom:2px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.sv-dm-shared-post-text{font-size:11.5px; color:var(--text-dim); line-height:1.6; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.sv-dm-shared-post-foot{display:flex; align-items:center; gap:10px; margin-top:7px; font-size:10.5px; color:var(--text-faint); font-weight:700;}
.sv-dm-shared-post.deleted{padding:14px 12px; opacity:.7; cursor:default;}
.sv-dm-shared-post.deleted:hover{transform:none; box-shadow:none;}

/* ============ صفحه‌ی «پست جدید» — تمام‌صفحه، جدا از فید ============ */
.sv-compose-page{max-width:600px;}
.sv-compose-page textarea{min-height:130px; resize:vertical;}
.sv-compose-tips{font-size:12px; color:var(--text-faint); background:var(--surface); border:1px dashed var(--border); border-radius:10px; padding:12px 14px; margin-top:10px; line-height:1.9;}
.sv-compose-footer{display:flex; gap:10px; margin-top:16px;}
.sv-compose-footer .sv-btn-ghost{flex-shrink:0; width:auto; padding:12px 22px;}

/* ============ صفحه‌ی یک پست + بنر مهمان ============ */
.sv-guest-banner{
  display:flex; align-items:center; justify-content:space-between; gap:14px; background:var(--surface-strong);
  border:1px solid var(--border-strong); border-radius:var(--r-md); padding:16px 20px; margin-bottom:20px; flex-wrap:wrap;
}
.sv-guest-banner p{font-size:13.5px;}
.sv-guest-banner .sv-btn{width:auto; padding:10px 20px;}

/* ============ امکان جدید: تیک آبی (احراز هویت) ============ */
.sv-verified-badge{display:inline-flex; align-items:center; justify-content:center; width:1.15em; height:1.15em; flex-shrink:0; vertical-align:-0.16em; filter:drop-shadow(0 1px 5px rgba(47,216,255,.75)) drop-shadow(0 0 10px rgba(179,79,255,.35));}
.sv-verified-badge svg{width:100%; height:100%; display:block;}
.sv-pv-names b .sv-verified-badge{width:1.05em; height:1.05em; margin-right:6px;}
.sv-post-names b .sv-verified-badge{width:1em; height:1em; margin-right:5px;}
.sv-user-row b .sv-verified-badge, .mini-user .sv-verified-badge{width:19px; height:19px; margin-right:4px;}
.sv-comment-name .sv-verified-badge{width:0.95em; height:0.95em; margin-right:4px;}

.sv-verify-locked-chip{position:absolute; bottom:-20px; left:50%; transform:translateX(-50%); white-space:nowrap; font-size:9.5px; font-weight:800; padding:4px 9px; border-radius:999px; background:rgba(255,255,255,.06); color:var(--text-faint); border:1px solid var(--border-strong); cursor:default;}
.sv-verify-locked-chip .lock-ic{margin-left:2px;}

.sv-verify-request-btn{position:absolute; bottom:-2px; left:-2px; width:30px; height:30px; border-radius:50%; background:linear-gradient(135deg,var(--blue),var(--violet)); display:flex; align-items:center; justify-content:center; cursor:pointer; border:3px solid var(--bg); color:#06070c; box-shadow:0 2px 10px rgba(47,216,255,.4); transition:.2s;}
.sv-verify-request-btn:hover{transform:scale(1.08);}
.sv-verify-request-btn svg{width:14px; height:14px; stroke:#06070c; stroke-width:2.6; fill:none;}
.sv-verify-pending-chip{position:absolute; bottom:-8px; left:50%; transform:translateX(-50%); white-space:nowrap; font-size:9.5px; font-weight:800; padding:4px 9px; border-radius:999px; background:rgba(255,204,102,.16); color:var(--warn); border:1px solid rgba(255,204,102,.4);}

.sv-verify-modal-intro{font-size:12.5px; color:var(--text-dim); line-height:1.9; margin-bottom:14px;}
.sv-verify-modal-intro b{color:var(--cyan);}
.sv-verify-field{margin-bottom:14px;}
.sv-verify-field label{display:block; font-size:12.5px; color:var(--text-dim); margin-bottom:6px; font-weight:600;}
.sv-verify-field textarea{width:100%; min-height:90px; resize:vertical; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:12px 14px; color:var(--text); font-family:inherit; font-size:14px; outline:none;}
.sv-verify-field textarea:focus{border-color:var(--blue);}
.sv-verify-field input[type=tel]{width:100%; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:12px 14px; color:var(--text); font-family:inherit; font-size:14px; outline:none;}
.sv-verify-field input[type=tel]:focus{border-color:var(--blue);}
.sv-verify-charcount{font-size:11px; color:var(--text-faint); margin-top:5px; text-align:left; font-family:var(--font-mono);}
.sv-verify-charcount.ok{color:var(--success);}
.sv-verify-charcount.bad{color:var(--danger);}

/* ============ پنل مدیریت — تیک آبی درخشان (استفاده مشترک با پنل ادمین از طریق کلاس مشابه) ============ */


.sv-profile-cover{height:170px; border-radius:var(--r-md); background:linear-gradient(135deg,rgba(47,216,255,.35),rgba(179,79,255,.35)); background-size:cover; background-position:center; position:relative; margin-bottom:-40px;}
.sv-profile-cover-edit{position:absolute; bottom:14px; left:14px; display:flex; align-items:center; gap:8px; padding:11px 20px; border-radius:999px; background:rgba(5,7,14,.72); backdrop-filter:blur(6px); font-size:13.5px; font-weight:700; cursor:pointer; border:1.5px solid rgba(255,255,255,.35); transition:.2s;}
.sv-profile-cover-edit:hover{background:rgba(5,7,14,.9); border-color:var(--cyan); transform:translateY(-1px);}
.sv-profile-cover-edit svg{width:16px;height:16px; flex-shrink:0;}
.sv-profile-cover-edit input{display:none;}
.sv-profile-head{display:flex; align-items:flex-end; justify-content:space-between; padding:0 6px; position:relative; flex-wrap:wrap; gap:12px;}
.sv-profile-avatar-box{position:relative; width:88px; height:88px;}
.sv-profile-avatar{width:88px; height:88px; border-radius:50%; background:var(--grad-1); border:4px solid var(--bg); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:28px;}
.sv-profile-avatar-edit{position:absolute; bottom:2px; left:2px; width:32px; height:32px; border-radius:50%; background:rgba(5,7,14,.75); display:flex; align-items:center; justify-content:center; cursor:pointer; border:1px solid rgba(255,255,255,.3);}
.sv-profile-avatar-edit input{display:none;}
.sv-profile-stats{display:flex; gap:18px; padding-bottom:6px;}
.sv-profile-stats button{text-align:center; font-size:12px; color:var(--text-dim); display:flex; flex-direction:column; gap:2px;}
.sv-profile-stats button:hover b{color:var(--cyan);}
.sv-profile-stats b{display:block; font-size:16px; color:var(--text); font-family:var(--font-mono); transition:.2s;}
.sv-profile-form{margin-top:26px;}

/* ============ صفحه‌ی نمایش پروفایل (خودم/دیگران) ============ */
.sv-pv-top{display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-top:14px; padding:0 6px;}
.sv-pv-names{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.sv-pv-names b{font-size:21px; font-weight:900; display:inline-block; letter-spacing:-.2px;}
.sv-pv-names span{font-size:13.5px; color:var(--text-faint); font-family:var(--font-mono); display:block; margin-top:2px;}
.sv-pv-team{display:inline-block; margin-top:6px; font-size:11.5px; font-weight:700; padding:4px 10px; border-radius:999px; background:var(--surface-strong); color:var(--cyan); border:1px solid var(--border-strong);}
.sv-pv-actions{display:flex; gap:8px; align-items:center;}
.sv-pv-actions .sv-btn{width:auto; padding:10px 22px;}
.sv-pv-share-btn{width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--surface-strong); border:1px solid var(--border-strong); color:var(--text-dim); flex-shrink:0; transition:.2s;}
.sv-pv-share-btn:hover{color:var(--cyan); border-color:var(--cyan); transform:translateY(-1px);}
.sv-pv-share-btn svg{width:16px;height:16px;}
.sv-follow-btn.following{background:var(--surface); border:1px solid var(--border-strong); color:var(--text);}
.sv-pv-bio{margin-top:14px; font-size:14px; line-height:1.9; padding:0 6px; white-space:pre-wrap; color:var(--text);}
.sv-pv-meta{margin-top:14px; display:flex; flex-wrap:wrap; gap:8px; padding:0 6px;}
.sv-pv-meta div{display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--text-dim); background:var(--surface); border:1px solid var(--border); padding:7px 12px; border-radius:999px;}
.sv-pv-meta svg{width:14px;height:14px; stroke:currentColor; fill:none; stroke-width:1.9; flex-shrink:0; color:var(--cyan);}
.sv-pv-meta a{color:var(--cyan);}
.sv-pv-restricted{margin-top:20px; text-align:center; padding:50px 20px; color:var(--text-faint); background:var(--surface); border:1px dashed var(--border-strong); border-radius:var(--r-md);}

/* امکان جدید: پست‌های پروفایل به‌صورت فید عمودی و تمیز (مثل خانه)، نه کارت‌های جعبه‌ای */
.sv-pv-section-title{margin-top:30px; margin-bottom:14px; padding:0 6px; display:flex; align-items:center; gap:8px; font-size:13px; font-weight:800; color:var(--text-faint); text-transform:uppercase; letter-spacing:.5px;}
.sv-pv-section-title svg{width:15px;height:15px; stroke:currentColor; fill:none; stroke-width:2;}
.sv-pv-list{display:flex; flex-direction:column; gap:14px;}

/* ============ امکان جدید: انتشار برنامه توسط کاربران ============ */
.sv-pv-tabs{display:flex; gap:6px; margin-top:26px; border-bottom:1px solid var(--border); padding:0 2px;}
.sv-pv-tab{flex:1; text-align:center; padding:12px 6px; font-size:13.5px; font-weight:700; color:var(--text-faint); background:none; border:none; border-bottom:2px solid transparent; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:6px; transition:.15s;}
.sv-pv-tab svg{width:16px;height:16px; stroke:currentColor; fill:none; stroke-width:2;}
.sv-pv-tab:hover{color:var(--text);}
.sv-pv-tab.active{color:var(--cyan); border-bottom-color:var(--cyan);}
.sv-app-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; margin-top:16px;}
.sv-app-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; cursor:pointer; transition:.15s; display:flex; flex-direction:column;}
.sv-app-card:hover{border-color:var(--border-strong); transform:translateY(-2px);}
.sv-app-card-preview{width:100%; aspect-ratio:16/9; background:var(--bg-soft) center/cover no-repeat; position:relative;}
.sv-app-card-head{display:flex; align-items:center; gap:8px; padding:10px 10px 0;}
.sv-app-card-icon{width:38px;height:38px;border-radius:11px; background:var(--bg-soft) center/cover no-repeat; flex-shrink:0; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-weight:800; color:var(--cyan);}
.sv-app-card-title{font-size:13.5px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.sv-app-card-body{padding:8px 10px 12px; display:flex; flex-direction:column; gap:6px; flex:1;}
.sv-app-card-desc{font-size:11.5px; color:var(--text-dim); line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.sv-app-card-stats{display:flex; align-items:center; gap:10px; font-size:11px; color:var(--text-faint); margin-top:auto;}
.sv-app-card-stats span{display:flex; align-items:center; gap:3px;}
.sv-app-card-stats svg{width:12px;height:12px; stroke:currentColor; fill:none; stroke-width:2;}
.sv-app-open-btn{margin-top:6px; text-align:center; font-size:12px; font-weight:700; padding:8px; border-radius:10px; background:var(--grad-1); color:#fff;}
.sv-app-card-cat{position:absolute; top:8px; left:8px; background:rgba(5,7,14,.72); backdrop-filter:blur(4px); color:#fff; font-size:10.5px; font-weight:700; padding:4px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.2);}
/* امکان جدید: دکمه‌های ویرایش/حذف روی کارتِ برنامه‌ی خودِ کاربر */
.sv-app-card-owner-actions{position:absolute; top:8px; right:8px; z-index:2; display:flex; gap:6px;}
.sv-app-card-owner-actions button{width:30px; height:30px; border-radius:50%; background:rgba(5,7,14,.72); backdrop-filter:blur(4px); color:#fff; border:1px solid rgba(255,255,255,.2); font-size:13px; display:flex; align-items:center; justify-content:center; transition:.15s; line-height:1;}
.sv-app-card-owner-actions button:hover{background:rgba(5,7,14,.92); transform:translateY(-1px);}
.sv-app-card-owner-actions .sv-app-card-delete-btn:hover{background:var(--danger); border-color:var(--danger);}
/* امکان جدید: پنجره‌ی تأییدِ اختصاصیِ SAREVO به‌جای confirm() مرورگر */
.sv-confirm-modal{text-align:center;}
.sv-confirm-icon{width:52px;height:52px; border-radius:50%; background:rgba(255,107,129,.14); color:var(--danger); display:flex; align-items:center; justify-content:center; margin:0 auto 14px;}
.sv-confirm-icon svg{width:26px;height:26px;}
.sv-confirm-title{text-align:center; font-size:16px; font-weight:800; margin-bottom:8px;}
.sv-confirm-text{text-align:center; font-size:13px; color:var(--text-dim); line-height:2; margin-bottom:6px;}
.sv-confirm-actions{display:flex; gap:10px; margin-top:14px;}
.sv-confirm-actions button{flex:1; padding:12px; border-radius:999px; font-size:13px; font-weight:700;}
.sv-confirm-actions .cancel{background:var(--surface); border:1px solid var(--border-strong);}
.sv-confirm-actions .danger{background:var(--danger); color:#fff;}

/* ============ امکان جدید: نوار «پست‌ها / برنامه‌ها» بالای فید خانه + چیپ‌های دسته‌بندی برنامه ============ */
.sv-home-tabs{display:flex; gap:6px; background:var(--surface); border-radius:999px; padding:5px; margin-bottom:18px; max-width:280px;}
.sv-home-tab{flex:1; display:flex; align-items:center; justify-content:center; gap:6px; text-align:center; padding:9px; border-radius:999px; font-size:13px; font-weight:700; color:var(--text-dim); transition:.15s;}
.sv-home-tab svg{width:15px;height:15px; stroke:currentColor; fill:none; stroke-width:2;}
.sv-home-tab.active{background:var(--grad-1); color:#fff;}
.sv-app-cat-chips{display:flex; gap:8px; overflow-x:auto; padding-bottom:6px; margin-bottom:16px; -ms-overflow-style:none; scrollbar-width:none;}
.sv-app-cat-chips::-webkit-scrollbar{display:none;}
.sv-app-cat-chip{flex-shrink:0; display:flex; align-items:center; gap:6px; padding:8px 15px; border-radius:999px; background:var(--surface); border:1px solid var(--border); font-size:12.5px; font-weight:700; color:var(--text-dim); transition:.15s;}
.sv-app-cat-chip:hover{border-color:var(--border-strong); color:var(--text);}
.sv-app-cat-chip.active{background:var(--grad-1); color:#fff; border-color:transparent;}
.sv-app-cat-chip span{opacity:.7; font-family:var(--font-mono); font-size:11px;}

/* فرم انتشار برنامه */
.sv-app-form-row{display:flex; gap:16px; flex-wrap:wrap;}
.sv-app-upload-box{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; width:100%; border:1.5px dashed var(--border-strong); border-radius:var(--r-md); padding:16px; cursor:pointer; text-align:center; color:var(--text-faint); font-size:12.5px; background:var(--surface); transition:.15s; position:relative; overflow:hidden;}
.sv-app-upload-box:hover{border-color:var(--cyan); color:var(--text);}
.sv-app-upload-box.has-image{padding:0; border-style:solid;}
.sv-app-upload-box.has-image img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0;}
.sv-app-upload-box input{position:absolute; inset:0; opacity:0; cursor:pointer;}
.sv-app-icon-box{width:96px;height:96px; border-radius:22px;}
.sv-app-preview-box{flex:1; min-width:200px; aspect-ratio:16/9;}
.sv-app-shots-row{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
.sv-app-shots-row .sv-app-upload-box{aspect-ratio:9/16;}

/* صفحه‌ی جزئیات برنامه */
.sv-app-detail-back{display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--text-dim); margin-bottom:16px; cursor:pointer;}
.sv-app-detail-back svg{width:16px;height:16px; stroke:currentColor; fill:none; stroke-width:2.2;}
.sv-app-detail-top-row{display:flex; align-items:center; justify-content:space-between;}
.sv-app-more{position:relative; flex-shrink:0; margin-bottom:16px;}
.sv-app-more .sv-post-more-btn{background:var(--surface-strong); border:1px solid var(--border);}
.sv-app-edit-modal-overlay{position:fixed; inset:0; z-index:60; background:rgba(4,5,10,.7); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; padding:16px;}
.sv-app-edit-modal{background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--r-md); padding:20px; width:100%; max-width:460px; max-height:85vh; overflow-y:auto;}
.sv-app-edit-modal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px;}
.sv-app-edit-modal-head h3{font-size:15px;}
.sv-app-edit-modal-close{width:28px; height:28px; border-radius:50%; color:var(--text-faint); font-size:14px;}
.sv-app-edit-modal-close:hover{background:var(--surface-strong); color:var(--text);}
/* دکمه‌ی گوشه‌ای خروج از صفحه‌ی تک‌پست — همیشه ثابت روی صفحه می‌ماند تا هنگام اسکرول هم در دسترس باشد.
   با کلیک روی آن به همان‌جایی از فید که کاربر قبلاً پیمایش می‌کرد برمی‌گردد (نه بالای صفحه). */
.sv-post-detail-close{
  position:fixed; top:calc(var(--topbar-h) + 14px); left:16px; z-index:40;
  width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--surface-strong); border:1px solid var(--border); color:var(--text); font-size:17px;
  backdrop-filter:blur(6px); box-shadow:0 8px 22px -8px rgba(0,0,0,.5); transition:.15s;
}
.sv-post-detail-close:hover{background:var(--surface); border-color:var(--border-strong); transform:scale(1.06);}
@media (max-width:860px){
  .sv-post-detail-close{top:calc(var(--topbar-h) + 10px); left:10px; width:36px; height:36px; font-size:15px;}
}
.sv-app-detail-head{display:flex; gap:16px; align-items:flex-start; flex-wrap:wrap;}
.sv-app-detail-icon{width:88px;height:88px; border-radius:22px; background:var(--bg-soft) center/cover no-repeat; border:1px solid var(--border); flex-shrink:0;}
.sv-app-detail-title{font-size:22px; font-weight:900;}
.sv-app-detail-author{font-size:13px; color:var(--text-faint); margin-top:4px;}
.sv-app-detail-author a{color:var(--cyan);}
.sv-app-detail-rating{display:flex; align-items:center; gap:6px; margin-top:8px; font-size:13px; color:var(--text-dim);}
.sv-app-stars{display:inline-flex; gap:2px; direction:ltr;}
.sv-app-stars svg{width:16px;height:16px;}
.sv-app-star-filled{fill:#ffb020; stroke:#ffb020;}
.sv-app-star-empty{fill:none; stroke:var(--text-faint); stroke-width:1.6;}
.sv-app-detail-actions{display:flex; gap:10px; margin-top:16px; flex-wrap:wrap;}
.sv-app-download-btn{background:var(--grad-1); color:#fff; font-weight:800; padding:12px 26px; border-radius:12px; font-size:14px;}
.sv-app-detail-preview{width:100%; border-radius:var(--r-md); margin-top:20px; overflow:hidden; border:1px solid var(--border);}
.sv-app-detail-preview img{width:100%; display:block;}
.sv-app-detail-desc{margin-top:18px; font-size:14px; line-height:2; color:var(--text-dim); white-space:pre-wrap;}
.sv-app-shots-scroll{display:flex; gap:12px; overflow-x:auto; margin-top:18px; padding-bottom:6px;}
.sv-app-shots-scroll img{height:280px; border-radius:14px; border:1px solid var(--border); cursor:pointer; flex-shrink:0;}
.sv-app-rate-box{margin-top:26px; padding:18px; background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md);}
.sv-app-rate-stars{display:inline-flex; gap:6px; direction:ltr; cursor:pointer;}
.sv-app-rate-stars svg{width:26px;height:26px; transition:.1s;}
.sv-app-review-input{width:100%; margin-top:12px; min-height:70px; resize:vertical;}
.sv-app-review-item{padding:14px 0; border-top:1px solid var(--border); display:flex; gap:10px;}
.sv-app-review-item:first-child{border-top:none;}
.sv-app-review-body b{font-size:13px;}
.sv-app-review-body .sv-app-stars{margin:4px 0;}
.sv-app-review-text{font-size:13px; color:var(--text-dim); line-height:1.7;}
.sv-home-apps-row{display:flex; gap:14px; overflow-x:auto; padding-bottom:6px; margin-bottom:6px;}
.sv-home-apps-row .sv-app-card{min-width:170px; max-width:170px; flex-shrink:0;}

/* ============ لیست کاربران (فالوئر/فالووینگ/جستجو) ============ */
.sv-user-row{display:flex; align-items:center; gap:10px; padding:10px 8px; border-radius:12px; transition:.15s;}
.sv-user-row:hover{background:var(--surface);}
.sv-user-row .sv-post-avatar{width:36px;height:36px;font-size:13px;}
.sv-user-row b{display:block; font-size:13.5px;}
.sv-user-row span{font-size:11.5px; color:var(--text-faint); font-family:var(--font-mono);}
/* امکان جدید: دسته‌بندیِ دنبال‌کردن‌ها */
.sv-user-row-wrap{display:flex; align-items:center; gap:4px;}
.sv-user-row-wrap .sv-user-row{flex:1; min-width:0;}
.sv-cat-badge{display:inline-block; margin-right:6px; font-size:10.5px; font-weight:700; color:var(--cyan); background:rgba(47,216,255,.12); border-radius:999px; padding:2px 8px; vertical-align:middle;}
.sv-cat-change-btn{flex-shrink:0; width:32px; height:32px; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:14px; color:var(--text-faint); transition:.15s;}
.sv-cat-change-btn:hover{background:var(--surface-strong); color:var(--text);}
.sv-cat-group{margin-bottom:10px;}
.sv-cat-group-title{font-size:12px; font-weight:800; color:var(--text-faint); padding:8px 8px 4px; display:flex; align-items:center; gap:5px;}
.sv-cat-group-title span{font-weight:600; color:var(--text-faint); opacity:.7;}
.sv-cat-modal{max-width:340px;}
.sv-cat-list{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px;}
.sv-cat-chip{padding:8px 14px; border-radius:999px; background:var(--surface); border:1px solid var(--border); font-size:12.5px; font-weight:700; color:var(--text-dim); transition:.15s;}
.sv-cat-chip:hover{border-color:var(--cyan); color:var(--cyan);}
.sv-cat-new-row{display:flex; gap:8px;}
.sv-cat-new-row input{flex:1; padding:9px 12px; border-radius:10px; border:1px solid var(--border); background:var(--surface); color:var(--text); font-family:inherit; font-size:12.5px;}

/* ============ جستجو ============ */
/* امکان جدید: به‌جای یک نوار جستجوی همیشه-باز که بار بالا را شلوغ می‌کرد،
   فقط یک آیکون کوچک نمایش داده می‌شود؛ با کلیک روی آن، یک کادر جستجوی
   شیک و تمیز درست زیر آیکون باز می‌شود. */
.sv-search-pop{position:relative; margin:0 6px;}
.sv-search-toggle{width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.05); border:1px solid var(--border); color:var(--text-faint); cursor:pointer; transition:background .15s,border-color .15s,color .15s;}
.sv-search-toggle svg{width:17px; height:17px;}
.sv-search-toggle:hover{background:rgba(255,255,255,.09); color:var(--text);}
.sv-search-pop.open .sv-search-toggle{background:var(--cyan); border-color:var(--cyan); color:#06070c;}
.sv-search-wrap{position:absolute; top:calc(100% + 10px); right:0; width:300px; max-width:calc(100vw - 32px); opacity:0; transform:translateY(-6px) scale(.98); pointer-events:none; transition:opacity .16s ease,transform .16s ease; z-index:70;}
.sv-search-pop.open .sv-search-wrap{opacity:1; transform:translateY(0) scale(1); pointer-events:auto;}
.sv-search-wrap input{width:100%; background:var(--bg-soft); border:1px solid var(--border-strong); border-radius:999px; padding:10px 16px; color:var(--text); font-size:13px; font-family:inherit; box-shadow:0 16px 34px -12px rgba(0,0,0,.55);}
.sv-search-wrap input:focus{outline:none; border-color:var(--cyan);}
.sv-search-results{position:relative; margin-top:8px; background:var(--bg-soft); border:1px solid var(--border-strong); border-radius:var(--r-md); padding:8px; max-height:420px; overflow-y:auto; z-index:60; box-shadow:0 20px 40px -14px rgba(0,0,0,.6); display:none;}
.sv-search-results.show{display:block;}
/* در صفحه‌های کوچک، کادر جستجو به‌جای چسبیدن به لبه، وسط صفحه باز می‌شود */
@media (max-width:680px){
  .sv-search-wrap{right:auto; left:50%; width:min(340px, calc(100vw - 24px)); transform:translate(-50%,-6px) scale(.98);}
  .sv-search-pop.open .sv-search-wrap{transform:translate(-50%,0) scale(1);}
}
.sv-search-sec-title{font-size:11px; color:var(--text-faint); padding:8px 10px 4px;}
.sv-search-post-row{display:block; padding:9px 10px; border-radius:10px; font-size:13px;}
.sv-search-post-row:hover{background:var(--surface);}
.sv-search-empty{padding:20px; text-align:center; font-size:12.5px; color:var(--text-faint);}

/* ============ تنظیمات ============ */
.sv-settings-group{margin-bottom:22px;}
.sv-settings-group h4{font-size:13.5px; margin-bottom:10px;}
.sv-radio-row{display:flex; flex-direction:column; gap:8px;}
.sv-radio-opt{display:flex; align-items:flex-start; gap:10px; padding:12px 14px; border-radius:12px; background:var(--surface); border:1px solid var(--border); cursor:pointer; transition:.15s;}
.sv-radio-opt:hover{border-color:var(--border-strong);}
.sv-radio-opt.checked{border-color:var(--cyan); background:var(--surface-strong);}
.sv-radio-opt input{margin-top:3px;}
.sv-radio-opt div b{display:block; font-size:13px; margin-bottom:2px;}
.sv-radio-opt div span{font-size:11.5px; color:var(--text-faint); line-height:1.7;}

/* ============ عکس داخل کارت پست ============ */
.sv-post-image{margin-top:8px; border-radius:14px; overflow:hidden; border:1px solid var(--border); position:relative;}
.sv-post-image-heart{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) scale(0); font-size:80px; pointer-events:none; filter:drop-shadow(0 4px 14px rgba(0,0,0,.4)); z-index:2;}
.sv-post-image-heart.pop{animation:svHeartPop .75s ease forwards;}
@keyframes svHeartPop{
  0%{transform:translate(-50%,-50%) scale(0); opacity:0;}
  25%{transform:translate(-50%,-50%) scale(1.15); opacity:1;}
  40%{transform:translate(-50%,-50%) scale(1); opacity:1;}
  100%{transform:translate(-50%,-50%) scale(1); opacity:0;}
}
.sv-post-image img{width:100%; max-height:420px; object-fit:cover; display:block;}

/* ============ اسلایدر تا ۴ عکس داخل کارت پست ============ */
.sv-post-slider{padding:0;}
.sv-post-slider-track{display:flex; width:100%; transition:transform .32s var(--ease);}
.sv-post-slide{flex:0 0 100%; width:100%;}
.sv-post-slide img{width:100%; max-height:420px; object-fit:cover; display:block;}
.sv-post-slider-nav{position:absolute; top:50%; transform:translateY(-50%); width:32px; height:32px; border-radius:50%; background:rgba(5,7,14,.55); color:#fff; display:flex; align-items:center; justify-content:center; font-size:20px; line-height:1; z-index:3; backdrop-filter:blur(2px);}
.sv-post-slider-prev{left:8px;}
.sv-post-slider-next{right:8px;}
.sv-post-slider-dots{position:absolute; bottom:10px; left:50%; transform:translateX(-50%); display:flex; gap:6px; z-index:3;}
.sv-post-slider-dot{width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.45); cursor:pointer; transition:background .2s, width .2s;}
.sv-post-slider-dot.active{background:#fff; width:16px; border-radius:4px;}
.sv-post-slider-count{position:absolute; top:8px; right:8px; background:rgba(5,7,14,.6); color:#fff; font-size:11px; font-family:var(--font-mono); padding:3px 9px; border-radius:999px; z-index:3;}

/* ============ پیش‌نمایش عکس‌های اسلایدری در صفحه‌ی نوشتن پست ============ */
.sv-compose-image-preview{margin-top:10px; display:none; flex-wrap:wrap; gap:8px;}
.sv-compose-image-thumb{position:relative; width:84px; height:84px; border-radius:12px; overflow:hidden; border:1px solid var(--border);}
.sv-compose-image-thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.sv-compose-image-add{width:84px; height:84px; border-radius:12px; border:1px dashed var(--border-strong); display:flex; align-items:center; justify-content:center; font-size:26px; color:var(--text-faint); cursor:pointer;}
.sv-compose-image-remove{position:absolute; top:5px; left:5px; background:rgba(5,7,14,.75); color:#fff; width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; cursor:pointer;}
.sv-compose-image-btn{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; padding:9px 16px; border-radius:999px; background:var(--surface); border:1px solid var(--border-strong); cursor:pointer; margin-top:10px;}
.sv-compose-image-btn input{display:none;}

/* ============ افزودن کد به پست (دکمه، تراشه‌ی وضعیت، دکمه‌ی مشاهده در کارت) ============ */
#svCpCodeToggle{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; padding:9px 16px; border-radius:999px; background:var(--surface); border:1px solid var(--border-strong); cursor:pointer; margin-top:10px; color:var(--text);}
.sv-compose-code-chip{margin-top:10px; display:flex; align-items:center; gap:8px; background:var(--surface-strong); border:1px solid var(--border-strong); border-radius:14px; padding:10px 14px; font-size:12.5px;}
.sv-compose-code-chip-icon{font-size:16px;}
.sv-compose-code-chip-text{flex:1; color:var(--text-dim);}
.sv-compose-code-chip-text b{color:var(--cyan); font-family:var(--font-mono);}
.sv-compose-code-chip button{font-size:11.5px; font-weight:700; padding:6px 12px; border-radius:999px; background:var(--surface); border:1px solid var(--border-strong); color:var(--text);}
.sv-compose-code-chip #svCpCodeRemove{color:var(--danger); border-color:rgba(255,107,129,.35);}
.sv-post-code-btn{margin-top:10px; display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px; background:linear-gradient(135deg, rgba(47,216,255,.15), rgba(179,79,255,.15)); border:1px solid var(--border-strong); color:var(--text); font-size:13px; font-weight:700; transition:.18s;}
.sv-post-code-btn:hover{background:linear-gradient(135deg, rgba(47,216,255,.28), rgba(179,79,255,.28)); border-color:rgba(47,216,255,.5); transform:translateY(-1px);}
.sv-post-code-btn svg{width:16px; height:16px;}

/* ============ مودالِ نوشتنِ کد (تا ۴۰٬۰۰۰ کاراکتر) ============ */
.sv-code-compose-modal{max-width:640px; width:96%; max-height:88vh; display:flex; flex-direction:column;}
.sv-code-compose-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
.sv-code-compose-head h3{font-size:15px;}
.sv-code-compose-close{font-size:20px; color:var(--text-faint);}
.sv-code-compose-textarea{width:100%; flex:1; min-height:320px; resize:vertical; background:#05070d; color:#d7f8ff; border:1px solid var(--border-strong); border-radius:14px; padding:14px; font-family:var(--font-mono); font-size:13px; line-height:1.7; direction:ltr; text-align:left;}
.sv-code-compose-foot{margin-top:10px;}
.sv-code-compose-actions{display:flex; gap:10px; justify-content:flex-end; margin-top:6px;}
.sv-code-compose-actions .sv-btn, .sv-code-compose-actions .sv-btn-ghost{width:auto; padding:10px 20px;}

/* ============ نمایشگرِ کد — طراحیِ شبیه ویرایشگر کد، تیره، شیشه‌ای و رنگی ============ */
@keyframes svCvFadeIn{ from{opacity:0;} to{opacity:1;} }
@keyframes svCvSlideUp{ from{opacity:0; transform:translateY(14px) scale(.985);} to{opacity:1; transform:translateY(0) scale(1);} }
@keyframes svCvSkelPulse{ 0%,100%{opacity:.35;} 50%{opacity:.9;} }
.sv-code-viewer-backdrop{
  position:fixed; inset:0; z-index:200; display:flex; flex-direction:column;
  background:
    radial-gradient(1100px 500px at 15% -10%, rgba(47,216,255,.10), transparent 60%),
    radial-gradient(900px 600px at 100% 110%, rgba(179,79,255,.10), transparent 60%),
    #06070c;
  animation:svCvFadeIn .18s ease;
}
.sv-code-viewer-backdrop.closing{animation:svCvFadeIn .16s ease reverse;}
.sv-code-viewer{display:flex; flex-direction:column; height:100%; width:100%; animation:svCvSlideUp .22s var(--ease);}
.sv-code-viewer-head{
  display:flex; align-items:center; gap:14px; padding:13px 18px; flex-shrink:0;
  background:rgba(14,16,24,.85); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 1px 0 rgba(47,216,255,.12), 0 8px 24px -12px rgba(0,0,0,.6);
}
.sv-code-viewer-dots{display:flex; gap:6px; flex-shrink:0;}
.sv-code-viewer-dots span{width:11px; height:11px; border-radius:50%; display:block;}
.sv-code-viewer-dots span:nth-child(1){background:#ff5f57;}
.sv-code-viewer-dots span:nth-child(2){background:#febc2e;}
.sv-code-viewer-dots span:nth-child(3){background:#28c840;}
.sv-code-viewer-title{
  flex:1; min-width:0; display:flex; align-items:center; justify-content:center; gap:8px;
  font-size:13px; color:var(--text-faint); font-weight:700;
}
.sv-code-viewer-title svg{width:15px; height:15px; color:var(--cyan); flex-shrink:0;}
.sv-code-viewer-linecount{
  font-family:var(--font-mono); font-size:11px; color:var(--text-faint); background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1); padding:2px 9px; border-radius:999px; flex-shrink:0;
}
.sv-code-viewer-actions{display:flex; align-items:center; gap:8px; flex-shrink:0;}
.sv-code-viewer-copy, .sv-code-viewer-back{
  display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:#fff;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); padding:8px 14px; border-radius:999px;
  transition:.15s;
}
.sv-code-viewer-copy svg{width:14px; height:14px;}
.sv-code-viewer-back{padding:8px 12px; font-size:15px;}
.sv-code-viewer-copy:hover, .sv-code-viewer-back:hover{background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.24);}
.sv-code-viewer-copy.copied{background:rgba(75,227,168,.18); border-color:rgba(75,227,168,.5); color:var(--success);}
.sv-code-viewer-body{flex:1; overflow:auto; padding:22px 22px 70px; -webkit-overflow-scrolling:touch;}
.sv-code-viewer-empty{color:var(--text-faint); text-align:center; padding:60px 0; font-size:14px;}
/* اسکلتِ بارگذاری — چند خطِ محو که به‌آرامی پالس می‌زنند تا حس «در حال آماده‌شدن» بدهند */
.sv-code-viewer-skeleton{display:flex; flex-direction:column; gap:14px; max-width:640px; margin:10px auto 0;}
.sv-code-skel-line{height:13px; border-radius:6px; background:linear-gradient(90deg, rgba(47,216,255,.16), rgba(179,79,255,.16)); animation:svCvSkelPulse 1.3s ease-in-out infinite;}
.sv-code-pre{
  direction:ltr; text-align:left; font-family:var(--font-mono); font-size:13px; line-height:1.9; white-space:pre; color:#e6f1ff;
  max-width:960px; margin:0 auto; padding:18px 0 18px 6px; border-right:1px solid rgba(255,255,255,.06);
}
.sv-code-line{display:grid; grid-template-columns:42px 1fr; column-gap:14px; align-items:start; border-radius:6px; transition:background .12s;}
.sv-code-line:hover{background:rgba(47,216,255,.06);}
.sv-code-line-num{
  color:#4a5568; user-select:none; text-align:right; padding-left:16px;
  -webkit-user-select:none; border-left:2px solid rgba(255,255,255,.06);
}
.sv-code-line-content{white-space:pre-wrap; word-break:break-word; min-width:0;}
.sv-tok-keyword{color:#ff79c6; font-weight:600;}
.sv-tok-string{color:#a5e844;}
.sv-tok-number{color:#ffb86c;}
.sv-tok-comment{color:#6a7a8c; font-style:italic;}
@media (max-width:600px){
  .sv-code-viewer-head{padding:11px 12px; gap:8px;}
  .sv-code-viewer-title span:not(.sv-code-viewer-linecount){display:none;}
  .sv-code-viewer-copy span{display:none;}
  .sv-code-viewer-copy{padding:9px;}
  .sv-code-viewer-body{padding:16px 12px 60px;}
  .sv-code-line{grid-template-columns:26px 1fr; column-gap:8px;}
  .sv-code-line-num{padding-left:8px;}
  .sv-code-pre{font-size:12px;}
}

/* ============ مودال ساده (لیست فالوئر/فالووینگ) ============ */
.sv-modal-backdrop{position:fixed; inset:0; background:rgba(4,5,10,.7); backdrop-filter:blur(3px); z-index:90; display:flex; align-items:center; justify-content:center; padding:16px;}
.sv-modal{width:100%; max-width:380px; max-height:70vh; overflow-y:auto; background:var(--bg-soft); border:1px solid var(--border-strong); border-radius:var(--r-lg); padding:18px;}
.sv-modal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px;}
.sv-modal-head h3{font-size:15px;}
.sv-modal-close{font-size:20px; color:var(--text-faint);}
.sv-stats-modal{max-width:420px;}
.sv-stats-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:14px;}
.sv-stats-card{background:var(--surface-strong); border-radius:14px; padding:12px 8px; text-align:center;}
.sv-stats-card b{display:block; font-size:18px; font-weight:900; color:var(--cyan);}
.sv-stats-card span{font-size:11px; color:var(--text-faint);}
.sv-stats-chart{display:flex; align-items:flex-end; gap:4px; height:90px; margin-bottom:16px; padding:0 2px;}
.sv-stats-bar{flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; height:100%; position:relative;}
.sv-stats-bar-fill{width:100%; background:var(--grad-1); border-radius:5px 5px 0 0; min-height:3px;}
.sv-stats-bar span{font-size:8.5px; color:var(--text-faint); margin-top:3px; white-space:nowrap;}
.sv-stats-section{margin-bottom:12px;}
.sv-stats-section h5{font-size:12.5px; color:var(--text-faint); margin-bottom:6px; font-weight:800;}
.sv-stats-row{display:flex; align-items:center; justify-content:space-between; padding:6px 10px; background:var(--surface-strong); border-radius:10px; font-size:12.5px; margin-bottom:5px;}
.sv-stats-row b{color:var(--text);}
.sv-stats-empty{font-size:12px; color:var(--text-faint); padding:6px 2px;}
.sv-stats-note{font-size:11px; color:var(--text-faint); text-align:center; margin-top:6px;}

/* ============ امکان جدید: سیستم امتیاز — نشان بالای صفحه ============ */
.sv-points-badge{display:flex; align-items:center; gap:5px; background:var(--surface-strong); border:1px solid var(--border-strong); border-radius:999px; padding:6px 12px; font-size:13px; font-weight:800; color:#ffc400; text-decoration:none; transition:transform .15s;}
.sv-points-badge:hover{transform:translateY(-1px);}
.sv-points-badge svg{width:15px; height:15px; fill:#ffc400; stroke:#ffc400;}
.sv-points-badge span{color:var(--text);}

/* ============ امکان جدید: نوار امتیاز/دعوت بالای پروفایل خودم ============ */
.sv-pv-referral-strip{display:flex; align-items:center; gap:14px; background:var(--surface-strong); border:1px solid var(--border-strong); border-radius:16px; padding:12px 16px; margin:10px 0 6px; flex-wrap:wrap;}
.sv-pv-ref-points{display:flex; align-items:center; gap:8px; text-decoration:none; color:inherit;}
.sv-pv-ref-points .ic{font-size:22px;}
.sv-pv-ref-points b{display:block; font-size:17px; font-weight:900; color:#ffc400;}
.sv-pv-ref-points span{font-size:11px; color:var(--text-faint);}
.sv-pv-ref-divider{width:1px; align-self:stretch; background:var(--border-strong);}
.sv-pv-ref-invite{flex:1; min-width:200px;}
.sv-pv-ref-invite-top{font-size:12.5px; color:var(--text-faint); display:flex; align-items:center; gap:5px; margin-bottom:6px;}
.sv-pv-ref-invite-top b{color:var(--text);}
.sv-pv-ref-code{background:var(--bg-soft); border-radius:6px; padding:2px 8px; font-family:var(--font-mono); color:var(--cyan); font-weight:800; letter-spacing:1px;}
.sv-pv-ref-copybtn{padding:6px 12px; font-size:12px;}
.sv-pv-ref-more{font-size:12px; color:var(--cyan); text-decoration:none; white-space:nowrap;}
@media (max-width:520px){ .sv-pv-referral-strip{flex-direction:column; align-items:stretch;} .sv-pv-ref-divider{display:none;} }

/* ============ امکان جدید: دکمه‌ی حرفه‌ای «دعوت دوستان» بالای پروفایل — به صفحه‌ی اختصاصیِ کد دعوت می‌رود ============ */
.sv-pv-invite-cta{
  position:relative; flex:1; min-width:210px; display:flex; align-items:center; gap:12px;
  padding:11px 14px; border-radius:14px; text-decoration:none; color:#fff; overflow:hidden;
  background:linear-gradient(120deg,#ffb100,#ff7a30 55%,#ff4fa3); isolation:isolate;
  box-shadow:0 12px 26px -12px rgba(255,140,0,.55); transition:transform .2s var(--ease-back), box-shadow .2s;
}
.sv-pv-invite-cta:hover{transform:translateY(-2px); box-shadow:0 16px 32px -12px rgba(255,140,0,.7);}
.sv-pv-invite-cta-glow{
  position:absolute; inset:0; z-index:-1; opacity:.55; pointer-events:none;
  background:radial-gradient(120px 60px at 15% 0%, rgba(255,255,255,.45), transparent 70%);
}
.sv-pv-invite-cta-ic{
  flex-shrink:0; width:38px; height:38px; border-radius:11px; background:rgba(255,255,255,.22);
  display:flex; align-items:center; justify-content:center; font-size:19px; backdrop-filter:blur(2px);
}
.sv-pv-invite-cta-txt{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px;}
.sv-pv-invite-cta-txt b{font-size:14px; font-weight:900;}
.sv-pv-invite-cta-txt span{font-size:11px; opacity:.92;}
.sv-pv-invite-cta-arrow{width:16px; height:16px; flex-shrink:0; opacity:.9;}

/* ============ امکان جدید: صفحه‌ی «امتیازهای من» ============ */
.sv-pts-total-card{background:linear-gradient(135deg, rgba(255,196,0,.16), rgba(179,79,255,.12)); border:1px solid var(--border-strong); border-radius:20px; padding:26px 16px; text-align:center; margin-bottom:18px;}
.sv-pts-total-num{font-size:42px; font-weight:900; color:#ffc400; line-height:1;}
.sv-pts-total-label{font-size:13px; color:var(--text-faint); margin-top:6px;}
.sv-pts-section{margin-bottom:20px;}
.sv-pts-section h5{font-size:13px; color:var(--text-faint); margin-bottom:10px; font-weight:800;}
.sv-pts-chart{display:flex; align-items:flex-end; gap:10px; height:130px; padding:16px 12px 12px; background:var(--surface-strong); border-radius:14px;}
.sv-pts-bar{flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; height:100%; max-width:52px; margin:0 auto;}
.sv-pts-bar-fill{width:100%; background:var(--grad-1); border-radius:8px 8px 3px 3px; min-height:4px; box-shadow:0 4px 14px -6px rgba(47,216,255,.55); transition:height .4s var(--ease-back);}
.sv-pts-bar-fill.neg{background:var(--danger); box-shadow:0 4px 14px -6px rgba(255,107,129,.5);}
.sv-pts-bar span{font-size:11px; font-weight:700; color:var(--text-faint); margin-top:7px; white-space:nowrap;}
.sv-pts-rules{background:var(--surface-strong); border-radius:14px; overflow:hidden;}
.sv-pts-rule{display:flex; align-items:center; justify-content:space-between; padding:11px 14px; font-size:13px; border-bottom:1px solid var(--border-strong);}
.sv-pts-rule:last-child{border-bottom:none;}
.sv-pts-rule b{color:var(--success); font-size:14px;}
.sv-pts-source-row{display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--surface-strong); border-radius:12px; margin-bottom:6px;}
.sv-pts-source-ic{font-size:19px; width:34px; height:34px; border-radius:50%; background:var(--bg-soft); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.sv-pts-source-mid{flex:1; min-width:0;}
.sv-pts-source-mid b{display:block; font-size:13px;}
.sv-pts-source-mid span{font-size:11px; color:var(--text-faint);}
.sv-pts-source-val{font-size:15px; font-weight:900; color:var(--success);}
.sv-pts-source-val.neg{color:var(--danger);}
.sv-pts-invite-card{background:rgba(255,196,0,.06); border:1px solid rgba(255,196,0,.25); border-radius:16px; padding:16px;}
.sv-pts-invite-card h5{color:#ffc400;}
.sv-pts-invite-stats{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:12px;}
.sv-pts-invite-stats div{background:var(--surface-strong); border-radius:12px; padding:10px; text-align:center;}
.sv-pts-invite-stats b{display:block; font-size:18px; font-weight:900; color:#ffc400;}
.sv-pts-invite-stats span{font-size:11px; color:var(--text-faint);}
.sv-pts-code-row{display:flex; align-items:center; justify-content:space-between; background:var(--surface-strong); border-radius:10px; padding:8px 12px; margin-bottom:8px; font-size:13px;}
.sv-pts-code-row b{font-family:var(--font-mono); color:var(--cyan); letter-spacing:1px;}
.sv-pts-link-row{display:flex; align-items:center; justify-content:space-between; gap:8px; background:var(--surface-strong); border-radius:10px; padding:8px 12px; margin-bottom:10px;}
.sv-pts-link-row span{font-size:11px; color:var(--text-faint); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1;}
.sv-pts-link-row button{flex-shrink:0; padding:6px 12px; font-size:12px; border-radius:8px; background:var(--grad-1); color:#fff; font-weight:800;}
.sv-pts-apply-box h6{font-size:12.5px; color:var(--text-faint); margin-bottom:8px; font-weight:700;}
.sv-pts-apply-form{display:flex; gap:8px;}
.sv-pts-apply-form input{flex:1; background:var(--surface-strong); border:1px solid var(--border-strong); border-radius:10px; padding:9px 12px; color:var(--text); font-family:var(--font-mono);}
.sv-pts-applied-ok{background:rgba(45,209,140,.1); color:var(--success); border-radius:10px; padding:9px 12px; font-size:12.5px;}
.sv-pts-log-list{display:flex; flex-direction:column; gap:6px;}
.sv-pts-log-row{display:flex; align-items:center; gap:10px; padding:9px 12px; background:var(--surface-strong); border-radius:12px;}
.sv-pts-log-ic{font-size:16px; width:30px; height:30px; border-radius:50%; background:var(--bg-soft); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.sv-pts-log-mid{flex:1; min-width:0;}
.sv-pts-log-text{font-size:12.5px;}
.sv-pts-log-text b{font-weight:700;}
.sv-pts-log-text span{color:var(--text-faint); font-family:var(--font-mono); font-size:11px;}
.sv-pts-log-date{font-size:10.5px; color:var(--text-faint); margin-top:2px;}
.sv-pts-log-val{font-size:14px; font-weight:900; color:var(--success); flex-shrink:0;}
.sv-pts-log-val.neg{color:var(--danger);}

/* ============ امکان جدید: صفحه‌ی اختصاصیِ «کد دعوت» ============ */
.sv-inv-hero{
  position:relative; overflow:hidden; border-radius:22px; padding:30px 18px 24px; text-align:center; margin-bottom:16px;
  background:linear-gradient(150deg,#ff9d00 0%,#ff5f6d 48%,#b34fff 100%); color:#fff;
  box-shadow:0 20px 44px -18px rgba(255,90,90,.5);
}
.sv-inv-hero-glow{position:absolute; inset:-40% -10%; background:radial-gradient(closest-side, rgba(255,255,255,.35), transparent 70%); animation:svInvGlow 5s ease-in-out infinite; pointer-events:none;}
@keyframes svInvGlow{0%,100%{transform:translate(-10%,-10%) scale(1);}50%{transform:translate(10%,6%) scale(1.15);}}
.sv-inv-hero-label{font-size:12.5px; opacity:.9; font-weight:700; margin-bottom:14px; position:relative;}
.sv-inv-hero-code{position:relative; display:flex; justify-content:center; gap:6px; flex-wrap:wrap; margin-bottom:20px;}
.sv-inv-hero-code span{
  display:inline-flex; align-items:center; justify-content:center; width:34px; height:42px; border-radius:10px;
  background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35); backdrop-filter:blur(3px);
  font-family:var(--font-mono); font-weight:900; font-size:20px; letter-spacing:0;
}
.sv-inv-hero-actions{position:relative; display:flex; gap:8px; justify-content:center; flex-wrap:wrap;}
.sv-inv-hero-actions button{
  display:flex; align-items:center; gap:6px; padding:10px 16px; border-radius:999px; font-size:12.5px; font-weight:800;
  background:#fff; color:#ff5f6d; transition:transform .15s;
}
.sv-inv-hero-actions button:hover{transform:translateY(-1px);}
.sv-inv-hero-actions button.ghost{background:rgba(255,255,255,.16); color:#fff; border:1px solid rgba(255,255,255,.4);}
.sv-inv-hero-actions svg{width:15px; height:15px;}
.sv-inv-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:20px;}
.sv-inv-stat{background:var(--surface-strong); border-radius:14px; padding:14px 8px; text-align:center;}
.sv-inv-stat b{display:block; font-size:20px; font-weight:900; color:#ffc400;}
.sv-inv-stat span{font-size:11px; color:var(--text-faint);}
.sv-inv-howto{background:var(--surface-strong); border-radius:14px; overflow:hidden;}
.sv-inv-step{display:flex; align-items:center; gap:12px; padding:12px 14px; font-size:13px; border-bottom:1px solid var(--border-strong);}
.sv-inv-step:last-child{border-bottom:none;}
.sv-inv-step span{flex-shrink:0; width:26px; height:26px; border-radius:50%; background:var(--grad-1); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:12.5px;}
.sv-inv-applied-ok{display:flex; align-items:center; gap:8px; background:rgba(45,209,140,.1); color:var(--success); border-radius:10px; padding:10px 12px; font-size:12.5px;}
.sv-inv-applied-ok svg{width:17px; height:17px; flex-shrink:0;}
.sv-inv-linkback{text-align:center; margin-top:4px;}
.sv-inv-linkback a{font-size:12.5px; color:var(--cyan); text-decoration:none;}
@media (max-width:420px){ .sv-inv-hero-code span{width:28px; height:36px; font-size:16px;} }


/* ============ نوار «پست‌های جدید» شبیه ایکس ============ */
.sv-new-posts-bar{
  position:sticky; top:70px; z-index:35; display:flex; justify-content:center; margin-bottom:14px; height:0; overflow:visible;
}
.sv-new-posts-btn{
  pointer-events:none; opacity:0; transform:translateY(-14px) scale(.9); transition:.35s var(--ease-back);
  display:flex; align-items:center; gap:8px; padding:11px 22px; border-radius:999px; background:var(--grad-1); color:#fff;
  font-weight:700; font-size:13.5px; box-shadow:0 14px 30px -10px rgba(47,216,255,.55);
}
.sv-new-posts-btn.show{pointer-events:auto; opacity:1; transform:translateY(0) scale(1);}
.sv-new-posts-btn svg{width:15px;height:15px; animation:svBounceUp 1.1s ease-in-out infinite;}
@keyframes svBounceUp{0%,100%{transform:translateY(0);}50%{transform:translateY(-3px);}}

/* ============ سه‌نقطه‌ی پست (ویرایش/حذف) ============ */
.sv-post-more{position:relative; flex-shrink:0;}
.sv-post-more-btn{width:30px;height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--text-faint); font-size:18px; font-weight:900; letter-spacing:1px;}
.sv-post-more-btn:hover{background:var(--surface-strong); color:var(--text);}
.sv-post-menu{position:absolute; top:36px; left:0; background:var(--bg-soft); border:1px solid var(--border-strong); border-radius:14px; padding:6px; min-width:130px; z-index:20; box-shadow:0 16px 34px -12px rgba(0,0,0,.65); display:none;}
.sv-post-menu.show{display:block;}
.sv-post-menu button{display:flex; align-items:center; gap:8px; width:100%; padding:9px 12px; border-radius:9px; font-size:13px; font-weight:600; text-align:right;}
.sv-post-menu button:hover{background:var(--surface-strong);}
.sv-post-menu .danger{color:var(--danger);}
.sv-post-edited-tag{font-size:10.5px; color:var(--text-faint); margin-right:4px;}

/* ============ حالت ویرایش پست ============ */
.sv-post-edit-box{display:flex; flex-direction:column; gap:8px; margin:6px 0;}
.sv-post-edit-box input, .sv-post-edit-box textarea{background:var(--bg); border:1px solid var(--border-strong); border-radius:10px; padding:10px 12px; color:var(--text); font-size:13.5px; font-family:inherit;}
.sv-post-edit-box textarea{min-height:80px; resize:vertical;}
.sv-post-edit-actions{display:flex; gap:8px; justify-content:flex-end;}
.sv-post-edit-actions button{padding:7px 16px; border-radius:999px; font-size:12.5px; font-weight:700;}
.sv-post-edit-actions .save{background:var(--grad-1); color:#fff;}
.sv-post-edit-actions .cancel{background:var(--surface); border:1px solid var(--border);}

/* ============ لینک/هشتگ/منشن داخل متن پست و کامنت ============ */
.sv-hashtag, .sv-mention{color:var(--cyan); font-weight:700; cursor:pointer;}
.sv-hashtag:hover, .sv-mention:hover{text-decoration:underline;}
.sv-ext-link{color:var(--violet); font-weight:600; text-decoration:underline; text-underline-offset:2px; word-break:break-all;}

/* ============ مودال هشدار لینک خارجی ============ */
.sv-link-warn-icon{width:52px;height:52px; border-radius:50%; background:rgba(255,107,129,.14); color:var(--danger); display:flex; align-items:center; justify-content:center; margin:0 auto 14px;}
.sv-link-warn-icon svg{width:26px;height:26px;}
.sv-link-warn-title{text-align:center; font-size:16px; font-weight:800; margin-bottom:8px;}
.sv-link-warn-text{text-align:center; font-size:13px; color:var(--text-dim); line-height:2; margin-bottom:6px;}
.sv-link-warn-url{background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:10px 12px; font-family:var(--font-mono); font-size:11.5px; color:var(--text-faint); word-break:break-all; margin:14px 0; text-align:center;}
.sv-link-warn-actions{display:flex; gap:10px; margin-top:6px;}
.sv-link-warn-actions button{flex:1; padding:12px; border-radius:999px; font-size:13px; font-weight:700;}
.sv-link-warn-actions .cancel{background:var(--surface); border:1px solid var(--border-strong);}
.sv-link-warn-actions .go{background:var(--grad-1); color:#fff;}

/* ============ سرآیند بزرگ و رنگی نویسنده در صفحه‌ی تک‌پست ============ */
.sv-post-detail .sv-post-avatar{width:52px;height:52px; font-size:19px;}
.sv-post-detail .sv-post-names b{
  font-size:20px; font-weight:900; background:var(--grad-1); -webkit-background-clip:text; background-clip:text; color:transparent;
  white-space:normal;
}
.sv-post-detail .sv-post-names span{font-size:13px;}
.sv-post-detail .sv-post-head{margin-bottom:16px;}
.sv-post-detail h3{font-size:17.5px;}
.sv-post-detail p{font-size:14.5px;}

/* ============ دکمه‌ی «دیدن ادامه‌ی پست» — وقتی متن پست در فید کوتاه‌شده باشد ============ */
.sv-post-readmore{
  display:inline-block; margin:2px 0 8px; padding:0; border:none; background:none;
  font-family:inherit; font-size:13.5px; font-weight:700; color:var(--violet);
  cursor:pointer;
}
.sv-post-readmore:hover{text-decoration:underline;}
.sv-post-detail .sv-post-readmore{display:none;}

/* ============ کامنت‌های خفن (ریپلای + لایک) ============ */
/* توجه: این بلاک تکراری بود و با تعریف اصلی sv-comment/sv-comment-replies (بالاتر در
   همین فایل) تداخل می‌کرد؛ همین تداخل باعث می‌شد خط راهنمای پاسخ‌ها و کادرها روی هم
   بیفتند. حذف شد تا فقط یک تعریف (نسخه‌ی کامل‌تر بالا) اعمال شود. */

/* ============ منشن‌یاب (autocomplete) ============ */
.sv-mention-box{position:relative;}
.sv-mention-list{position:absolute; bottom:calc(100% + 6px); right:0; left:0; background:var(--bg-soft); border:1px solid var(--border-strong); border-radius:14px; padding:6px; max-height:220px; overflow-y:auto; z-index:50; box-shadow:0 16px 34px -12px rgba(0,0,0,.65); display:none;}
.sv-mention-list.show{display:block;}
.sv-mention-item{display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:10px; font-size:13px; cursor:pointer;}
.sv-mention-item:hover, .sv-mention-item.active{background:var(--surface-strong);}
.sv-mention-item b{font-size:12.5px;}
.sv-mention-item span{font-size:11px; color:var(--text-faint); font-family:var(--font-mono);}

/* ============ صفحه‌ی جستجو (هشتگ/متن) ============ */
.sv-search-tabs{display:flex; gap:6px; background:var(--surface); border-radius:999px; padding:5px; margin-bottom:18px; max-width:280px;}
.sv-search-tab{flex:1; text-align:center; padding:8px; border-radius:999px; font-size:12.5px; font-weight:700; color:var(--text-dim);}
.sv-search-tab.active{background:var(--grad-1); color:#fff;}


/* ============================================================
   ریسپانسیو و زیبایی‌سازی نهایی — یکپارچه برای کل سایت
   (قبلاً این اصلاحات فقط داخل resume.css بود و فقط صفحه‌ی رزومه
   را پوشش می‌داد؛ حالا کل شل اصلی، فید، پروفایل، برنامه‌ها و... هم
   در گوشی و صفحه‌های کوچک مرتب، خوانا و بدون تو در تو شدن نمایش
   داده می‌شوند. همه‌چیز با اندازه‌ی صفحه‌ی دستگاه، هماهنگ کوچک/بزرگ می‌شود)
   ============================================================ */

/* ---- ایمنیِ کلی: هیچ‌چیز نباید عرض صفحه را بشکند و اسکرول افقی بسازد ----
   نکته‌ی مهم: قبلاً overflow-x:hidden روی body هم ست شده بود. طبق رفتار استاندارد
   مرورگرها وقتی overflow-x چیزی غیر از visible باشد -- حتی اگر overflow-y صراحتاً
   visible نوشته شده باشد -- مرورگر عملاً آن را به auto تبدیل می‌کند و body خودش یک
   کانتینر اسکرول‌شونده می‌شود. همین باعث می‌شد position:sticky داخل body (مثل نوار
   منوی کناری .sv-nav) دیگر نسبت به اسکرول واقعی صفحه کار نکند و انگار کلاً
   بی‌حرکت/چسبیده بماند. با overflow-x:clip روی body همان جلوگیری از اسکرول افقی
   انجام می‌شود بدون این‌که sticky خراب شود. */
html{overflow-x:hidden;}
body{overflow-x:clip;}
.sv-shell, .sv-main, .sv-main-inner{max-width:100%;}
img, video{max-width:100%; height:auto;}

/* ---- بار بالا: در صفحه‌های کوچک جمع‌وجورتر می‌شود ---- */
@media (max-width:680px){
  .sv-topbar{padding:10px 14px;}
  .sv-brand{font-size:16px; gap:6px;}
  .sv-brand svg{width:22px; height:22px;}
  .sv-topbar-actions{gap:6px;}
  .sv-user-chip span{display:none;} /* روی گوشی فقط آواتار کاربر کافیست، اسم جا را تنگ می‌کند */
}

/* ---- نوار کنارِ آیتم‌ها (نویگیشن): از حدود تبلت به بعد کنار می‌رود چون فضای کافی نیست ---- */
@media (max-width:960px){
  .sv-aside{display:none;}
}

/* ---- نوار منوی کناری: در صفحه‌های کوچک فقط آیکن (لوگوی هر آیتم) می‌ماند، بدون اسم و بدون متنِ دکمه ----
   نکته‌ی مهم: عمداً از position:fixed استفاده نشده. اگر نوار را کاملاً از جریان
   چیدمان (flex) بیرون می‌آوردیم، باید برای تک‌تک صفحه‌ها (فید، پروفایل، پیام‌ها،
   جزئیات پست و...) به‌صورت دستی یک padding جبرانی می‌گذاشتیم؛ در عمل جاهایی این
   عدد کافی نبود و نوار روی کارت‌های پست می‌افتاد. به‌جایش نوار همچنان عضوِ عادیِ
   .sv-shell می‌ماند (دقیقاً مثل حالت لپ‌تاپ) و فقط با ترکیب sticky + top:50% +
   translateY(-50%) از نظر عمودی وسط صفحه‌نمایش می‌نشیند. چون هنوز داخل چیدمان
   flex است، عرضش همیشه و در همه‌ی صفحات رزرو می‌شود و هرگز روی محتوا نمی‌افتد. */
@media (max-width:820px){
  .sv-nav{
    width:76px; padding:14px 8px; gap:10px;
    /* رفع باگ: قبلاً اینجا top:50% + translateY(-50%) بود تا نوار وسطِ صفحه بایستد،
       اما چون این ترکیب به اسکرولِ واقعیِ صفحه وابسته است، هر بار که مسیر عوض
       می‌شد (مثلا کلیک روی «ذخیره‌شده‌ها») و محتوای صفحه لحظه‌ای کوتاه/بلند
       می‌شد (حالت لودینگ)، مرورگر موقعیتِ sticky را دوباره حساب می‌کرد و نوار
       (و دکمه‌ی خانه) به‌طور محسوس می‌پرید بالا، درست وسطِ ضربه‌ی بعدیِ کاربر.
       حالا مثل نسخه‌ی دسکتاپ فقط به بالای صفحه می‌چسبد و دیگر با تغییر
       ارتفاعِ محتوا تکان نمی‌خورد. */
    top:calc(var(--topbar-h) + 10px);
    max-height:calc(100vh - var(--topbar-h) - 20px); max-height:calc(100dvh - var(--topbar-h) - 20px);
    border-radius:var(--r-lg);
  }
  .sv-nav-item{
    justify-content:center; padding:13px 0; gap:0;
  }
  .sv-nav-item span{display:none;} /* حذف نام آیتم‌ها؛ فقط آیکن باقی می‌ماند */
  .sv-nav-compose{padding:13px 0;}
  .sv-nav-compose span{display:none;} /* حذف متنِ دکمه‌ی «پست جدید»؛ فقط آیکن باقی می‌ماند */
  .sv-nav-badge{position:absolute; top:6px; left:14px; margin-right:0;}
  .sv-nav-notif{justify-content:center;}
  .sv-main{padding:20px 16px 70px;}
  /* رفع باگ: ترفندِ sticky+top:50% برای وسط‌چین‌نگه‌داشتنِ نوار به «اسکرولِ واقعیِ
     صفحه» وابسته است. اما در صفحه‌ی پیام‌رسان، برای رفعِ باگ‌های اسکرول، خودِ صفحه
     دیگر اسکرول نمی‌خورد (کلاس sv-scroll-locked روی body) — و همین باعث می‌شد این
     ترفند دیگر درست حساب نکند و نوار (و مخصوصاً دکمه‌ی خانه) از قابِ دید بیرون
     بزند و کلیک‌پذیر نباشد. برای همین، فقط دقیقاً همین حالت، نوار مستقیم و
     مطمئن نسبت به کلِ صفحه ثابت و وسط‌چین می‌شود (دیگر به هیچ اسکرولی وابسته نیست)،
     و به‌جای رزروِ عرض از طریق چیدمانِ flex (که با fixed از دست می‌رود)، همان
     مقدار به‌صورت margin روی کارتِ گفتگو گذاشته می‌شود تا چیزی زیرِ نوار نیفتد. */
  body.sv-scroll-locked .sv-nav{
    position:fixed; top:50%; right:12px; left:auto; transform:translateY(-50%); z-index:30;
  }
  body.sv-scroll-locked .sv-dm-wrap{margin-right:100px;}
}
@media (max-width:480px){
  .sv-nav{width:60px; padding:12px 4px;}
  .sv-nav-item{padding:11px 0;}
  .sv-nav-item svg{width:19px; height:19px;}
  .sv-main{padding:14px 10px 76px;}
  body.sv-scroll-locked .sv-dm-wrap{margin-right:84px;}
}

/* ---- عنوان صفحه و دکمه‌ی «پست جدید» بالای فید: در تنگی جا زیر هم می‌روند نه چسبیده به هم ---- */
@media (max-width:560px){
  .sv-page-head{flex-direction:column; align-items:flex-start; gap:10px;}
  .sv-compose-cta{width:100%; justify-content:center;}
}

/* ---- کارت پست: در گوشی جمع‌وجورتر و دکمه‌های پایینش هرگز از کادر بیرون نمی‌زنند ---- */
@media (max-width:560px){
  .sv-post{padding:12px; border-radius:16px;}
  .sv-post-head{gap:8px;}
  .sv-post-avatar{width:36px; height:36px; font-size:13px;}
  .sv-post-names b{font-size:14.5px;}
  .sv-post h3{font-size:14.5px;}
  .sv-post p{font-size:13.5px;}
  /* دکمه‌هایی که فقط یک کلمه‌ی متنی دارن (ذخیره/کپی/اشتراک/بسته) رو روی گوشی مخفی می‌کنیم؛
     شمارنده‌های عددی (لایک، کامنت، بازنشر، دیس‌لایک، بازدید) که کلاس مخصوص دارن دست‌نخورده می‌مونن،
     تا دکمه‌ها فقط آیکن‌ خطی + عدد باشن، جمع‌وجور و شیک بشن. چون اندازه‌ی دکمه‌ها الان با clamp()
     پیوسته و متناسب با عرض صفحه کوچیک می‌شه، دیگه نیازی به اسکرول افقی هم نیست */
  .sv-post-actions button > span:not([class]){display:none;}
}
@media (max-width:400px){
  .sv-post{padding:10px;}
  .sv-post-names b{font-size:13.5px;}
}


/* ---- کامنت‌ها: تورفتگیِ پاسخ‌ها در گوشی کمتر می‌شود تا محتوا تو در تو له نشود ---- */
@media (max-width:480px){
  .sv-comment-replies{margin-right:10px; padding-right:8px;}
  .sv-comments-head{flex-wrap:wrap; gap:8px;}
}

/* ---- فرم‌ها: ردیف‌های دوستونه در گوشی یک‌ستونه می‌شوند ---- */
@media (max-width:560px){
  .sv-field-row{grid-template-columns:1fr;}
  .sv-gate-card{padding:26px 20px;}
}

/* ---- صفحه‌ی جزئیات برنامه: هدر و تصاویر در گوشی وسط‌چین و متناسب می‌شوند ---- */
@media (max-width:640px){
  .sv-app-detail-head{flex-direction:column; align-items:center; text-align:center;}
  .sv-app-detail-actions{justify-content:center;}
  .sv-app-shots-scroll img{height:200px;}
}
@media (max-width:480px){
  .sv-app-shots-row{grid-template-columns:repeat(2,1fr);}
  .sv-app-icon-box{width:76px; height:76px;}
}

/* ---- پروفایل: آواتار و آمار در گوشی بدون بهم‌ریختگی جا می‌شوند ---- */
@media (max-width:480px){
  .sv-profile-avatar-box, .sv-profile-avatar{width:72px; height:72px;}
  .sv-pv-names b{font-size:18px;}
  .sv-pv-actions{width:100%;}
  .sv-pv-actions .sv-btn{flex:1;}
}

/* ---- استوری‌ها و شاتس اپ‌ها: کمی کوچک‌تر تا در عرض گوشی جا شوند ---- */
@media (max-width:480px){
  .sv-story{width:58px;}
  .sv-story-ring{width:52px; height:52px;}
  .sv-story span{max-width:58px;}
}

/* ---- مودال‌ها و کادرهای بازشو: همیشه داخل صفحه می‌مانند، هرگز از لبه‌ها بیرون نمی‌زنند ---- */
@media (max-width:480px){
  .sv-modal, .sv-quote-modal, .sv-app-edit-modal, .sv-cat-modal{padding:16px;}
  .sv-quote-modal-actions, .sv-app-edit-modal-head{flex-wrap:wrap;}
}

/* ---- نوار زیرین دعوت‌نامه/رفرال: در گوشی زیر هم و خوانا ---- */
@media (max-width:480px){
  .sv-inv-stats{gap:6px;}
  .sv-inv-hero-actions{gap:6px;}
}