@font-face {
  font-family: 'Vazirmatn';
  src: url('../fonts/Vazirmatn.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --bg: #0c0e14;
  --bg-soft: #141823;
  --bg-card: #181c28;
  --bg-card-2: #1d2230;
  --border: #2a2f3d;
  --border-soft: #232838;
  --text: #eef0f5;
  --text-dim: #9aa1b2;
  --accent: #7c9eff;
  --accent-2: #b07cff;
  --accent-dim: #5872c4;
  --danger: #ff6b6b;
  --success: #4cd97b;
  --warn: #e0c34c;
  --radius: 14px;
  --radius-sm: 9px;
  --grad: linear-gradient(135deg, var(--accent), var(--accent-2));
  --shadow-card: 0 1px 0 rgba(255,255,255,.02) inset, 0 10px 30px -16px rgba(0,0,0,.6);
  --shadow-pop: 0 18px 50px -20px rgba(124,158,255,.35);
}

/* ---------- پوسته‌ی روشن ---------- */
:root[data-theme="light"] {
  --bg: #eef1f6;
  --bg-soft: #ffffff;
  --bg-card: #ffffff;
  --bg-card-2: #f1f3f9;
  --border: #dfe3ec;
  --border-soft: #e8eaf1;
  --text: #1b1e29;
  --text-dim: #687087;
  --accent: #4d7bff;
  --accent-2: #9a5cf0;
  --accent-dim: #c7d4f7;
  --danger: #e0454f;
  --success: #1f9e5c;
  --warn: #a9790a;
  --shadow-card: 0 1px 0 rgba(255,255,255,.7) inset, 0 10px 30px -18px rgba(30,40,80,.16);
  --shadow-pop: 0 18px 50px -22px rgba(77,123,255,.35);
}
:root[data-theme="light"] body {
  background-image:
    radial-gradient(800px 420px at 85% -10%, rgba(77,123,255,.10), transparent 60%),
    radial-gradient(700px 380px at -5% 0%, rgba(154,92,240,.08), transparent 60%);
}
:root[data-theme="light"] .topbar,
:root[data-theme="light"] .app-topbar { background: rgba(255,255,255,.85); }
:root[data-theme="light"] .nav { background: rgba(255,255,255,.75); }

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  background-image:
    radial-gradient(800px 420px at 85% -10%, rgba(124,158,255,.14), transparent 60%),
    radial-gradient(700px 380px at -5% 0%, rgba(176,124,255,.10), transparent 60%);
  background-repeat: no-repeat;
  color: var(--text);
  font-family: 'Vazirmatn', Tahoma, Arial, sans-serif;
  direction: rtl;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
/* لینک‌های «بازدید شده» نباید رنگ پیش‌فرض آبی/بنفش مرورگر را نشان دهند؛ رنگ از کلاس والد به ارث می‌رسد */
a:visited { color: inherit; }

.container { max-width: 1120px; margin: 0 auto; padding: 24px; }
.narrow { max-width: 440px; margin: 60px auto; padding: 0 20px; }

.card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 22px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-card);
  transition: transform .22s cubic-bezier(.2,.8,.2,1), border-color .22s ease, box-shadow .22s ease;
}

h1, h2, h3 { margin: 0 0 12px; letter-spacing: -.01em; }
p { line-height: 1.85; color: var(--text-dim); }

/* ---------- لوگو ---------- */
.logo-row { display: flex; align-items: center; gap: 10px; }
.logo-mark { width: 34px; height: 34px; border-radius: 10px; display: block; flex-shrink: 0; }
.logo-mark.sm { width: 26px; height: 26px; border-radius: 8px; }
.logo-text { font-size: 18px; font-weight: 800; color: var(--text); }
.logo-text span { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- بار بالای صفحات داخلی (داشبورد/اتاق) ---------- */
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px;
  background: rgba(20,24,35,.85);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
  gap: 8px;
  position: sticky;
  top: 0;
  z-index: 20;
}
.topbar .brand { font-size: 18px; font-weight: bold; color: var(--accent); }

/* ---------- دکمه‌ها ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--grad);
  color: #0c0e14;
  border: none;
  border-radius: var(--radius-sm);
  padding: 10px 18px;
  font-size: 14px;
  cursor: pointer;
  font-weight: 700;
  font-family: inherit;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-pop); text-decoration: none; }
.btn.secondary { background: transparent; border: 1px solid var(--border); color: var(--text); box-shadow: none; }
.btn.secondary:hover { border-color: var(--accent-dim); box-shadow: none; }
.btn.outline { background: transparent; border: 1.5px solid var(--accent); color: var(--accent); box-shadow: none; }
.btn.ghost { background: transparent; color: var(--text-dim); box-shadow: none; padding: 8px 10px; }
.btn.danger { background: var(--danger); color: #1a0a0a; }
.btn.danger:hover { box-shadow: 0 18px 50px -20px rgba(255,107,107,.45); }
.btn.small { padding: 6px 12px; font-size: 12px; border-radius: 8px; }
.btn.lg { padding: 14px 26px; font-size: 16px; border-radius: 12px; }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }

.icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 9px;
  background: var(--bg-soft); border: 1px solid var(--border); color: var(--text-dim);
  cursor: pointer; transition: all .15s ease; flex-shrink: 0;
}
.icon-btn:hover { color: var(--text); border-color: var(--accent-dim); }
.icon-btn:hover { transform: translateY(-1px) scale(1.025); background: var(--bg-card-2); box-shadow: 0 7px 18px -12px rgba(124,158,255,.75); }
.icon-btn:active, .btn:active { transform: translateY(0) scale(.97); }
.icon-btn.danger:hover { color: var(--danger); border-color: var(--danger); }
.icon { display: block; }

/* ---------- فرم‌ها ---------- */
input, textarea, select {
  width: 100%;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 9px;
  padding: 10px 12px;
  font-size: 14px;
  font-family: inherit;
  margin-bottom: 12px;
  transition: border-color .15s ease;
}
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--accent); }
input:focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px rgba(124,158,255,.12); }
label { display: block; font-size: 13px; color: var(--text-dim); margin-bottom: 6px; }

.error-box { background: rgba(255,107,107,.12); border: 1px solid var(--danger); color: var(--danger); padding: 10px 12px; border-radius: 8px; margin-bottom: 12px; font-size: 13px; }
.success-box { background: rgba(76,217,123,.12); border: 1px solid var(--success); color: var(--success); padding: 10px 12px; border-radius: 8px; margin-bottom: 12px; font-size: 13px; }
.info-box { background: rgba(124,158,255,.10); border: 1px solid var(--accent-dim); color: var(--accent); padding: 10px 12px; border-radius: 8px; margin-bottom: 12px; font-size: 13px; }

.captcha-row { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.captcha-row img { border-radius: 8px; border: 1px solid var(--border); }

/* ---------- صفحه ورود/ثبت‌نام ---------- */
.auth-page { max-width: 440px; margin: 48px auto 60px; padding: 0 20px; }
.auth-logo { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 24px; }
.auth-logo .logo-mark { width: 52px; height: 52px; border-radius: 14px; }
.auth-logo .logo-text { font-size: 22px; }

/* ---------- شبکه و کارت‌ها ---------- */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 16px; }
.room-card { display: block; transition: transform .15s ease, border-color .15s ease; }
.room-card:hover { transform: translateY(-2px); border-color: var(--accent-dim); }

.badge { display: inline-block; font-size: 11px; padding: 3px 10px; border-radius: 20px; background: var(--bg-soft); color: var(--text-dim); border: 1px solid var(--border); font-weight: 600; }
.badge.public { color: var(--success); border-color: var(--success); }
.badge.pending { color: var(--warn); border-color: var(--warn); }
.badge.rejected { color: var(--danger); border-color: var(--danger); }
.badge.role { color: var(--accent); border-color: var(--accent-dim); background: rgba(124,158,255,.08); }
.badge.founder { color: #ffd76b; border-color: #b8902f; background: rgba(255,215,107,.08); }
.badge.overdue { color: var(--danger); border-color: var(--danger); background: rgba(255,107,107,.08); }

.goal-assign-form { display: flex; gap: 6px; align-items: center; margin-top: 8px; background: var(--bg-soft); border: 1px solid var(--border); border-radius: 9px; padding: 5px 6px; flex-wrap: wrap; }
.goal-assign-form select, .goal-assign-form input[type="date"] { margin: 0; font-size: 12px; padding: 6px 9px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 7px; color: var(--text); }
.goal-assign-form button { border-radius: 7px; }

.tabs { display: flex; gap: 4px; margin-bottom: 16px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.tabs a, .tabs a:visited { display: inline-block; color: var(--text-dim); padding: 10px 14px; font-size: 14px; border-bottom: 2px solid transparent; border-radius: 8px 8px 0 0; transition: color .15s ease, background-color .15s ease; }
.tabs a:hover { color: var(--text); background: var(--bg-soft); text-decoration: none; }
.tabs a.active, .tabs a.active:visited { color: var(--accent); border-bottom-color: var(--accent); }
.tabs a.active:hover { background: transparent; }

.empty-state { text-align: center; padding: 36px 20px; color: var(--text-dim); }

/* ---------- آواتار ---------- */
.avatar {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; color: #0c0e14; font-weight: 800; flex-shrink: 0;
}

/* ---------- ناوبری صفحه لندینگ ---------- */
.nav { position: sticky; top: 0; z-index: 30; background: rgba(12,14,20,.7); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border-soft); }
.nav-inner { max-width: 1120px; margin: 0 auto; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.nav-links { display: flex; align-items: center; gap: 22px; }
.nav-links a:not(.btn) { color: var(--text-dim); font-size: 14px; }
.nav-links a:not(.btn):hover { color: var(--text); text-decoration: none; }
.nav-cta { display: flex; align-items: center; gap: 10px; }

/* ---------- هیرو ---------- */
.hero { position: relative; overflow: hidden; padding: 70px 24px 50px; max-width: 1120px; margin: 0 auto; }
.hero-inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; align-items: center; }
@media (max-width: 860px) { .hero-inner { grid-template-columns: 1fr; text-align: center; } .hero-actions, .hero-badge { justify-content: center; } }
.hero-badge { display: inline-flex; align-items: center; gap: 8px; background: var(--bg-card); border: 1px solid var(--border); color: var(--accent); font-size: 12px; font-weight: 600; padding: 6px 14px; border-radius: 30px; margin-bottom: 18px; }
.hero h1 { font-size: 40px; line-height: 1.35; margin-bottom: 14px; }
.hero h1 span { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero p.lead { font-size: 16px; color: var(--text-dim); margin-bottom: 26px; max-width: 480px; }
@media (max-width: 860px) { .hero p.lead { margin-inline: auto; } }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-stats { display: flex; gap: 26px; margin-top: 28px; flex-wrap: wrap; }
@media (max-width: 860px) { .hero-stats { justify-content: center; } }
.hero-stats .stat b { display: block; font-size: 20px; color: var(--text); }
.hero-stats .stat span { font-size: 12px; color: var(--text-dim); }

.hero-art { position: relative; aspect-ratio: 1/1; max-width: 380px; margin: 0 auto; }
.hero-art .blob { position: absolute; inset: 0; border-radius: 40% 60% 55% 45% / 50% 45% 55% 50%; background: var(--grad); opacity: .18; filter: blur(2px); animation: blobmove 9s ease-in-out infinite; }
@keyframes blobmove { 0%,100% { border-radius: 40% 60% 55% 45% / 50% 45% 55% 50%; } 50% { border-radius: 55% 45% 40% 60% / 45% 55% 50% 50%; } }
.hero-art .flow-card { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 10px; }
.flow-step { display: flex; align-items: center; gap: 12px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-card); padding: 13px 15px; text-align: right; }
.flow-step strong { display: block; font-size: 14px; color: var(--text); }
.flow-step .muted { font-size: 11.5px; }
.flow-ico { width: 38px; height: 38px; border-radius: 10px; background: var(--grad); color: #0c0e14; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.flow-arrow { display: flex; justify-content: center; color: var(--accent-dim); transform: rotate(90deg); }

/* ---------- بخش‌ها ---------- */
.section { max-width: 1120px; margin: 0 auto; padding: 50px 24px; }
.section-head { text-align: center; max-width: 600px; margin: 0 auto 36px; }
.section-tag { color: var(--accent); font-size: 12px; font-weight: 700; letter-spacing: .04em; margin-bottom: 8px; }
.section-title { font-size: 28px; margin-bottom: 10px; }
.section-sub { color: var(--text-dim); font-size: 15px; }

.features { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 18px; }
.feature-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 22px; transition: transform .15s ease, border-color .15s ease; }
.feature-card:hover { transform: translateY(-3px); border-color: var(--accent-dim); }
.feature-icon { width: 42px; height: 42px; border-radius: 11px; background: var(--grad); display: flex; align-items: center; justify-content: center; color: #0c0e14; margin-bottom: 14px; }
.feature-card h3 { font-size: 16px; }
.feature-card p { font-size: 13.5px; margin: 0; }

.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 760px) { .steps { grid-template-columns: 1fr; } }
.step-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 24px 20px; transition: transform .15s ease, border-color .15s ease; }
.step-card:hover { transform: translateY(-3px); border-color: var(--accent-dim); }
.step-num { width: 38px; height: 38px; border-radius: 50%; background: var(--grad); color: #0c0e14; font-weight: 800; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; font-size: 15px; }
.step-card h3 { font-size: 16px; }
.step-card p { font-size: 13.5px; margin: 0; }

.public-rooms-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; flex-wrap: wrap; gap: 10px; }

.cta-banner { max-width: 1120px; margin: 10px auto 60px; padding: 40px 24px; background: linear-gradient(135deg, rgba(124,158,255,.12), rgba(176,124,255,.12)); border: 1px solid var(--border-soft); border-radius: 20px; text-align: center; }
.cta-banner h2 { font-size: 24px; }
.cta-banner p { max-width: 480px; margin: 0 auto 22px; }

.footer { border-top: 1px solid var(--border-soft); padding: 28px 24px; }
.footer-inner { max-width: 1120px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.footer-inner .muted { font-size: 12.5px; }

/* ---------- چت به سبک پیام‌رسان ---------- */
.chat-messages { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; visibility: hidden; }
.chat-messages.chat-ready { visibility: visible; }
.load-older-messages {
  align-self: center; display: inline-flex; align-items: center; gap: 6px;
  margin: 0 auto 10px; padding: 7px 14px; border-radius: 999px;
  border: 1px solid var(--border); background: var(--bg-card); color: var(--text-dim);
  font-family: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  transition: color .18s ease, border-color .18s ease, transform .18s ease, opacity .18s ease;
}
.load-older-messages:hover { color: var(--text); border-color: var(--accent-dim); transform: translateY(-1px); }
.load-older-messages.loading { opacity: .55; cursor: wait; }
.load-older-messages.loading .icon { animation: loader-spin .8s linear infinite; }
.new-message-indicator {
  position: absolute; z-index: 11; left: 50%; bottom: 82px; transform: translateX(-50%);
  border: 1px solid var(--accent-dim); border-radius: 999px; padding: 7px 14px;
  background: var(--bg-card); color: var(--accent); box-shadow: var(--shadow-pop);
  font-family: inherit; font-size: 12px; font-weight: 700; cursor: pointer; animation: message-in .2s ease both;
}
.new-message-indicator:hover { background: var(--bg-card-2); }
@keyframes loader-spin { to { transform: rotate(360deg); } }
.msg {
  max-width: 70%; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 16px 16px 4px 16px; padding: 8px 14px 9px; align-self: flex-start;
  box-shadow: 0 4px 16px -14px rgba(0,0,0,.85);
  transform-origin: bottom left;
  transition: transform .2s cubic-bezier(.2,.8,.2,1), border-color .2s ease, box-shadow .2s ease;
}
.msg.just-arrived { animation: message-in .22s cubic-bezier(.2,.8,.2,1) both; }
.msg:hover { transform: translateY(-1px); border-color: rgba(124,158,255,.42); box-shadow: 0 10px 28px -19px rgba(0,0,0,.9); }
.msg.mine {
  align-self: flex-end; background: var(--accent-dim); border-color: var(--accent-dim);
  border-radius: 16px 16px 16px 4px; color: #fff;
  transform-origin: bottom right;
}
@keyframes message-in {
  from { opacity: 0; transform: translateY(7px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
:root[data-theme="light"] .msg.mine { background: var(--accent); border-color: var(--accent); }
.msg .meta { font-size: 11px; color: var(--text-dim); margin-bottom: 4px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.msg.mine .meta { color: rgba(255,255,255,.78); }
.message-status {
  display: inline-flex; align-items: center; justify-content: center;
  margin-inline-start: 1px; vertical-align: middle;
}
.message-status.sent {
  color: #42e695;
  filter: drop-shadow(0 0 3px rgba(66,230,149,.35));
}
.message-status.pending { color: rgba(255,255,255,.72); }
.pending-message { opacity: .88; }
.pending-reaction-placeholder { pointer-events: none; }
.pending-reaction-placeholder > span {
  display: block; width: 24px; height: 24px; visibility: hidden;
}
.message-reply-quote {
  display: flex; flex-direction: column; gap: 1px; margin: 0 0 7px;
  padding: 6px 9px; border-inline-start: 3px solid var(--accent);
  border-radius: 7px; background: rgba(0,0,0,.12); color: inherit;
  max-width: 100%; text-decoration: none;
}
.message-reply-quote strong { color: var(--accent-soft, #c7d4ff); font-size: 11px; }
.message-reply-quote span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 11.5px; opacity: .82; }
.msg.mine .message-reply-quote strong { color: #dfffea; }
.chat-input-wrap .chat-input-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  align-items: end;
  gap: 8px;
  min-width: 0;
}
.chat-input-bar textarea {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  min-width: 0;
}
.chat-input-bar .send-btn {
  grid-column: 2;
  grid-row: 1;
}
.reply-compose-preview {
  grid-column: 1 / -1; grid-row: 1;
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px; padding: 6px 9px; border-inline-start: 3px solid var(--accent);
  border-radius: 8px; background: var(--bg-soft);
}
.reply-compose-preview:not([hidden]) ~ textarea { grid-row: 2; }
.reply-compose-preview:not([hidden]) ~ .send-btn { grid-row: 2; }
.reply-compose-preview[hidden] { display: none; }
.reply-compose-preview > div { min-width: 0; display: flex; flex-direction: column; }
.reply-compose-preview strong { color: var(--accent); font-size: 11px; }
.reply-compose-preview span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 11.5px; color: var(--text-dim); }
.reply-compose-preview .icon-btn { width: 27px; height: 27px; flex-shrink: 0; }
.message-context-menu {
  position: fixed; z-index: 1000; min-width: 145px; padding: 5px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 13px; box-shadow: var(--shadow-pop);
  transform-origin: top center;
  animation: message-menu-in .16s cubic-bezier(.2,.8,.2,1) both;
}
.message-context-menu[hidden] { display: none; }
.message-context-menu button {
  width: 100%; display: flex; align-items: center; gap: 8px;
  border: 0; border-radius: 8px; padding: 9px 11px;
  background: transparent; color: var(--text); font-family: inherit;
  font-size: 13px; cursor: pointer; text-align: start;
}
.message-context-menu button:hover { background: var(--bg-soft); color: var(--accent); }
.message-context-menu .message-delete-action { color: #ef5b65; }
.message-context-menu .message-delete-action:hover { color: #ff6b75; background: rgba(239,91,101,.11); }
.msg.message-deleting { opacity: .45; pointer-events: none; transform: scale(.98); transition: opacity .18s ease, transform .18s ease; }
.msg.message-action-active {
  transform: translateY(-2px) scale(1.012);
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(124,158,255,.16), 0 14px 32px -18px rgba(0,0,0,.9);
}
.msg.message-action-active::after {
  content: ''; position: absolute; inset: -7px; z-index: -1;
  border-radius: 20px; background: rgba(124,158,255,.06);
}
.msg { position: relative; }
@keyframes message-menu-in {
  from { opacity: 0; transform: translateY(-5px) scale(.94); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.pending-message .message-status.pending .icon {
  animation: pending-clock-pulse 1.15s ease-in-out infinite;
}
.pending-message.send-failed {
  opacity: .82;
  border-color: rgba(255,107,107,.72);
}
.pending-message.send-failed .message-status.pending { color: #ffb0b0; }
.pending-message.send-failed .message-status.pending .icon { animation: none; }
.msg.just-arrived .message-status.sent { animation: sent-check-in .28s .08s cubic-bezier(.2,.8,.2,1) both; }
@keyframes pending-clock-pulse {
  0%, 100% { opacity: .56; transform: scale(.94); }
  50% { opacity: 1; transform: scale(1.06); }
}
@keyframes sent-check-in {
  from { opacity: 0; transform: scale(.55) translateY(2px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
.message-user-link, .message-user-link:visited {
  display: inline-flex; align-items: center; gap: 5px; color: inherit;
  font-weight: 650; border-radius: 999px; padding: 2px 5px 2px 7px;
  transition: background-color .18s ease, transform .18s ease;
}
.message-user-link:hover { background: rgba(124,158,255,.12); transform: translateY(-1px); text-decoration: none; }
.msg.mine .message-user-link:hover { background: rgba(255,255,255,.14); }
.msg:target {
  animation: message-focus 1.15s ease;
  border-color: var(--accent);
}
@keyframes message-focus {
  0%, 100% { box-shadow: 0 4px 16px -14px rgba(0,0,0,.85); }
  35% { box-shadow: 0 0 0 4px rgba(124,158,255,.2), 0 14px 35px -16px rgba(124,158,255,.7); }
}
.msg .content { white-space: pre-wrap; word-break: break-word; font-size: 14px; line-height: 1.65; }
.msg .goal-link { font-size: 11px; }
@media (max-width: 700px) { .msg { max-width: 86%; } }

.chat-input-bar { flex-shrink: 0; display: flex; gap: 8px; align-items: flex-end; padding: 12px 16px; border-top: 1px solid var(--border); background: var(--bg-card); }
.chat-input-bar textarea { margin-bottom: 0; resize: none; max-height: 140px; border-radius: 20px; padding: 11px 16px; background: var(--bg-soft); transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease; }
.chat-input-bar textarea:focus { background: var(--bg-card-2); box-shadow: 0 0 0 3px rgba(124,158,255,.1); }
.send-btn { width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.send-btn:hover { transform: translateY(-2px) scale(1.04); }

/* ---------- اعضا و نقش‌ها ---------- */
.member-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 4px; border-bottom: 1px solid var(--border-soft); flex-wrap: wrap; }
.member-card:last-child { border-bottom: none; }
.member-id { display: flex; align-items: center; gap: 10px; }
.member-id .uname { font-weight: 600; font-size: 14px; }
.member-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.role-form { display: flex; gap: 6px; align-items: center; background: var(--bg-soft); border: 1px solid var(--border); border-radius: 9px; padding: 3px 4px 3px 3px; }
.role-form input { margin: 0; width: 96px; font-size: 12px; padding: 6px 9px; background: transparent; border: none; }
.role-form input:focus { outline: none; }
.role-form button { border-radius: 7px; }

/* ---------- اهداف و پروژه‌های فعال ---------- */
.goal-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; background: var(--bg-card-2); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 14px 16px; margin-bottom: 10px; }
.goal-card.done { opacity: .62; }
.goal-card .goal-pin { width: 34px; height: 34px; border-radius: 9px; background: var(--grad); display: flex; align-items: center; justify-content: center; color: #0c0e14; flex-shrink: 0; }
.goal-card .goal-body { flex: 1; min-width: 0; }
.goal-card .goal-text { color: var(--text); font-size: 14px; margin-bottom: 4px; word-break: break-word; }

.muted { color: var(--text-dim); font-size: 13px; }
.flex-between { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.flex-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.inline-form { display: inline; }
.mt8 { margin-top: 8px; } .mt16 { margin-top: 16px; } .mt24 { margin-top: 24px; }

/* ====================================================================
   پوسته‌ی اصلی برنامه (دو ستونه، شبیه پیام‌رسان حرفه‌ای) — dashboard/room
   ==================================================================== */
.app-shell { display: flex; height: 100vh; overflow: hidden; }
.sidebar-toggle-cb { display: none; }

.app-sidebar {
  width: 300px; flex-shrink: 0; background: var(--bg-card);
  border-inline-start: 1px solid var(--border);
  display: flex; flex-direction: column; overflow: hidden;
}
.sidebar-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--border-soft); flex-shrink: 0; }

.sidebar-new-room, .sidebar-new-room:visited {
  display: flex; align-items: center; gap: 8px; margin: 12px 14px 4px; padding: 10px 14px;
  background: var(--grad); color: #0c0e14; border-radius: var(--radius-sm); font-weight: 700; font-size: 13.5px;
  flex-shrink: 0; transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.sidebar-new-room:hover { text-decoration: none; opacity: .94; transform: translateY(-1px); box-shadow: var(--shadow-pop); }

.sidebar-quicklinks { display: flex; flex-direction: column; padding: 6px 8px; border-bottom: 1px solid var(--border-soft); margin-bottom: 4px; flex-shrink: 0; }
.sidebar-quicklinks a, .sidebar-quicklinks a:visited { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 9px; color: var(--text-dim); font-size: 13.5px; transition: background-color .15s ease, color .15s ease; }
.sidebar-quicklinks a:hover { background: var(--bg-soft); color: var(--text); text-decoration: none; }
.sidebar-count { background: var(--accent); color: #fff; font-size: 10.5px; font-weight: 700; border-radius: 20px; padding: 1px 7px; margin-inline-start: auto; }

.sidebar-rooms { flex: 1; overflow-y: auto; padding: 4px 8px; }
.sidebar-empty { padding: 18px 12px; text-align: center; font-size: 13px; }
.sidebar-room, .sidebar-room:visited { display: flex; align-items: center; gap: 10px; padding: 9px 8px; border-radius: 10px; margin-bottom: 2px; color: var(--text); transition: background-color .15s ease; }
.sidebar-room:hover { background: var(--bg-soft); text-decoration: none; transform: translateX(-2px); }
.sidebar-room.active { background: rgba(124,158,255,.13); }
.sidebar-room-info { flex: 1; min-width: 0; }
.sidebar-room-info strong { font-size: 13.5px; font-weight: 600; }
.sidebar-room-preview { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.sr-crown { color: #ffd76b; display: flex; flex-shrink: 0; }

.sidebar-foot { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--border-soft); flex-shrink: 0; }

.app-main { flex: 1; min-width: 0; height: 100vh; display: flex; flex-direction: column; overflow: hidden; background: var(--bg); }
.app-topbar {
  display: flex; align-items: center; gap: 12px; padding: 12px 22px;
  background: rgba(20,24,35,.85); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border);
  flex-shrink: 0; flex-wrap: wrap;
}
.app-topbar .tabs a { font-size: 13.5px; padding: 8px 12px; }
.app-content { flex: 1; overflow-y: auto; padding: 20px 24px; }
.app-content.chat-mode { padding: 0; display: flex; flex-direction: column; overflow: hidden; position: relative; }

/* لودر گفتگو؛ در اتصال سریع پیش از ظاهرشدن حذف می‌شود و باعث چشمک‌زدن نمی‌شود. */
.chat-loader {
  position: absolute; inset: 0 0 69px; z-index: 12;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  background: var(--bg);
  background: color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter: blur(5px);
  opacity: 0;
  animation: chat-loader-reveal 0s .12s forwards;
  transition: opacity .2s ease, visibility .2s ease;
}
.chat-loader.done { opacity: 0 !important; visibility: hidden; animation: none; pointer-events: none; }
.chat-loader-bubble {
  display: flex; align-items: center; gap: 5px;
  min-width: 66px; height: 42px; padding: 0 14px;
  border-radius: 18px 18px 5px 18px;
  background: var(--bg-card); border: 1px solid var(--border);
  box-shadow: var(--shadow-card);
}
.chat-loader-bubble span {
  width: 7px; height: 7px; border-radius: 50%; background: var(--accent);
  animation: chat-loader-dot 1.05s ease-in-out infinite;
}
.chat-loader-bubble span:nth-child(2) { animation-delay: .14s; }
.chat-loader-bubble span:nth-child(3) { animation-delay: .28s; }
.chat-loader-label { color: var(--text-dim); font-size: 11.5px; }
@keyframes chat-loader-reveal { to { opacity: 1; } }
@keyframes chat-loader-dot {
  0%, 60%, 100% { transform: translateY(0); opacity: .45; }
  30% { transform: translateY(-5px); opacity: 1; }
}

.menu-btn { display: none; flex-shrink: 0; }
.sidebar-overlay { display: none; }

@media (max-width: 860px) {
  .app-sidebar {
    position: fixed; top: 0; bottom: 0; right: 0; width: 86%; max-width: 330px;
    transform: translateX(100%); transition: transform .25s ease; z-index: 60;
    box-shadow: -10px 0 40px -10px rgba(0,0,0,.45);
  }
  .sidebar-toggle-cb:checked ~ .app-sidebar { transform: translateX(0); }
  .sidebar-overlay {
    display: block; position: fixed; inset: 0; background: rgba(0,0,0,.5); opacity: 0; pointer-events: none;
    transition: opacity .2s ease; z-index: 55;
  }
  .sidebar-toggle-cb:checked ~ .sidebar-overlay { opacity: 1; pointer-events: auto; }
  .menu-btn { display: inline-flex; }
  .app-content { padding: 16px; }
  .app-topbar { padding: 10px 14px; }
  .app-topbar .tabs { width: 100%; order: 3; }
}

/* ---------- پنل «کارهای من» ---------- */
.my-task-row { display: flex; align-items: center; gap: 12px; padding: 10px 8px; border-radius: 10px; color: var(--text); }
.my-task-row:hover { background: var(--bg-soft); text-decoration: none; }
.my-task-row:not(:last-child) { border-bottom: 1px solid var(--border-soft); }
.my-task-pin { width: 32px; height: 32px; border-radius: 9px; background: var(--bg-soft); color: var(--accent); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.my-task-body { flex: 1; min-width: 0; }
.my-task-body .goal-text { font-size: 13.5px; }

/* ---------- آواتار تصویری (آپلودشده) ---------- */
img.avatar { object-fit: cover; }

/* ---------- واکنش ایموجی روی پیام‌ها ---------- */
.reaction-bar { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 6px; }
.reaction-pill {
  display: inline-flex; align-items: center; gap: 4px; font-size: 12px; line-height: 1;
  background: var(--bg-soft); border: 1px solid var(--border); color: var(--text-dim);
  border-radius: 20px; padding: 3px 9px; cursor: pointer; transition: all .15s ease; font-family: inherit;
}
.reaction-pill:hover { border-color: var(--accent-dim); color: var(--text); }
.reaction-pill.mine { background: rgba(124,158,255,.14); border-color: var(--accent); color: var(--accent); }
.msg.mine .reaction-pill { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.25); color: rgba(255,255,255,.9); }
.msg.mine .reaction-pill.mine { background: rgba(255,255,255,.3); border-color: #fff; color: #fff; }

.reaction-add { position: relative; }
.reaction-add summary {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 50%; background: var(--bg-soft); border: 1px solid var(--border);
  color: var(--text-dim); cursor: pointer; list-style: none;
}
.reaction-add summary::-webkit-details-marker { display: none; }
.reaction-add summary:hover { color: var(--text); border-color: var(--accent-dim); }
.reaction-tray {
  position: absolute; bottom: calc(100% + 6px); inset-inline-start: 0; z-index: 10;
  display: flex; gap: 3px; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 20px; padding: 5px 7px; box-shadow: var(--shadow-card); white-space: nowrap;
}
.reaction-opt { background: none; border: none; font-size: 17px; cursor: pointer; padding: 2px 4px; border-radius: 8px; line-height: 1; font-family: inherit; }
.reaction-opt:hover { background: var(--bg-soft); transform: scale(1.15); }

/* ---------- پیام صوتی در حباب چت: پلیر سفارشی شبیه تلگرام ---------- */
.sticker-content { background: transparent !important; }
.sticker-img { width: 96px; height: 96px; display: block; }

.voice-content { display: flex; align-items: center; gap: 8px; min-width: 200px; }
.voice-play-btn { width: 32px; height: 32px; border-radius: 50%; padding: 0; flex-shrink: 0; background: var(--grad); border-color: transparent; color: #0c0e14; }
.voice-play-btn:hover { filter: brightness(1.08); border-color: transparent; color: #0c0e14; }
.voice-play-btn .ico-play, .voice-play-btn .ico-pause { display: flex; }
.voice-play-btn .ico-pause { display: none; }
.voice-play-btn.playing .ico-play { display: none; }
.voice-play-btn.playing .ico-pause { display: flex; }
.msg.mine .voice-play-btn { background: rgba(255,255,255,.92); color: var(--accent-dim); }
.msg.mine .voice-play-btn:hover { color: var(--accent-dim); }

.voice-wave { position: relative; flex: 1; min-width: 60px; height: 26px; cursor: pointer; direction: ltr; }
.voice-wave-row { position: absolute; inset: 0; display: flex; align-items: center; gap: 1.5px; overflow: hidden; direction: ltr; }
.voice-wave-row span { flex: 0 0 2px; border-radius: 2px; }
.voice-wave-bg span { background: var(--border); }
.voice-wave-fg { width: 0%; }
.voice-wave-fg span { background: var(--accent-dim); }
.msg.mine .voice-wave-bg span { background: rgba(255,255,255,.32); }
.msg.mine .voice-wave-fg span { background: #fff; }

.voice-time { font-size: 11px; color: var(--text-dim); min-width: 30px; text-align: center; flex-shrink: 0; }
.msg.mine .voice-time { color: rgba(255,255,255,.78); }
.voice-dl-btn { flex-shrink: 0; display: flex; color: var(--text-dim); }
.voice-dl-btn:hover { color: var(--accent); }
.msg.mine .voice-dl-btn { color: rgba(255,255,255,.78); }
.msg.mine .voice-dl-btn:hover { color: #fff; }

/* مخفی‌کردن اسکرول‌بار نوار پیام‌های چت (ظاهر پیش‌فرض اسکرول‌بار جذاب نیست، اسکرول‌کردن همچنان فعال است) */
.chat-messages { scrollbar-width: none; -ms-overflow-style: none; }
.chat-messages::-webkit-scrollbar { display: none; }

/* ---------- نوار ارسال پیام: میکروفون + متن ---------- */
.chat-input-wrap { flex-shrink: 0; display: flex; gap: 8px; align-items: flex-end; padding: 12px 16px; border-top: 1px solid var(--border); background: var(--bg-card); }
.chat-input-wrap .chat-input-bar { flex: 1; padding: 0; border-top: none; background: transparent; }

.mic-btn { flex-shrink: 0; }
.mic-btn.recording { background: var(--danger); color: #1a0a0a; border-color: var(--danger); animation: mic-pulse 1.2s ease-in-out infinite; }
@keyframes mic-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(255,107,107,.5); } 50% { box-shadow: 0 0 0 7px rgba(255,107,107,0); } }

/* ---------- پنل ضبط پیام صوتی: واکنش زنده به سطح صدا + تایمر + لغو/ارسال ---------- */
.voice-recorder { flex: 1; display: flex; align-items: center; gap: 8px; background: var(--bg-soft); border: 1px solid var(--border); border-radius: 999px; padding: 5px 8px; height: 44px; }
.voice-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--danger); flex-shrink: 0; margin-inline-start: 4px; animation: mic-pulse 1.2s ease-in-out infinite; }
.voice-bars { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 2.5px; height: 30px; overflow: hidden; }
.voice-bar { width: 3px; height: 4px; border-radius: 2px; background: var(--grad); transition: height .08s ease; }
.voice-timer { font-size: 12px; color: var(--text-dim); min-width: 32px; text-align: center; flex-shrink: 0; }
.voice-cancel-btn { background: transparent; border-color: transparent; color: var(--danger); }
.voice-cancel-btn:hover { background: rgba(255,107,107,.12); border-color: transparent; color: var(--danger); }
.voice-send-btn { background: var(--grad); border-color: transparent; color: #0c0e14; }
.voice-send-btn:hover { filter: brightness(1.08); border-color: transparent; color: #0c0e14; }

/* ---------- رنگ نقش اعضا ---------- */
.color-form { display: flex; gap: 6px; align-items: center; background: var(--bg-soft); border: 1px solid var(--border); border-radius: 9px; padding: 3px 4px 3px 3px; }
.color-form input[type="color"] { margin: 0; width: 30px; height: 28px; padding: 2px; border: none; background: transparent; cursor: pointer; }
.color-form button { border-radius: 7px; }

/* ---------- پروفایل (اتاق فکر / کاربر) ---------- */
.room-profile-form textarea { resize: vertical; }

/* ---------- گزارش/آنالیتیکس اتاق فکر ---------- */
.report-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.stat-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 16px; box-shadow: var(--shadow-card); }
.stat-label { font-size: 12px; color: var(--text-dim); display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.stat-value { font-size: 26px; font-weight: 800; color: var(--text); }

.leaderboard-row { display: flex; align-items: center; gap: 10px; padding: 9px 4px; border-bottom: 1px solid var(--border-soft); }
.leaderboard-row:last-child { border-bottom: none; }
.leaderboard-bar-track { flex: 2; height: 7px; border-radius: 6px; background: var(--bg-soft); overflow: hidden; }
.leaderboard-bar { height: 100%; background: var(--grad); border-radius: 6px; }

.digest-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 14px; }
@media (max-width: 700px) { .digest-cols { grid-template-columns: 1fr; } }
.digest-item { font-size: 13px; padding: 8px 10px; background: var(--bg-card-2); border-radius: 8px; margin-bottom: 6px; word-break: break-word; }
.digest-item.done { opacity: .7; text-decoration: line-through; }
.empty-state.small { padding: 14px 8px; font-size: 12.5px; }

/* ---------- پروفایل عمومی کاربر ---------- */
.public-profile-wrap { max-width: 760px; width: 100%; margin: 0 auto; }
.profile-back-btn { direction: ltr; }
.public-profile-card { overflow: hidden; position: relative; }
.public-profile-card::before {
  content: ""; position: absolute; inset: 0 0 auto; height: 105px;
  background: linear-gradient(135deg, rgba(124,158,255,.22), rgba(176,124,255,.15));
  pointer-events: none;
}
.public-profile-head { position: relative; display: flex; align-items: center; gap: 16px; padding-top: 28px; margin-bottom: 24px; }
.public-profile-avatar { position: relative; flex-shrink: 0; }
.public-profile-avatar .avatar { border: 4px solid var(--bg-card); box-shadow: 0 10px 30px -12px rgba(0,0,0,.7); }
.profile-online-dot { position: absolute; left: 5px; bottom: 7px; width: 16px; height: 16px; border-radius: 50%; background: var(--success); border: 3px solid var(--bg-card); }
.public-profile-identity { flex: 1; min-width: 0; padding-top: 24px; }
.public-profile-identity h1 { font-size: 22px; margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; }
.public-profile-head > .btn { margin-top: 24px; }
.profile-bio { background: var(--bg-soft); border: 1px solid var(--border-soft); border-radius: 13px; padding: 14px 16px; margin-bottom: 16px; }
.profile-bio p { color: var(--text); margin: 4px 0 0; font-size: 14px; line-height: 1.9; overflow-wrap: anywhere; }
.profile-section-label { color: var(--accent); font-size: 11px; font-weight: 700; }
.profile-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.profile-stats > div { text-align: center; background: var(--bg-card-2); border: 1px solid var(--border-soft); border-radius: 12px; padding: 12px 6px; transition: transform .2s ease, border-color .2s ease; }
.profile-stats > div:hover { transform: translateY(-2px); border-color: var(--accent-dim); }
.profile-stats strong { display: block; font-size: 20px; }
.profile-stats span { color: var(--text-dim); font-size: 11px; }
.shared-room-list { display: flex; flex-direction: column; gap: 4px; }
.shared-room-list a, .shared-room-list a:visited { display: flex; align-items: center; gap: 10px; color: var(--text); padding: 9px; border-radius: 11px; transition: background-color .18s ease, transform .18s ease; }
.shared-room-list a:hover { background: var(--bg-soft); transform: translateX(-2px); text-decoration: none; }
.shared-room-list a span { flex: 1; font-size: 14px; font-weight: 600; }
.shared-room-list a > .icon { color: var(--text-dim); }

@media (max-width: 560px) {
  .public-profile-head { align-items: flex-end; flex-wrap: wrap; }
  .public-profile-avatar .avatar { width: 76px !important; height: 76px !important; }
  .public-profile-identity { padding-top: 18px; }
  .public-profile-head > .btn { width: 100%; margin-top: 0; }
  .profile-stats strong { font-size: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ===== Tachat Messenger UI 2026 ===== */
:root{--tg-blue:#3390ec;--tg-blue-2:#5aa8f5;--tg-panel:rgba(24,28,40,.88);--tg-glass:blur(18px) saturate(135%);--tg-wallpaper-opacity:.28;--radius:16px;--radius-sm:11px;--accent:var(--tg-blue);--accent-2:#6daef0;--grad:linear-gradient(135deg,#3390ec,#66aef4)}
:root[data-theme="light"]{--bg:#e8edf3;--bg-soft:#f2f5f8;--bg-card:#fff;--bg-card-2:#f4f7fa;--border:#d9e0e8;--border-soft:#e5eaf0;--text:#17212b;--text-dim:#6d7883;--tg-panel:rgba(255,255,255,.9);--tg-wallpaper-opacity:.22}
body{background-color:var(--bg);background-image:radial-gradient(circle at 15% 5%,rgba(51,144,236,.14),transparent 32%),radial-gradient(circle at 90% 90%,rgba(91,167,240,.1),transparent 34%);background-attachment:fixed}
.app-shell{background:transparent}.app-sidebar{background:var(--tg-panel)!important;backdrop-filter:var(--tg-glass);border-inline-end:1px solid var(--border-soft);box-shadow:8px 0 30px -28px #000}.sidebar-head,.app-topbar{background:var(--tg-panel)!important;backdrop-filter:var(--tg-glass);-webkit-backdrop-filter:var(--tg-glass)}
.app-topbar{min-height:64px;border-bottom:1px solid var(--border-soft);box-shadow:0 8px 28px -28px #000}.sidebar-room{border-radius:13px;margin:2px 7px;padding:9px!important}.sidebar-room:hover{background:rgba(51,144,236,.09)!important;transform:translateX(-2px)}.sidebar-room.active{background:linear-gradient(135deg,#3390ec,#5da7ef)!important;color:#fff}.sidebar-quicklinks a{border-radius:11px;transition:.2s ease}.tabs a{border-radius:10px;padding:8px 11px!important;white-space:nowrap}.tabs a.active{background:rgba(51,144,236,.13);color:var(--tg-blue)}
.card{border-color:var(--border-soft);box-shadow:0 10px 35px -30px rgba(0,0,0,.8)}.btn{border-radius:12px;background:linear-gradient(135deg,var(--tg-blue),var(--tg-blue-2));color:#fff;box-shadow:0 8px 22px -16px var(--tg-blue)}.btn.secondary{background:var(--bg-card);color:var(--text)}input,textarea,select{border-radius:12px!important;border-color:var(--border)!important;background:var(--bg-soft)!important}.avatar{box-shadow:0 0 0 2px var(--bg-card),0 4px 14px -8px #000}
.chat-mode{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(rgba(10,18,28,.62),rgba(10,18,28,.62)),radial-gradient(circle at 20% 30%,rgba(51,144,236,.13),transparent 30%),radial-gradient(circle at 80% 65%,rgba(108,174,239,.1),transparent 27%)}
.chat-mode::before{content:'';position:absolute;inset:0;z-index:-1;opacity:var(--tg-wallpaper-opacity);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg fill='none' stroke='%2389a6bc' stroke-opacity='.34' stroke-width='1.2'%3E%3Cpath d='M22 33c12-14 24 4 10 13S8 43 22 33ZM121 25l12 8-8 12-12-8zM60 92c8-17 29-12 28 6s-26 20-28-6ZM130 118c14-8 25 8 14 18s-28-8-14-18ZM28 139l18-4 4 18-18 4z'/%3E%3Cpath d='M73 28q12 15 24 0M102 151q9-18 20 0'/%3E%3C/g%3E%3C/svg%3E");filter:blur(.25px)}
:root[data-theme="light"] .chat-mode{background:linear-gradient(rgba(231,239,246,.76),rgba(231,239,246,.76)),radial-gradient(circle at 20% 20%,rgba(51,144,236,.11),transparent 30%)}
.chat-messages{padding:20px clamp(10px,4vw,48px);gap:4px}.msg{border:0;border-radius:15px 15px 15px 4px;padding:8px 12px;background:var(--bg-card);box-shadow:0 2px 7px rgba(0,0,0,.12);max-width:min(76%,620px)}.msg.mine{border-radius:15px 15px 4px 15px;background:linear-gradient(135deg,#2f8de4,#3c98ed);color:#fff}.msg.mine .content{color:#fff}.msg .meta{opacity:.86}.chat-input-wrap{margin:0 clamp(8px,3vw,34px) 10px;padding:8px;border:0;border-radius:18px;background:var(--tg-panel);backdrop-filter:var(--tg-glass);box-shadow:0 8px 32px -18px #000}.chat-input-bar textarea{border:0!important;background:transparent!important;box-shadow:none!important}.send-btn,.mic-btn{background:var(--tg-blue)!important;color:#fff!important;border:0!important}
.dating-page{max-width:980px}.dating-deck{min-height:680px}.dating-card{width:min(470px,calc(100vw - 28px));border:0;background:var(--bg-card);box-shadow:0 35px 90px -38px #000;touch-action:pan-y}.dating-card.card-active::before{content:'LIKE';position:absolute;z-index:4;top:28px;right:22px;padding:6px 12px;border:3px solid #42e695;border-radius:9px;color:#42e695;font-size:25px;font-weight:900;opacity:0;transform:rotate(10deg)}.dating-card.dragging{transition:none}.dating-photo{height:330px}.dating-info{background:linear-gradient(180deg,transparent,var(--bg-card) 15%);margin-top:-20px;position:relative;border-radius:22px 22px 0 0}.dating-actions button{background:var(--bg-card);box-shadow:0 9px 26px -15px #000;border:0}.dating-like{background:rgba(66,230,149,.12)!important}.dating-pass{background:rgba(255,107,125,.1)!important}.match-celebration{position:fixed;inset:0;z-index:3000;display:grid;place-content:center;text-align:center;background:rgba(8,14,22,.86);backdrop-filter:blur(18px);animation:site-fade-in .25s ease}.match-celebration[hidden]{display:none}.match-celebration>div{font-size:84px;animation:badge-pop .65s cubic-bezier(.2,1.5,.3,1)}.match-celebration h2{font-size:34px;color:#fff}.match-celebration p{color:#cbd8e5}
@media(max-width:700px){.app-content{padding:12px!important}.app-topbar{padding:8px 10px!important;min-height:56px}.app-topbar .tabs{order:3;width:100%;padding-bottom:2px}.dating-deck{min-height:calc(100dvh - 150px)}.dating-card{min-height:calc(100dvh - 165px);border-radius:22px}.dating-photo{height:43dvh}.dating-info{padding:16px}.dating-info h2{font-size:22px}.dating-actions{position:absolute;bottom:4px;left:0;right:0}.msg{max-width:88%}.chat-messages{padding:12px 8px}.chat-input-wrap{margin:0 6px 6px}.lifestyle-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* ---------- Dating / Match ---------- */
.dating-page{max-width:760px;margin:0 auto;width:100%}.dating-setup{max-width:620px;margin:20px auto}.dating-deck{position:relative;min-height:610px;perspective:1200px}.dating-card{position:absolute;inset:0;margin:auto;width:min(430px,100%);height:max-content;min-height:560px;border:1px solid var(--border);border-radius:26px;background:var(--bg-card);box-shadow:0 28px 70px -35px #000;overflow:hidden;animation:dating-card-in .45s cubic-bezier(.16,1,.3,1) both;transform-origin:center bottom}.dating-card:nth-last-child(2){transform:scale(.96) translateY(12px);opacity:.75}.dating-photo{height:285px;background:linear-gradient(135deg,rgba(124,158,255,.16),rgba(176,124,255,.18));display:grid;place-items:center;overflow:hidden}.dating-photo .avatar{width:100%!important;height:100%!important;border-radius:0;font-size:70px!important}.dating-info{padding:18px 20px}.dating-info h2{margin:0 0 5px;font-size:24px}.dating-info p{color:var(--text-dim);line-height:1.8}.dating-city{color:var(--accent);font-size:13px;margin-bottom:12px}.dating-actions{display:flex;justify-content:center;gap:20px;padding:0 18px 20px}.dating-actions button{width:58px;height:58px;border-radius:50%;border:1px solid var(--border);font-size:27px;cursor:pointer;background:var(--bg-soft);transition:.22s cubic-bezier(.2,.8,.2,1)}.dating-actions button:hover{transform:translateY(-4px) scale(1.08)}.dating-pass{color:#ff6b7d}.dating-like{color:#42e695}.dating-card.swipe-left{animation:swipe-left .36s ease forwards}.dating-card.swipe-right{animation:swipe-right .36s ease forwards}.dating-list{display:flex;flex-direction:column;gap:9px}.dating-person-row{display:flex;align-items:center;gap:12px;margin:0}.dating-person-row>div:nth-child(2){display:flex;flex-direction:column;flex:1;min-width:0}.dating-person-row>div span{color:var(--text-dim);font-size:12px}.dating-person-row .dating-actions{padding:0;gap:7px}.dating-person-row .dating-actions button{width:40px;height:40px;font-size:18px}.direct-messages{min-height:0}.direct-messages .msg{animation:message-in .22s ease both}@keyframes dating-card-in{from{opacity:0;transform:translateY(28px) scale(.94) rotate(2deg)}to{opacity:1;transform:none}}@keyframes swipe-left{to{opacity:0;transform:translateX(-130%) rotate(-18deg)}}@keyframes swipe-right{to{opacity:0;transform:translateX(130%) rotate(18deg)}}@media(max-width:600px){.dating-deck{min-height:570px}.dating-card{min-height:520px}.dating-photo{height:245px}.app-topbar .tabs{overflow-x:auto;flex-wrap:nowrap}}

.room-card-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.room-card-title strong { overflow-wrap: anywhere; }
.room-founder-link,
.room-founder-link:visited {
  display: inline-flex; align-items: center; gap: 6px;
  color: inherit; border-radius: 9px; padding: 2px 4px;
}
.room-founder-link:hover { color: var(--accent); background: var(--bg-soft); text-decoration: none; }
.admin-user-search {
  display: flex; align-items: center; gap: 8px; padding: 10px;
}
.admin-user-search input { flex: 1; min-width: 180px; margin: 0; }
.admin-password-details { position: relative; }
.admin-password-details > summary { list-style: none; cursor: pointer; white-space: nowrap; }
.admin-password-details > summary::-webkit-details-marker { display: none; }
.admin-password-form {
  position: absolute; z-index: 20; inset-inline-end: 0; top: calc(100% + 7px);
  width: min(310px, 82vw); padding: 12px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 13px; box-shadow: var(--shadow);
}
.admin-password-form input { margin-bottom: 8px; }
.admin-password-form .btn { width: 100%; }

@media (max-width: 620px) {
  .admin-user-search { flex-wrap: wrap; }
  .admin-user-search input { flex-basis: 100%; }
  .member-card { align-items: flex-start; }
  .member-actions { flex-wrap: wrap; }
}

/* ---------- مسیرهای زندگی و چالش روزانه ---------- */
.lifestyle-page { max-width: 1040px; margin: 0 auto; width: 100%; }
.lifestyle-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); gap: 15px; }
.lifestyle-card { padding: 0; overflow: hidden; }
.lifestyle-card > img { width: 100%; height: 155px; object-fit: cover; }
.lifestyle-card-body { padding: 18px; }
.lifestyle-card-body .btn { width: 100%; margin-top: 14px; }
.lifestyle-icon { font-size: 38px; filter: drop-shadow(0 8px 12px rgba(0,0,0,.25)); }
.lifestyle-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 16px; padding: 24px; }
.lifestyle-hero::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(124,158,255,.12),transparent),var(--life-cover) center/cover; opacity:.14; }
.lifestyle-hero > * { position: relative; }
.lifestyle-hero h1 { margin: 5px 0; }
.lifestyle-progress { grid-column:1/-1; height:8px; background:var(--bg-soft); border-radius:20px; overflow:hidden; }
.lifestyle-progress span { display:block; height:100%; background:var(--grad); border-radius:inherit; }
.daily-challenge { margin-top:16px; border-color:rgba(124,158,255,.35); }
.challenge-text { font-size:16px; line-height:2; }
.challenge-guide { padding:12px; background:var(--bg-soft); border-radius:10px; margin:12px 0; line-height:1.9; }
.challenge-music { display:flex; gap:10px; align-items:center; padding:12px; margin:12px 0; border:1px solid var(--border); border-radius:12px; }
.challenge-music div { display:flex; flex-direction:column; }
.challenge-music div { flex:1; gap:7px; }.challenge-music audio,.admin-audio-preview{width:100%;max-width:520px;height:40px}.admin-audio-preview{margin:4px 0 10px}
.roadmap-list { display:flex; flex-direction:column; gap:9px; }
.roadmap-day { display:grid; grid-template-columns:42px 1fr auto; align-items:center; gap:12px; padding:13px; margin:0; }
.roadmap-day p { margin:3px 0 0; color:var(--text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.roadmap-number { width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--bg-soft);font-weight:800; }
.roadmap-day.done .roadmap-number { background:#42e695;color:#092218; }.roadmap-day.locked{opacity:.58}.lifestyle-finished{text-align:center}.lifestyle-finished>div{font-size:54px}
.lifestyle-admin-layout { display:grid; grid-template-columns:minmax(300px,430px) 1fr; gap:18px; align-items:start; }.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.lifestyle-admin-days{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:12px}.lifestyle-admin-days .card{margin:0}
.lifestyle-home-card { display:grid;grid-template-columns:1.15fr .85fr;gap:34px;align-items:center;padding:38px;border:1px solid var(--border);border-radius:24px;background:radial-gradient(circle at 85% 20%,rgba(176,124,255,.18),transparent 38%),var(--bg-card);overflow:hidden; }
.lifestyle-home-steps{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.lifestyle-home-steps span{padding:8px 11px;background:var(--bg-soft);border-radius:10px;font-size:12px}.lifestyle-home-steps b{color:var(--accent);margin-left:4px}.lifestyle-preview-card{padding:22px;border:1px solid rgba(124,158,255,.3);border-radius:20px;background:rgba(12,15,25,.72);box-shadow:var(--shadow-pop);transform:rotate(-1.5deg)}.lifestyle-preview-top{display:flex;gap:12px;align-items:center}.lifestyle-preview-top>span{font-size:42px}.lifestyle-preview-top div{display:flex;flex-direction:column}.lifestyle-preview-card p{color:var(--text-dim);line-height:1.9}.lifestyle-preview-music{padding:10px;border-radius:10px;background:var(--bg-soft)}.lifestyle-preview-progress{height:6px;background:var(--bg-soft);border-radius:9px;margin-top:15px}.lifestyle-preview-progress span{display:block;width:35%;height:100%;background:var(--grad);border-radius:inherit}
@media(max-width:760px){.lifestyle-home-card,.lifestyle-admin-layout{grid-template-columns:1fr}.lifestyle-home-card{padding:22px}.lifestyle-preview-card{transform:none}.form-row{grid-template-columns:1fr}.lifestyle-hero{padding:18px}.roadmap-day{grid-template-columns:38px 1fr}}

/* ---------- موشن سراسری و نشان‌های افتخار ---------- */
body { animation: site-fade-in .42s ease both; }
.nav { animation: nav-drop-in .5s cubic-bezier(.2,.8,.2,1) both; }
.hero-inner > div:first-child { animation: hero-copy-in .7s .08s cubic-bezier(.2,.8,.2,1) both; }
.hero-art { animation: hero-art-in .85s .16s cubic-bezier(.2,.8,.2,1) both; }
.hero-art .blob { animation: ambient-float 7s ease-in-out infinite alternate; }
.section { animation: section-rise-in .65s cubic-bezier(.2,.8,.2,1) both; }
.app-main > .app-topbar { animation: nav-drop-in .42s cubic-bezier(.2,.8,.2,1) both; }
.app-content > * { animation: section-rise-in .48s cubic-bezier(.2,.8,.2,1) both; }
.app-content > *:nth-child(2) { animation-delay:.045s }.app-content > *:nth-child(3){animation-delay:.09s}.app-content > *:nth-child(4){animation-delay:.135s}
.card,.feature-card,.step-card,.room-card { will-change:transform; }
.card:hover,.feature-card:hover,.step-card:hover { transform:translateY(-3px); box-shadow:0 16px 38px -25px rgba(124,158,255,.55); }
.btn { position:relative; overflow:hidden; isolation:isolate; }
.btn::after { content:''; position:absolute; inset:-60% auto -60% -55%; width:34%; transform:rotate(18deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent); transition:left .55s ease; pointer-events:none; }
.btn:hover::after { left:125%; }
.avatar { transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease; }
a:hover > .avatar,.avatar:hover { transform:scale(1.08); box-shadow:0 0 0 3px rgba(124,158,255,.16); }
.lifestyle-icon { animation: lifestyle-icon-float 3.6s ease-in-out infinite; }
.lifestyle-preview-card { animation: preview-card-float 4.8s ease-in-out infinite alternate; }
.lifestyle-progress span,.lifestyle-preview-progress span { animation: progress-glow 1.8s ease-in-out infinite alternate; }
.daily-challenge { animation: challenge-arrive .62s cubic-bezier(.16,1,.3,1) both; }
.roadmap-day.done .roadmap-number { animation: badge-pop .45s cubic-bezier(.2,1.4,.4,1) both; }
.profile-badges { margin:0 0 16px; padding:14px 16px; border:1px solid rgba(66,230,149,.25); border-radius:13px; background:linear-gradient(135deg,rgba(66,230,149,.07),rgba(124,158,255,.06)); }
.profile-badge-list { display:flex; flex-wrap:wrap; gap:8px; margin-top:9px; }
.life-achievement-badge { display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid rgba(66,230,149,.34);border-radius:999px;background:var(--bg-card-2);color:var(--text);box-shadow:0 7px 20px -16px #42e695;animation:badge-pop .55s cubic-bezier(.2,1.4,.4,1) both; }
.life-achievement-badge > span { font-size:20px }.life-achievement-badge .icon{color:#42e695}.life-achievement-badge:hover{transform:translateY(-2px) scale(1.025);border-color:#42e695}
@keyframes site-fade-in{from{opacity:0}to{opacity:1}}
@keyframes nav-drop-in{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
@keyframes hero-copy-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes hero-art-in{from{opacity:0;transform:translateY(28px) scale(.94) rotate(2deg)}to{opacity:1;transform:none}}
@keyframes section-rise-in{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
@keyframes ambient-float{from{transform:translate3d(-8px,8px,0) scale(.97)}to{transform:translate3d(12px,-12px,0) scale(1.04)}}
@keyframes lifestyle-icon-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes preview-card-float{from{transform:rotate(-1.5deg) translateY(0)}to{transform:rotate(.5deg) translateY(-7px)}}
@keyframes progress-glow{from{filter:saturate(1);box-shadow:0 0 0 rgba(124,158,255,0)}to{filter:saturate(1.35);box-shadow:0 0 12px rgba(124,158,255,.42)}}
@keyframes challenge-arrive{from{opacity:0;transform:scale(.97) translateY(18px)}to{opacity:1;transform:none}}
@keyframes badge-pop{from{opacity:0;transform:scale(.72)}to{opacity:1;transform:scale(1)}}
.channel-readonly-notice{margin:10px 16px;padding:12px 14px;text-align:center;border:1px solid var(--border);border-radius:13px;background:var(--bg-soft);color:var(--text-dim);font-size:13px;animation:section-rise-in .4s ease both}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation:none !important;transition-duration:.01ms !important;scroll-behavior:auto !important; }
}

/* ===== Messenger application shell / dashboard ===== */
.app-sidebar{width:330px;display:flex;flex-direction:column;height:100dvh;position:sticky;top:0}.sidebar-head{min-height:66px;padding:12px 15px;border-bottom:0!important}.sidebar-search{display:flex;align-items:center;gap:9px;margin:2px 12px 10px;padding:0 13px;height:42px;border-radius:13px;background:var(--bg-soft);color:var(--text-dim);border:1px solid transparent;transition:.2s ease}.sidebar-search:focus-within{background:var(--bg-card);border-color:rgba(51,144,236,.45);box-shadow:0 0 0 3px rgba(51,144,236,.08);color:var(--tg-blue)}.sidebar-search input{height:auto!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;min-width:0;font-size:13px}.sidebar-actions{display:grid;grid-template-columns:1fr 42px;gap:7px;padding:0 12px 9px}.sidebar-new-room{margin:0!important;height:42px;display:flex!important;align-items:center;justify-content:center}.sidebar-action-icon{display:grid;place-items:center;border-radius:12px;background:rgba(51,144,236,.1);color:var(--tg-blue)}.sidebar-quicklinks{display:grid!important;grid-template-columns:1fr 1fr;gap:5px;padding:4px 12px 8px!important}.sidebar-quicklinks a{font-size:12px;padding:9px!important;background:var(--bg-soft)}.sidebar-section-title{display:flex;align-items:center;justify-content:space-between;padding:9px 15px 5px;color:var(--text-dim);font-size:11px;font-weight:700}.sidebar-section-title span:last-child{background:var(--bg-soft);padding:2px 7px;border-radius:20px}.sidebar-rooms{flex:1;overflow-y:auto;padding-bottom:8px}.sidebar-foot{min-height:64px;border-top:1px solid var(--border-soft);padding:10px 14px;background:var(--tg-panel)}.mobile-bottom-nav{display:none}
.dashboard-topbar-title{display:flex;flex-direction:column;gap:1px;min-width:150px}.dashboard-topbar-title strong{font-size:16px}.dashboard-topbar-title span{font-size:11px;color:var(--text-dim)}.dashboard-tabs{margin-inline-start:auto!important;flex:0 1 auto!important}.dashboard-compose{background:var(--tg-blue)!important;color:#fff!important}.dashboard-compose .icon{color:#fff}.dashboard-welcome{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:25px 28px;margin-bottom:20px;border-radius:22px;overflow:hidden;background:radial-gradient(circle at 10% 20%,rgba(255,255,255,.16),transparent 32%),linear-gradient(135deg,#2484df,#54a7f3);color:#fff;box-shadow:0 20px 45px -30px #1873c9}.dashboard-welcome h1{font-size:27px;margin:5px 0}.dashboard-welcome p{margin:0;color:rgba(255,255,255,.78)}.dashboard-welcome .eyebrow{color:rgba(255,255,255,.72)}.dashboard-quick-actions{display:flex;gap:8px}.dashboard-quick-actions a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:82px;height:74px;border-radius:16px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:11px;backdrop-filter:blur(8px);transition:.2s ease}.dashboard-quick-actions a:hover{background:rgba(255,255,255,.24);transform:translateY(-3px);text-decoration:none}.dashboard-quick-actions b{font-size:24px}.dashboard-columns{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.7fr);gap:18px;align-items:start}.dashboard-section-head{display:flex;align-items:end;justify-content:space-between;margin:0 2px 10px}.dashboard-section-head h2{margin:1px 0;font-size:18px}.eyebrow{color:var(--tg-blue);font-size:10px;font-weight:800}.section-count{display:grid;place-items:center;min-width:28px;height:28px;padding:0 8px;border-radius:50px;background:rgba(51,144,236,.11);color:var(--tg-blue);font-size:12px;font-weight:800}
.conversation-list{overflow:hidden;border:1px solid var(--border-soft);border-radius:19px;background:var(--bg-card);box-shadow:0 18px 45px -38px #000}.conversation-row{display:flex;align-items:center;gap:13px;min-height:78px;padding:10px 14px;color:var(--text)!important;border-bottom:1px solid var(--border-soft);transition:.18s ease}.conversation-row:last-child{border:0}.conversation-row:hover{background:rgba(51,144,236,.07);text-decoration:none;transform:none}.conversation-avatar{position:relative;flex:none}.conversation-avatar i{position:absolute;bottom:2px;right:2px;width:11px;height:11px;background:#42d984;border:2px solid var(--bg-card);border-radius:50%}.conversation-body{flex:1;min-width:0}.conversation-title,.conversation-preview{display:flex;align-items:center;justify-content:space-between;gap:12px}.conversation-title strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-title time{font-size:10px;color:var(--text-dim);white-space:nowrap}.conversation-preview{margin-top:5px;color:var(--text-dim);font-size:12px}.conversation-preview span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-preview b{font-size:9px;padding:3px 7px;border-radius:20px;background:var(--bg-soft);white-space:nowrap}.dashboard-task-card{padding:7px!important}.dashboard-rail .my-task-row{padding:10px 7px}.empty-state.compact{font-size:12px;line-height:1.9}.today-challenge-card{display:flex;align-items:center;gap:13px;margin-top:12px;padding:18px;border-radius:18px;color:#fff!important;background:linear-gradient(135deg,#6d5ce8,#a265e8);box-shadow:0 16px 35px -25px #7a54de}.today-challenge-card>span{font-size:35px}.today-challenge-card div{display:flex;flex-direction:column;gap:3px}.today-challenge-card small{opacity:.75}.today-challenge-card strong{font-size:14px}.today-challenge-card em{font-size:10px;opacity:.8;font-style:normal;margin-top:4px}.today-challenge-card:hover{text-decoration:none;transform:translateY(-2px)}
@media(max-width:980px){.dashboard-columns{grid-template-columns:1fr}.dashboard-rail{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dashboard-rail>.dashboard-section-head{grid-column:1/-1}.dashboard-task-card,.today-challenge-card{margin:0}}
@media(max-width:700px){body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}.app-main{min-width:0}.app-content{padding:10px!important}.app-topbar{position:sticky;top:0;z-index:30;flex-wrap:nowrap!important}.dashboard-topbar-title{display:flex;flex:1}.dashboard-tabs{flex:none!important}.dashboard-tabs a:not(.dashboard-compose){display:none}.dashboard-compose span{display:none}.dashboard-compose{width:39px;height:39px;padding:0!important;display:grid!important;place-items:center}.mobile-bottom-nav{position:fixed;z-index:1200;display:grid;grid-template-columns:repeat(4,1fr);inset-inline:0;bottom:0;height:calc(62px + env(safe-area-inset-bottom));padding:5px 7px env(safe-area-inset-bottom);background:var(--tg-panel);border-top:1px solid var(--border-soft);backdrop-filter:var(--tg-glass);box-shadow:0 -12px 35px -30px #000}.mobile-bottom-nav a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:12px;color:var(--text-dim);font-size:10px;font-weight:650}.mobile-bottom-nav a.active{color:var(--tg-blue);background:rgba(51,144,236,.08)}.mobile-bottom-nav a.active:before{content:'';position:absolute;top:1px;width:22px;height:3px;border-radius:5px;background:var(--tg-blue)}.mobile-nav-emoji{font-size:23px;line-height:21px}.dashboard-welcome{padding:20px;align-items:flex-start;flex-direction:column}.dashboard-welcome h1{font-size:22px}.dashboard-welcome p{font-size:12px}.dashboard-quick-actions{width:100%}.dashboard-quick-actions a{flex:1;width:auto;height:62px}.dashboard-columns{gap:16px}.dashboard-rail{display:block}.dashboard-rail .today-challenge-card{margin-top:10px}.conversation-row{min-height:72px;padding:8px 10px}.conversation-avatar .avatar{width:50px!important;height:50px!important}.conversation-preview b{display:none}.sidebar-quicklinks{grid-template-columns:1fr}.sidebar-search{margin-top:0}}

/* ===== Responsive chat: phone, keyboard and small WebView ===== */
.room-page,.room-page .app-shell,.room-page .app-main{height:var(--app-height,100dvh);max-height:var(--app-height,100dvh)}
.room-page{overflow:hidden;padding-bottom:0}.room-chat-page .mobile-bottom-nav{display:none!important}.room-page .app-topbar{min-width:0}.room-page .app-topbar>div:not(.tabs){min-width:0}.room-page .chat-mode{min-height:0}.room-page .chat-messages{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.room-page .msg .content{overflow-wrap:anywhere;word-break:break-word}.room-page .message-reply-quote{max-width:100%}
@media(max-width:860px){.room-page .app-sidebar{height:var(--app-height,100dvh);max-height:none}.room-page .app-main{width:100%}.room-page .app-topbar{padding:8px 10px;gap:8px}.room-page .app-topbar>.avatar{width:36px!important;height:36px!important;flex:none}.room-page .app-topbar .tabs{display:flex;width:100%;order:3;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;scrollbar-width:none;padding:2px 0 0}.room-page .app-topbar .tabs::-webkit-scrollbar{display:none}.room-page .app-topbar .tabs a{flex:0 0 auto;padding:6px 10px!important;font-size:11.5px}.room-page .chat-mode{padding:0!important}.room-page .chat-messages{padding:11px max(7px,env(safe-area-inset-left)) 8px max(7px,env(safe-area-inset-right))}.room-page .chat-input-wrap{width:auto;max-width:none;margin:0;padding:7px max(7px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));gap:6px;border-radius:16px 16px 0 0;align-items:flex-end}.room-page .chat-input-wrap .chat-input-bar{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:5px;align-items:end}.room-page .chat-input-bar textarea{grid-column:1;min-width:0;width:100%;min-height:42px;max-height:min(132px,28dvh);padding:10px 9px!important;font-size:16px;line-height:1.45}.room-page .chat-input-bar .send-btn{grid-column:2;width:42px;height:42px;min-width:42px;padding:0;display:grid;place-items:center;border-radius:50%}.room-page .mic-btn{width:42px;height:42px;min-width:42px;border-radius:50%}.room-page .reply-compose-preview{grid-column:1/-1;width:100%;padding:6px 9px;margin:0 0 1px}.room-page .reply-compose-preview:not([hidden])~textarea,.room-page .reply-compose-preview:not([hidden])~.send-btn{grid-row:auto}.room-page .voice-recorder{min-width:0;height:44px;padding:4px 6px;gap:5px}.room-page .voice-bars{gap:1.5px}.room-page .voice-bar:nth-child(n+25){display:none}.room-page .message-context-menu{max-width:calc(100vw - 16px);border-radius:14px}.room-page .reaction-tray{position:fixed;left:8px!important;right:8px!important;bottom:76px;justify-content:space-around;direction:ltr}.room-page .channel-readonly-notice{margin:7px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}}
@media(max-width:520px){.room-page .app-topbar{min-height:54px}.room-page .app-topbar>div:not(.tabs) .flex-row{flex-wrap:nowrap!important}.room-page .app-topbar>div:not(.tabs) .badge{display:none}.room-page .app-topbar>div:not(.tabs) strong{display:block;max-width:48vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-page .app-topbar>div:not(.tabs) .muted{max-width:52vw}.room-page .msg{max-width:92%;min-width:0;padding:7px 9px}.room-page .msg .meta{font-size:9.5px}.room-page .msg .meta>.flex-row{gap:4px}.room-page .msg .meta .badge{display:none}.room-page .message-user-link .avatar{width:16px!important;height:16px!important}.room-page .voice-content{min-width:min(210px,68vw);max-width:72vw;gap:5px}.room-page .voice-play-btn{width:30px;height:30px}.room-page .voice-dl-btn{display:none}.room-page .sticker-img{width:82px;height:82px}.room-page .reaction-tray .reaction-opt{font-size:20px;padding:5px}.room-page .chat-loader{inset:0 0 58px}.room-page .load-older-messages{font-size:11px}}
@media(max-width:700px){.room-section-page .app-content:not(.chat-mode){padding-bottom:calc(82px + env(safe-area-inset-bottom))!important}}
@media(max-width:360px){.room-page .menu-btn{width:34px;height:34px}.room-page .app-topbar>.avatar{width:32px!important;height:32px!important}.room-page .app-topbar>div:not(.tabs) strong{max-width:40vw}.room-page .app-topbar .tabs a{padding:5px 8px!important;font-size:10.5px}.room-page .msg{max-width:95%}.room-page .chat-input-wrap{gap:4px;padding-inline:5px}.room-page .mic-btn,.room-page .chat-input-bar .send-btn{width:39px;height:39px;min-width:39px}.room-page .chat-input-wrap .chat-input-bar{grid-template-columns:minmax(0,1fr) 39px}.room-page .voice-time{font-size:10px;min-width:27px}}

/* چت خصوصی قدیمی نیز بدون نیاز به تغییر قراردادهای PHP، همان پوسته موبایل را می‌گیرد. */
body:has(.direct-messages){overflow:hidden;padding-bottom:0}body:has(.direct-messages) .app-shell,body:has(.direct-messages) .app-main{height:100dvh}body:has(.direct-messages) .mobile-bottom-nav{display:none!important}
@media(max-width:860px){body:has(.direct-messages) .app-topbar{padding:8px 10px;gap:8px;flex-wrap:nowrap!important;min-height:56px}body:has(.direct-messages) .app-topbar strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body:has(.direct-messages) .app-topbar .badge{margin-inline-start:auto;white-space:nowrap}body:has(.direct-messages) .chat-mode{padding:0!important;min-height:0}body:has(.direct-messages) .chat-messages{padding:11px 7px 8px;overscroll-behavior:contain}body:has(.direct-messages) .chat-input-wrap{margin:0;padding:7px max(7px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));border-radius:16px 16px 0 0}body:has(.direct-messages) .chat-input-bar{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:5px;width:100%}body:has(.direct-messages) .chat-input-bar textarea{grid-column:1;min-width:0;width:100%;min-height:42px;max-height:min(132px,28dvh);font-size:16px;padding:10px 9px!important}body:has(.direct-messages) .chat-input-bar .send-btn{grid-column:2;width:42px;height:42px;min-width:42px;padding:0;display:grid;place-items:center;border-radius:50%}body:has(.direct-messages) .msg{max-width:92%;overflow-wrap:anywhere}}

/* ===== Final mobile shell reset: must stay after every desktop rule ===== */
html,body{max-width:100%;overflow-x:hidden}.app-shell,.app-main,.app-content{min-width:0}.app-content>*{max-width:100%;box-sizing:border-box}img,video,audio,canvas,svg{max-width:100%}.grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr))}
@media(max-width:860px){
  .app-shell{width:100%;height:100dvh;overflow:hidden}.app-main{width:100%;max-width:100%;height:100dvh;flex:1 1 100%}
  .app-sidebar{position:fixed!important;z-index:1250!important;top:0!important;bottom:0!important;right:0!important;left:auto!important;width:min(88vw,330px)!important;height:100dvh!important;max-height:100dvh!important;flex:none!important;transform:translate3d(105%,0,0)!important;transition:transform .25s cubic-bezier(.2,.8,.2,1)!important;box-shadow:-18px 0 48px -20px rgba(0,0,0,.7)!important}
  .sidebar-toggle-cb:checked~.app-sidebar{transform:translate3d(0,0,0)!important}.sidebar-overlay{z-index:1240!important;inset:0!important}.sidebar-toggle-cb:checked~.sidebar-overlay{opacity:1!important;pointer-events:auto!important}
  .app-topbar{width:100%;max-width:100%;box-sizing:border-box}.app-content{width:100%;max-width:100%;box-sizing:border-box;overflow-x:hidden}.card{max-width:100%;box-sizing:border-box}.grid{width:100%;grid-template-columns:minmax(0,1fr);gap:10px}.room-card{width:100%;min-width:0}.room-card p,.room-card-title strong{overflow-wrap:anywhere}.flex-between,.flex-row{min-width:0}
  table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}input,textarea,select,button{max-width:100%;box-sizing:border-box}.form-row{grid-template-columns:minmax(0,1fr)!important}
}
@media(max-width:700px){
  .app-content:not(.chat-mode){padding:10px 10px calc(78px + env(safe-area-inset-bottom))!important}.dashboard-tabs{min-width:0}.dashboard-welcome{width:100%;box-sizing:border-box}.dashboard-columns,.dashboard-conversations,.dashboard-rail,.conversation-list{width:100%;min-width:0}.conversation-row{width:100%;box-sizing:border-box}.conversation-body{min-width:0}
  body:has(.dating-page) .app-topbar{display:grid!important;grid-template-columns:40px minmax(0,1fr);gap:7px!important;align-items:center;flex-wrap:unset!important}body:has(.dating-page) .app-topbar>.menu-btn{grid-column:1;grid-row:1}body:has(.dating-page) .app-topbar>strong{grid-column:2;grid-row:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body:has(.dating-page) .app-topbar>.tabs{grid-column:1/-1;grid-row:2;width:100%;min-width:0;display:flex;order:unset!important;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap!important;margin:0!important;padding:2px 0 3px;scrollbar-width:none}body:has(.dating-page) .app-topbar>.tabs::-webkit-scrollbar{display:none}body:has(.dating-page) .app-topbar>.tabs a{flex:1 0 auto;text-align:center;padding:7px 10px!important;font-size:12px}
  .dating-page{width:100%!important;max-width:100%!important;margin:0!important;padding-inline:10px!important;overflow:hidden}.dating-deck{width:100%;max-width:100%;min-height:calc(100dvh - 190px)!important;margin:0 auto}.dating-card{inset:0!important;width:100%!important;max-width:430px!important;min-width:0!important;min-height:0!important;max-height:calc(100dvh - 184px);display:flex;flex-direction:column;margin:0 auto!important;border-radius:20px!important}.dating-photo{height:min(38dvh,280px)!important;min-height:180px;flex:none}.dating-info{min-height:0;overflow-y:auto;padding:14px 16px!important;margin-top:-15px!important}.dating-info h2{font-size:20px!important}.dating-info p{margin-bottom:5px}.dating-actions{position:static!important;left:auto!important;right:auto!important;bottom:auto!important;flex:none;padding:8px 16px 14px!important}.dating-actions button{width:52px;height:52px}.dating-setup{width:100%;margin:0!important}.dating-person-row{width:100%;box-sizing:border-box;min-width:0;padding:10px}.dating-person-row>div:nth-child(2){overflow:hidden}.dating-person-row>div strong,.dating-person-row>div span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dating-person-row>.btn{flex:none}
}
@media(max-width:380px){.app-content:not(.chat-mode){padding-inline:7px!important}.mobile-bottom-nav{padding-inline:3px}.mobile-bottom-nav a{font-size:9px}.dating-page{padding-inline:5px!important}.dating-card{border-radius:16px!important}.dating-photo{min-height:155px}.dating-info{padding:11px 13px!important}.dating-actions{padding:5px 12px 10px!important}.dating-actions button{width:47px;height:47px}}

/* ===== Dating settings, matches, badges and custom chat wallpaper ===== */
.chat-mode::before{background-image:var(--chat-wallpaper-image)!important;background-size:auto;background-position:center}.platform-user-badge{display:inline-flex;align-items:center;gap:3px;padding:2px 6px;border-radius:999px;background:color-mix(in srgb,var(--badge-color) 16%,transparent);border:1px solid color-mix(in srgb,var(--badge-color) 52%,transparent);color:var(--badge-color);font-size:9px;font-weight:800;line-height:1.25;vertical-align:middle;white-space:nowrap}.msg.mine .platform-user-badge{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.38);color:#fff}.sidebar-kind{font-size:8px;color:var(--text-dim);padding:2px 5px;border:1px solid var(--border);border-radius:8px;white-space:nowrap}.direct-dot{width:8px;height:8px;border-radius:50%;background:#42d984;flex:none}.sidebar-direct .avatar{border-radius:50%}.profile-platform-badge{margin:4px 0 16px}.profile-direct-card{display:flex;align-items:center;justify-content:space-between;gap:14px}.profile-direct-card h3,.profile-direct-card p{margin:2px 0}.profile-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end;margin-top:12px}.profile-direct-toggle{margin:0!important;min-height:46px}
.dating-settings-head{display:flex;gap:16px;align-items:flex-start;margin-bottom:20px}.dating-settings-head>span{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,rgba(255,92,145,.18),rgba(154,105,255,.18));font-size:28px}.dating-settings-head h1{margin:4px 0 5px;font-size:24px}.dating-settings-head p{margin:0;color:var(--text-dim)}.dating-settings-form label{display:block;margin-bottom:6px;font-size:12px;color:var(--text-dim)}.dating-switch{display:flex!important;align-items:center;gap:10px;cursor:pointer;margin:12px 0 16px!important}.dating-switch input{display:none}.dating-switch span{position:relative;width:43px;height:24px;border-radius:20px;background:var(--border);transition:.2s}.dating-switch span:after{content:'';position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 7px rgba(0,0,0,.25);transition:.2s}.dating-switch input:checked+span{background:var(--tg-blue)}.dating-switch input:checked+span:after{transform:translateX(-19px)}.dating-switch b{font-size:12px;color:var(--text)}.dating-save{width:100%}
.dating-photo{position:relative}.dating-photo-gradient{position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(5,9,16,.88))}.dating-card-name{position:absolute;z-index:2;bottom:18px;right:18px;left:18px;color:#fff}.dating-card-name h2{margin:0 0 5px;font-size:25px}.dating-card-name>span{font-size:12px;opacity:.86}.dating-profile-open{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--bg-soft);border:1px solid var(--border);color:var(--tg-blue);font-size:20px}.matches-hero{display:flex;align-items:center;gap:16px;padding:18px 4px}.matches-hero>span{font-size:46px}.matches-hero h1{margin:0;font-size:25px}.matches-hero p{margin:4px 0;color:var(--text-dim)}.match-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:13px}.match-card{padding:18px;text-align:center;border:1px solid var(--border-soft);border-radius:22px;background:var(--bg-card);box-shadow:0 18px 45px -38px #000;transition:.22s ease}.match-card:hover{transform:translateY(-4px);border-color:rgba(51,144,236,.4)}.match-photo{position:relative;width:100px;margin:auto}.match-photo .avatar{width:100px!important;height:100px!important}.match-photo>span{position:absolute;left:-3px;bottom:3px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#ff4f87;color:#fff;border:3px solid var(--bg-card)}.match-card h3{margin:12px 0 4px}.match-card p{min-height:36px;color:var(--text-dim);font-size:12px}.match-card-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.match-card-actions .btn{padding:8px;font-size:11px}.direct-topbar>div{display:flex;flex-direction:column;flex:1;min-width:0}.direct-topbar>div strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.direct-topbar>div>span{font-size:10px;color:var(--text-dim)}.direct-empty{margin:auto;text-align:center;max-width:280px;color:var(--text-dim)}.direct-empty h3{color:var(--text)}
@media(max-width:700px){.profile-settings-grid{grid-template-columns:1fr}.profile-direct-card{align-items:flex-start}.match-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.match-card{padding:12px 8px;border-radius:17px}.match-photo,.match-photo .avatar{width:76px!important;height:76px!important}.match-card h3{font-size:13px}.match-card p{font-size:10px}.match-card-actions{grid-template-columns:1fr}.matches-hero{padding:7px 2px 13px}.matches-hero>span{font-size:35px}.matches-hero h1{font-size:20px}.matches-hero p{font-size:11px}.dating-settings-head>span{width:48px;height:48px}.dating-settings-head h1{font-size:19px}.dating-settings-head p{font-size:11px}}

/* دایرکت هم‌سطح چت گروهی: ارسال آنی، ویس و وضعیت شبکه */
.direct-compose [hidden]{display:none!important}.direct-compose .voice-recorder{margin:0;flex:1}.direct-voice{display:flex;align-items:center;gap:8px;min-width:210px}.direct-voice>div{flex:1;min-width:80px}.direct-voice audio{display:none}.direct-voice-line{height:24px;display:flex;align-items:center;overflow:hidden;background:repeating-linear-gradient(90deg,var(--text-dim) 0 2px,transparent 2px 5px);mask:linear-gradient(180deg,transparent 12%,#000 12% 88%,transparent 88%);opacity:.65}.msg.mine .direct-voice-line{background:repeating-linear-gradient(90deg,#fff 0 2px,transparent 2px 5px)}.direct-voice small{font-size:10px;opacity:.75}.direct-compose .pending-message{opacity:.82}.direct-messages .send-failed{outline:1px solid var(--danger)}.direct-messages .send-failed .message-status{color:#ff7b7b}.direct-messages .pending-message{min-height:unset}.direct-messages .message-status.sent{color:#58e697}.direct-messages .message-status.pending{color:rgba(255,255,255,.75)}
@media(max-width:520px){.direct-voice{min-width:min(210px,67vw);max-width:72vw}.direct-compose .voice-recorder{width:calc(100vw - 60px)}.direct-compose .voice-bars{min-width:30px}}
.dating-setting-switches{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.dating-setting-switches .dating-switch{margin:0!important;padding:11px;border:1px solid var(--border-soft);border-radius:13px;background:var(--bg-soft)}
@media(max-width:600px){.dating-setting-switches{grid-template-columns:1fr}}
.dating-cover-img{width:100%;height:100%;object-fit:cover}.dating-goal-chip{display:inline-flex;margin-top:7px;padding:5px 9px;border-radius:999px;background:rgba(255,86,140,.1);color:#ff6b9b;font-size:10px}.dating-photo-manager{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:18px}.dating-photo-manager>div{position:relative;aspect-ratio:3/4;border-radius:14px;overflow:hidden;background:var(--bg-soft)}.dating-photo-manager img{width:100%;height:100%;object-fit:cover}.dating-photo-manager form{position:absolute;top:6px;left:6px}.dating-photo-manager .icon-btn{background:rgba(12,15,25,.76);backdrop-filter:blur(8px)}.match-photo img{width:100px;height:100px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px var(--bg-card)}.match-card>small{display:block;color:var(--text-dim);font-size:10px;margin:-2px 0 10px}
.dating-full-page{max-width:1080px;margin:0 auto;width:100%}.dating-full-hero{display:grid;grid-template-columns:minmax(320px,.9fr) 1.1fr;gap:28px;padding:18px}.dating-full-gallery{min-width:0}.dating-gallery-main{height:500px;border-radius:20px;overflow:hidden;background:var(--bg-soft)}.dating-gallery-main img{width:100%;height:100%;object-fit:cover}.dating-gallery-thumbs{display:flex;gap:7px;margin-top:8px;overflow-x:auto;padding-bottom:3px}.dating-gallery-thumbs button{flex:0 0 62px;width:62px;height:72px;padding:0;border:2px solid transparent;border-radius:11px;overflow:hidden;background:none;cursor:pointer}.dating-gallery-thumbs button.active{border-color:var(--tg-blue)}.dating-gallery-thumbs img{width:100%;height:100%;object-fit:cover}.dating-gallery-fallback{height:500px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(135deg,rgba(51,144,236,.18),rgba(255,86,140,.12))}.dating-gallery-fallback .avatar{width:180px!important;height:180px!important;font-size:70px!important}.dating-full-summary{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:20px}.dating-full-summary h1{font-size:38px;margin:10px 0 4px}.dating-full-headline{font-size:17px;color:var(--text-dim);line-height:1.8}.dating-facts{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 22px}.dating-facts span{padding:8px 11px;border-radius:11px;background:var(--bg-soft);border:1px solid var(--border-soft);font-size:12px}.dating-full-columns{display:grid;grid-template-columns:1.2fr .8fr;gap:13px;margin-top:13px}.dating-about-card p{line-height:2.1;font-size:14px}.interest-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.interest-chips span{padding:7px 11px;border-radius:999px;background:rgba(51,144,236,.1);border:1px solid rgba(51,144,236,.22);color:var(--tg-blue);font-size:12px}
@media(max-width:760px){.dating-photo-manager{grid-template-columns:repeat(2,1fr)}.dating-full-hero{grid-template-columns:1fr;padding:10px;gap:8px}.dating-gallery-main,.dating-gallery-fallback{height:min(56dvh,480px)}.dating-full-summary{padding:14px 8px 8px}.dating-full-summary h1{font-size:27px}.dating-full-headline{font-size:14px}.dating-full-columns{grid-template-columns:1fr}.dating-full-page{padding-inline:8px!important}.dating-gallery-thumbs button{flex-basis:54px;width:54px;height:64px}.match-photo img{width:76px;height:76px}}
.dating-photo-manager-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:22px}.dating-photo-manager-head>div{display:flex;flex-direction:column}.dating-photo-manager-head small{color:var(--text-dim);font-size:10px}.dating-photo-manager-head>span{padding:5px 9px;border-radius:999px;background:var(--bg-soft);color:var(--text-dim);font-size:10px}.dating-photo-manage-card{position:relative;aspect-ratio:3/4;border-radius:14px;overflow:hidden;background:var(--bg-soft);border:2px solid transparent}.dating-photo-manage-card.is-primary{border-color:#ff5c91;box-shadow:0 10px 28px -18px #ff5c91}.dating-photo-manager .dating-photo-manage-card form{top:auto;left:auto}.dating-photo-remove{position:absolute!important;top:6px!important;left:6px!important}.dating-primary-label{position:absolute;right:7px;bottom:7px;padding:5px 8px;border-radius:9px;background:linear-gradient(135deg,#ff568c,#8e65f2);color:#fff;font-size:9px;font-weight:800}.dating-set-primary{position:absolute!important;right:6px;bottom:6px;left:6px!important}.dating-set-primary button{width:100%;padding:7px;border:1px solid rgba(255,255,255,.18);border-radius:9px;background:rgba(8,17,31,.78);backdrop-filter:blur(10px);color:#fff;font-family:inherit;font-size:9px;cursor:pointer}.dating-photo-empty{margin-top:15px;padding:18px;border:1px dashed var(--border);border-radius:14px;background:var(--bg-soft);color:var(--text-dim);font-size:12px;text-align:center}

/* ===== Dating campaign on landing ===== */
.dating-home{max-width:1240px;padding-top:26px}.dating-home-visual{position:relative;isolation:isolate;min-height:590px;border-radius:32px;overflow:hidden;background:#07172c;box-shadow:0 35px 90px -45px rgba(0,0,0,.9);border:1px solid rgba(90,165,240,.22)}.dating-home-visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2}.dating-home-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,14,30,.98) 0%,rgba(4,14,30,.91) 36%,rgba(4,14,30,.36) 62%,rgba(4,14,30,.08) 100%),linear-gradient(0deg,rgba(3,10,22,.36),transparent 45%)}.dating-home-copy{width:min(540px,52%);padding:70px 64px;color:#fff}.dating-home-kicker{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.08);backdrop-filter:blur(8px);font-size:12px}.dating-home-kicker span{color:#ff568c;font-size:18px}.dating-home-copy h2{font-size:clamp(35px,4.3vw,60px);line-height:1.17;margin:18px 0 14px;letter-spacing:-1.8px}.dating-home-copy h2 span{background:linear-gradient(90deg,#57aaff,#ff72a1);-webkit-background-clip:text;background-clip:text;color:transparent}.dating-home-copy>p{max-width:490px;color:rgba(255,255,255,.75);font-size:15px;line-height:2;margin:0}.dating-home-points{display:flex;flex-wrap:wrap;gap:7px;margin:22px 0}.dating-home-points span{padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.11);font-size:11px}.dating-home-actions{display:flex;gap:9px;flex-wrap:wrap}.dating-home-primary{background:linear-gradient(135deg,#268eed,#ff568c)!important}.dating-home-ghost{color:#fff!important;background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.18)!important}.dating-home-copy>small{display:block;margin-top:14px;color:rgba(255,255,255,.48)}.dating-home-float{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 15px;border:1px solid rgba(255,255,255,.16);border-radius:16px;background:rgba(8,20,38,.7);color:#fff;backdrop-filter:blur(14px);box-shadow:0 18px 40px -24px #000;animation:dating-home-float 4s ease-in-out infinite alternate}.dating-home-float>span{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(255,86,140,.18);font-size:21px}.dating-home-float div{display:flex;flex-direction:column}.dating-home-float b{font-size:12px}.dating-home-float small{font-size:9px;color:rgba(255,255,255,.6)}.dating-home-float-one{top:48px;left:40px}.dating-home-float-two{bottom:42px;left:25%;animation-delay:-1.7s}@keyframes dating-home-float{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-8px) rotate(1deg)}}
@media(max-width:900px){.dating-home-visual{min-height:620px}.dating-home-copy{width:62%;padding:58px 38px}.dating-home-float-one{left:20px}.dating-home-float-two{left:35%}}
@media(max-width:700px){.dating-home{padding-inline:10px}.dating-home-visual{min-height:690px;border-radius:24px}.dating-home-visual>img{height:48%;inset:auto 0 0;object-position:65% center}.dating-home-shade{background:linear-gradient(180deg,#07172c 0%,#07172c 47%,rgba(7,23,44,.82) 67%,rgba(7,23,44,.18) 100%)}.dating-home-copy{width:auto;padding:30px 23px}.dating-home-copy h2{font-size:34px;letter-spacing:-1px}.dating-home-copy>p{font-size:13px;line-height:1.9}.dating-home-actions .btn{flex:1;text-align:center}.dating-home-float{padding:9px 11px}.dating-home-float-one{top:auto;bottom:34px;left:13px}.dating-home-float-two{display:none}}
@media(max-width:380px){.dating-home-visual{min-height:720px}.dating-home-copy{padding:25px 17px}.dating-home-copy h2{font-size:30px}.dating-home-points span{font-size:9px}.dating-home-actions{flex-direction:column}}
.public-handle-field{display:flex;align-items:center;direction:ltr;border:1px solid var(--border);background:var(--bg-soft);border-radius:12px;overflow:hidden;margin-bottom:5px}.public-handle-field>span{padding:0 12px;color:var(--tg-blue);font-weight:800}.public-handle-field input{margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;direction:ltr}.profile-handle{display:inline-block;margin-top:4px;color:var(--tg-blue);font-size:12px;font-weight:700;direction:ltr}.user-mention{display:inline-flex;direction:ltr;padding:0 3px;border-radius:5px;background:rgba(51,144,236,.13);color:var(--tg-blue)!important;font-weight:800}.msg.mine .user-mention{background:rgba(255,255,255,.17);color:#fff!important}.share-link-row{display:flex;gap:7px;align-items:center;margin-top:8px;padding:8px;border:1px dashed var(--border);border-radius:11px;background:var(--bg-soft)}.share-link-row code{direction:ltr;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.share-link-row .btn{flex:none}