:root{ --blush:#FFF3F1;--cream:#FFF9F7;--coral:#FF5C8A;--coral-2:#FF8A6B; --plum:#5B2348;--lavender:#B49BF0;--gold:#FFC06A;--ink:#3A2233;--ink-soft:#7A6270; --line:rgba(91,35,72,.10);--glass:rgba(255,255,255,.66);--glass-strong:rgba(255,255,255,.85); --shadow:0 18px 50px -18px rgba(91,35,72,.45);--shadow-sm:0 8px 24px -12px rgba(91,35,72,.35); --r:26px;--r-sm:16px; /* brand tokens — change these to re-skin the whole app */ --grad:linear-gradient(120deg,var(--coral),var(--coral-2)); --grad-plum:linear-gradient(135deg,#6B2D5C,#3F1D37); --backdrop:#2a1024;--online:#41dd9c;--ok:#2bbd82; /* font tokens — Latin by default, Persian (RTL) overrides below */ --font-body:"Plus Jakarta Sans","Vazirmatn",system-ui,sans-serif; --font-display:"Fraunces","Vazirmatn",serif; } /* ===== قالب‌های دامنه (theme presets) — با تغییرِ همین توکن‌ها کلِ اپ ری‌اسکین می‌شود ===== */ :root[data-theme="romantic"]{ /* شکوفه — صورتیِ رمانتیک */ --blush:#FFEFF6;--cream:#FFF8FC;--coral:#FF6FA5;--coral-2:#FFA9C9;--plum:#6E1F52;--lavender:#F0A6D0;--gold:#FFC2D6;--ink:#43223A;--ink-soft:#8A6579;--line:rgba(110,31,82,.10);--grad-plum:linear-gradient(135deg,#7A2E63,#4A1C3E);--backdrop:#2e0f24} :root[data-theme="sunset"]{ /* غروب — نارنجی/هلویی گرم */ --blush:#FFF1E7;--cream:#FFF9F3;--coral:#FF7A45;--coral-2:#FFB25E;--plum:#5C2A1C;--lavender:#FFB08A;--gold:#FFCE7D;--ink:#3E2A1E;--ink-soft:#836553;--line:rgba(92,42,28,.10);--grad-plum:linear-gradient(135deg,#7A3B22,#4A2415);--backdrop:#2a1710} :root[data-theme="ocean"]{ /* لاگون — فیروزه‌ای/آبی تازه */ --blush:#E9F8FA;--cream:#F4FCFD;--coral:#12B5C4;--coral-2:#4FD6C4;--plum:#0E3A46;--lavender:#7FDCE8;--gold:#5FD3E0;--ink:#123138;--ink-soft:#4F7680;--line:rgba(14,58,70,.10);--grad-plum:linear-gradient(135deg,#124E5C,#0A2F39);--backdrop:#08222a} :root[data-theme="purple"]{ /* کهکشان — بنفش/نیلی مدرن */ --blush:#F2ECFF;--cream:#FAF7FF;--coral:#8B5CF6;--coral-2:#C08AFC;--plum:#2E1065;--lavender:#CBB6FD;--gold:#B794F6;--ink:#2B1F42;--ink-soft:#6A5A88;--line:rgba(46,16,101,.10);--grad-plum:linear-gradient(135deg,#3D1D75,#241148);--backdrop:#180a33} :root[data-theme="green"]{ /* نعنا — سبزِ زمردی تازه */ --blush:#EAFBF3;--cream:#F4FEF9;--coral:#10B981;--coral-2:#54DE8E;--plum:#0A4D3A;--lavender:#7CE6B8;--gold:#6EE7B0;--ink:#123329;--ink-soft:#4F7A69;--line:rgba(10,77,58,.10);--grad-plum:linear-gradient(135deg,#0E5E45,#08402F);--backdrop:#07261c} :root[data-theme="dark"]{ /* مخمل — سرخابیِ عمیقِ شبانه */ --blush:#FBEEF4;--cream:#FFF7FB;--coral:#E0367B;--coral-2:#FF6BA0;--plum:#3A0E2C;--lavender:#D98AB8;--gold:#F5A3C4;--ink:#331026;--ink-soft:#7A5468;--line:rgba(58,14,44,.10);--grad-plum:linear-gradient(135deg,#5A163F,#320B24);--backdrop:#20081a} :root[data-theme="minimal"]{ /* مینیمال — طوسیِ شیک با اکسنتِ مِلایم */ --blush:#F6F3F4;--cream:#FCFAFB;--coral:#B06A86;--coral-2:#C98BA3;--plum:#33262E;--lavender:#C9AEBC;--gold:#D8B3C4;--ink:#2E2429;--ink-soft:#7C6F76;--line:rgba(51,38,46,.10);--grad-plum:linear-gradient(135deg,#443843,#2A222A);--backdrop:#1c151a} :root[data-theme="glass"]{ /* کریستال — شیشه‌ایِ لوکس؛ بنفش→فیروزه‌ایِ درخشان (glassmorphism v2) */ --blush:rgba(233,240,255,.52);--cream:rgba(255,255,255,.66);--coral:#7C5CFC;--coral-2:#38C6F4;--plum:#2A2560;--lavender:#A78BFA;--gold:#67E8F9;--ink:#1D2144;--ink-soft:#5A5F8A; --line:rgba(255,255,255,.65);--glass:rgba(255,255,255,.42);--glass-strong:rgba(255,255,255,.62); --shadow:0 18px 50px -18px rgba(28,26,90,.55);--shadow-sm:0 8px 24px -12px rgba(28,26,90,.38); --grad-plum:linear-gradient(135deg,rgba(52,46,128,.80),rgba(22,20,66,.88));--backdrop:#0a0e2a} /* ── قالبِ کریستال: شیشهٔ زنده (blur + هایلایتِ لبه + برقِ عبوری) ── */ :root[data-theme="glass"] .phone{ background:linear-gradient(160deg,rgba(255,255,255,.60),rgba(228,236,255,.38) 55%,rgba(255,255,255,.48)); backdrop-filter:blur(30px) saturate(1.6);-webkit-backdrop-filter:blur(30px) saturate(1.6); box-shadow:var(--shadow),0 0 0 1px rgba(255,255,255,.6) inset,0 1.5px 0 rgba(255,255,255,.95) inset} :root[data-theme="glass"] .phone::after{content:"";position:absolute;inset:-20%;z-index:50;pointer-events:none; background:linear-gradient(115deg,transparent 43%,rgba(255,255,255,.13) 50%,transparent 57%); transform:translateX(-130%);animation:glassSheen 9s ease-in-out infinite} @keyframes glassSheen{0%,58%{transform:translateX(-130%)}88%,100%{transform:translateX(130%)}} :root[data-theme="glass"] .blob{opacity:.95} :root[data-theme="glass"] .blob.b1{background:radial-gradient(circle,#6d5bff,transparent 62%)} :root[data-theme="glass"] .blob.b2{background:radial-gradient(circle,#c05bff,transparent 62%)} :root[data-theme="glass"] .blob.b3{background:radial-gradient(circle,#22cdea,transparent 62%)} :root[data-theme="glass"] .langmenu,:root[data-theme="glass"] .pf-stat,:root[data-theme="glass"] .cred-row, :root[data-theme="glass"] .priv-card,:root[data-theme="glass"] .pay-card,:root[data-theme="glass"] .cred-tabs, :root[data-theme="glass"] .adpop-feat,:root[data-theme="glass"] .lang-opt,:root[data-theme="glass"] .cred-loglink{ backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3); border-color:rgba(255,255,255,.66);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),var(--shadow-sm)} :root[data-theme="glass"] .nav{ backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4); box-shadow:0 16px 36px -14px rgba(14,14,55,.68),inset 0 1px 0 rgba(255,255,255,.24)} :root[data-theme="glass"] .fab{box-shadow:0 14px 28px -8px rgba(124,92,252,.75)} /* چت و پروفایل: سطحِ تقریباً مات تا محتوای پشت حواس را پرت نکند؛ با هالهٔ ملایمِ رنگی برای حسِ شیشه */ :root[data-theme="glass"] .chatpop-bg,:root[data-theme="glass"] .pv-bg{background:rgba(237,242,255,.97)} :root[data-theme="glass"] .chatpop{background: radial-gradient(120% 55% at 100% 0%,rgba(124,92,252,.10),transparent 55%), radial-gradient(120% 55% at 0% 100%,rgba(56,198,244,.11),transparent 55%), linear-gradient(180deg,rgba(255,255,255,.93),rgba(234,240,255,.91))} :root[data-theme="glass"] .cp-head{background:rgba(255,255,255,.82); backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3); border-bottom-color:rgba(124,92,252,.16)} :root[data-theme="glass"] .cbubble.them{background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.9); box-shadow:0 8px 20px -12px rgba(30,35,95,.35)} :root[data-theme="glass"] .cbubble.me{box-shadow:0 10px 24px -10px rgba(124,92,252,.55)} :root[data-theme="glass"] .cp-composer{background:rgba(255,255,255,.78); backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top-color:rgba(124,92,252,.16)} :root[data-theme="glass"] .cp-composer input#cinp,:root[data-theme="glass"] .cp-composer input#supInp{background:rgba(255,255,255,.96)} :root[data-theme="glass"] .cp-send{box-shadow:0 8px 18px -8px rgba(124,92,252,.7)} :root[data-theme="glass"] .cp-emoji,:root[data-theme="glass"] .cp-pend,:root[data-theme="glass"] .cfm, :root[data-theme="glass"] .pv-body,:root[data-theme="glass"] .payres-card{background:rgba(250,252,255,.97)} /* فالبک: WebView سبک (litefx) یا مرورگرِ بدونِ backdrop-filter → پس‌زمینهٔ مات و روشن، بدونِ sheen */ html.litefx[data-theme="glass"] .phone{background:linear-gradient(180deg,#F6F9FF,#E9EFFF)!important} html.litefx[data-theme="glass"] .phone::after{display:none} @supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){ :root[data-theme="glass"] .phone{background:linear-gradient(180deg,#F6F9FF,#E9EFFF)} } [dir=rtl]{ --font-body:"Vazirmatn",system-ui,sans-serif; --font-display:"Vazirmatn",serif; } *{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent} html,body{height:100%} body{font-family:var(--font-body);color:var(--ink);background:var(--backdrop); display:flex;align-items:center;justify-content:center;min-height:100dvh;overflow:hidden} .aurora{position:fixed;inset:0;z-index:0;overflow:hidden} .blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.85;mix-blend-mode:screen;animation:drift 22s ease-in-out infinite} .blob.b1{width:60vmax;height:60vmax;left:-15vmax;top:-20vmax;background:radial-gradient(circle,#ff5c8a,transparent 62%)} .blob.b2{width:55vmax;height:55vmax;right:-18vmax;top:5vmax;background:radial-gradient(circle,#b49bf0,transparent 62%);animation-delay:-7s} .blob.b3{width:50vmax;height:50vmax;left:10vmax;bottom:-22vmax;background:radial-gradient(circle,#ff8a6b,transparent 62%);animation-delay:-13s} @keyframes drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(6vmax,-4vmax) scale(1.12)}66%{transform:translate(-5vmax,5vmax) scale(.94)}} .phone{position:relative;z-index:2;width:min(440px,100vw);height:min(900px,100dvh); background:linear-gradient(180deg,var(--cream),var(--blush));border-radius:42px;overflow:hidden;display:flex;flex-direction:column; box-shadow:var(--shadow),0 0 0 1.5px rgba(255,255,255,.5) inset} @media(max-width:480px){ /* قابِ اپ روی موبایل ثابت و دقیقاً به اندازهٔ «ناحیهٔ واقعی دیدنی» (visualViewport) می‌شود (JS). لایهٔ aurora (که فقط پس‌زمینهٔ دسکتاپ است و روی موبایل همیشه پشتِ قاب پنهان بود) حذف می‌شود و body هم‌رنگِ اپ می‌شود؛ پس اگر لحظه‌ای هنگامِ باز/بسته شدنِ کیبورد قاب کوتاه شود، به‌جای گرادیانِ تیره یک رنگِ هم‌رنگِ اپ (عملاً نامرئی) دیده می‌شود — نه آن نوارهای رنگی. */ body,html{background:var(--cream)} .aurora{display:none} .phone{position:fixed;top:0;left:0;width:100%;height:100dvh;border-radius:0} } .screen{position:absolute;inset:0;display:none;flex-direction:column;animation:fade .45s ease both} .screen.active{display:flex} @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} .scroll{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch} h1,h2,h3{font-family:var(--font-display);font-weight:600;color:var(--plum);line-height:1.4;letter-spacing:-.01em} [dir=rtl] h1,[dir=rtl] h2,[dir=rtl] h3{letter-spacing:0;line-height:1.6} .muted{color:var(--ink-soft)} /* language switcher */ .langbar{position:absolute;top:14px;inset-inline-start:16px;z-index:40} .langbtn{display:flex;align-items:center;gap:6px;background:var(--glass-strong);border:1.5px solid var(--line); border-radius:999px;padding:8px 12px;cursor:pointer;font:inherit;font-size:13px;font-weight:700;color:var(--plum)} .langmenu{position:absolute;top:46px;inset-inline-start:0;background:var(--glass-strong);backdrop-filter:blur(14px); border:1.5px solid var(--line);border-radius:16px;padding:6px;box-shadow:var(--shadow);display:none;min-width:130px} .langmenu.on{display:block} .langmenu button{display:flex;width:100%;gap:8px;align-items:center;background:none;border:none;cursor:pointer; font:inherit;font-size:14px;font-weight:600;color:var(--ink);padding:10px 12px;border-radius:10px;text-align:start} .langmenu button:hover{background:rgba(255,92,138,.1)}.langmenu button.on{color:var(--coral)} .btn{font:inherit;font-weight:700;border:none;cursor:pointer;border-radius:999px;padding:16px 22px;width:100%;color:#fff;font-size:16px; background:var(--grad);box-shadow:0 12px 26px -10px rgba(255,92,138,.7); transition:transform .15s,filter .15s} .btn:active{transform:translateY(1px) scale(.99)}.btn:hover{filter:brightness(1.04)} .btn:disabled{filter:grayscale(.5) opacity(.6);cursor:not-allowed} .btn.ghost{background:transparent;color:var(--plum);box-shadow:none;border:1.5px solid var(--line)} :focus-visible{outline:3px solid var(--lavender);outline-offset:2px;border-radius:8px} /* welcome / intro */ #welcome{justify-content:flex-end} .hero-bubbles{position:relative;flex:1;margin-top:54px;overflow:hidden} #welcome.active .hero-bubbles{animation:groupIn .9s cubic-bezier(.2,.9,.3,1) both} @keyframes groupIn{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}} .portrait{position:absolute;inset:0;width:100%;height:100%;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;pointer-events:none} /* placeholderِ «عکس در انتظار تایید» که به‌جای عکسِ تاییدنشده به دیگران نشان داده می‌شود */ .pend-ph{container-type:size;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px; text-align:center;padding:6px;background:linear-gradient(160deg,#4a2a3f,#5b2348);color:#fff} .pend-ph svg{width:22px;height:22px;opacity:.9;flex:none} .pend-ph-tx{display:none;font-size:12.5px;font-weight:700;line-height:1.55;opacity:.95} @container (min-width:120px){.pend-ph svg{width:40px;height:40px}.pend-ph-tx{display:block}} /* نوارِ «در انتظار تایید» روی پیش‌نمایشِ پروفایلِ خودِ کاربر */ .pv-pendbar{position:absolute;top:0;inset-inline-start:64px;inset-inline-end:64px;z-index:2;display:flex;align-items:center;justify-content:center;gap:7px; border-radius:0 0 16px 16px; background:linear-gradient(135deg,rgba(255,176,32,.97),rgba(255,140,60,.97));color:#3a2233;font-size:13px;font-weight:800; padding:9px 14px;padding-top:calc(9px + env(safe-area-inset-top))} .pv-pendbar svg{width:17px;height:17px;flex:none} img.portrait{object-fit:cover} .bub{position:absolute;border-radius:50%;overflow:hidden;border:3px solid #fff;box-shadow:var(--shadow);opacity:1; animation:popIn .6s cubic-bezier(.2,.9,.3,1) both, floaty 6s ease-in-out infinite} @keyframes popIn{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}} @keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}} .bub.b1{width:112px;height:112px;top:18px;inset-inline-start:28px;animation-delay:.1s,1s} .bub.b2{width:86px;height:86px;top:8px;inset-inline-end:42px;animation-delay:.25s,1.4s} .bub.b3{width:96px;height:96px;top:150px;inset-inline-start:128px;animation-delay:.4s,1.7s} .b4{width:72px;height:72px;top:188px;inset-inline-end:52px;animation-delay:.55s,1.1s} .b5{width:120px;height:120px;top:250px;inset-inline-start:34px;animation-delay:.7s,1.9s} .chip-float{position:absolute;background:var(--plum);color:#fff;font-size:13px;font-weight:700;padding:8px 14px;border-radius:999px; box-shadow:var(--shadow-sm);opacity:1;animation:popIn .5s ease both, floaty 5s ease-in-out infinite} .chip-float.alt{background:var(--grad)} .cf1{top:96px;inset-inline-end:18px;animation-delay:.7s,1.2s} .cf2{top:316px;inset-inline-end:80px;animation-delay:.9s,1.6s} .speech{position:absolute;top:212px;inset-inline-end:24px;background:#fff;color:var(--plum);font-weight:700;font-size:13.5px; padding:11px 15px;border-radius:18px;border-bottom-right-radius:6px;box-shadow:var(--shadow);opacity:1; animation:popIn .5s ease both, floaty 6s ease-in-out infinite;animation-delay:1s,1.4s} .spark{position:absolute;color:var(--lavender);opacity:0;animation:twinkle 2.6s ease-in-out infinite} .spark svg{width:100%;height:100%} .sp1{width:18px;height:18px;top:120px;inset-inline-start:160px;animation-delay:1.2s} .sp2{width:13px;height:13px;top:300px;inset-inline-end:30px;color:var(--coral);animation-delay:1.8s} .sp3{width:15px;height:15px;top:60px;inset-inline-start:150px;color:var(--gold);animation-delay:2.2s} @keyframes twinkle{0%,100%{opacity:0;transform:scale(.5) rotate(0)}50%{opacity:.9;transform:scale(1) rotate(90deg)}} .orbit{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.55;animation:orbspin 48s linear infinite} @keyframes orbspin{to{transform:rotate(360deg)}} .orbit .flow{animation:dashflow 2.4s linear infinite} @keyframes dashflow{to{stroke-dashoffset:-28}} .mini{position:absolute;display:grid;place-items:center;border-radius:50%;background:#fff;box-shadow:var(--shadow-sm); opacity:1;animation:popIn .5s ease both, floaty 5.5s ease-in-out infinite} .mini svg{width:18px;height:18px} .m1{width:40px;height:40px;color:var(--coral);top:258px;inset-inline-end:26px;animation-delay:.8s,1.3s} .m1 svg{animation:beat 1.7s ease-in-out infinite} @keyframes beat{0%,100%{transform:scale(1)}14%{transform:scale(1.22)}28%{transform:scale(1)}42%{transform:scale(1.14)}56%{transform:scale(1)}} .m3{width:34px;height:34px;color:var(--gold);top:62px;inset-inline-start:150px;animation-delay:1.1s,1.1s} .m3 svg{animation:beat 2.4s ease-in-out infinite} /* حباب پیام صوتی متحرک (اکولایزر) — سبک، فقط CSS */ .voicechip{position:absolute;display:flex;align-items:center;gap:8px;background:var(--grad);color:#fff; padding:9px 12px;border-radius:999px;box-shadow:0 14px 28px -10px rgba(255,92,138,.7);opacity:1; animation:popIn .6s ease both, floaty 5.4s ease-in-out infinite;z-index:2;top:290px;inset-inline-end:92px;animation-delay:.95s,1.5s} .voicechip .vc-play{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.25);display:grid;place-items:center;flex:none} .voicechip .vc-play svg{width:11px;height:11px} .voicechip .vc-wave{display:flex;align-items:center;gap:2.5px;height:22px} .voicechip .vc-wave i{width:3px;height:16px;border-radius:2px;background:#fff;opacity:.92;transform-origin:center;animation:eq 1.1s ease-in-out infinite} .voicechip .vc-wave i:nth-child(1){animation-delay:0s} .voicechip .vc-wave i:nth-child(2){animation-delay:.18s} .voicechip .vc-wave i:nth-child(3){animation-delay:.36s} .voicechip .vc-wave i:nth-child(4){animation-delay:.12s} .voicechip .vc-wave i:nth-child(5){animation-delay:.30s} .voicechip .vc-wave i:nth-child(6){animation-delay:.06s} @keyframes eq{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1.25)}} .voicechip .vc-dur{font-size:11px;font-weight:700;opacity:.95} .voicechip .vc-check{display:flex;color:#fff;animation:vcheck 3s ease-in-out infinite} @keyframes vcheck{0%,62%,100%{opacity:.55}72%,90%{opacity:1}} /* هالهٔ نرم پشت حباب مرکزی */ .hero-glow{position:absolute;width:190px;height:190px;border-radius:50%;top:118px;left:50%;transform:translateX(-50%); background:radial-gradient(circle,rgba(255,92,138,.22),transparent 70%);z-index:0;animation:glowPulse 5.5s ease-in-out infinite} @keyframes glowPulse{0%,100%{opacity:.45;transform:translateX(-50%) scale(1)}50%{opacity:.8;transform:translateX(-50%) scale(1.15)}} /* گفت‌وگوی متحرک خوش‌آمد — یک‌بار پخش می‌شود و می‌ماند */ .cvbub{position:absolute;z-index:3;max-width:152px;font-weight:700;font-size:13px;line-height:1.55; padding:9px 13px;border-radius:16px;box-shadow:var(--shadow);opacity:1;animation:cvIn .5s cubic-bezier(.2,.9,.3,1) both} @keyframes cvIn{from{opacity:0;transform:translateY(8px) scale(.85)}to{opacity:1;transform:none}} .cv-male{top:140px;inset-inline-end:24px;background:var(--grad);color:#fff;border-bottom-left-radius:5px;animation-delay:1.1s} .cv-female{top:132px;inset-inline-start:24px;background:#fff;color:var(--plum);border-bottom-right-radius:5px;animation-delay:3s} .cvtyping{position:absolute;z-index:3;top:132px;inset-inline-start:24px;display:flex;gap:4px;align-items:center; background:#fff;padding:12px 14px;border-radius:16px;border-bottom-right-radius:5px;box-shadow:var(--shadow);opacity:0;animation:cvTyping 1.1s ease 2s both} .cvtyping i{width:6px;height:6px;border-radius:50%;background:var(--ink-soft);animation:cvDot 1s ease-in-out infinite} .cvtyping i:nth-child(2){animation-delay:.15s}.cvtyping i:nth-child(3){animation-delay:.3s} @keyframes cvTyping{0%{opacity:0;transform:scale(.85)}18%{opacity:1;transform:scale(1)}82%{opacity:1}100%{opacity:0}} @keyframes cvDot{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(-4px);opacity:1}} #welcome h1 .hl{display:inline-block;background:var(--grad);color:#fff; padding:0 14px 4px;border-radius:14px;box-shadow:0 10px 22px -10px rgba(255,92,138,.7);transform:rotate(-1.5deg)} .welcome-foot{position:relative;z-index:3;padding:28px 26px calc(30px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,var(--cream) 42%)} .welcome-foot .logo-row{justify-content:center;margin-bottom:16px} #welcome h1{font-size:30px;text-align:center;margin-bottom:10px} #welcome .sub{text-align:center;font-size:14px;color:var(--ink-soft);margin-bottom:22px;line-height:1.9} .welcome-foot .btn+.btn{margin-top:11px} #welcome.active .welcome-foot>*{animation:upFade .6s ease both} #welcome.active .welcome-foot>*:nth-child(1){animation-delay:.2s} #welcome.active .welcome-foot>*:nth-child(2){animation-delay:.3s} #welcome.active .welcome-foot>*:nth-child(3){animation-delay:.4s} #welcome.active .welcome-foot>*:nth-child(4){animation-delay:.5s} #welcome.active .welcome-foot>*:nth-child(5){animation-delay:.6s} @keyframes upFade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} .card .portrait{z-index:0} .head{padding:64px 26px 4px} .logo-row{display:flex;align-items:center;gap:9px;margin-bottom:20px} .logo-row .mark{width:34px;height:34px} .wm{font-family:var(--font-display);font-weight:600;font-size:28px;color:var(--plum)} .head h1{font-size:30px;margin-bottom:8px} .head p{font-size:14px;color:var(--ink-soft);line-height:1.9} form{padding:18px 26px 28px;display:flex;flex-direction:column;gap:16px} .field label{display:block;font-size:13px;font-weight:600;color:var(--plum);margin:0 4px 8px} .ctrl{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--glass-strong); border:1.5px solid var(--line);border-radius:var(--r-sm);padding:15px 16px;transition:border-color .15s,box-shadow .15s} .ctrl::placeholder{color:#b7a3b1} .ctrl:focus{border-color:var(--coral);box-shadow:0 0 0 4px rgba(255,92,138,.12);outline:none} select.ctrl{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%235B2348' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 14px center;padding-left:42px} [dir=ltr] select.ctrl{background-position:right 14px center;padding-left:16px;padding-right:42px} select.ctrl:disabled{opacity:.55} option{background:#fff;color:var(--ink)} .two{display:flex;gap:12px}.two .field{flex:1} /* ثبت‌نام: سن + استان + شهر در یک ردیف */ .su-three{gap:8px} .su-three .field{min-width:0} .su-three .field.su-age{flex:0 0 78px} .su-three .ctrl{padding-inline:12px 26px!important;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;background-position:left 9px center!important} html[dir="ltr"] .su-three .ctrl{background-position:right 9px center!important} .su-three .su-age .ctrl{text-align:center;padding-inline:8px 22px!important} .hint{font-size:12px;margin:7px 4px 0;color:var(--ink-soft)}.hint.err{color:#e0356b;font-weight:600} /* نمایش/مخفی‌کردنِ رمز (آیکنِ چشم) */ .pwd-wrap{position:relative} .pwd-wrap .ctrl{padding-left:46px !important;padding-right:14px !important;text-align:right !important} .pwd-eye{position:absolute;top:50%;transform:translateY(-50%);left:10px;right:auto;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;color:var(--ink-soft);padding:0;z-index:2} .pwd-eye:active{transform:translateY(-50%) scale(.92)} .pwd-eye svg{width:21px;height:21px} .mobinp{direction:ltr;text-align:start} .seg{display:flex;gap:10px} .seg label{flex:1;cursor:pointer} .seg input{position:absolute;opacity:0;pointer-events:none} .seg .opt{display:flex;align-items:center;justify-content:center;gap:8px;padding:15px;border-radius:var(--r-sm); border:1.5px solid var(--line);background:var(--glass-strong);font-weight:600;color:var(--ink-soft);transition:.15s} .seg input:checked+.opt{border-color:var(--coral);color:var(--coral);background:rgba(255,92,138,.08);box-shadow:0 0 0 3px rgba(255,92,138,.1)} .seg .opt svg{width:20px;height:20px} .foot-link{text-align:center;font-size:14px;color:var(--ink-soft);margin-top:4px} .foot-link b{color:var(--coral);cursor:pointer;font-weight:700} .forgot{text-align:end;font-size:13px;color:var(--coral);font-weight:600;cursor:pointer;margin-top:-6px} /* تایمرِ ارسالِ دوبارهٔ کد */ #otpResend,#vfResend{transition:opacity .2s,color .2s} #otpResend.otp-wait,#vfResend.otp-wait{opacity:.5;pointer-events:none;color:var(--ink-soft);font-weight:700} #otpResend.otp-ready,#vfResend.otp-ready{color:var(--coral);font-weight:800} #otpResend.otp-ready::before,#vfResend.otp-ready::before{content:"↻ "} /* sliders */ .slider-head{display:flex;justify-content:space-between;align-items:baseline;margin:0 4px 10px} .slider-head .val{font-family:var(--font-display);font-weight:600;font-size:20px;color:var(--coral)} input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:999px; background:linear-gradient(90deg,var(--coral),var(--coral-2));outline:none} input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff; border:3px solid var(--coral);cursor:pointer;box-shadow:var(--shadow-sm)} input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--coral);cursor:pointer} /* interests grid */ .igrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px} .interest{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px 8px; border-radius:18px;border:1.5px solid var(--line);background:var(--glass-strong);cursor:pointer;transition:.15s;text-align:center} .interest svg{width:26px;height:26px;color:var(--plum);transition:.15s} .interest span{font-size:12px;font-weight:600;color:var(--ink-soft)} .interest.sel{border-color:var(--coral);background:rgba(255,92,138,.08);box-shadow:0 0 0 3px rgba(255,92,138,.1)} .interest.sel svg{color:var(--coral)}.interest.sel span{color:var(--coral)} .icount{text-align:center;font-size:13px;color:var(--ink-soft);margin-top:14px} .icount b{color:var(--coral)} /* dashboard */ .iconbtn{width:42px;height:42px;border-radius:14px;border:1.5px solid var(--line);background:var(--glass);display:grid;place-items:center;cursor:pointer;color:var(--plum)} .iconbtn.filterbtn{position:relative;width:auto;min-width:42px;height:42px;padding:0 12px;display:flex;align-items:center;gap:6px;background:linear-gradient(135deg,#fff,var(--blush));border-color:rgba(255,92,138,.3);color:var(--coral);box-shadow:0 8px 18px -10px rgba(255,92,138,.5);animation:filterBeat 2.2s ease-in-out infinite} .iconbtn.filterbtn .filterbtn-lbl{font-size:13.5px;font-weight:800;white-space:nowrap} .iconbtn.filterbtn::after{content:"";position:absolute;inset:0;border-radius:14px;border:2px solid var(--coral);pointer-events:none;animation:filterPulse 2.2s ease-out infinite} .iconbtn.filterbtn:active{transform:scale(.92);animation:none} @keyframes filterBeat{0%,42%,100%{transform:scale(1)}12%{transform:scale(1.16)}24%{transform:scale(1.03)}33%{transform:scale(1.12)}} @keyframes filterPulse{0%{opacity:.5;transform:scale(1)}65%{opacity:0;transform:scale(1.55)}100%{opacity:0}} .deck{flex:1;position:relative;padding:6px 20px 16px} .deck-empty{position:absolute;inset:6px 20px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:30px 24px} .deck-empty-ic{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;color:var(--coral);background:linear-gradient(135deg,rgba(255,92,138,.14),rgba(255,138,92,.14));animation:deckFloat 3.2s ease-in-out infinite} .deck-empty-ic svg{width:52px;height:52px} .deck-empty h3{font-family:var(--font-display);font-size:22px;font-weight:600;color:var(--plum);margin:0} .deck-empty p{font-size:14px;line-height:1.9;color:var(--ink-soft);max-width:300px;margin:0} @keyframes deckFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}} .card{position:absolute;inset:6px 20px 16px;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow); display:flex;flex-direction:column;justify-content:flex-end;color:#fff;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none} .card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} .card .fb{position:absolute;inset:0} .card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(34,8,28,.5) 55%,rgba(34,8,28,.92))} .meta{position:relative;z-index:2;padding:24px 24px 96px} .meta .nm{font-family:var(--font-display);font-size:28px;font-weight:600} .meta .loc{display:flex;align-items:center;gap:6px;opacity:.92;font-size:14px;margin-top:5px} .meta .chips{display:flex;gap:8px;margin-top:12px;flex-wrap:nowrap;overflow:hidden} .meta .chip{background:rgba(255,255,255,.2);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.3);padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;flex:none} .meta .chip-more{background:rgba(255,255,255,.28)} .meta .chip svg{width:15px;height:15px} .online{position:absolute;top:18px;inset-inline-start:18px;z-index:3;display:flex;align-items:center;gap:7px; background:rgba(20,6,16,.4);backdrop-filter:blur(6px);padding:7px 12px;border-radius:999px;font-size:12px;font-weight:600;color:#fff} .dot{width:8px;height:8px;border-radius:50%;background:var(--online);animation:pulseDot 1.8s ease-out infinite} @keyframes pulseDot{0%{box-shadow:0 0 0 0 rgba(65,221,156,.6)}70%{box-shadow:0 0 0 7px rgba(65,221,156,0)}100%{box-shadow:0 0 0 0 rgba(65,221,156,0)}} .online.off .dot{background:#cbb9c6;box-shadow:none;animation:none} .online.off{font-size:11px} .actions{display:flex;justify-content:center;gap:14px;margin-top:-90px;padding:0 0 64px;position:relative;z-index:20} .act{width:58px;height:58px;border-radius:50%;border:1px solid rgba(255,255,255,.85);cursor:pointer;display:grid;place-items:center;background:rgba(255,255,255,.82);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);box-shadow:0 8px 20px -10px rgba(60,20,45,.4),inset 0 1px 0 rgba(255,255,255,.7);transition:transform .14s} .act:active{transform:scale(.9)}.act svg{width:26px;height:26px} .act.pass{color:#ff7a90}.act.like{width:72px;height:72px;background:var(--grad);color:#fff;box-shadow:0 14px 28px -10px rgba(255,92,138,.65)}.act.like svg{width:30px;height:30px} .act.fav{color:var(--lavender)}.act.msg{color:var(--coral-2)} /* نشانگرِ کشیدن: ❤ لایک / ✕ رد */ .meta .chip.com{background:linear-gradient(135deg,rgba(255,77,141,.75),rgba(122,79,214,.75));border-color:rgba(255,255,255,.55)} .dk-mt{display:inline-block;margin:6px 0 2px;font-size:11.5px;font-weight:800;color:#fff;background:rgba(0,0,0,.32);backdrop-filter:blur(6px);border-radius:999px;padding:3px 10px} .deckhint .dh-sup{background:#fff;color:#3b82f6;font-size:44px;inset-block-start:34%} .dk-lbl{position:absolute;top:70px;font-size:26px;font-weight:900;letter-spacing:1px;border:4px solid;border-radius:12px;padding:2px 14px;opacity:0;transition:opacity .1s;background:rgba(255,255,255,.12)} .dk-l-like{color:#22c55e;inset-inline-start:22px;transform:rotate(-14deg)}.dk-l-pass{color:#ef4444;inset-inline-end:22px;transform:rotate(14deg)} .dk-demo{position:absolute;inset-inline:0;bottom:34%;margin:auto;width:max-content;max-width:88%;z-index:17;pointer-events:none;background:rgba(20,8,24,.62);backdrop-filter:blur(8px);color:#fff;font-size:13px;font-weight:800;padding:9px 16px;border-radius:999px;opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s}.dk-demo.on{opacity:1;transform:none} .dcnt{display:none!important;position:absolute;top:10px;inset-inline-start:50%;transform:translateX(-50%);font-size:11.5px;font-weight:800;color:#fff;background:rgba(0,0,0,.38);backdrop-filter:blur(6px);border-radius:999px;padding:4px 12px;white-space:nowrap} [dir=rtl] .dcnt{transform:translateX(50%)} .dk-eacts{display:flex;gap:10px;justify-content:center;margin-top:6px}.dk-eg{font:inherit;font-weight:700;border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 18px;cursor:pointer} .deckhint{position:absolute;inset:0;pointer-events:none;display:flex;align-items:center;justify-content:center;z-index:16} .deckhint .dh{position:absolute;width:98px;height:98px;border-radius:50%;display:grid;place-items:center;opacity:0;transition:opacity .12s ease;box-shadow:0 14px 34px -10px rgba(0,0,0,.45)} .deckhint .dh svg{width:46px;height:46px} .deckhint .dh-pass{background:#fff;color:#5b6472} .deckhint .dh-like{background:var(--grad);color:#fff} /* chat popup */ .chatpop-bg{position:absolute;inset:0;z-index:80;background:var(--cream);display:none;align-items:stretch;overflow:hidden;animation:fade .25s ease both} .chatpop-bg.on{display:flex} .chatpop{width:100%;height:100%;background:linear-gradient(180deg,var(--cream),var(--blush));display:flex;flex-direction:column;overflow:hidden; animation:up .3s cubic-bezier(.2,.9,.3,1) both} @keyframes up{from{transform:translateY(100%)}to{transform:none}} .cp-head{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--line);flex:none;position:sticky;top:0;background:var(--cream);z-index:2} .cp-head .av{width:44px;height:44px;border-radius:50%;overflow:hidden;flex:none;position:relative;background:var(--grad)} .cp-head .av img{width:100%;height:100%;object-fit:cover} .cp-head .nm{font-weight:700;color:var(--plum);font-size:16px}.cp-head .st{font-size:12px;color:var(--ok);font-weight:600;margin-top:2px} .cp-block-ic{margin-inline-start:auto;width:38px;height:38px;border-radius:12px;border:1.5px solid var(--line);background:var(--glass);display:grid;place-items:center;cursor:pointer;color:var(--plum)} .cp-block-ic:active{transform:scale(.92)} .cp-block-ic.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 8px 18px -10px rgba(255,92,138,.8)} .cp-close{width:38px;height:38px;border-radius:12px;border:1.5px solid var(--line);background:var(--glass);display:grid;place-items:center;cursor:pointer;color:var(--plum)} .cp-del-ic{width:38px;height:38px;border-radius:12px;border:1.5px solid #f0c2cf;background:var(--glass);display:grid;place-items:center;cursor:pointer;color:#d8456a} .cp-del-ic:active{transform:scale(.92)} /* ===================== سرگرمی ===================== */ .fx-bg{position:fixed;inset:0;z-index:320;background:rgba(18,10,20,.5);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;transition:opacity .25s} .fx-bg.on{opacity:1} #gameBox{z-index:330} .fx-sheet{width:100%;max-width:440px;max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain;background:var(--cream,#fff);border-radius:26px;padding:16px; box-shadow:0 30px 60px -24px rgba(0,0,0,.55);transform:translateY(24px) scale(.96);opacity:0;transition:transform .36s cubic-bezier(.2,.9,.3,1.15),opacity .25s;text-align:start} .fx-bg.on .fx-sheet{transform:none;opacity:1} .fx-sheet.fx-tall{min-height:min(560px,calc(100dvh - 40px))} .fx-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px} .fx-title{font-weight:900;font-size:18px;color:var(--ink)} .fx-sub{font-size:13px;color:var(--ink-soft);line-height:1.8} .fx-x{flex:none;width:38px;height:38px;border-radius:13px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;cursor:pointer;color:var(--ink)} .fx-x svg{width:17px;height:17px} .fx-back{border:none;background:none;font:inherit;font-weight:800;color:var(--coral);cursor:pointer;font-size:15px;padding:6px 2px} .fx-body{display:flex;flex-direction:column;gap:10px} .fx-card{display:flex;align-items:center;gap:13px;padding:14px;border-radius:22px;cursor:pointer;color:#fff;position:relative;overflow:hidden;opacity:0;animation:supIn .45s cubic-bezier(.2,.9,.3,1.2) forwards;box-shadow:0 14px 28px -18px rgba(0,0,0,.6);transition:transform .15s} .fx-card:active{transform:scale(.97)} .fx-card::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 12% 0%,rgba(255,255,255,.35),transparent 55%);pointer-events:none} .fx-faal{background:linear-gradient(135deg,#7b5cff,#c05bd6)} .fx-qod{background:linear-gradient(135deg,#ff8a6b,#ff5c8a)} .fx-song{background:linear-gradient(135deg,#1fb58f,#1b8fb5)} .fx-games{background:linear-gradient(135deg,#3b4a6b,#5b6fa0);cursor:default} .fx-ic{flex:none;width:52px;height:52px;border-radius:17px;background:rgba(255,255,255,.2);display:grid;place-items:center;font-size:27px;backdrop-filter:blur(6px)} .fx-tx{flex:1;min-width:0}.fx-tx b{display:block;font-size:16px;margin-bottom:3px}.fx-tx span{font-size:12.5px;opacity:.92;line-height:1.7} .fx-go{font-size:26px;opacity:.8} .fx-row{display:flex;gap:10px;margin-top:14px}.fx-row .btn{flex:1;margin:0} .fx-cta{width:100%} .fx-load{display:grid;place-items:center;padding:30px;color:var(--ink-soft)} .fx-spin{display:inline-block;width:18px;height:18px;border-radius:50%;border:2.5px solid currentColor;border-inline-end-color:transparent;animation:spin .8s linear infinite;vertical-align:-3px} .fx-cf{position:fixed;width:8px;height:12px;border-radius:2px;z-index:500;pointer-events:none;animation:fxCf 1s cubic-bezier(.2,.8,.3,1) forwards} @keyframes fxCf{to{transform:translate(var(--dx),calc(var(--dy) + 120px)) rotate(540deg);opacity:0}} /* فال */ .faal-intro{text-align:center;padding:10px 0} .faal-book{width:96px;height:96px;margin:6px auto 12px;border-radius:30px;display:grid;place-items:center;font-size:50px;background:linear-gradient(135deg,#7b5cff,#c05bd6);box-shadow:0 18px 34px -14px #7b5cff;animation:faalFloat 3s ease-in-out infinite} @keyframes faalFloat{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-8px) rotate(3deg)}} .faal-card{background:linear-gradient(180deg,#fffaf0,#fff);border:1px solid #f1e3c4;border-radius:22px;padding:16px;box-shadow:0 14px 30px -22px rgba(120,80,0,.6);animation:supIn .4s ease both} .faal-t{text-align:center;font-weight:900;color:#8a5a00;margin-bottom:10px} .faal-v{display:flex;flex-direction:column;gap:10px;margin:12px 0} .faal-b{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:14.5px;line-height:2;color:#3b2a10;text-align:center;opacity:0;animation:supIn .45s ease forwards;padding-bottom:8px;border-bottom:1px dashed #efdcb4} .faal-b:last-child{border-bottom:none} .faal-sum{background:#fff6e0;border-radius:14px;padding:10px 12px;font-size:13px;line-height:1.9;color:#5b4520} .faal-sum summary{cursor:pointer;font-weight:800} .fx-play{display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;font:inherit;font-weight:700;font-size:13px;color:#fff;background:linear-gradient(135deg,#7b5cff,#c05bd6);padding:8px 14px;border-radius:999px;box-shadow:0 8px 16px -10px #7b5cff} .faal-card .fx-play{display:flex;margin:0 auto} .fx-play i{font-style:normal}.fx-play .s{display:none}.fx-play.on .p{display:none}.fx-play.on .s{display:inline} .fx-play.on{animation:supBeat 1.6s ease-in-out infinite} .fx-play.ld .p{display:none} .fx-play.ld::before{content:"";width:14px;height:14px;border-radius:50%;border:2.2px solid #fff;border-inline-end-color:transparent;animation:spin .8s linear infinite;flex:none} .fx-play.sm{flex:none;width:38px;height:38px;padding:0;justify-content:center;border-radius:50%;background:linear-gradient(135deg,#1fb58f,#1b8fb5)} /* سؤال روز */ .qod-card{background:linear-gradient(160deg,#fff4ef,#fff);border:1px solid #ffd9cc;border-radius:22px;padding:16px;animation:supIn .4s ease both} .qod-badge{display:inline-block;padding:5px 12px;border-radius:999px;background:linear-gradient(135deg,#ff8a6b,#ff5c8a);color:#fff;font-weight:800;font-size:12px} .qod-q{font-size:19px;font-weight:900;color:var(--ink);margin:12px 0;line-height:1.7} .qod-in{width:100%;min-height:90px;border-radius:16px;border:1.5px solid rgba(255,92,138,.25);padding:12px 14px;font:inherit;font-size:15px;resize:vertical;background:#fff;box-sizing:border-box} .qod-in:focus{outline:none;border-color:#ff5c8a;box-shadow:0 0 0 4px rgba(255,92,138,.12)} .qod-meta{font-size:12.5px;color:var(--ink-soft);margin:8px 2px 12px} .qod-note{font-size:12px;color:var(--ink-soft);text-align:center;margin-top:10px;line-height:1.8} /* آهنگ */ .song-search{display:flex;gap:8px;margin:12px 0 8px} .song-search input{flex:1;min-width:0;border-radius:14px;border:1.5px solid var(--line);padding:12px 14px;font:inherit;font-size:14px;background:#fff} .song-search button{flex:none;width:48px;border-radius:14px;border:none;background:linear-gradient(135deg,#1fb58f,#1b8fb5);color:#fff;font-size:18px;cursor:pointer} .song-it{display:flex;align-items:center;gap:10px;padding:8px;border-radius:16px;background:#fff;border:1px solid var(--line);margin-bottom:8px;animation:supIn .35s ease both} .song-it img{width:48px;height:48px;border-radius:12px;object-fit:cover;flex:none;background:#eee} .song-tx{flex:1;min-width:0}.song-tx b,.song-tx span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-tx b{font-size:14px;color:var(--ink)}.song-tx span{font-size:12px;color:var(--ink-soft)} .song-pick{flex:none;border:none;border-radius:12px;padding:9px 12px;font:inherit;font-weight:800;font-size:12.5px;color:#1b8f6f;background:rgba(31,181,143,.12);cursor:pointer} .song-del{flex:none;width:34px;height:34px;border-radius:50%;border:none;background:rgba(216,69,106,.1);color:#d8456a;cursor:pointer} .song-mine .song-it{border:2px solid #1fb58f;box-shadow:0 10px 22px -16px #1fb58f} .song-empty{text-align:center;color:var(--ink-soft);font-size:13px;padding:14px;border:1.5px dashed var(--line);border-radius:16px} /* پروفایل */ #pvFun:empty{display:none} #pvFun{display:flex;flex-direction:column;gap:10px;margin-top:18px} .pvf-qod{padding:14px;border-radius:20px;background:linear-gradient(135deg,#fff4ef,#fff);border:1px solid #ffd9cc;animation:supIn .4s ease both} .pvf-lbl{font-size:12.5px;font-weight:800;color:#c0587a;margin-bottom:6px} .pvf-ans{font-size:15.5px;font-weight:700;color:var(--ink);line-height:1.8} .pvf-song{padding:12px;border-radius:20px;background:linear-gradient(135deg,#eafaf5,#fff);border:1px solid #c9eee2;animation:supIn .4s ease both} .pvf-song .song-it{margin:0;border:none;background:transparent;padding:0} /* منوی بازی */ .g-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px} .g-tile{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:start;border:none;cursor:pointer;color:#fff;padding:14px;border-radius:20px;background:linear-gradient(145deg,var(--c1),var(--c2)); box-shadow:0 14px 24px -16px var(--c2);font:inherit;min-height:120px;opacity:0;animation:supIn .42s cubic-bezier(.2,.9,.3,1.2) forwards;transition:transform .15s;position:relative;overflow:hidden} .g-tile::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 0,rgba(255,255,255,.35),transparent 55%)} .g-tile:active{transform:scale(.95)} .g-em{font-size:28px;margin-bottom:6px}.g-tile b{font-size:14.5px}.g-tile small{font-size:11.5px;opacity:.9;line-height:1.6} .tod-seg{display:flex;gap:8px;margin-bottom:12px}.tod-seg button{flex:1;border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:11px;font:inherit;font-weight:800;cursor:pointer} .tod-seg button.on{border-color:transparent;color:#fff;background:linear-gradient(135deg,#f5b94a,#e0761e)} .tod-card{border-radius:24px;padding:26px 18px;text-align:center;color:#fff;min-height:150px;display:flex;flex-direction:column;justify-content:center;animation:todFlip .5s cubic-bezier(.2,.9,.3,1.2) both} .tod-card.truth{background:linear-gradient(135deg,#6c8cff,#9b6cff)}.tod-card.dare{background:linear-gradient(135deg,#ff7a45,#ff4d6d)} @keyframes todFlip{from{transform:rotateY(80deg) scale(.9);opacity:0}to{transform:none;opacity:1}} .tod-k{font-size:12px;font-weight:900;letter-spacing:.1em;opacity:.85;margin-bottom:10px} .tod-q{font-size:18px;font-weight:800;line-height:1.8} .wyr-box{display:flex;flex-direction:column;align-items:stretch;gap:8px} .wyr-o{border-radius:20px;padding:22px 14px;text-align:center;font-weight:900;font-size:18px;color:#fff;animation:supIn .4s ease both} .wyr-o.a{background:linear-gradient(135deg,#41d08f,#23a36b)}.wyr-o.b{background:linear-gradient(135deg,#6c8cff,#4a63e0);animation-delay:.1s} .wyr-vs{align-self:center;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--line);font-weight:900;color:var(--ink);margin:-20px 0;z-index:2;box-shadow:0 6px 14px -8px rgba(0,0,0,.4)} /* بازیِ زنده */ .g-box{max-width:400px} .g-wait{text-align:center;padding:14px 4px} .g-pulse{width:90px;height:90px;margin:4px auto 14px;border-radius:30px;display:grid;place-items:center;font-size:36px;background:linear-gradient(135deg,#ff7aa2,#7b5cff);box-shadow:0 16px 30px -14px #ff7aa2;animation:supBeat 1.6s ease-in-out infinite} .ttt-score{display:flex;justify-content:center;align-items:center;gap:10px;font-size:13px;color:var(--ink-soft);margin-bottom:6px} .ttt-score b{font-size:18px;color:var(--ink)}.ttt-score .me b{color:#e84d7c} .ttt-st{text-align:center;font-weight:800;color:var(--ink-soft);margin:6px 0 12px;padding:8px;border-radius:14px;background:rgba(0,0,0,.03)} .ttt-st.my{color:#fff;background:linear-gradient(135deg,#41d08f,#23a36b);animation:supBeat 2s ease-in-out infinite} .ttt{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;direction:ltr} .ttt-c{aspect-ratio:1/1;border-radius:20px;border:none;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line),0 8px 16px -14px rgba(0,0,0,.5);cursor:pointer;display:grid;place-items:center;padding:0;transition:transform .12s} .ttt-c:active{transform:scale(.93)} .ttt-c svg{width:58%;height:58%;fill:none;stroke-width:3.2;stroke-linecap:round;animation:tttPop .3s cubic-bezier(.2,.9,.3,1.6) both} .ttt-c.x svg{stroke:#e84d7c}.ttt-c.o svg{stroke:#4a63e0} .ttt-c.w{background:linear-gradient(135deg,#fff3c4,#ffe28a);box-shadow:0 0 0 2px #ffc93c} @keyframes tttPop{from{transform:scale(.2) rotate(-40deg);opacity:0}to{transform:none;opacity:1}} .cmp-prog{display:flex;gap:6px;justify-content:center}.cmp-prog i{width:26px;height:6px;border-radius:9px;background:rgba(0,0,0,.1)}.cmp-prog i.d{background:#ff7aa2}.cmp-prog i.on{background:linear-gradient(90deg,#ff7aa2,#7b5cff);width:40px} .cmp-opts{display:flex;flex-direction:column;gap:10px} .cmp-o{border:none;border-radius:20px;padding:22px 14px;font:inherit;font-weight:900;font-size:17px;color:#fff;cursor:pointer;animation:supIn .35s ease both;transition:transform .12s} .cmp-o:active{transform:scale(.96)}.cmp-o.a{background:linear-gradient(135deg,#ff7aa2,#e84d7c)}.cmp-o.b{background:linear-gradient(135deg,#9b6cff,#6c4ae0);animation-delay:.08s} .cmp-res{text-align:center;padding:6px 0 10px} .cmp-heart{width:150px;height:150px;margin:0 auto;display:grid;place-items:center;white-space:nowrap;direction:ltr;font-size:38px;font-weight:900;color:#fff;background:linear-gradient(135deg,#ff7aa2,#e84d7c);border-radius:50%;box-shadow:0 20px 40px -18px #e84d7c;animation:supBeat 1.8s ease-in-out infinite} .cmp-msg{font-weight:900;font-size:18px;color:var(--ink);margin-top:12px} .cmp-list{display:flex;flex-direction:column;gap:6px;margin-top:8px} .cmp-row{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;font-size:12.5px;padding:8px 10px;border-radius:12px;background:rgba(0,0,0,.035);text-align:center} .cmp-row.ok{background:rgba(65,208,143,.12)} /* ===== سرگرمیِ AI ===== */ .fx-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px} .fx-tile{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:start;border:none;cursor:pointer;color:#fff;padding:14px 13px;border-radius:22px; background:linear-gradient(145deg,var(--c1),var(--c2));box-shadow:0 14px 26px -18px var(--c1);font:inherit;min-height:112px;opacity:0;animation:supIn .45s cubic-bezier(.2,.9,.3,1.2) forwards;transition:transform .15s} .fx-tile::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 0,rgba(255,255,255,.35),transparent 55%);pointer-events:none} .fx-tile:active{transform:scale(.95)} .fx-te{font-size:30px;margin-bottom:4px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.2))}.fx-tile b{font-size:15px}.fx-tile small{font-size:11.5px;opacity:.9} .fx-ham{background:linear-gradient(135deg,#ff6fa5,#b36cff);animation-delay:0ms} .fx-ham .fx-ic{animation:supBeat 1.8s ease-in-out infinite} .ai-hero{width:88px;height:88px;margin:4px auto 10px;border-radius:28px;display:grid;place-items:center;font-size:44px;box-shadow:0 16px 30px -14px rgba(0,0,0,.45);animation:faalFloat 3s ease-in-out infinite} .ai-tips{display:flex;flex-direction:column;gap:8px;margin:12px 0} .ai-tip{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:16px;background:rgba(0,0,0,.035);font-size:13px;line-height:1.8} .ai-tip b{flex:none;width:24px;height:24px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:12px} .ai-prev{position:relative;border-radius:20px;overflow:hidden;margin-bottom:10px;max-height:300px} .ai-prev img{width:100%;max-height:300px;object-fit:cover;display:block} .ai-rephoto{position:absolute;bottom:10px;inset-inline-start:10px;border:none;border-radius:999px;padding:8px 12px;background:rgba(0,0,0,.55);color:#fff;font:inherit;font-size:12px;cursor:pointer;backdrop-filter:blur(6px)} .ai-load{text-align:center;padding:40px 10px} .ai-orb{width:110px;height:110px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;font-size:50px;background:radial-gradient(circle at 30% 30%,#fff,#f3e8ff 40%,#d9c5ff);box-shadow:0 0 0 0 rgba(179,108,255,.5);animation:aiOrb 2s ease-in-out infinite} @keyframes aiOrb{0%,100%{box-shadow:0 0 0 0 rgba(179,108,255,.45);transform:scale(1)}50%{box-shadow:0 0 0 18px rgba(179,108,255,0);transform:scale(1.05)}} .ai-lt{font-weight:800;color:var(--ink);transition:opacity .2s;min-height:1.6em} .ai-dots{display:flex;gap:6px;justify-content:center;margin-top:12px}.ai-dots i{width:8px;height:8px;border-radius:50%;background:#b36cff;animation:aiDot 1.2s infinite}.ai-dots i:nth-child(2){animation-delay:.2s}.ai-dots i:nth-child(3){animation-delay:.4s} @keyframes aiDot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-6px)}} .ai-err{text-align:center;padding:30px 10px;font-weight:800;color:var(--ink);line-height:1.9} .ai-res{border-radius:24px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 16px 30px -22px rgba(0,0,0,.5);animation:supIn .4s ease both} .ai-res-h{display:flex;align-items:center;gap:10px;padding:14px 16px;color:#fff;background:var(--g)}.ai-res-h span{font-size:28px}.ai-res-h b{font-size:17px} .ai-chips{display:flex;flex-wrap:wrap;gap:6px;padding:12px 14px 0} .ai-chips span{padding:6px 11px;border-radius:999px;background:rgba(179,108,255,.12);color:#6c4ae0;font-size:12.5px;font-weight:800;opacity:0;animation:supIn .35s ease forwards} .ai-txt{padding:12px 16px 4px;font-size:15px;line-height:2.05;color:var(--ink)} .ai-tag{margin:6px 16px 14px;display:inline-block;font-size:11.5px;color:var(--ink-soft);background:rgba(0,0,0,.04);padding:4px 10px;border-radius:999px} .ai-left{text-align:center;font-size:12.5px;color:var(--ink-soft);margin-top:10px} .hm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px} .hm-m{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 6px;border-radius:18px;border:1.5px solid var(--line);background:#fff;font:inherit;font-weight:800;font-size:13px;cursor:pointer;opacity:0;animation:supIn .35s ease forwards} .hm-m span{font-size:24px}.hm-m.on{border-color:transparent;color:#fff;background:linear-gradient(135deg,#ff7a9c,#ffb36b)} .ho-card{border-radius:24px;padding:4px 0 2px;background:linear-gradient(180deg,#fff5f7,#fff);border:1px solid #ffd6e0;animation:supIn .4s ease both} .ho-top{display:flex;gap:12px;align-items:center;padding:14px 16px 0}.ho-top b{display:block;font-size:16px;color:var(--ink)}.ho-top small{font-size:12.5px;color:var(--ink-soft)} .ho-em{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;font-size:28px;color:#fff;background:linear-gradient(135deg,#ff7a9c,#ffb36b);flex:none} .ho-rows{display:flex;flex-direction:column;gap:8px;padding:6px 16px}.ho-rows div{display:flex;gap:8px;font-size:13.5px;line-height:1.8;background:#fff;border-radius:14px;padding:9px 11px;border:1px solid #ffe3ea}.ho-rows i{font-style:normal} .ho-lucky{display:flex;flex-wrap:wrap;gap:6px;padding:8px 16px 0}.ho-lucky span{padding:6px 10px;border-radius:999px;background:#fff;border:1px solid #ffd6e0;font-size:12.5px;font-weight:700} .tar-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0} .tar-slot{aspect-ratio:2/3.2;border-radius:16px;border:2px dashed rgba(108,74,224,.3);display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding:6px;position:relative} .tar-slot small{font-size:11.5px;font-weight:800;color:#6c4ae0;position:absolute;bottom:-20px} .tar-card{position:absolute;inset:0;perspective:800px} .tar-in{position:relative;width:100%;height:100%;transition:transform .8s cubic-bezier(.2,.9,.3,1.1);transform-style:preserve-3d} .tar-card.flip .tar-in{transform:rotateY(180deg)} .tar-f{position:absolute;inset:0;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden} .tar-bk,.tar-back{background:repeating-linear-gradient(45deg,#3b2a7a 0 8px,#4a3595 8px 16px);box-shadow:inset 0 0 0 3px #d4b25a,inset 0 0 0 5px #3b2a7a} .tar-fr{transform:rotateY(180deg);background:linear-gradient(160deg,#fff8e6,#f3e2b8);box-shadow:inset 0 0 0 3px #d4b25a;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:8px 4px;text-align:center} .tar-fr i{font-style:normal;font-size:11px;font-weight:900;color:#8a6a1e}.tar-fr span{font-size:30px}.tar-fr b{font-size:11.5px;color:#4a3595} .tar-deck{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:26px} .tar-back{aspect-ratio:2/3;border:none;border-radius:9px;cursor:pointer;opacity:0;animation:supIn .35s ease forwards;transition:transform .2s,opacity .3s} .tar-back:active{transform:translateY(-6px) scale(1.05)}.tar-back.gone{opacity:0!important;pointer-events:none;transform:translateY(-20px)} .tar-res{display:flex;flex-direction:column;gap:8px;margin-top:26px} .tar-row{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:18px;background:linear-gradient(135deg,#f7f2ff,#fff);border:1px solid #e3d8ff;opacity:0;animation:supIn .45s ease forwards} .tar-e{font-size:28px}.tar-row b{font-size:14px;color:#4a3595}.tar-row p{margin:4px 0 0;font-size:13.5px;line-height:1.9;color:var(--ink)} .ham-sheet{display:flex;flex-direction:column;height:calc(100vh - 40px);height:calc(100dvh - 40px);max-height:720px;overflow:hidden;padding:14px} .ham-h{display:flex;align-items:center;gap:10px}.ham-h b{display:block;font-size:17px;color:var(--ink)}.ham-h small{font-size:11.5px;color:var(--ink-soft)} .ham-av{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;font-size:22px;background:linear-gradient(135deg,#ffe0ec,#efe0ff)} .ham-msgs{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:6px 2px 10px;overscroll-behavior:contain} .ham-b{max-width:84%;padding:10px 13px;border-radius:18px;font-size:14.5px;line-height:1.85;animation:supIn .3s ease both;word-wrap:break-word} .ham-b.ai{align-self:flex-end;background:linear-gradient(135deg,#fff0f6,#f5edff);color:var(--ink);border-end-start-radius:6px} .ham-b.me{align-self:flex-start;background:linear-gradient(135deg,#ff6fa5,#b36cff);color:#fff;border-end-end-radius:6px} .ham-b.typing{display:flex;gap:5px;padding:14px}.ham-b.typing i{width:7px;height:7px;border-radius:50%;background:#b36cff;animation:aiDot 1.2s infinite}.ham-b.typing i:nth-child(2){animation-delay:.2s}.ham-b.typing i:nth-child(3){animation-delay:.4s} .ham-in{display:flex;gap:8px;align-items:flex-end;flex:none} .ham-in textarea{flex:1;min-width:0;border-radius:18px;border:1.5px solid #ecd9ff;padding:11px 14px;font:inherit;font-size:15px;resize:none;background:#fff;max-height:110px} .ham-in textarea:focus{outline:none;border-color:#b36cff} .ham-in button{flex:none;width:46px;height:46px;border-radius:50%;border:none;color:#fff;font-size:18px;background:linear-gradient(135deg,#ff6fa5,#b36cff);cursor:pointer;transform:scaleX(-1)} #askVoice{position:fixed;inset:0;z-index:99998;color:#fff;display:none;font-family:inherit;overflow:hidden; background:radial-gradient(120% 80% at 50% 0%,#2b1a5e 0%,#120c2b 45%,#07060f 100%)} #askVoice.on{display:block;animation:cuIn .35s ease} #askVoice::before,#askVoice::after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(90px);opacity:.55;pointer-events:none;animation:avDrift 14s ease-in-out infinite alternate} #askVoice::before{background:#5b7cff;left:-200px;top:-120px} #askVoice::after{background:#c86bff;right:-220px;bottom:-160px;animation-delay:-7s;opacity:.4} @keyframes avDrift{to{transform:translate(80px,60px) scale(1.15)}} #askVoice.av-speak::before{background:#3fc8ff}#askVoice.av-speak::after{background:#7c5cff} #askVoice .av-top{position:absolute;top:calc(env(safe-area-inset-top,0px) + 28px);left:0;right:0;text-align:center;z-index:2} #askVoice .av-top span{display:inline-flex;align-items:center;gap:8px;font-size:13px;padding:8px 16px;border-radius:99px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)} #askVoice .av-top span::before{content:"";width:8px;height:8px;border-radius:50%;background:#6ee7b7;box-shadow:0 0 10px #6ee7b7} #askVoice.av-think .av-top span::before{background:#fbbf24;box-shadow:0 0 10px #fbbf24;animation:cuDot 1s infinite} #askVoice.av-speak .av-top span::before{background:#60a5fa;box-shadow:0 0 10px #60a5fa} #askVoice.av-muted .av-top span::before{background:#f87171;box-shadow:0 0 10px #f87171} #askVoice .av-wrap{position:absolute;left:50%;top:40%;width:230px;height:230px;margin:-115px 0 0 -115px;z-index:1} #askVoice .av-halo{position:absolute;inset:-28px;border-radius:50%;background:radial-gradient(circle,rgba(130,160,255,.35),rgba(130,160,255,0) 70%);animation:avHalo 3s ease-in-out infinite} @keyframes avHalo{50%{transform:scale(1.08);opacity:.7}} #askVoice .av-orb{position:absolute;inset:0;border-radius:50%;overflow:hidden;cursor:pointer;transition:transform .09s linear;isolation:isolate; -webkit-mask-image:-webkit-radial-gradient(white,black);mask-image:radial-gradient(white,black);transform:translateZ(0); background:radial-gradient(circle at 35% 28%,#c9d6ff 0,#7a95ff 34%,#4d5ff0 70%,#3a2fc4 100%); box-shadow:inset 0 -18px 40px rgba(20,10,80,.45),inset 0 14px 30px rgba(255,255,255,.35),0 20px 60px -10px rgba(91,110,255,.6)} #askVoice .av-orb i{position:absolute;left:-25%;right:-25%;height:60%;top:30%;border-radius:50%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.7),rgba(255,255,255,0));filter:blur(16px);animation:avWave 6s ease-in-out infinite} #askVoice .av-orb i:nth-child(2){top:10%;height:45%;opacity:.45;animation-duration:9s;animation-direction:reverse;background:linear-gradient(90deg,rgba(150,210,255,0),rgba(170,220,255,.8),rgba(150,210,255,0))} #askVoice .av-orb i:nth-child(3){top:55%;height:50%;opacity:.35;animation-duration:12s;background:linear-gradient(90deg,rgba(255,170,230,0),rgba(255,180,235,.8),rgba(255,170,230,0))} #askVoice .av-orb::after{content:"";position:absolute;left:18%;top:9%;width:42%;height:24%;border-radius:50%;background:linear-gradient(rgba(255,255,255,.75),rgba(255,255,255,0));filter:blur(2px);transform:rotate(-18deg)} @keyframes avWave{0%{transform:translateX(-12%) rotate(-8deg)}50%{transform:translateX(12%) rotate(6deg)}100%{transform:translateX(-12%) rotate(-8deg)}} #askVoice.av-think .av-orb{animation:avThink 1.2s ease-in-out infinite} @keyframes avThink{50%{filter:brightness(1.15) saturate(1.2)}} #askVoice.av-think .av-orb i{animation-duration:2.2s} #askVoice.av-speak .av-orb{background:radial-gradient(circle at 35% 28%,#d5f1ff 0,#6cc6ff 34%,#3f7dfa 70%,#3542d6 100%)} #askVoice.av-muted .av-orb{filter:grayscale(.85) brightness(.6)} #askVoice .av-txt{position:absolute;left:20px;right:20px;top:calc(40% + 150px);max-height:22%;overflow:hidden;z-index:2;text-align:center} #askVoice .av-txt:not(:empty){font-size:15px;line-height:1.95;padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px); -webkit-mask-image:linear-gradient(#000 75%,transparent);mask-image:linear-gradient(#000 75%,transparent)} #askVoice .av-bot{position:absolute;bottom:calc(env(safe-area-inset-bottom,0px) + 36px);left:0;right:0;display:flex;justify-content:center;gap:26px;z-index:2;direction:ltr} #askVoice .av-btn{width:66px;height:66px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#fff;display:grid;place-items:center;cursor:pointer} #askVoice .av-btn.av-x{background:rgba(255,80,110,.9);border-color:transparent} #askVoice.av-muted #avMute{background:#fff;color:#c0304f} #askVoice .av-hint{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 112px);text-align:center;font-size:11.5px;opacity:.55;z-index:2} .ask-mic{width:auto!important;padding:0 14px 0 12px!important;border-radius:23px!important;display:inline-flex!important;align-items:center;gap:6px;background:linear-gradient(135deg,#0ea5b7,#22c993)!important;transform:none!important;font:inherit!important;font-size:13px!important;font-weight:800!important;white-space:nowrap;box-shadow:0 6px 16px -6px rgba(14,165,183,.8);position:relative} .ask-mic::after{content:"";position:absolute;inset:-4px;border-radius:27px;border:2px solid rgba(34,201,147,.55);animation:askRing 1.8s ease-out infinite} @keyframes askRing{from{opacity:1;transform:scale(.96)}to{opacity:0;transform:scale(1.18)}} .ask-mic.rec{background:linear-gradient(135deg,#ff5c7a,#e8264a)!important;animation:cuPulse 1.2s infinite;font-size:16px!important} .ask-rec{display:flex;align-items:center;gap:10px;margin:0 0 8px;padding:9px 13px;border-radius:16px;background:#fff1f4;color:#c0304f;font-size:13px;font-weight:700;flex:none} .ask-rec button{border:0;background:transparent;color:inherit;font-size:16px;cursor:pointer} .ask-dot{width:10px;height:10px;border-radius:50%;background:#e8264a;animation:cuDot 1s infinite} .ask-play{display:inline-flex;margin-top:6px;margin-inline-start:6px;border:0;border-radius:99px;padding:3px 11px;font:inherit;font-size:12px;font-weight:700;background:rgba(124,92,252,.12);color:#6d3fd6;cursor:pointer;vertical-align:middle} .ask-play.on{background:#7c5cfc;color:#fff}.ask-play.ld{opacity:.6} .fx-x.ask-on{background:#7c5cfc;color:#fff} .ham-note{text-align:center;font-size:11px;color:var(--ink-soft);margin-top:6px;flex:none} .ham-crisis{background:#fff8e1;border:1.5px solid #ffd966;border-radius:18px;padding:12px 14px;font-size:13.5px;line-height:1.9;animation:supIn .3s ease both} .ham-crisis b{font-size:15px}.ham-crisis p{margin:4px 0 8px} .ham-lines{display:flex;flex-wrap:wrap;gap:6px}.ham-lines a{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:12px;background:#fff;border:1px solid #ffd966;color:#8a5a00;font-weight:900;text-decoration:none} .ham-lines small{font-weight:700;font-size:11px} @media (prefers-reduced-motion:reduce){.fx-tile,.hm-m,.tar-back,.tar-row{animation:none;opacity:1}.ai-hero,.ai-orb,.fx-ham .fx-ic{animation:none}} .cp-ibtn.gm{font-size:20px;line-height:1} .fun-hbtn{font-size:20px;position:relative} @media (max-width:419px){.head-actions.has-fun #supIcon:not(.sup-alert) .sup-lbl{display:none}.head-actions.has-fun #supIcon:not(.sup-alert){padding:0!important;width:42px!important}} .fun-hbtn::after{content:"";position:absolute;top:6px;inset-inline-end:6px;width:8px;height:8px;border-radius:50%;background:#ff5c8a;animation:pulseDot 1.8s ease-out infinite} @media (prefers-reduced-motion:reduce){.fx-card,.g-tile,.faal-b,.song-it,.wyr-o,.cmp-o{animation:none;opacity:1}.faal-book,.g-pulse,.cmp-heart,.ttt-st.my,.fx-play.on{animation:none}} /* ===================== سرگرمی — ظاهرِ جدید (ریسپانسیو + انیمیشن) ===================== */ .fun-hbtn::after{display:none} .fun-hbtn.fun-dot::after{display:block} .fx-bg{padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))} .fx-sheet{max-height:100%;padding:0 16px 16px;scrollbar-width:none;position:relative;-webkit-overflow-scrolling:touch} .fx-sheet::-webkit-scrollbar{display:none} .fx-sheet.fx-tall{min-height:min(560px,100%)} .fx-sheet>:first-child:not(.fx-head):not(.fxh-hero){margin-top:16px} .fx-head{position:sticky;top:0;z-index:6;margin:0 -16px 8px;padding:12px 16px 12px;background:linear-gradient(var(--cream,#fff) 72%,rgba(255,255,255,0))} .fx-x{transition:transform .2s}.fx-x:active{transform:scale(.9) rotate(90deg)} .ham-sheet{height:100%;max-height:760px;padding:0 14px 14px;background:linear-gradient(180deg,#fff7fb,#f7f1ff)} .ham-sheet .fx-head{margin:0 -14px 4px;padding:12px 14px;background:linear-gradient(#fff7fb 72%,rgba(255,247,251,0))} .ham-av{animation:supBeat 2s ease-in-out infinite} @keyframes fxRise{from{opacity:0;transform:translateY(18px) scale(.94)}to{opacity:1;transform:none}} @keyframes fxBob{50%{transform:translateY(-4px) rotate(4deg)}} @keyframes fxFloat{50%{transform:translateY(-7px) rotate(3deg)}} @keyframes fxSpin{to{transform:rotate(360deg)}} @keyframes fxTw{0%,100%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1)}} @keyframes fxAur{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}} @keyframes fxPop{0%,100%{transform:rotate(-8deg) scale(1)}50%{transform:rotate(10deg) scale(1.18)}} @keyframes fxGlow{50%{transform:scale(1.25);opacity:.55}} @keyframes fxShine{0%,55%{transform:translateX(-160%) skewX(-18deg)}100%{transform:translateX(360%) skewX(-18deg)}} .fx-shine::before{content:"";position:absolute;top:0;bottom:0;left:0;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);animation:fxShine 5s ease-in-out infinite;animation-delay:var(--sd,0s);pointer-events:none;z-index:1} .fx-st{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff;animation:fxTw 3s ease-in-out infinite;pointer-events:none} /* هاب */ .fx-hub{padding:0 0 16px;background:linear-gradient(180deg,#fff,#fff6fa)} .fxh-hero{position:sticky;top:0;z-index:6;overflow:hidden;padding:18px 16px 20px;color:#fff;border-radius:26px 26px 24px 24px; background:linear-gradient(120deg,#ff5c8a,#c05bd6,#7b6cff,#ff7aa2);background-size:300% 300%;animation:fxAur 10s ease infinite;box-shadow:0 16px 30px -20px #b36cff} .fxh-hero::before{content:"";position:absolute;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.45),transparent 65%);top:-90px;inset-inline-end:-50px;animation:fxGlow 6s ease-in-out infinite} .fxh-hero::after{content:"";position:absolute;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(255,220,120,.35),transparent 65%);bottom:-90px;inset-inline-start:-30px;animation:fxGlow 7s ease-in-out infinite reverse} .fxh-row{position:relative;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;gap:10px} .fxh-t{font-size:22px;font-weight:900;display:flex;align-items:center;gap:8px;text-shadow:0 2px 12px rgba(0,0,0,.18)} .fxh-t .pop{display:inline-block;animation:fxPop 2.4s ease-in-out infinite} .fxh-s{font-size:13px;opacity:.95;margin-top:5px;line-height:1.7} .fxh-hero .fx-x{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.4);color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)} .fxh-hero .fx-st{z-index:1} .fx-hub .fx-body{padding:14px 14px 0;gap:12px} .fx-feat{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;padding:16px;border-radius:24px;color:#fff;cursor:pointer;border:none;font:inherit;text-align:start;width:100%; background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 18px 30px -20px var(--c2),inset 0 1px 0 rgba(255,255,255,.3);opacity:0;animation:fxRise .55s cubic-bezier(.2,.9,.3,1.2) forwards;transition:transform .15s} .fx-feat:active{transform:scale(.97)} .fx-feat>*{position:relative;z-index:2} .fx-feat .ic{flex:none;width:58px;height:58px;border-radius:19px;background:rgba(255,255,255,.22);display:grid;place-items:center;font-size:30px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);animation:fxBob 3s ease-in-out infinite} .fx-feat b{display:block;font-size:16.5px;margin-bottom:2px}.fx-feat .d{display:block;font-size:12.5px;opacity:.93;line-height:1.7} .fx-feat .go{margin-inline-start:auto;font-size:24px;opacity:.85} .fx-feat .ic{position:relative}.fx-feat .fx-new{position:absolute;top:-7px;inset-inline-start:-9px;background:#fff;color:#e84d7c;font-size:10.5px;font-weight:900;padding:3px 9px;border-radius:999px;box-shadow:0 4px 10px -4px rgba(0,0,0,.3);animation:supBeat 1.6s ease-in-out infinite;z-index:3} .fx-tile{min-height:128px;padding:14px 13px;border-radius:24px;box-shadow:0 16px 26px -18px var(--c1),inset 0 1px 0 rgba(255,255,255,.35);animation:fxRise .5s cubic-bezier(.2,.9,.3,1.2) forwards} .fx-tile>*{position:relative;z-index:2} .fx-tile .deco{position:absolute;z-index:0;inset-inline-end:-12px;bottom:-20px;font-size:76px;opacity:.17;transform:rotate(-14deg);pointer-events:none;line-height:1} .fx-te{width:50px;height:50px;border-radius:17px;background:rgba(255,255,255,.22);display:grid;place-items:center;font-size:27px;margin-bottom:8px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28);animation:fxBob 3.2s ease-in-out infinite;animation-delay:var(--bd,0s);filter:none} .fx-tile b{font-size:15px}.fx-tile small{font-size:11.5px;opacity:.92;line-height:1.6} @media (max-width:360px){.fx-grid{gap:8px}.fx-tile{min-height:114px;padding:12px}.fx-te{width:42px;height:42px;font-size:23px}.fx-tile b{font-size:14px}.fx-feat{padding:13px;gap:11px}.fx-feat .ic{width:50px;height:50px;font-size:26px}.fxh-t{font-size:20px}} @media (max-height:640px){.fxh-hero{padding:14px 14px 15px}.fxh-s{display:none}} /* صحنهٔ بالای هر بخش */ .stg{position:relative;overflow:hidden;border-radius:24px;padding:18px 16px 16px;text-align:center;color:#fff;margin-bottom:12px;background:var(--sg);background-size:200% 200%;animation:fxRise .5s ease both,fxAur 12s ease infinite;box-shadow:0 18px 32px -22px rgba(0,0,0,.6)} .stg-art{position:relative;height:100px;display:grid;place-items:center;margin-bottom:4px} .stg-em{font-size:60px;line-height:1;filter:drop-shadow(0 8px 14px rgba(0,0,0,.3));animation:fxFloat 3.4s ease-in-out infinite;position:relative;z-index:2} .stg b{display:block;font-size:19px;font-weight:900;position:relative;z-index:2;text-shadow:0 2px 10px rgba(0,0,0,.2)} .stg small{display:block;font-size:13px;opacity:.93;margin-top:4px;line-height:1.8;position:relative;z-index:2} .stg-aura{position:absolute;width:130px;height:130px;left:50%;top:50%;margin:-65px 0 0 -65px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.55),transparent 65%);animation:fxGlow 2.6s ease-in-out infinite} .stg-steam{position:absolute;bottom:60px;width:9px;height:44px;border-radius:50%;background:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,.8));filter:blur(3px);animation:fxSteam 2.6s ease-in infinite;opacity:0;z-index:1} @keyframes fxSteam{0%{transform:translateY(12px) scaleX(.6);opacity:0}30%{opacity:.9}100%{transform:translateY(-30px) scaleX(1.7) skewX(14deg);opacity:0}} .stg-scan{position:absolute;left:30%;right:30%;height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,#fff,transparent);box-shadow:0 0 14px 4px rgba(255,255,255,.7);animation:fxScan 2.2s ease-in-out infinite;z-index:3} @keyframes fxScan{0%,100%{top:6%}50%{top:90%}} .stg-ring{position:absolute;width:150px;height:150px;left:50%;top:50%;margin:-75px 0 0 -75px;animation:fxSpin 36s linear infinite} .stg-ring i{position:absolute;left:50%;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;display:grid;place-items:center;font-style:normal;font-size:14px;opacity:.9;transform:rotate(var(--a)) translateY(-64px)} .stg-fan{position:absolute;inset:0;display:grid;place-items:center} .stg-fan span{position:absolute;width:46px;height:70px;border-radius:9px;background:repeating-linear-gradient(45deg,#3b2a7a 0 6px,#4a3595 6px 12px);box-shadow:inset 0 0 0 2px #d4b25a,0 10px 18px -8px rgba(0,0,0,.7);transform-origin:50% 130%;animation:fxFan 3.6s ease-in-out infinite} .stg-fan span:nth-child(1){--r:-24deg}.stg-fan span:nth-child(2){--r:0deg;z-index:2}.stg-fan span:nth-child(3){--r:24deg} .stg-fan span:nth-child(2)::after{content:"✦";position:absolute;inset:0;display:grid;place-items:center;color:#f5d27a;font-size:18px;text-shadow:0 0 8px #f5d27a} @keyframes fxFan{0%,100%{transform:rotate(calc(var(--r) * .5))}50%{transform:rotate(var(--r)) translateY(-5px)}} .stg-cloud{position:absolute;font-size:28px;opacity:.5;animation:fxDrift 16s linear infinite;z-index:1} @keyframes fxDrift{from{transform:translateX(-180px)}to{transform:translateX(180px)}} .stg-orbit{position:absolute;width:118px;height:118px;left:50%;top:50%;margin:-59px 0 0 -59px;animation:fxSpin 5s linear infinite;z-index:1} .stg-orbit i{position:absolute;font-style:normal;font-size:15px} .stg-orbit i:nth-child(1){top:-6px;left:44%}.stg-orbit i:nth-child(2){bottom:-6px;left:44%}.stg-orbit i:nth-child(3){left:-6px;top:40%}.stg-orbit i:nth-child(4){right:-6px;top:40%} .faal-intro .fx-cta{margin-top:4px} /* لودینگ و نتیجه */ .ai-orb{position:relative} .ai-orb::before{content:"";position:absolute;inset:-12px;border-radius:50%;border:2px dashed rgba(179,108,255,.5);animation:fxSpin 7s linear infinite} .ai-orb::after{content:"✦";position:absolute;top:-22px;left:50%;margin-left:-6px;color:#b36cff;font-size:15px;transform-origin:6px 77px;animation:fxSpin 2.6s linear infinite} .ai-res{animation:fxRise .55s cubic-bezier(.2,.9,.3,1.2) both} .ai-res-h{position:relative;overflow:hidden} .rv{opacity:0;animation:fxRv .7s ease forwards} @keyframes fxRv{from{opacity:0;filter:blur(5px)}to{opacity:1;filter:none}} /* ادیتِ عکس */ .ed-drop{position:relative;border-radius:22px;border:2px dashed rgba(179,108,255,.45);background:linear-gradient(135deg,#fff5fa,#f6f0ff);min-height:150px;display:grid;place-items:center;cursor:pointer;overflow:hidden;transition:transform .15s} .ed-drop:active{transform:scale(.98)} .ed-ph{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--ink-soft);padding:18px} .ed-ph span{font-size:40px;animation:fxBob 3s ease-in-out infinite}.ed-ph b{color:#8f4bd6;font-size:15px}.ed-ph small{font-size:12px} .ed-drop.has{border:none;background:#15121c;min-height:0} .ed-drop.has img{width:100%;max-height:300px;object-fit:contain;display:block} .ed-lbl{font-weight:900;color:var(--ink);margin:14px 2px 8px;font-size:15px} .ed-chips{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 10px;scrollbar-width:none} .ed-chips::-webkit-scrollbar{display:none} .ed-chips button{flex:none;display:flex;align-items:center;gap:6px;border:1.5px solid #ecdcff;background:#fff;border-radius:999px;padding:8px 13px;font:inherit;font-size:13px;font-weight:800;color:#6c4ae0;cursor:pointer;opacity:0;animation:fxRise .4s ease forwards;white-space:nowrap;transition:transform .15s} .ed-chips button:active{transform:scale(.93)} .ed-chips button.on{background:linear-gradient(135deg,#ff5c8a,#b36cff);color:#fff;border-color:transparent;box-shadow:0 8px 16px -10px #b36cff} .ed-go{margin-top:12px;background:linear-gradient(120deg,#ff5c8a,#b36cff,#4fc3ff,#ff5c8a)!important;background-size:300% 300%!important;animation:fxAur 5s ease infinite;box-shadow:0 14px 26px -14px #b36cff!important} .ed-note{font-size:11.5px;color:var(--ink-soft);text-align:center;line-height:1.9;margin-top:14px} .ed-magic{position:relative;border-radius:24px;overflow:hidden;background:#15121c;margin-bottom:16px;box-shadow:0 18px 34px -20px #b36cff} .ed-magic img{width:100%;max-height:320px;object-fit:contain;display:block;animation:edBreath 2.4s ease-in-out infinite} @keyframes edBreath{0%,100%{filter:saturate(.8) brightness(.8)}50%{filter:saturate(1.4) brightness(1.05) hue-rotate(25deg)}} .ed-magic::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.5) 45%,rgba(255,92,138,.35) 50%,rgba(79,195,255,.3) 55%,transparent 70%);background-size:250% 100%;animation:edSweep 1.8s linear infinite} @keyframes edSweep{from{background-position:120% 0}to{background-position:-120% 0}} .ed-magic .fx-st{z-index:2;width:4px;height:4px} .ed-wand{position:absolute;z-index:3;font-size:34px;left:50%;top:50%;margin:-20px 0 0 -17px;animation:edWand 2.2s ease-in-out infinite;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))} @keyframes edWand{0%,100%{transform:translate(-40px,20px) rotate(-20deg)}50%{transform:translate(40px,-20px) rotate(15deg)}} .ed-cmp{--p:50%;position:relative;border-radius:24px;overflow:hidden;direction:ltr;background:#15121c;box-shadow:0 18px 34px -22px rgba(0,0,0,.7);animation:fxRise .5s ease both} .ed-cmp>img{display:block;width:100%;max-height:62vh;object-fit:contain} .ed-cmp .b{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--p)) 0 0);-webkit-clip-path:inset(0 calc(100% - var(--p)) 0 0)} .ed-cmp .b img{width:100%;height:100%;object-fit:contain;display:block;background:#15121c} .ed-bar{position:absolute;top:0;bottom:0;left:var(--p);width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 12px rgba(0,0,0,.45);pointer-events:none} .ed-bar span{position:absolute;top:50%;left:50%;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;background:#fff;display:grid;place-items:center;font-weight:900;color:#b36cff;box-shadow:0 6px 14px -4px rgba(0,0,0,.5);font-size:15px} .ed-cmp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;z-index:4} .ed-cmp em{position:absolute;top:10px;z-index:3;font-style:normal;font-size:11.5px;font-weight:900;color:#fff;background:rgba(0,0,0,.45);padding:4px 10px;border-radius:999px;pointer-events:none} .ed-cmp .l1{left:10px}.ed-cmp .l2{right:10px;background:linear-gradient(135deg,#ff5c8a,#b36cff)} .ed-pr{margin:12px 4px 2px;font-size:13.5px;color:var(--ink-soft);text-align:center;line-height:1.8} .ed-hh{display:flex;justify-content:space-between;align-items:center;margin:22px 2px 10px;font-weight:900;color:var(--ink);font-size:15px} .ed-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px} .ed-t{position:relative;aspect-ratio:1/1;border-radius:16px;overflow:hidden;border:none;padding:0;cursor:pointer;background:#f1eaf8;opacity:0;animation:fxRise .4s ease forwards} .ed-t img{width:100%;height:100%;object-fit:cover;display:block} .ed-t i{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;font-size:22px;background:rgba(20,10,30,.4);color:#fff} a.btn{display:flex;align-items:center;justify-content:center;text-decoration:none;box-sizing:border-box} /* راهنمای بارِ اولِ آیکنِ سرگرمی */ /* آیکنِ 🎉 — انیمیشنِ همیشگی */ .fun-hbtn{position:relative;overflow:visible;border-color:transparent!important;background:linear-gradient(var(--glass,#fff),var(--glass,#fff)) padding-box,linear-gradient(120deg,#ff5c8a,#ffc06a,#b36cff,#4fc3ff,#ff5c8a) border-box!important;background-size:100% 100%,300% 300%!important;animation:funBorder 4s linear infinite;box-shadow:0 6px 16px -8px rgba(179,108,255,.7)} @keyframes funBorder{to{background-position:0 0,300% 0}} .fun-em{display:inline-block;font-size:21px;line-height:1;transform-origin:30% 80%;animation:funEm 3.6s ease-in-out infinite} @keyframes funEm{0%,62%,100%{transform:none}68%{transform:rotate(-18deg) scale(1.18)}74%{transform:rotate(14deg) scale(1.18)}80%{transform:rotate(-8deg) scale(1.08)}86%{transform:rotate(4deg)}92%{transform:none}} .fun-sp{position:absolute;font-style:normal;font-size:9px;color:#ff5c8a;pointer-events:none;opacity:0;animation:funSp 3.6s ease-out infinite} .fun-sp.s1{top:-3px;right:2px;animation-delay:2.4s}.fun-sp.s2{top:4px;left:-4px;color:#b36cff;animation-delay:2.55s}.fun-sp.s3{bottom:-3px;right:6px;color:#ffb020;animation-delay:2.7s} @keyframes funSp{0%{opacity:0;transform:scale(.2)}8%{opacity:1;transform:scale(1.2) rotate(45deg)}20%,100%{opacity:0;transform:scale(.4) translateY(-6px) rotate(90deg)}} @media (prefers-reduced-motion:reduce){.fun-hbtn,.fun-em,.fun-sp{animation:none}} .fun-hbtn.fun-new{animation:fhWig 2.4s ease-in-out infinite;box-shadow:0 0 0 3px rgba(255,92,138,.22),0 0 20px rgba(255,92,138,.6)} @keyframes fhWig{0%,55%,100%{transform:none}62%{transform:rotate(-16deg) scale(1.15)}70%{transform:rotate(14deg) scale(1.15)}78%{transform:rotate(-9deg) scale(1.08)}86%{transform:rotate(5deg)}} .fh-bg{position:fixed;inset:0;z-index:400;background:radial-gradient(circle at var(--x) var(--y),rgba(0,0,0,0) 0 30px,rgba(20,8,24,.66) 46px);opacity:0;transition:opacity .4s} .fh-bg.on{opacity:1} .fh-ring{position:fixed;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;border:2.5px solid #fff;animation:fhRing 1.5s ease-out infinite;pointer-events:none} @keyframes fhRing{0%{box-shadow:0 0 0 0 rgba(255,122,162,.85);transform:scale(.9)}100%{box-shadow:0 0 0 28px rgba(255,122,162,0);transform:scale(1.15)}} .fh-bub{position:fixed;width:min(310px,calc(100vw - 32px));box-sizing:border-box;background:#fff;border-radius:24px;padding:18px 16px 16px;text-align:center;box-shadow:0 24px 50px -20px rgba(0,0,0,.6);transform:translateY(14px) scale(.9);opacity:0;transition:transform .55s cubic-bezier(.2,.9,.3,1.35) .2s,opacity .3s .2s} .fh-bg.on .fh-bub{transform:none;opacity:1} .fh-bub::before{content:"";position:absolute;top:-8px;left:var(--ax);width:18px;height:18px;margin-left:-9px;background:#fff;transform:rotate(45deg);border-radius:4px} .fh-em{font-size:42px;display:inline-block;animation:fxPop 1.8s ease-in-out infinite} .fh-bub b{display:block;font-size:17px;font-weight:900;color:var(--ink);margin:6px 0} .fh-bub p{margin:0 0 10px;font-size:13.5px;line-height:1.9;color:var(--ink-soft)} .fh-tags{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:14px} .fh-tags span{font-size:12px;font-weight:800;padding:5px 10px;border-radius:999px;background:linear-gradient(135deg,#fff0f6,#f3ecff);color:#8f4bd6;opacity:0;animation:fxRise .4s ease forwards} .fh-bub .btn{width:100%;margin:0;padding:13px 18px} @media (prefers-reduced-motion:reduce){.fx-feat,.fx-tile,.stg,.ed-chips button,.ed-t,.rv,.fh-tags span{animation:none!important;opacity:1}.fx-shine::before,.stg-em,.fx-te,.fx-feat .ic,.fun-hbtn.fun-new{animation:none}} /* ===== سرِ چت: ابزارهای شیشه‌ای + شهر + راهنمای بارِ اول ===== */ .cp-tools{margin-inline-start:auto;display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:17px;background:rgba(255,255,255,.7); border:1px solid var(--line);box-shadow:0 8px 20px -14px rgba(0,0,0,.35);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)} .cp-tools>button{margin:0!important;width:40px;height:40px;border-radius:14px;border:none!important;display:grid;place-items:center;cursor:pointer;transition:transform .12s,background .2s} .cp-tools>button:active{transform:scale(.88)} .cp-tools .cp-block-ic{background:rgba(120,120,140,.08);color:#6b6f80} .cp-tools .cp-block-ic.on{background:var(--grad);color:#fff} .cp-tools .cp-del-ic{background:rgba(216,69,106,.09);color:#d8456a} .cp-tools .cp-bell-ic{margin-inline-start:0} .cp-tools .cp-bell-ic.on{background:var(--grad);color:#fff} .cp-bell-ic.on svg{fill:currentColor} .push-note{font-size:12px;line-height:1.7;color:var(--ink-soft,#7a6a80);padding:2px 4px 6px} .cp-tools .cp-close{background:var(--grad);color:#fff;box-shadow:0 6px 14px -8px var(--coral)} .cp-tools svg{width:17px;height:17px} .cp-head .st{flex-wrap:nowrap;white-space:nowrap;min-width:0;max-width:100%;display:flex} .cp-head .nm{display:flex;align-items:baseline;min-width:0}.cp-head .nm .nmt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cp-head .nm .nma{flex:none;white-space:nowrap} .cp-head .st>*{flex:none}.cp-head .st .stcity{flex:0 1 auto;min-width:0;overflow:hidden}.cp-head .st .stct{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} /* ===== نوارِ ابزارِ چت: شیشه‌ای / کریستالی ===== */ #chatpop .cp-head{flex-wrap:wrap;row-gap:12px} #chatpop .cp-head .cp-tools{flex:1 1 100%;order:3;margin:0;justify-content:space-around;gap:2px;padding:10px 6px 8px;border-radius:24px; background:linear-gradient(160deg,rgba(255,255,255,.78),rgba(255,255,255,.34));border:1px solid rgba(255,255,255,.85); box-shadow:0 14px 30px -18px rgba(90,40,120,.45),inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(150,120,190,.12); backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4)} #chatpop .cp-head .cp-tools>button{width:auto;flex:1 1 0;height:auto;min-width:0;background:none!important;box-shadow:none;display:grid;justify-items:center;align-content:center;gap:6px;padding:0;border-radius:14px} #chatpop .cp-head .cp-tools>button::after{content:attr(data-l);font-size:10.5px;font-weight:600;letter-spacing:0;color:rgba(70,50,90,.62);line-height:1;transition:color .2s} #chatpop .cp-head .cp-tools>button svg{width:42px;height:42px;padding:11.5px;box-sizing:border-box;border-radius:50%;color:#6e6a86; background:radial-gradient(circle at 30% 22%,rgba(255,255,255,.98),rgba(238,234,250,.62) 58%,rgba(214,206,240,.5)); border:1px solid rgba(255,255,255,.95);box-shadow:0 8px 16px -10px rgba(80,50,140,.55),inset 0 1px 1px rgba(255,255,255,1),inset 0 -2px 4px rgba(150,130,200,.18);transition:transform .15s,box-shadow .2s} #chatpop .cp-head .cp-tools>button:active svg{transform:scale(.9)} #chatpop .cp-head .cp-tools .cp-call-ic svg{color:#0e9f6e;background:radial-gradient(circle at 30% 22%,rgba(255,255,255,.98),rgba(205,246,226,.75) 58%,rgba(150,225,190,.6));box-shadow:0 8px 16px -10px rgba(16,185,129,.7),inset 0 1px 1px #fff,inset 0 -2px 4px rgba(16,185,129,.16)} #chatpop .cp-head .cp-tools .cp-call-ic svg path{fill:currentColor} #chatpop .cp-head .cp-tools .cp-call-ic.off svg{color:#8a8fa3;background:radial-gradient(circle at 30% 22%,#fff,rgba(238,234,250,.62) 58%,rgba(214,206,240,.5));box-shadow:0 8px 16px -10px rgba(80,50,140,.4),inset 0 1px 1px #fff} #chatpop .cp-head .cp-tools .cp-del-ic svg{color:#d8456a;background:radial-gradient(circle at 30% 22%,rgba(255,255,255,.98),rgba(255,226,235,.75) 58%,rgba(250,180,200,.55));box-shadow:0 8px 16px -10px rgba(216,69,106,.6),inset 0 1px 1px #fff,inset 0 -2px 4px rgba(216,69,106,.14)} #chatpop .cp-head .cp-tools .cp-del-ic::after{color:rgba(216,69,106,.85)} #chatpop .cp-head .cp-tools .cp-block-ic.on svg,#chatpop .cp-head .cp-tools .cp-bell-ic.on svg{background:var(--grad);color:#fff;border-color:rgba(255,255,255,.55);box-shadow:0 10px 18px -10px var(--coral),inset 0 1px 1px rgba(255,255,255,.7)} #chatpop .cp-head .cp-tools .cp-close svg{color:#fff;background:linear-gradient(145deg,rgba(255,255,255,.35),transparent 42%),var(--grad);border-color:rgba(255,255,255,.6);box-shadow:0 10px 18px -10px var(--coral),inset 0 1px 1px rgba(255,255,255,.75),inset 0 -2px 4px rgba(0,0,0,.08)} #chatpop .cp-head .cp-tools .cp-close::after{color:var(--coral)} .cp-head .st .stsep{opacity:.45;margin:0 1px} .cp-head .st .stcity{display:inline-flex;align-items:center;gap:3px;color:var(--ink-soft);font-weight:600} .cp-head .st .stcity svg{width:12px;height:12px;opacity:.75} .ct-ov{position:fixed;inset:0;z-index:400;pointer-events:auto} .ct-spot{position:fixed;border-radius:16px;box-shadow:0 0 0 9999px rgba(18,10,20,.62),0 0 0 3px rgba(255,255,255,.9),0 0 22px 6px rgba(65,221,156,.55); transition:all .35s cubic-bezier(.2,.9,.3,1);pointer-events:none;animation:ctPulse 1.6s ease-in-out infinite} @keyframes ctPulse{0%,100%{box-shadow:0 0 0 9999px rgba(18,10,20,.62),0 0 0 3px rgba(255,255,255,.9),0 0 18px 4px rgba(65,221,156,.45)}50%{box-shadow:0 0 0 9999px rgba(18,10,20,.62),0 0 0 3px rgba(255,255,255,.9),0 0 30px 10px rgba(65,221,156,.7)}} .ct-bub{position:fixed;left:16px;right:16px;max-width:420px;margin:0 auto;background:#fff;border-radius:22px;padding:16px 16px 12px;box-shadow:0 20px 40px -16px rgba(0,0,0,.5); transition:top .35s cubic-bezier(.2,.9,.3,1),opacity .2s;text-align:start;direction:rtl} [dir=ltr] .ct-bub{direction:ltr} .ct-bub .ct-e{font-size:28px;line-height:1} .ct-bub .ct-t{font-weight:900;font-size:16px;color:var(--ink);margin:6px 0 4px} .ct-bub .ct-s{font-size:13.5px;color:var(--ink-soft);line-height:1.9} .ct-row{display:flex;align-items:center;gap:8px;margin-top:12px} .ct-dots{display:flex;gap:5px;flex:1} .ct-dots i{width:7px;height:7px;border-radius:9px;background:rgba(0,0,0,.12);transition:.25s} .ct-dots i.on{width:20px;background:var(--grad)} .ct-skip{background:none;border:none;font:inherit;font-size:13px;color:var(--ink-soft);cursor:pointer;padding:8px} .ct-next{border:none;font:inherit;font-weight:800;font-size:14px;color:#fff;background:var(--grad);border-radius:14px;padding:10px 18px;cursor:pointer;box-shadow:0 8px 16px -8px var(--coral)} @media (prefers-reduced-motion:reduce){.ct-spot{animation:none;transition:none}} .cfm-bg{position:absolute;inset:0;z-index:120;background:rgba(40,12,32,.5);backdrop-filter:blur(5px);display:none;align-items:center;justify-content:center;padding:26px} .cfm-bg.on{display:flex} .cfm{width:100%;max-width:330px;background:var(--cream);border-radius:24px;padding:22px 20px 18px;box-shadow:var(--shadow);text-align:center;animation:cfmpop .28s cubic-bezier(.2,.9,.3,1) both} @keyframes cfmpop{from{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:none}} .cfm-t{font-family:var(--font-display);font-weight:600;color:var(--plum);font-size:19px;margin-bottom:8px} .cfm-m{color:var(--ink-soft);font-size:14px;line-height:1.8;margin-bottom:18px} .cfm-btns{display:flex;gap:10px} .cfm-no,.cfm-yes{flex:1;font:inherit;font-weight:700;font-size:15px;border-radius:14px;padding:13px;cursor:pointer;border:none} .cfm-no{background:#fff;color:var(--plum);border:1.5px solid var(--line)} .cfm-yes{background:linear-gradient(120deg,#e0356b,#ff6f8f);color:#fff;box-shadow:0 10px 22px -12px rgba(224,53,107,.8)} .cfm-no:active,.cfm-yes:active{transform:scale(.97)} .cp-msgs{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:14px;display:flex;flex-direction:column;gap:8px} .cp-msgs::before{content:"";margin-top:auto} .cp-hint{margin:auto;color:var(--ink-soft);font-size:13px;text-align:center;opacity:.85} /* حالتِ خالیِ گفتگو (طراحیِ خلاقانه) */ .cp-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px 22px;margin:auto;animation:fade .4s ease both} .cpe-stage{position:relative;width:196px;height:150px;display:flex;align-items:center;justify-content:center;margin-bottom:8px} .cpe-av{position:relative;width:108px;height:108px;border-radius:50%;overflow:hidden;background:var(--line);box-shadow:0 16px 38px -12px rgba(255,92,138,.5),0 0 0 4px #fff,0 0 0 7px rgba(255,92,138,.26)} /* صحنهٔ حباب‌های چتِ زنده (جایگزینِ آواتار) */ .cpe-scene{position:relative;width:180px;height:132px;margin:0 auto 8px} .cpe-bub{position:absolute;display:grid;place-items:center;box-shadow:0 16px 34px -14px rgba(255,92,138,.55)} .cpe-bub.in{width:100px;height:62px;top:14px;inset-inline-start:6px;background:var(--grad);border-radius:22px;border-end-start-radius:7px;animation:cpeBubIn .55s .05s both,cpeBob 3.4s ease-in-out infinite} .cpe-bub.out{width:70px;height:48px;bottom:8px;inset-inline-end:6px;background:#fff;border:1.5px solid var(--line);border-radius:20px;border-end-end-radius:6px;color:var(--coral);box-shadow:0 12px 26px -14px rgba(120,40,70,.4);animation:cpeBubIn .55s .32s both,cpeBob 3.4s ease-in-out infinite .5s} .cpe-bub.out svg{width:26px;height:26px} @keyframes cpeBubIn{from{opacity:0;transform:translateY(14px) scale(.82)}to{opacity:1;transform:none}} @keyframes cpeBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} .cpe-dots{display:flex;gap:6px} .cpe-dots i{width:9px;height:9px;border-radius:50%;background:#fff;animation:cpeDot 1.3s infinite} .cpe-dots i:nth-child(2){animation-delay:.18s} .cpe-dots i:nth-child(3){animation-delay:.36s} @keyframes cpeDot{0%,60%,100%{transform:translateY(0);opacity:.55}30%{transform:translateY(-6px);opacity:1}} .cpe-heart{position:absolute;top:6px;inset-inline-start:44px;font-size:19px;filter:drop-shadow(0 4px 6px rgba(255,92,138,.4));animation:cpeHeart 2.9s ease-in-out infinite;z-index:3} @keyframes cpeHeart{0%{transform:translateY(12px) scale(.5);opacity:0}25%{opacity:1}70%{opacity:1}100%{transform:translateY(-24px) scale(1.05);opacity:0}} .cpe-spark{position:absolute;font-size:14px;animation:cpeTwinkle 2.4s ease-in-out infinite} .cpe-spark.s1{top:0;inset-inline-end:14px} .cpe-spark.s2{bottom:2px;inset-inline-start:6px;animation-delay:1.2s} @keyframes cpeTwinkle{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.18)}} .cpe-av.mono{overflow:visible;background:var(--grad);box-shadow:0 18px 40px -12px rgba(255,92,138,.6),0 0 0 5px rgba(255,255,255,.9);animation:cpeAvFloat 3.6s ease-in-out infinite} @keyframes cpeAvFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}} .cpe-av.mono .cpe-init{position:relative;z-index:2;font-family:var(--font-display,inherit);font-weight:900;font-size:46px;color:#fff;text-shadow:0 3px 10px rgba(120,20,50,.35)} .cpe-av.mono .cpe-ring{position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(255,92,138,.45);animation:cpeRing 2.6s ease-out infinite;z-index:1} .cpe-av.mono .cpe-ring.r2{animation-delay:1.3s} @keyframes cpeRing{0%{transform:scale(.92);opacity:.75}100%{transform:scale(1.4);opacity:0}} .cpe-av .portrait{width:100%;height:100%;object-fit:cover} .cpe-wave{position:absolute;bottom:-2px;inset-inline-end:-2px;width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:21px;box-shadow:0 8px 18px -6px rgba(0,0,0,.28);animation:cpeWave 2.6s ease-in-out infinite;transform-origin:70% 70%;z-index:4} .cpe-orb{position:absolute;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 12px 24px -8px rgba(60,20,45,.3);animation:cpeFloat 4.6s ease-in-out infinite} .cpe-orb.o1{width:44px;height:44px;font-size:19px;top:2px;inset-inline-start:2px} .cpe-orb.o2{width:34px;height:34px;font-size:15px;top:12px;inset-inline-end:4px;animation-delay:.9s} .cpe-orb.o3{width:38px;height:38px;font-size:17px;bottom:4px;inset-inline-start:24px;animation-delay:1.8s} @keyframes cpeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}} @keyframes cpeWave{0%,60%,100%{transform:rotate(0)}20%{transform:rotate(20deg)}40%{transform:rotate(-12deg)}} .cpe-title{font-size:18px;font-weight:900;color:var(--ink);margin:4px 0 3px} .cpe-sub{font-size:12.7px;color:var(--ink-soft);line-height:1.75;margin:0 0 15px;max-width:250px} .cpe-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:290px} .cpe-chip{border:1px solid rgba(255,92,138,.28);cursor:pointer;font:inherit;font-size:13px;font-weight:800;color:var(--coral);background:rgba(255,92,138,.09);border-radius:15px;padding:9px 15px;transition:transform .12s,background .12s} .cpe-chip:active{transform:scale(.94);background:rgba(255,92,138,.16)} /* حالتِ خالیِ لیستِ گفتگوها (خلاقانه و انیمیشنی) */ .chats-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:38px 24px;margin:auto;animation:fade .45s ease both} .che-stage{position:relative;width:200px;height:160px;display:flex;align-items:center;justify-content:center;margin-bottom:8px} .che-core{position:relative;width:102px;height:102px;border-radius:30px 30px 30px 9px;background:var(--grad);display:grid;place-items:center;box-shadow:0 22px 46px -14px rgba(255,92,138,.6);animation:chePulse 3s ease-in-out infinite} .che-core .che-chat{width:48px;height:48px;color:#fff;opacity:.96} .che-bubble{position:absolute;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 12px 26px -10px rgba(60,20,45,.34);animation:cheFloat 4.6s ease-in-out infinite} .che-bubble.b1{width:46px;height:46px;font-size:21px;top:0;inset-inline-start:4px} .che-bubble.b2{width:38px;height:38px;font-size:17px;top:16px;inset-inline-end:0;animation-delay:.9s} .che-bubble.b3{width:36px;height:36px;font-size:16px;bottom:0;inset-inline-start:30px;animation-delay:1.8s} @keyframes cheFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}} @keyframes chePulse{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.06) rotate(-2deg)}} .che-title{font-size:20px;font-weight:900;color:var(--ink);margin:6px 0 4px} .che-sub{font-size:13px;color:var(--ink-soft);line-height:1.75;margin:0 0 18px;max-width:262px} .che-cta{border:none;cursor:pointer;font:inherit;font-weight:900;font-size:14.5px;color:#fff;background:var(--grad);border-radius:16px;padding:13px 28px;box-shadow:0 14px 28px -12px rgba(255,92,138,.7);transition:transform .12s} .che-cta:active{transform:scale(.96)} /* کارتِ وسطِ صفحه برای نتیجهٔ پرداخت (موفق/ناموفق) — خودکار محو می‌شود */ .payres{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:30px;background:rgba(30,10,24,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:fade .25s ease both} .payres.on{display:flex} .payres.out{animation:fade .35s ease reverse both} .payres-card{width:100%;max-width:320px;background:var(--cream,#fff);border-radius:28px;padding:32px 26px;text-align:center;box-shadow:0 34px 74px -20px rgba(40,12,32,.65);animation:payresPop .45s cubic-bezier(.2,.9,.3,1.35) both} .payres-ic{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px} .payres-ic svg{width:44px;height:44px;color:#fff} .payres-ic.ok{background:linear-gradient(140deg,#3ddc84,#1faa63);box-shadow:0 18px 36px -12px rgba(31,170,99,.6);animation:payresPulse 2s ease-in-out infinite} .payres-ic.no{background:linear-gradient(140deg,#ff6b6b,#e8455f);box-shadow:0 18px 36px -12px rgba(232,69,95,.55);animation:payresShake .5s ease both} .payres-msg{font-size:15.5px;font-weight:800;color:var(--ink);line-height:1.9} @keyframes payresPop{0%{transform:scale(.8);opacity:0}100%{transform:scale(1);opacity:1}} @keyframes payresPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}} @keyframes payresShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}40%{transform:translateX(7px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}} .crow{display:flex;width:100%} .crow.them{justify-content:flex-end} .crow.me{justify-content:flex-start} .cbubble{max-width:76%;padding:10px 13px;border-radius:16px;font-size:14px;line-height:1.7;box-shadow:var(--shadow-sm);word-break:break-word} .ctime{align-self:flex-end;flex:none;font-size:10px;line-height:1;color:var(--ink-soft,#9a8f99);opacity:.75;margin:0 6px 4px;white-space:nowrap;direction:ltr;font-variant-numeric:tabular-nums} .crow.them .ctime{order:-1} .crow{align-items:flex-end} .cbubble.them{background:#fff;color:var(--ink);border-bottom-left-radius:5px} .cbubble.me{background:var(--grad);color:#fff;border-bottom-right-radius:5px} .cticks{display:inline-flex;align-items:center;vertical-align:-3px;margin-inline-start:7px;color:#d8ffe9;opacity:.85} .cticks.read{color:#26ff9e;opacity:1} .cmh{align-self:flex-start;margin:2px 10px 8px;max-width:88%;font-size:11.5px;line-height:1.7;color:var(--ink-soft,#9a8f99);animation:cmhIn .25s ease both} .cmh b{font-weight:700}.cmh.rd b{color:#26ff9e} .cmh .tip{display:block;margin-top:3px;opacity:.9} @keyframes cmhIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}} .cticks svg{width:19px;height:11px} .cbubble.me.img .cticks,.cbubble.me .vmsg+.cticks{display:flex;justify-content:flex-end;margin:4px 2px 0} .cp-composer{display:flex;gap:6px;align-items:center;padding:10px 12px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line)} .cp-blockbar{display:none;align-items:center;justify-content:center;gap:8px;padding:14px 16px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);color:var(--ink-soft);font-size:13.5px;font-weight:600;text-align:center;background:#faf3f6} .cp-composer input#cinp,.cp-composer input#supInp{flex:1;min-width:0;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:12px 16px;font:inherit;font-size:16px;color:var(--ink);text-align:start} /* موقعِ نوشتن هیچ کادری دورِ فیلدِ چت/پشتیبانی نیفتد (حلقهٔ focusِ سراسری اینجا خنثی می‌شود). */ .cp-composer input#cinp:focus,.cp-composer input#supInp:focus, .cp-composer input#cinp:focus-visible,.cp-composer input#supInp:focus-visible{outline:none;box-shadow:none;border-color:var(--line)} .cp-ibtn{width:42px;height:42px;border-radius:50%;border:none;background:none;cursor:pointer;color:var(--plum);display:grid;place-items:center;flex:none} .cp-ibtn:active{transform:scale(.9)} .cp-ibtn svg{width:24px;height:24px} .cp-send{width:46px;height:46px;border-radius:50%;border:none;cursor:pointer;flex:none;color:#fff;background:var(--grad);display:grid;place-items:center;box-shadow:0 8px 18px -8px rgba(255,92,138,.7)} .cp-send svg{width:22px;height:22px} .cp-send:active{transform:scale(.92)} .cp-emoji{display:none;flex-wrap:wrap;gap:2px;padding:8px 12px;max-height:46vh;overflow-y:auto;border-top:1px solid var(--line);background:var(--cream)} .cp-emoji.on{display:flex} .cp-emoji button{font-size:25px;line-height:1;border:none;background:none;cursor:pointer;width:13%;height:46px;border-radius:10px} .cp-emoji button:active{background:var(--glass)} .cbubble.img{padding:4px} .cbubble img.cphoto{display:block;max-width:210px;width:100%;border-radius:12px;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;pointer-events:auto;-webkit-user-drag:none;cursor:zoom-in} .imgv-bg{position:fixed;inset:0;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;z-index:3000;padding:16px} .imgv-bg.on{display:flex} .imgv-bg img{max-width:100%;max-height:100%;border-radius:10px;object-fit:contain;-webkit-user-select:none;user-select:none} .imgv-x{position:absolute;top:calc(14px + env(safe-area-inset-top));inset-inline-end:16px;width:42px;height:42px;border-radius:50%;border:none;background:rgba(255,255,255,.15);color:#fff;font-size:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(6px)} .imgv-x:active{background:rgba(255,255,255,.28)} .vmsg{display:flex;align-items:center;gap:9px} .vplay{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:none;background:rgba(255,255,255,.22);border:none;cursor:pointer;color:inherit;padding:0} .cbubble.them .vplay{background:rgba(255,92,138,.12);color:var(--coral)} .vplay svg{width:15px;height:15px} .vwave{display:flex;align-items:center;gap:2px;height:22px} .vwave i{width:3px;border-radius:2px;background:currentColor;opacity:.85} .vdur{font-size:12px;opacity:.9} .cp-recbar{display:flex;align-items:center;gap:12px;padding:10px 12px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line)} .cp-rec-cancel,.cp-rec-send{width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;flex:none;display:grid;place-items:center} .cp-rec-cancel{background:#fff;color:#d8456a;border:1.5px solid var(--line)} .cp-rec-cancel svg{width:20px;height:20px} .cp-rec-send{color:#fff;background:var(--grad);box-shadow:0 8px 18px -8px rgba(255,92,138,.7)} .cp-rec-send svg{width:21px;height:21px} .cp-rec-send:active,.cp-rec-cancel:active{transform:scale(.92)} .cp-rec-live{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--plum);font-variant-numeric:tabular-nums} .cp-rec-dot{width:11px;height:11px;border-radius:50%;background:#e0356b;animation:pulseDot 1.4s ease-out infinite} .cp-rec-hint{flex:1;color:var(--ink-soft);font-size:13px} .cp-prev-play{width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;flex:none;display:grid;place-items:center;color:#fff;background:var(--grad);box-shadow:0 8px 18px -8px rgba(255,92,138,.7)} .cp-prev-play svg{width:19px;height:19px} .cp-prev-play:active{transform:scale(.92)} /* filter dialog (centered, compact) */ .fsheet-bg{position:absolute;inset:0;z-index:100;background:rgba(40,12,32,.5);backdrop-filter:blur(5px);display:none;align-items:center;justify-content:center;padding:20px;animation:fade .25s ease both} .spam-sheet{max-width:360px;width:100%;display:flex;flex-direction:column;max-height:82vh} .spam-attach{display:flex;gap:8px;margin-bottom:8px} .spam-smart{background:linear-gradient(135deg,#8f6bff,#ff7aa8)!important;color:#fff!important;border-color:transparent!important} .spam-smart.arm{background:linear-gradient(135deg,#ff7a59,#ff3d77)!important;animation:smPulse .8s infinite alternate} @keyframes smPulse{to{transform:scale(1.05)}} .spam-att-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;border-radius:11px;border:1px solid var(--line);background:#fff;color:var(--coral);font-size:13px;font-weight:700;cursor:pointer;font-family:inherit} .spam-att-btn svg{width:17px;height:17px} .spam-att-btn.rec{background:linear-gradient(135deg,#FF5C8A,#FF8A5C);color:#fff;border-color:transparent} .spam-att-btn:active{opacity:.7} .spam-media{display:flex;align-items:center;gap:10px;margin-bottom:10px;background:#faf3f6;border-radius:12px;padding:8px 10px} .spam-media img{width:46px;height:46px;border-radius:9px;object-fit:cover;flex:none} .spam-media .sm-play{flex:none;width:40px;height:40px;border-radius:50%;border:none;cursor:pointer;display:grid;place-items:center;color:#fff;background:var(--grad);box-shadow:0 6px 14px -6px var(--coral)} .spam-media .sm-play svg{width:18px;height:18px} .spam-media .sm-play .i-pause{display:none} .spam-media .sm-play.on .i-play{display:none}.spam-media .sm-play.on .i-pause{display:block} .spam-media .sm-voice{flex:1;min-width:0;font-size:13px} .spam-media .sm-bar{height:4px;border-radius:9px;background:rgba(0,0,0,.08);margin-top:7px;overflow:hidden} .spam-media .sm-bar i{display:block;height:100%;width:0;background:var(--grad);transition:width .2s linear} .spam-media .sm-x{margin-inline-start:auto;border:none;background:rgba(0,0,0,.06);width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:13px;flex:none} .spam-tabs{display:flex;gap:7px;margin-bottom:10px} #pvHW{margin-top:8px} body.can-del #cpMsgs .crow.me .cbubble{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none} #fcmPop,#pushAskPop{position:fixed;inset:0;z-index:100002;background:rgba(20,8,30,.6);display:flex;align-items:center;justify-content:center;padding:22px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)} #fcmPop .fp-card,#pushAskPop .fp-card{width:100%;max-width:340px;max-height:86vh;overflow:auto;background:#fff;border-radius:24px;padding:20px 18px 18px;text-align:center;box-shadow:0 24px 60px -12px rgba(0,0,0,.45)} #fcmPop img{width:100%;max-height:220px;object-fit:cover;border-radius:16px;margin-bottom:12px} #fcmPop b,#pushAskPop b{display:block;font-size:17px;color:#3A2233;margin-bottom:8px} #fcmPop p,#pushAskPop p{margin:0 0 16px;font-size:14px;line-height:1.9;color:#5a4150;white-space:pre-wrap;text-align:start} #fcmPop button,#pushAskPop button{width:100%;border:0;border-radius:14px;padding:13px;font:inherit;font-weight:700;color:#fff;background:linear-gradient(135deg,#e0457b,#f08a6c);cursor:pointer} #badNamePop{position:fixed;inset:0;z-index:100001;background:rgba(20,8,30,.6);display:flex;align-items:center;justify-content:center;padding:22px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)} #badNamePop .bn-card{width:100%;max-width:340px;background:#fff;border-radius:24px;padding:24px 20px 20px;text-align:center;box-shadow:0 24px 60px -12px rgba(0,0,0,.45)} #badNamePop .bn-ic{font-size:34px;margin-bottom:6px} #badNamePop b{display:block;font-size:17px;color:#3A2233;margin-bottom:8px} #badNamePop p{font-size:13px;line-height:1.9;color:#6b5866;margin:0 0 14px} #badNamePop input{width:100%;box-sizing:border-box;padding:13px 14px;border-radius:14px;border:1.5px solid #e6d6e2;font:inherit;font-size:15px;text-align:center;margin-bottom:12px} html.dark #badNamePop .bn-card{background:#241a2e}html.dark #badNamePop b{color:#f3e9f6}html.dark #badNamePop p{color:#c9b8cf} .vnew-app{margin-top:6px;font-size:11.5px;line-height:1.8;opacity:.95} .vnew-app a{color:inherit;font-weight:800;text-decoration:underline} .spam-tab{flex:1;padding:9px 4px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--ink-soft);font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;font-family:inherit} .spam-tab.on{background:linear-gradient(135deg,var(--coral),#ff8a5c);color:#fff;border-color:transparent} .spam-count{font-size:12px;color:var(--coral);font-weight:700;margin-bottom:8px;text-align:right} .spam-selrow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.spam-selrow .spam-count{margin-bottom:0} .spam-selmode{display:flex;gap:4px;background:rgba(127,127,127,.12);border-radius:99px;padding:3px} .spam-selmode button{border:0;background:transparent;font:inherit;font-size:12px;font-weight:700;padding:6px 11px;border-radius:99px;color:inherit;cursor:pointer;opacity:.7} .spam-selmode button.on{background:var(--coral);color:#fff;opacity:1} .spam-list{flex:1 1 auto;overflow-y:auto;min-height:60px;max-height:38vh;margin-bottom:12px;-webkit-overflow-scrolling:touch} /* باکسِ متن هیچ‌وقت با باز شدنِ کیبورد کوچک نمی‌شود؛ با متن بزرگ‌تر می‌شود. فقط لیستِ گیرنده‌ها جمع می‌شود. */ .spam-sheet{overflow-y:auto;-webkit-overflow-scrolling:touch} .spam-sheet>*{flex-shrink:0} .spam-sheet>.spam-list{flex-shrink:1} #spamText{min-height:96px;max-height:42vh;resize:none;overflow-y:auto;line-height:1.8} .spam-row{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:12px;cursor:pointer;transition:background .12s} .spam-row.on{background:rgba(255,92,138,.08)} .spam-check{width:22px;height:22px;flex:none;border-radius:7px;border:2px solid var(--line);display:grid;place-items:center;color:#fff} .spam-row.on .spam-check{background:var(--coral);border-color:var(--coral)} .spam-check svg{width:14px;height:14px} .spam-av{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none} .spam-av-none{display:grid;place-items:center;background:#f0e6ef;color:#b596b0} .spam-av-none svg{width:20px;height:20px} .spam-nm{font-weight:700;font-size:14px;color:var(--plum)} .spam-empty{text-align:center;color:var(--ink-soft);padding:30px 10px;font-size:14px} .spam-btn{color:#fff} .fsheet-bg.on{display:flex} #profileView.pv-ff .pv-act.like,#profileView.pv-ff .pv-act.msg,#profileView.pv-ff .pv-act.call,#profileView.pv-ff .pv-act.star{display:none!important} .c2h{max-width:330px;text-align:center;overflow:hidden} .c2h-art{position:relative;width:96px;height:72px;margin:6px auto 10px} .c2h-c1,.c2h-c2{position:absolute;width:62px;height:40px;border-radius:9px;box-shadow:0 10px 20px -10px rgba(0,0,0,.45)} .c2h-c1{left:0;top:4px;background:linear-gradient(135deg,var(--coral),var(--coral-2));transform:rotate(-10deg);animation:c2hA 2.6s ease-in-out infinite} .c2h-c2{right:0;bottom:2px;background:linear-gradient(135deg,#3b2d5c,#6a4fa3);transform:rotate(8deg);animation:c2hB 2.6s ease-in-out infinite} .c2h-c1::after,.c2h-c2::after{content:"";position:absolute;left:8px;top:9px;width:13px;height:10px;border-radius:3px;background:#f3c96a} .c2h-art svg{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;padding:6px;border-radius:50%;background:#fff;color:var(--coral);box-shadow:0 6px 14px -6px rgba(0,0,0,.4);box-sizing:content-box} @keyframes c2hA{50%{transform:rotate(-14deg) translateX(-3px)}}@keyframes c2hB{50%{transform:rotate(12deg) translateX(3px)}} .c2h h2{margin:2px 0 8px;font-size:18px} .c2h p{font-size:14px;line-height:1.95;color:var(--ink);margin:0 0 16px} .c2h .c2h-no{margin-top:8px} /* پاپ‌آپِ «پرداخت انجام نشد؟» (۳ شکستِ درگاه) */ .c2t{max-width:340px;padding-top:22px;border:1.5px solid rgba(255,92,138,.35);box-shadow:0 24px 60px -18px rgba(255,92,138,.55),0 0 0 6px rgba(255,92,138,.08);animation:c2tIn .5s cubic-bezier(.2,.9,.3,1.25) both} .c2t-x{position:absolute;top:10px;left:10px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(0,0,0,.08);color:#6b5560;font-size:19px;line-height:34px;padding:0;cursor:pointer;z-index:2} .c2t-hero{position:relative;width:92px;height:92px;margin:0 auto 8px;display:grid;place-items:center} .c2t-ring{position:absolute;inset:6px;border-radius:50%;border:2px solid rgba(255,92,138,.5);animation:c2tPulse 2s ease-out infinite} .c2t-r2{animation-delay:1s} .c2t-ic{position:relative;width:62px;height:62px;border-radius:20px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--coral),var(--coral-2));box-shadow:0 12px 24px -10px rgba(255,92,138,.8);animation:c2tShake 3.2s ease-in-out infinite} .c2t-ic svg{width:32px;height:32px} .c2t h2{font-size:19px;margin:0 0 6px} .c2t p{margin:0 0 12px;font-size:13.5px} .c2t-step{display:flex;align-items:center;gap:10px;text-align:start;padding:9px 12px;margin:0 0 7px;border-radius:14px;background:rgba(255,255,255,.7);border:1px solid rgba(255,92,138,.18);font-size:13.5px;font-weight:700;color:var(--ink)} .c2t-step .n{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12.5px;color:#fff;background:linear-gradient(135deg,var(--coral),var(--coral-2))} .c2t-or{display:flex;align-items:center;gap:8px;margin:12px 0 10px} .c2t-or i{flex:1;height:1px;background:rgba(0,0,0,.12)}.c2t-or b{font-size:12px;color:var(--ink-soft)} .c2t-go{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:linear-gradient(135deg,#f4b740,#e8862a)!important;color:#fff;box-shadow:0 12px 24px -10px rgba(232,134,42,.9);animation:c2tGlow 2.2s ease-in-out infinite} .c2t-go svg{width:20px;height:20px} .c2t-retry{font-size:12.5px;opacity:.85} @keyframes c2tIn{from{opacity:0;transform:translateY(24px) scale(.94)}to{opacity:1;transform:none}} @keyframes c2tPulse{0%{transform:scale(.75);opacity:.9}100%{transform:scale(1.35);opacity:0}} @keyframes c2tShake{0%,86%,100%{transform:rotate(0)}89%{transform:rotate(-7deg)}92%{transform:rotate(7deg)}95%{transform:rotate(-4deg)}} @keyframes c2tGlow{50%{box-shadow:0 14px 30px -8px rgba(232,134,42,1)}} .pvpn-ic{width:58px;height:58px;margin:4px auto 0;border-radius:18px;display:grid;place-items:center;background:rgba(255,92,138,.14);color:var(--coral)}.pvpn-ic svg{width:30px;height:30px} .pvpn-bad{background:rgba(229,57,53,.12);border:1.5px solid #e53935;color:#e53935;border-radius:12px;padding:10px 12px;font-size:13.5px;line-height:1.8;font-weight:700;margin:4px 0 12px}.pvpn-bad.shk{animation:trmShake .4s} .pvpn-tx{font-size:14px;line-height:1.9;color:var(--ink,#3a2233);margin:0 0 16px} .trm-note{display:grid;gap:4px;text-align:right;background:linear-gradient(135deg,#fff4e0,#ffe9ef);border:1px solid rgba(255,140,60,.35);border-radius:14px;padding:11px 13px;margin:2px 0 10px;font-size:12.8px;line-height:1.8;color:#5a3a2a}.trm-note b{font-size:13.5px;color:#c2410c} .trm-acc{align-items:flex-start;text-align:right;line-height:1.8}.trm-acc span{display:grid;gap:3px}.trm-acc b{font-size:12.8px}.trm-acc small{font-size:11.5px;opacity:.85;font-weight:600} .ev-about{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;background:#fff;border:1px solid rgba(255,92,138,.28);border-radius:14px;padding:13px 14px;font:inherit;font-size:14px;font-weight:800;color:var(--ink,#3a2233);cursor:pointer;text-align:right} .trm-link{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;background:#fff;border:1px solid rgba(255,92,138,.28);border-radius:14px;padding:12px 14px;margin:0 0 10px;font:inherit;font-size:14px;color:var(--ink,#3a2233);cursor:pointer;text-align:right} .trm-link svg{width:18px;height:18px;color:var(--coral);flex-shrink:0} .trm-st{display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;border-radius:12px;padding:8px 10px;margin:0 0 14px;line-height:1.6} .trm-st.ok{background:rgba(46,170,110,.12);color:#1f7a50}.trm-st.no{background:rgba(255,92,138,.10);color:#a8335a} .trm-st svg{width:16px;height:16px;flex-shrink:0} .trm-biz{background:#fff;border:1px solid rgba(255,92,138,.22);border-radius:12px;padding:10px 12px;font-size:12.5px;line-height:1.9;margin:0 0 10px;white-space:pre-line;color:var(--ink,#3a2233)} .trm-body{max-height:38vh;overflow-y:auto;background:#fff;border-radius:12px;padding:12px 14px;font-size:13px;line-height:2;white-space:pre-line;text-align:right;color:var(--ink,#3a2233);border:1px solid rgba(255,92,138,.18);overscroll-behavior:contain} .trm-chk{display:flex;gap:10px;align-items:flex-start;margin:12px 0 8px;padding:10px 12px;font-size:13px;line-height:1.8;text-align:right;color:var(--ink,#3a2233);cursor:pointer;background:#fff;border:2px dashed var(--coral,#e0457b);border-radius:14px;animation:trmPulse 1.6s ease-in-out infinite} .trm-chk.ok{border-style:solid;border-color:#2eaa6e;background:rgba(46,170,110,.08);animation:none} .trm-chk.err{border-style:solid;border-color:#c0304f;background:#fff1f3;animation:trmShake .45s} .trm-chk input{width:24px;height:24px;margin-top:2px;flex-shrink:0;accent-color:#2eaa6e} .trm-hint{display:block;font-size:11.5px;font-weight:800;color:var(--coral,#e0457b);margin-bottom:2px} .trm-chk.ok .trm-hint{color:#1f7a50} .trm-err{color:#c0304f;font-size:13px;font-weight:700;margin:0 0 8px;text-align:center;display:none} .trm-err.on{display:block} @keyframes trmPulse{0%,100%{box-shadow:0 0 0 0 rgba(224,69,123,.35)}50%{box-shadow:0 0 0 6px rgba(224,69,123,0)}} @keyframes trmShake{0%,100%{transform:none}20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}} .fsheet{position:relative;width:100%;max-width:360px;max-height:92%;overflow-y:auto;background:linear-gradient(180deg,var(--cream),var(--blush)); border-radius:26px;padding:20px 20px 22px;box-shadow:var(--shadow);animation:pop .3s cubic-bezier(.2,.9,.3,1) both} @keyframes pop{from{opacity:0;transform:scale(.92) translateY(10px)}to{opacity:1;transform:none}} .fsheet h2{text-align:center;font-size:20px;margin:2px 0 10px} .fback{position:absolute;top:16px;inset-inline-end:16px;width:34px;height:34px;border-radius:11px;border:1.5px solid var(--line);background:var(--glass);display:grid;place-items:center;cursor:pointer;color:var(--plum)} .fback svg{width:17px;height:17px} html[dir="ltr"] .fback svg{transform:scaleX(-1)} .fx{position:absolute;top:16px;inset-inline-start:16px;width:34px;height:34px;border-radius:11px;border:1.5px solid var(--line);background:var(--glass);display:grid;place-items:center;cursor:pointer;color:var(--plum)} .frow{display:flex;align-items:center;justify-content:space-between;padding:11px 2px;border-bottom:1px solid var(--line)} .frow .lbl{font-weight:600;color:var(--plum);font-size:14px} .fblock{padding:12px 2px 6px;border-bottom:1px solid var(--line)} .fblock .lbl{font-weight:600;color:var(--plum);font-size:14px;display:block;margin-bottom:10px} .agerow{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-soft);margin-bottom:7px} .agerow b{font-family:var(--font-display);color:var(--coral);font-size:17px} .fsheet .field label{font-size:12px;margin-bottom:6px} .fsheet .ctrl{padding:12px 14px;font-size:16px} /* ===== فیلترِ جست‌وجو (طراحیِ جدید) ===== */ .flt{padding:20px 18px 18px!important} .flt-head{display:flex;flex-direction:column;align-items:center;gap:8px;margin:0 0 16px} .flt-badge{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;color:#fff;background:var(--grad);box-shadow:0 10px 22px -12px var(--coral)} .flt-badge svg{width:24px;height:24px} .flt-head h2{margin:0!important} .fsheet.flt .flt-help{position:absolute;top:16px;inset-inline-start:auto;inset-inline-end:16px;width:34px;height:34px;border-radius:11px;border:1px solid var(--line,#e6d9ee);background:var(--glass-strong,#fff);color:var(--plum,#6b3fa0);font:inherit;font-weight:900;font-size:15px;cursor:pointer;display:grid;place-items:center;z-index:2;padding:0;margin:0} .flt-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px} .ftile{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:13px 12px;border-radius:18px; background:var(--glass-strong,#fff);border:1.5px solid var(--line);cursor:pointer;transition:background .2s,border-color .2s,transform .12s;-webkit-tap-highlight-color:transparent} .ftile:active{transform:scale(.97)} .ftile input{position:absolute;opacity:0;pointer-events:none} .ft-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;color:var(--coral);background:color-mix(in srgb,var(--coral) 12%,transparent)} .ft-ic svg{width:19px;height:19px} .ft-dot{width:11px;height:11px;border-radius:50%;background:#2ecc71;box-shadow:0 0 0 4px rgba(46,204,113,.2)} .ft-t{font-size:12.5px;font-weight:700;line-height:1.6;color:var(--plum)} .ft-ck{position:absolute;top:10px;inset-inline-end:10px;width:20px;height:20px;border-radius:50%;border:1.8px solid var(--line);transition:.2s} .ftile:has(input:checked){background:var(--grad);border-color:transparent;box-shadow:0 12px 24px -16px var(--coral)} .ftile:has(input:checked) .ft-t{color:#fff} .ftile:has(input:checked) .ft-ic{background:rgba(255,255,255,.22);color:#fff} .ftile:has(input:checked) .ft-ck{border-color:#fff;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2322a06b' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/13px no-repeat} .flt-card{background:var(--glass-strong,#fff);border:1.5px solid var(--line);border-radius:20px;padding:14px 14px 12px;margin-bottom:12px} .flt-card .field{margin-bottom:10px} .flt-card .two .field{margin-bottom:0} .flt-card .field label{font-size:12px;font-weight:700;color:var(--ink-soft);margin:0 4px 6px} .flt-card select.ctrl{-webkit-appearance:none;appearance:none;border-radius:14px!important;padding:11px 14px!important;font-size:15px!important; background:var(--cream,#fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat;background-size:15px;background-position:left 12px center} html[dir="ltr"] .flt-card select.ctrl{background-position:right 12px center} .flt-ch{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px} .flt-ch .lbl{font-weight:700;color:var(--plum);font-size:14px} .age-big{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:color-mix(in srgb,var(--coral) 12%,transparent)} .age-big b{font-family:var(--font-display);font-size:18px;color:var(--coral);min-width:22px;text-align:center} .age-big i{font-style:normal;color:var(--ink-soft);font-size:12px} .dual{position:relative;height:30px;margin:0 4px} .dual-track,.dual-fill{position:absolute;top:50%;height:6px;margin-top:-3px;border-radius:999px} .dual-track{inset-inline:0;background:var(--line)} .dual-fill{background:var(--grad)} .dual input[type=range]{position:absolute;inset:0;width:100%;height:30px;margin:0;background:transparent!important;pointer-events:none;-webkit-appearance:none;appearance:none} .dual input[type=range]::-webkit-slider-runnable-track{background:transparent;height:30px} .dual input[type=range]::-moz-range-track{background:transparent} .dual input[type=range]::-webkit-slider-thumb{pointer-events:auto;-webkit-appearance:none;width:26px;height:26px;margin-top:2px;border-radius:50%;background:#fff;border:3px solid var(--coral);box-shadow:0 4px 12px -4px rgba(0,0,0,.35);cursor:grab;animation:none!important} .dual input[type=range]::-moz-range-thumb{pointer-events:auto;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--coral);cursor:grab} .dual input[type=range]:active::-webkit-slider-thumb{transform:scale(1.12);cursor:grabbing} .age-pre{display:flex;gap:6px;margin-top:12px} .age-pre button{flex:1;border:1.5px solid var(--line);background:transparent;color:var(--plum);font:inherit;font-size:12.5px;font-weight:700;padding:7px 0;border-radius:12px;cursor:pointer;transition:.15s} .age-pre button.on{background:var(--grad);color:#fff;border-color:transparent} .flt-apply{display:flex!important;align-items:center;justify-content:center;gap:8px;margin-top:4px} .flt-apply svg{width:18px;height:18px} .flt-reset{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:10px;padding:8px;border:0;background:none;color:var(--ink-soft);font:inherit;font-size:13px;font-weight:700;cursor:pointer} .flt-reset svg{width:15px;height:15px} .switch{position:relative;width:46px;height:27px;flex:none;cursor:pointer} .switch input{position:absolute;opacity:0;width:0;height:0} .switch .track{position:absolute;inset:0;background:var(--line);border-radius:999px;transition:.2s} .switch .track::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:21px;height:21px;border-radius:50%;background:#fff;box-shadow:var(--shadow-sm);transition:.2s} .switch input:checked+.track{background:var(--grad)} .switch input:checked+.track::after{inset-inline-start:22px} /* tabs + bottom nav */ .tab{display:none;flex:1;flex-direction:column;overflow:hidden;position:relative}.tab.on{display:flex} .tab-head{display:flex;align-items:center;justify-content:space-between;padding:58px 22px 10px;flex:none} /* z-index + لایهٔ جدا: در iOS لیستِ اسکرول‌شونده (لایهٔ کامپوزیت) روی دکمهٔ چت می‌افتاد و رنگش پریده دیده می‌شد */ .navbar{position:relative;z-index:30;transform:translateZ(0);flex:none;margin:0 14px calc(14px + env(safe-area-inset-bottom))} .nav{position:relative;display:flex;align-items:flex-end;justify-content:space-around; background:var(--grad-plum);border-radius:28px;padding:13px 8px 12px; -webkit-mask:radial-gradient(circle 36px at 50% 0,transparent 35px,#000 36px); mask:radial-gradient(circle 36px at 50% 0,transparent 35px,#000 36px); box-shadow:0 16px 36px -14px rgba(91,35,72,.55)} .navItem{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px; color:rgba(255,255,255,.55);font:inherit;font-size:11px;font-weight:600;padding:2px 4px;flex:1} .navItem svg{width:23px;height:23px} .navItem.on{color:#fff} .navItem .ul{width:16px;height:3px;border-radius:3px;background:transparent;margin-top:2px} .navItem.on .ul{background:var(--grad)} .navspace{flex:1} body.soc-on .nav .navItem,body.soc-on .nav .navspace{flex:1 1 0;min-width:0}body.soc-on .nav .navItem{font-size:10.5px;white-space:nowrap;overflow:hidden} body.soc-on .nav .navspace{flex:0 0 74px} /* ۵ دکمهٔ هم‌اندازه؛ دکمهٔ گردِ چت بینِ دکمهٔ ۳ و ۴ (کمی چپ‌تر از وسط) و بریدگیِ نوار هم همان‌جا */ body.soc-on .navbar .fab{left:calc(40% + 9px)} body.soc-on .nav{-webkit-mask:radial-gradient(circle 36px at calc(40% + 9px) 0,transparent 35px,#000 36px);mask:radial-gradient(circle 36px at calc(40% + 9px) 0,transparent 35px,#000 36px)} /* با اکسپلور ۳ دکمه سمتِ راست است: «جستجو کاربر» کوتاه می‌شود تا برچسب‌ها به هم نچسبند */ body.soc-on #nav-nearby [data-i18n="nav_nearby"]{display:none}#nav-nearby .nb-short{display:none}body.soc-on #nav-nearby .nb-short{display:inline!important} #nav-social{display:none}body.soc-on #nav-social{display:flex} #nav-vids{display:none}body.vid-on #nav-vids{display:flex}body.vid-on #nav-social{display:none!important} body.vid-on .nav .navItem,body.vid-on .nav .navspace{flex:1 1 0;min-width:0}body.vid-on .nav .navItem{font-size:10.5px;white-space:nowrap;overflow:hidden} body.vid-on .nav .navspace{flex:0 0 74px} body.vid-on .navbar .fab{left:calc(40% + 9px)} body.vid-on .nav{-webkit-mask:radial-gradient(circle 36px at calc(40% + 9px) 0,transparent 35px,#000 36px);mask:radial-gradient(circle 36px at calc(40% + 9px) 0,transparent 35px,#000 36px)} body.vid-on #nav-nearby [data-i18n="nav_nearby"]{display:none}body.vid-on #nav-nearby .nb-short{display:inline!important} .fab{position:absolute;left:50%;top:-22px;transform:translateX(-50%);width:58px;height:58px;border-radius:50%; border:4px solid var(--cream);cursor:pointer;background:var(--grad); display:grid;place-items:center;color:#fff;box-shadow:0 14px 28px -8px rgba(255,92,138,.7);transition:transform .14s} .fab:active{transform:translateX(-50%) scale(.92)} .fab svg{width:26px;height:26px} .ngrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:6px 18px 24px} .ncard{border-radius:22px;overflow:hidden;background:#fff;box-shadow:var(--shadow-sm);border:1px solid var(--line);cursor:pointer;transition:transform .12s;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none} .ncard:active{transform:scale(.97)} .pv-bg{position:absolute;inset:0;z-index:80;background:var(--cream);display:flex;flex-direction:column;overflow-y:auto; transform:translateY(100%);transition:transform .34s cubic-bezier(.2,.9,.3,1);visibility:hidden} .pv-bg.on{transform:none;visibility:visible} .pv-photo{position:relative;height:56%;min-height:340px;flex:none;overflow:hidden} .pv-portrait,.pv-portrait .portrait{position:absolute;inset:0;width:100%;height:100%} .pv-mainimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1} .pv-thumbs{display:flex;justify-content:center;align-items:center;gap:12px;margin:-44px 0 18px;position:relative;z-index:5} .pv-thumbs:empty{display:none} .pv-thumb{width:58px;height:58px;border-radius:50%;overflow:hidden;border:3px solid #fff;cursor:pointer;padding:0;background:#eee; box-shadow:0 10px 22px -8px rgba(91,35,72,.5);transition:transform .2s,box-shadow .2s;flex:none} .pv-thumb img{width:100%;height:100%;object-fit:cover;display:block} .pv-thumb.on{width:72px;height:72px;border-color:var(--coral);box-shadow:0 0 0 3px rgba(255,92,138,.25),0 14px 26px -8px rgba(255,92,138,.6);transform:translateY(-4px)} .pv-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(24,6,20,.55))} .pv-back{position:absolute;top:calc(30px + env(safe-area-inset-top,0px));inset-inline-start:18px;z-index:3;width:42px;height:42px;border-radius:14px;border:none;cursor:pointer; background:rgba(255,255,255,.85);backdrop-filter:blur(8px);color:var(--plum);display:grid;place-items:center;box-shadow:var(--shadow-sm)} .pv-back svg{transform:scaleX(1)} #pvStatus{top:calc(38px + env(safe-area-inset-top,0px));inset-inline-end:20px;inset-inline-start:auto; backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)} .pv-cap{position:absolute;bottom:44px;inset-inline-start:22px;inset-inline-end:22px;z-index:3;color:#fff} .pv-name{font-family:var(--font-display);font-weight:600;font-size:30px;line-height:1.05} .pv-city{display:flex;align-items:center;gap:6px;font-size:15px;margin-top:8px;opacity:.95} .pv-body{position:relative;z-index:4;margin-top:-28px;background:var(--cream);border-radius:30px 30px 0 0; padding:30px 22px calc(120px + env(safe-area-inset-bottom));flex:1 0 auto;box-shadow:0 -10px 30px -18px rgba(91,35,72,.5)} /* نوارِ ابزارِ سافاری/کروم ته صفحه را می‌پوشاند؛ فضای کافی تا آخرین دکمه همیشه قابلِ اسکرول و دیدن باشد */ .pv-bg{-webkit-overflow-scrolling:touch;overscroll-behavior:contain} .pv-stitle{font-weight:800;color:var(--plum);font-size:13px;letter-spacing:.04em;text-transform:uppercase;opacity:.85;margin-bottom:14px} .pv-tags{display:flex;flex-wrap:wrap;gap:10px} .pv-chip{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#ffffff,#fff4f6); border:1px solid rgba(255,92,138,.22);color:var(--plum);font-size:13.5px;font-weight:700;padding:11px 16px;border-radius:15px; box-shadow:0 6px 16px -10px rgba(91,35,72,.45)} .pv-chip svg{width:16px;height:16px;color:var(--coral)} .pv-actions{display:flex;align-items:center;gap:12px;margin-top:26px} .pv-act{height:54px;border-radius:18px;border:none;cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-sm);transition:transform .12s} .pv-act:active{transform:scale(.94)} .pv-act svg{width:24px;height:24px} .pv-act.star{width:54px;background:#fff;color:var(--lavender);border:1px solid var(--line)} .pv-act.like{width:54px;background:#fff;color:var(--coral);border:1px solid var(--line)} .pv-act.msg{flex:1;background:var(--grad);color:#fff;font:inherit;font-weight:700;font-size:15px;gap:8px;display:flex;align-items:center;justify-content:center} .pv-block{margin-top:14px;width:100%;height:48px;border-radius:16px;border:1.5px solid #ecc0cf;background:#fff;color:#d8456a; font:inherit;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:transform .12s} .pv-block:active{transform:scale(.97)} .pv-block svg{width:18px;height:18px} .pv-block.on{background:#fceef2;border-color:#f0a8bd} /* ===== پروفایل — ظاهرِ تازه ===== */ .pv-mini{display:flex;gap:10px;margin-top:14px} .pv-mini .pv-block{flex:1;min-width:0;margin-top:0;height:46px;border-radius:15px;font-size:13px;gap:7px;border:1.5px solid rgba(216,69,106,.22); background:linear-gradient(135deg,#fff,#fff6f8);box-shadow:0 6px 16px -12px rgba(216,69,106,.6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 10px} .pv-mini .pv-block span{overflow:hidden;text-overflow:ellipsis} .pv-mini .pv-rep{color:#b0627a;border-color:rgba(176,98,122,.2);background:linear-gradient(135deg,#fff,#faf6f8)} .pv-mini .pv-block svg{width:17px;height:17px;flex:none} .pv-body::before{content:"";position:absolute;top:10px;left:50%;width:42px;height:5px;margin-left:-21px;border-radius:9px;background:rgba(0,0,0,.10)} .pv-photo::after{background:linear-gradient(180deg,rgba(0,0,0,.18) 0,transparent 22%,transparent 48%,rgba(20,6,18,.72) 100%)} .pv-name{text-shadow:0 4px 18px rgba(0,0,0,.35);letter-spacing:-.01em} .pv-city{display:inline-flex;padding:6px 12px 6px 10px;border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.22)} .pv-chip{opacity:0;animation:pvChipIn .42s cubic-bezier(.2,.9,.3,1.25) forwards} .pv-chip:nth-child(1){animation-delay:.05s}.pv-chip:nth-child(2){animation-delay:.1s}.pv-chip:nth-child(3){animation-delay:.15s} .pv-chip:nth-child(4){animation-delay:.2s}.pv-chip:nth-child(5){animation-delay:.25s}.pv-chip:nth-child(6){animation-delay:.3s} .pv-chip:nth-child(n+7){animation-delay:.35s} @keyframes pvChipIn{from{opacity:0;transform:translateY(10px) scale(.92)}to{opacity:1;transform:none}} .pv-act.msg{position:relative;overflow:hidden;box-shadow:0 14px 28px -14px var(--coral)} .pv-act.msg::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg);animation:pvShine 3.2s ease-in-out 1s infinite} @keyframes pvShine{0%{left:-60%}35%,100%{left:130%}} .pv-act.like svg{animation:pvBeat 2.4s ease-in-out .6s infinite} @keyframes pvBeat{0%,100%{transform:scale(1)}8%{transform:scale(1.18)}16%{transform:scale(.96)}24%{transform:scale(1.1)}34%{transform:scale(1)}} .pv-bg.on .pv-cap{animation:pvCapIn .5s cubic-bezier(.2,.9,.3,1) .1s both} @keyframes pvCapIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}} @media (prefers-reduced-motion:reduce){.pv-chip,.pv-bg.on .pv-cap{animation:none;opacity:1}.pv-act.msg::after,.pv-act.like svg{animation:none}} .blockedview .pv-act.msg{background:#ddd2da;color:#fff;opacity:.7} .segwrap{display:flex;gap:8px;padding:4px 18px 12px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none} .segwrap::-webkit-scrollbar{display:none} .chsearch{display:flex;align-items:center;gap:9px;margin:12px 18px 4px;padding:11px 14px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm)} .chsearch svg{width:18px;height:18px;color:var(--ink-soft);flex:none} .chsearch input{flex:1;border:none;outline:none;background:none;font:inherit;font-size:16px;color:var(--ink);text-align:start} .chats-hero{flex:none;background:linear-gradient(135deg,#5B2348,#7E3A78 55%,#B49BF0);padding:56px 20px 18px;border-radius:0 0 28px 28px;box-shadow:0 16px 34px -18px rgba(91,35,72,.6);color:#fff} .chats-htop{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px} .chats-title{font-family:var(--font-display);font-weight:600;font-size:25px;color:#fff} .chats-srch{width:40px;height:40px;border-radius:50%;border:none;cursor:pointer;background:rgba(255,255,255,.18);color:#fff;display:grid;place-items:center;transition:transform .12s} .chats-srch:active{transform:scale(.9)}.chats-srch svg{width:19px;height:19px} .pin-strip{display:flex;gap:14px;overflow-x:auto;padding:2px 0;-webkit-overflow-scrolling:touch;scrollbar-width:none} .pin-strip::-webkit-scrollbar{display:none} .pin-empty{color:rgba(255,255,255,.82);font-size:12.5px;font-weight:600;padding:12px 2px} .pin-item{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;width:62px} .pin-item:active{transform:scale(.95)} .pin-ringwrap{position:relative;width:56px;height:56px} .pin-ring{position:absolute;inset:0;border-radius:50%;padding:3px;background:conic-gradient(from 0deg,#FFC06A,#FF5C8A,#B49BF0,#43C6AC,#FFC06A);animation:pinspin 4s linear infinite} @keyframes pinspin{to{transform:rotate(360deg)}} .pin-av{position:absolute;inset:3px;border-radius:50%;overflow:hidden;background:#fff;animation:pinspin 4s linear infinite reverse} .pin-av .portrait{position:absolute;inset:0;width:100%;height:100%} .pin-pdot{position:absolute;bottom:1px;inset-inline-end:1px;width:13px;height:13px;border-radius:50%;background:var(--online);border:2.5px solid #fff;z-index:3} .pin-name{font-size:11.5px;font-weight:700;color:#fff;max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .chatwrap{padding:14px 16px 20px} .ch-chips{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 12px;scrollbar-width:none}.ch-chips::-webkit-scrollbar{display:none} .ch-chip{flex:none;border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 14px;font:inherit;font-size:13px;font-weight:700;cursor:pointer;color:inherit} .ch-chip.on{background:linear-gradient(135deg,#ff4d8d,#c13584);color:#fff;border-color:transparent}.ch-chip i{font-style:normal;opacity:.85;margin-inline-start:3px} .ch-grp{font-size:12px;font-weight:800;opacity:.55;padding:6px 4px 8px} .ch-nm{margin-bottom:12px}.ch-nmh{font-size:13px;font-weight:800;padding:0 4px 8px} .ch-nmr{display:flex;gap:14px;overflow-x:auto;padding:2px 4px 6px;scrollbar-width:none}.ch-nmr::-webkit-scrollbar{display:none} .ch-nmi{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:0;font:inherit;color:inherit;cursor:pointer;width:68px} .ch-nmi .av{width:58px;height:58px;display:block;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2.5px #ff4d8d} .ch-nmi b{font-size:12px;max-width:68px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ch-nmi em{font-style:normal;font-size:10px;opacity:.6} .ch-wait{display:inline-block;margin-top:5px;font-size:11px;font-weight:700;color:#c13584;background:rgba(193,53,132,.1);border-radius:8px;padding:2px 8px} .ch-ice{margin-top:5px;font:inherit;font-size:11px;font-weight:700;color:#3b82c4;background:rgba(59,130,196,.1);border:0;border-radius:8px;padding:3px 9px;cursor:pointer} @keyframes chIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.ch-in{animation:chIn .32s ease both} .chatrow{display:flex;align-items:center;gap:13px;padding:12px 13px;border-radius:18px;cursor:pointer;background:#fff;border:1px solid var(--line);box-shadow:0 8px 22px -16px rgba(91,35,72,.45);margin-bottom:11px;transition:transform .12s} /* کشیدن برای حذف */ .chatswipe{position:relative;margin-bottom:11px;border-radius:18px;overflow:hidden} .chatswipe .chatrow{margin-bottom:0;position:relative;z-index:2;will-change:transform} .chatswipe-del{position:absolute;top:0;bottom:0;right:0;left:auto;width:76px;border:none;border-radius:18px; background:linear-gradient(135deg,#ff4d6d,#ff2e63);color:#fff;display:flex;align-items:center;justify-content:center; cursor:pointer;z-index:1;box-shadow:0 8px 20px -12px rgba(255,46,99,.7)} .chatswipe-del svg{width:24px;height:24px} .chatswipe.swiped .chatswipe-del{animation:delPop .25s ease} /* راهنمای یک‌بارهٔ «بکش برای حذف» */ .chatrow.hintnudge{animation:swipeHintNudge 2.2s cubic-bezier(.3,.9,.3,1) both} @keyframes swipeHintNudge{0%{transform:translateX(0)}18%{transform:translateX(-68px)}40%{transform:translateX(0)}58%{transform:translateX(-68px)}80%{transform:translateX(0)}100%{transform:translateX(0)}} /* راهنمای گفتگوها (کاربرِ تازه) */ .chat-tour{margin:6px 2px 18px;padding:15px 16px 13px;border-radius:20px;color:#fff;text-align:start; background:linear-gradient(135deg,#5b2a6e,#7b4bb5);box-shadow:0 18px 36px -18px rgba(90,40,140,.7);position:relative} .chat-tour::before{content:"";position:absolute;top:-7px;inset-inline-end:34px;width:14px;height:14px;background:#6a3a90;transform:rotate(45deg);border-radius:3px} .chat-tour.in{animation:ctIn .45s cubic-bezier(.2,.9,.3,1.2) both} @keyframes ctIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}} .ct-head{display:flex;align-items:center;gap:8px;font-size:15.5px} .ct-ic{font-size:20px}.ct-n{margin-inline-start:auto;font-size:12px;opacity:.7} .ct-d{font-size:13.5px;line-height:1.75;opacity:.92;margin:7px 0 12px} .ct-foot{display:flex;align-items:center;gap:8px} .ct-dots{display:flex;gap:5px;margin-inline-end:auto}.ct-dots i{width:6px;height:6px;border-radius:6px;background:rgba(255,255,255,.35);transition:width .3s} .ct-dots i.on{width:18px;background:#fff} .ct-skip{border:0;background:none;color:rgba(255,255,255,.75);font:inherit;font-size:13px;cursor:pointer;padding:6px} .ct-next{border:0;background:#fff;color:#5b2a6e;font:inherit;font-weight:700;font-size:13.5px;padding:8px 18px;border-radius:999px;cursor:pointer} /* هایلایتِ آموزش: زوم + حلقهٔ قرمزِ چشمک‌زن، تند تا چشم را بگیرد */ .tour-hl{position:relative;z-index:30;animation:tourZoom .75s ease-in-out infinite; outline:3px solid #ff2e55!important;outline-offset:3px;background-color:rgba(255,46,85,.22)!important} @keyframes tourZoom{ 0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,46,85,.95),0 0 18px 4px rgba(255,46,85,.55);outline-color:#ff2e55} 50%{transform:scale(1.32);box-shadow:0 0 0 12px rgba(255,46,85,0),0 0 26px 10px rgba(255,46,85,.75);outline-color:#ffd166}} .chats-srch.tour-hl{border-radius:50%;color:#fff} .flt-tiles.tour-hl,.flt-card.tour-hl,.flt-foot.tour-hl{animation:tourBlock .75s ease-in-out infinite;background-color:transparent!important} @keyframes tourBlock{0%,100%{transform:scale(1);outline-color:#ff2e55;box-shadow:0 0 0 0 rgba(255,46,85,.7)}50%{transform:scale(1.035);outline-color:#ffd166;box-shadow:0 0 22px 6px rgba(255,46,85,.45)}} .tour-finger{position:fixed;z-index:10060;font-size:30px;line-height:1;pointer-events:none;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35));animation:tourFinger .6s ease-in-out infinite alternate} @keyframes tourFinger{from{transform:translateY(0)}to{transform:translateY(-10px)}} @media (prefers-reduced-motion:reduce){.tour-hl,.tour-finger{animation:none}} .coach-pop{position:fixed;z-index:10050;padding:15px 16px 13px;border-radius:20px;color:#fff;text-align:start;direction:inherit; background:linear-gradient(135deg,#5b2a6e,#7b4bb5);box-shadow:0 22px 44px -16px rgba(40,10,70,.75);animation:ctIn .4s cubic-bezier(.2,.9,.3,1.2) both} [dir=rtl] .coach-pop,.coach-pop{font-family:inherit} .coach-pop::before{content:"";position:absolute;left:calc(var(--ax,50%) - 7px);width:14px;height:14px;background:#6a3a90;transform:rotate(45deg);border-radius:3px} .coach-pop.arr-up::before{top:-7px}.coach-pop.arr-down::before{bottom:-7px;background:#74449f} .filterbtn.tour-hl,.flt-tiles.tour-hl,.flt-card.tour-hl,.flt-foot.tour-hl{border-radius:16px} .chpin.tour-hl{border-radius:50%;color:#ff2e55!important} @keyframes delPop{0%{transform:scale(.6);opacity:.4}100%{transform:scale(1);opacity:1}} .chatrow:active{transform:scale(.99)} .chatrow.pinned{border-color:rgba(180,155,240,.55);background:linear-gradient(180deg,#fff,#f9f3ff)} .chpin{flex:none;width:32px;height:32px;border-radius:50%;border:none;background:none;cursor:pointer;color:#c9b8c4;display:grid;place-items:center} .chpin.on{color:var(--lavender)} .chpin svg{width:18px;height:18px} .chpin:active{transform:scale(.88)} .chats-acts{display:flex;align-items:center;gap:9px} .csel-bar{flex:none;display:flex;align-items:center;gap:10px;padding:11px 16px;background:#fff;border-bottom:1px solid var(--line)} .csel-allbtn{display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;font:inherit;font-weight:700;color:var(--plum);font-size:13.5px} .csel-allbtn .box{width:23px;height:23px;border-radius:7px;border:2px solid var(--line);display:grid;place-items:center;color:#fff;flex:none} .csel-allbtn .box svg{width:14px;height:14px;opacity:0} .csel-allbtn.on .box{background:var(--grad);border-color:transparent} .csel-allbtn.on .box svg{opacity:1} .csel-count{font-size:12.5px;color:var(--ink-soft);font-weight:700} .csel-spacer{flex:1} .csel-cancel{background:none;border:1.5px solid var(--line);border-radius:999px;padding:7px 16px;font:inherit;font-weight:700;color:var(--plum);font-size:13px;cursor:pointer} .csel-del{background:#fff;border:1.5px solid #ecc0cf;border-radius:999px;padding:7px 17px;font:inherit;font-weight:800;color:#d8456a;font-size:13px;cursor:pointer} .csel-del:disabled{opacity:.45;cursor:not-allowed} .csel-cancel:active,.csel-del:active{transform:scale(.96)} .csel-check{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);flex:none;display:grid;place-items:center;color:#fff;transition:.12s} .csel-check svg{width:14px;height:14px;opacity:0} .csel-check.on{background:var(--grad);border-color:transparent} .csel-check.on svg{opacity:1} .chatrow.sel{border-color:rgba(255,92,138,.5);background:linear-gradient(180deg,#fff,#fff5f8)} .chat-subtabs{flex:none;display:flex;gap:8px;padding:12px 16px 2px} .chsub{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;border-radius:14px;cursor:pointer;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);font:inherit;font-weight:700;font-size:13px;transition:.15s} .chsub.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 10px 22px -12px rgba(255,92,138,.7)} .chsub i{font-style:normal;font-size:11px;font-weight:800;min-width:18px;height:18px;padding:0 5px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:var(--line);color:var(--plum)} .chsub.on i{background:rgba(255,255,255,.3);color:#fff} /* سه‌تبِ منشأ گفتگو: تک‌خطی بماند */ #chatOriginTabs .chsub{font-size:12px;padding:9px 6px;gap:5px;white-space:nowrap} #chatOriginTabs .chsub i{min-width:16px;height:16px;font-size:10px} .chatrow.pend{flex-direction:column;align-items:stretch;gap:0;cursor:default} .pend-main{display:flex;align-items:center;gap:13px;width:100%;cursor:pointer} .pend-meta{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ink-soft);font-weight:600;margin:3px 0 1px} .pend-meta svg{width:13px;height:13px;flex:none;color:var(--coral)} .pend-acts{display:flex;gap:9px;margin-top:11px;padding-top:11px;border-top:1px solid var(--line)} .pend-yes,.pend-no{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:9px;border-radius:12px;font:inherit;font-weight:800;font-size:13px;cursor:pointer;border:1.5px solid var(--line);transition:transform .12s} .pend-yes{background:var(--grad);color:#fff;border-color:transparent} .pend-no{background:#fff;color:var(--ink-soft)} .pend-yes svg,.pend-no svg{width:15px;height:15px} .pend-yes:active,.pend-no:active{transform:scale(.96)} .req-card{margin:auto;width:100%;max-width:300px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px 16px;box-shadow:0 14px 30px -20px rgba(91,35,72,.5);animation:upFade .5s both} .req-av{width:88px;height:88px;border-radius:50%;overflow:hidden;margin:0 auto 10px;position:relative;box-shadow:0 0 0 3px #fff,0 0 0 5px #b49bf0} .req-av .portrait,.req-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} .req-nm{font-weight:800;font-size:17px}.req-sub{font-size:12.5px;opacity:.65;margin-top:3px} .req-cm{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:10px}.req-cm span{font-size:12px;font-weight:700;color:#7a4fd6;background:rgba(122,79,214,.1);border-radius:999px;padding:3px 10px} .req-pct{font-size:12px;font-weight:700;margin-top:7px;color:#7a4fd6}.req-bio{font-size:13px;opacity:.8;margin-top:10px;line-height:1.7} .req-warn{margin-top:12px;font-size:12.5px;font-weight:700;line-height:1.7;color:#b42342;background:rgba(220,38,70,.08);border-radius:12px;padding:9px 11px} .req-prof{margin-top:12px;font:inherit;font-size:13px;font-weight:700;color:#7a4fd6;background:none;border:1px solid rgba(122,79,214,.3);border-radius:12px;padding:7px 16px;cursor:pointer} .cp-day{text-align:center;margin:10px 0 6px}.cp-day span{font-size:11.5px;font-weight:700;opacity:.65;background:rgba(0,0,0,.05);border-radius:999px;padding:3px 12px} .cp-qr{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:12px 0 4px;animation:upFade .4s both} .cp-qr button{font:inherit;font-size:13px;font-weight:700;border:1px solid rgba(122,79,214,.3);background:#fff;color:#7a4fd6;border-radius:14px;padding:7px 13px;cursor:pointer} .cp-pend-btns .pend-rep{padding:9px 12px} .cp-msgs>.cp-msg+.cp-msg,.cp-msgs>*+.msg{margin-top:2px} .cp-pend{display:flex;align-items:center;gap:10px;padding:12px 14px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--cream)} .cp-pend-txt{flex:1;font-size:12.5px;color:var(--ink-soft);font-weight:600;line-height:1.6} .cp-pend-btns{display:flex;gap:8px;flex:none} .cp-pend-btns .pend-yes,.cp-pend-btns .pend-no{flex:none;padding:9px 16px} .chtxt{flex:1;min-width:0} .chtop{display:flex;align-items:center;justify-content:space-between;gap:8px} .chtop .nm2{font-weight:700;color:var(--plum);font-size:15px} .chtime{font-size:11.5px;color:var(--ink-soft);flex:none} .chbot{display:flex;align-items:center;gap:8px;margin-top:3px} .chprev{flex:1;min-width:0;font-size:13px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .chprev.b{color:var(--ink);font-weight:600} .unread{flex:none;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--grad); color:#fff;font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center} .cseg{flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 14px;border-radius:14px;cursor:pointer; border:1px solid var(--line);background:#fff;color:var(--ink-soft);font:inherit;font-size:12.5px;font-weight:700;white-space:nowrap;transition:.15s} .cseg i{font-style:normal;font-size:11px;font-weight:800;min-width:18px;height:18px;padding:0 5px;border-radius:999px; display:inline-flex;align-items:center;justify-content:center;background:var(--line);color:var(--plum)} .cseg.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 10px 22px -12px rgba(255,92,138,.8)} .cseg.on i{background:rgba(255,255,255,.3);color:#fff} .favrow{display:flex;align-items:center;gap:14px;padding:12px 8px;border-radius:18px;cursor:pointer;transition:background .12s} .favrow:active{background:var(--glass)} .avwrap{position:relative;flex:none} .av-dot{position:absolute;bottom:1px;inset-inline-end:1px;width:14px;height:14px;border-radius:50%;border:2.5px solid var(--cream);z-index:2} .av-dot.on{background:var(--online);animation:pulseDot 1.8s ease-out infinite}.av-dot.off{background:#cbb9c6} .frtxt{flex:1;min-width:0} .ubtn{margin-inline-start:auto;border:1.5px solid #ecc0cf;background:#fff;color:#d8456a;font:inherit;font-weight:700;font-size:12.5px; padding:7px 14px;border-radius:999px;cursor:pointer;flex:none} .ubtn:active{transform:scale(.95)} .vtime{margin-inline-start:auto;font-size:11.5px;color:var(--ink-soft);font-weight:600;white-space:nowrap;flex:none} .favwrap{padding:4px 18px 20px} .reveal-cta{display:flex;align-items:center;gap:13px;background:var(--grad-plum);color:#fff;border-radius:20px;padding:14px 16px;margin:2px 8px 14px;cursor:pointer;box-shadow:0 14px 30px -16px rgba(91,35,72,.7)} .reveal-cta:active{transform:scale(.99)} .reveal-cta .rc-ic{position:relative;width:46px;height:46px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(255,255,255,.15)} .reveal-cta .rc-ic svg{width:22px;height:22px} .reveal-cta .rc-badge{position:absolute;top:-3px;inset-inline-end:-3px;min-width:21px;height:21px;padding:0 5px;border-radius:999px;background:var(--grad);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;border:2px solid #3F1D37} .reveal-cta .rc-tx{flex:1;min-width:0} .reveal-cta .rc-t{font-weight:800;font-size:15px} .reveal-cta .rc-s{font-size:12.5px;opacity:.82;margin-top:2px} .reveal-cta .rc-go{width:20px;height:20px;flex:none;opacity:.8} [dir=rtl] .reveal-cta .rc-go{transform:scaleX(-1)} .favrow.locked{cursor:pointer} .favrow.locked .av{filter:blur(7px)} .favrow.locked .av-dot{filter:blur(4px)} .favrow.locked .nm2,.favrow.locked .lc{filter:blur(5px);user-select:none} .favrow.locked .lockpin{margin-inline-start:auto;color:var(--coral);flex:none} .favrow.locked .lockpin svg{width:20px;height:20px} .ncard-ph{position:relative;aspect-ratio:1/1;overflow:hidden} .ncard-ph .portrait{position:absolute;inset:0} .ncard-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(34,8,28,.28))} .nstatus{position:absolute;top:10px;inset-inline-start:10px;z-index:2;display:flex;align-items:center;gap:6px; color:#fff;font-size:11px;font-weight:700;padding:5px 10px;border-radius:999px;backdrop-filter:blur(6px)} .nstatus .ndot{width:7px;height:7px;border-radius:50%;flex:none} .nstatus.on{background:rgba(8,5,12,.42)} .nstatus.on .ndot{background:var(--online);animation:pulseDot 1.8s ease-out infinite} .nstatus.off{background:rgba(70,52,64,.5)} .nstatus.off .ndot{background:#c9b8c4} .crow.sending .cbubble{opacity:.55} /* وضعیتِ آنلاین/آفلاین — همه‌جا یکسان: آنلاین = متن و نقطهٔ سبزِ تپنده، آفلاین = متن و نقطهٔ خاکستری */ .cp-head .st{display:inline-flex;align-items:center;gap:6px} .cp-head .st .stdot{width:8px;height:8px;border-radius:50%;flex:none} .cp-head .st.on{color:#1fb573} .cp-head .st.on .stdot{background:#2fd48a;animation:pulseDot 1.8s ease-out infinite} .cp-head .st.off{color:#9aa3a0} .cp-head .st.off .stdot{background:#b9c0bd} .nstatus.on{color:#7ff2bd} .nstatus.on .ndot{background:#35e08f} .nstatus.off{color:#e3e6e5} .nstatus.off .ndot{background:#a9b0ad} .online:not(.off){color:#7ff2bd} .online.off{color:#e3e6e5} .online.off .dot{background:#a9b0ad} .ncard-info{padding:11px 13px 13px} .ncard-nm{font-family:var(--font-display);font-weight:600;color:var(--plum);font-size:17px;line-height:1.1} .ncard-lc{display:flex;align-items:center;gap:5px;color:var(--ink-soft);font-size:12.5px;margin-top:5px} .ncard-lc svg{width:13px;height:13px;flex:none} .avwrap .av{width:54px;height:54px;border-radius:50%;overflow:hidden;flex:none;position:relative;border:1.5px solid var(--line)} .favrow .nm2{font-weight:700;color:var(--plum);font-size:15px} .favrow .lc{font-size:13px;color:var(--ink-soft);margin-top:2px} .favrow .hb{margin-inline-start:auto;color:var(--coral)} /* ===== ارتباط‌ها و جستجو — ظاهرِ تازه ===== */ .favrow{background:rgba(255,255,255,.88);border:1px solid var(--line);padding:12px 14px;margin-bottom:10px;border-radius:20px; box-shadow:0 10px 24px -20px rgba(20,40,30,.55);opacity:0;animation:frIn .42s cubic-bezier(.2,.9,.3,1.15) forwards;transition:transform .12s,box-shadow .2s} .favrow:active{transform:scale(.975);background:#fff} .favwrap .favrow:nth-child(1){animation-delay:.02s}.favwrap .favrow:nth-child(2){animation-delay:.06s}.favwrap .favrow:nth-child(3){animation-delay:.1s} .favwrap .favrow:nth-child(4){animation-delay:.14s}.favwrap .favrow:nth-child(5){animation-delay:.18s}.favwrap .favrow:nth-child(6){animation-delay:.22s} .favwrap .favrow:nth-child(n+7){animation-delay:.26s} @keyframes frIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} .favrow .avwrap .av{border:none;box-shadow:0 0 0 2.5px #fff,0 0 0 4px rgba(0,0,0,.08)} .favrow.is-on .avwrap .av{box-shadow:0 0 0 2.5px #fff,0 0 0 4.5px #35e08f,0 6px 16px -6px rgba(53,224,143,.8)} .favrow .nm2{font-size:15.5px;font-weight:800} .favrow .lc{display:inline-flex;align-items:center;gap:4px;margin-top:5px;padding:3px 9px;border-radius:999px;background:rgba(0,0,0,.035);font-size:12.3px} .vtime{padding:6px 11px;border-radius:999px;background:rgba(65,201,142,.10);color:#2a8d62;font-size:11.5px;font-weight:700} .favrow .hb{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(65,201,142,.12);flex:none} .favrow .hb{padding:9px;box-sizing:border-box;animation:pvBeat 2.6s ease-in-out infinite} .ubtn{border:none!important;background:linear-gradient(135deg,#fff0f4,#ffe3ea)!important;box-shadow:0 6px 14px -10px rgba(216,69,106,.8);padding:9px 16px!important} .cseg{box-shadow:0 6px 16px -14px rgba(0,0,0,.5);transition:transform .15s,background .2s} .cseg:active{transform:scale(.95)} .ncard{border-radius:24px;border:none;box-shadow:0 14px 30px -22px rgba(20,40,30,.7);opacity:0;animation:frIn .45s cubic-bezier(.2,.9,.3,1.15) forwards;transition:transform .15s,box-shadow .2s} .ngrid .ncard:nth-child(1){animation-delay:.02s}.ngrid .ncard:nth-child(2){animation-delay:.07s}.ngrid .ncard:nth-child(3){animation-delay:.12s} .ngrid .ncard:nth-child(4){animation-delay:.17s}.ngrid .ncard:nth-child(n+5){animation-delay:.22s} .ncard.is-on{box-shadow:0 0 0 2px rgba(53,224,143,.85),0 14px 30px -18px rgba(53,224,143,.8)} .ncard-ph{border-radius:24px 24px 0 0} .ncard-ph::after{background:linear-gradient(180deg,rgba(0,0,0,.12) 0,transparent 26%,transparent 55%,rgba(20,6,18,.38))} .ncard-info{padding:11px 13px 14px} .ncard-nm{font-weight:800;font-size:16.5px} .ncard-lc{display:inline-flex;padding:3px 9px;border-radius:999px;background:rgba(0,0,0,.035);margin-top:7px} @media (prefers-reduced-motion:reduce){.favrow,.ncard{animation:none;opacity:1}.favrow .hb{animation:none}} .empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:30px;text-align:center;color:var(--ink-soft)} .empty-state svg{width:54px;height:54px;color:var(--coral);opacity:.5} .empty-state h2{font-size:22px;margin-bottom:2px} .pf{padding:0 24px 24px;text-align:center} .pf-av{width:96px;height:96px;border-radius:50%;margin:10px auto 14px;display:grid;place-items:center;color:#fff;font-weight:700;font-size:34px;background:var(--grad);box-shadow:var(--shadow);overflow:hidden} .pf-avwrap{position:relative;width:96px;margin:10px auto 14px;cursor:pointer} .pf-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:14px 0 4px} .pf-btns .pf-edit{margin:0} .pf-avwrap .pf-av{margin:0} .pf-avwrap:active{transform:scale(.97)} .pf-thumbs{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin:14px 0 4px} .pf-thumbs .pv-thumb{width:52px;height:52px} .pf-thumbs .pv-thumb.on{width:62px;height:62px;transform:none} .ph-hint{background:rgba(85,185,138,.12);border:1px solid rgba(85,185,138,.35);color:#1f5a3f;border-radius:14px;padding:10px 12px;font-weight:700;line-height:1.8} .ph-e{font-size:17px;margin-inline-end:6px;vertical-align:-2px} .pfx-chip:has(.ph-e){display:inline-flex;align-items:center;padding:9px 14px;border-radius:16px;font-weight:700;transition:transform .12s} .pfx-chip:has(.ph-e):active{transform:scale(.95)} .pfx-chip.on:has(.ph-e){box-shadow:0 8px 18px -10px var(--coral);transform:translateY(-1px)} .ab-pg{font-size:12px;font-weight:800;color:var(--ink-soft,#9a8a96);margin:10px 2px 6px} .cn-ph{display:grid;gap:8px;font-weight:700}.cn-phb{border:0;border-radius:14px;padding:11px 14px;background:var(--grad);color:#fff;font:inherit;font-size:13.5px;font-weight:800;cursor:pointer;box-shadow:0 10px 22px -12px var(--coral)}.cn-phb:active{transform:scale(.97)} .pf-upbtn{display:inline-flex;align-items:center;gap:7px;margin:10px auto 2px;padding:8px 16px;border:0;border-radius:999px;background:linear-gradient(135deg,#55b98a,#74d692);color:#fff;font:inherit;font-size:13px;font-weight:800;cursor:pointer;box-shadow:0 6px 16px rgba(85,185,138,.3)} .pf-upbtn svg{width:16px;height:16px} .pf-cam{position:absolute;bottom:2px;inset-inline-end:-2px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center; background:var(--grad);color:#fff;border:3px solid var(--cream);box-shadow:var(--shadow-sm)} .pf-cam svg{width:15px;height:15px} .pf-av img{width:100%;height:100%;object-fit:cover} .pf-edit{display:flex;align-items:center;gap:8px;margin:14px auto 4px;padding:10px 18px;border-radius:999px;cursor:pointer; border:1.5px solid var(--line);background:#fff;color:var(--plum);font:inherit;font-weight:700;font-size:14px;box-shadow:var(--shadow-sm)} .pf-edit svg{width:17px;height:17px} .pf-edit:active{transform:scale(.97)} .ev-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 8px;flex:none} .ev-title{font-family:var(--font-display);font-weight:600;color:var(--plum);font-size:20px} .ev-body{padding:8px 22px calc(110px + env(safe-area-inset-bottom));overflow-y:auto;flex:1} .ev-hint{color:var(--ink-soft);font-size:13px;margin-bottom:14px} .ev-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px} .ev2col{display:flex;gap:12px;align-items:flex-start} #editView .field{margin-bottom:14px} #editView .field label{margin-bottom:10px} #editView .ev2col .field label{min-height:18px} .ev2col .field{flex:1} .lock-lbl{display:flex;align-items:center;gap:5px} .lock-lbl svg{width:13px;height:13px;color:var(--ink-soft)} .seg.locked{opacity:.9;pointer-events:none} .seg.locked .opt{background:#f4eef1;border-color:var(--line)} .locked-field{background:#f4eef1;color:var(--ink-soft);cursor:not-allowed} .evval{font-family:var(--font-display);color:var(--coral);font-size:16px} #editView .igrid{margin-top:4px} .evphoto{position:relative;aspect-ratio:1/1;border-radius:18px;overflow:hidden;cursor:pointer;border:2px solid transparent;box-shadow:var(--shadow-sm)} .evphoto img{width:100%;height:100%;object-fit:cover} .evphoto.main{border-color:var(--coral)} .evmain{position:absolute;bottom:0;inset-inline-start:0;inset-inline-end:0;display:flex;align-items:center;justify-content:center;gap:5px; background:var(--grad);color:#fff;font-size:11px;font-weight:700;padding:5px 4px} .evmain svg{width:12px;height:12px} .evdel{position:absolute;top:6px;inset-inline-end:6px;width:28px;height:28px;border-radius:50%;border:none;cursor:pointer;z-index:6; background:linear-gradient(135deg,#fb7185,#e11d48);color:#fff;display:grid;place-items:center;box-shadow:0 4px 12px -3px rgba(225,29,72,.6)} .evdel:active{transform:scale(.9)} .evdel svg{width:15px;height:15px} .evadd{aspect-ratio:1/1;border-radius:18px;border:2px dashed var(--coral);background:rgba(255,92,138,.06);color:var(--coral); display:grid;place-items:center;cursor:pointer} .evadd svg{width:30px;height:30px} .evadd:active{transform:scale(.96)} .pf h2{font-size:24px}.pf .loc{color:var(--ink-soft);font-size:14px;margin-top:5px;display:flex;gap:6px;justify-content:center;align-items:center} .pf-row{display:flex;gap:10px;margin:20px 0} .pf-stat{flex:1;background:var(--glass-strong);border:1px solid var(--line);border-radius:18px;padding:14px 8px} .pf-stat .n{font-family:var(--font-display);font-size:20px;color:var(--coral);font-weight:600} .pf-stat .l{font-size:11px;color:var(--ink-soft);margin-top:3px} .pf-label{text-align:start;font-size:13px;font-weight:700;color:var(--plum);margin:6px 4px 10px} .pf-int{display:flex;flex-wrap:wrap;gap:8px} .pf-int .chip{background:rgba(255,92,138,.1);border:1px solid var(--line);color:var(--coral);padding:8px 14px;border-radius:999px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:7px} .pf-int .chip svg{width:16px;height:16px} /* featured user ads — premium carousel */ .adswrap{padding:2px 16px 6px} /* ===== بنرِ بوست/اسپات‌لایت (تبلیغ) ===== */ .boostbar{position:relative;border-radius:20px;padding:11px 11px 10px;overflow:hidden; background:linear-gradient(135deg,var(--coral),var(--coral-2)); box-shadow:0 16px 34px -18px var(--coral)} .boostbar::after{content:"";position:absolute;top:-40%;inset-inline-start:-15%;width:60%;height:180%;background:radial-gradient(circle,rgba(255,255,255,.26),transparent 70%);pointer-events:none} .boost-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px;position:relative;z-index:1} .boost-badge{display:inline-flex;align-items:center;gap:7px;font-weight:900;font-size:14.5px;color:#fff;letter-spacing:.4px} .boost-badge .spk{width:15px;height:15px;color:var(--gold);animation:spkTw 2.4s ease-in-out infinite} @keyframes spkTw{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(1.25) rotate(16deg)}} .boost-all{font-size:12.5px;font-weight:800;color:#fff;opacity:.95;cursor:pointer} .boost-all:active{opacity:.7} .ad-viewport{overflow:hidden;border-radius:15px;position:relative;z-index:1} .ad-slides{display:flex;direction:ltr;transition:transform .6s cubic-bezier(.65,0,.2,1)} .ad-slide{flex:0 0 100%;display:grid;grid-template-columns:1fr 1fr;gap:10px;direction:rtl} .ad-card{position:relative;aspect-ratio:1/0.8;border-radius:14px;overflow:hidden;cursor:pointer;box-shadow:0 10px 22px -12px rgba(0,0,0,.5);transition:transform .15s;background:#e9e0ea} .ad-card:active{transform:scale(.97)} .ad-empty{visibility:hidden;box-shadow:none} .ad-img,.ad-ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} .ad-ph svg{width:100%;height:100%} .ad-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(15,4,12,.85) 0%,rgba(15,4,12,.12) 46%,transparent 68%)} .ad-nm{position:absolute;inset-inline-start:11px;bottom:10px;color:#fff;font-weight:900;font-size:14.5px;text-shadow:0 2px 6px rgba(0,0,0,.5)} .ad-live{position:absolute;top:9px;inset-inline-end:9px;background:rgba(0,0,0,.42);backdrop-filter:blur(5px);color:#fff;font-size:9px;font-weight:700;border-radius:999px;padding:3px 8px;display:flex;align-items:center;gap:4px} .ad-live .d{width:6px;height:6px;border-radius:50%;background:#4be39f} .ad-live.off .d{background:#d9c4d0} .spx-row{flex:0 0 100%;display:flex;gap:9px;overflow-x:auto;overflow-y:hidden;direction:rtl;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:1px 1px 3px} .spx-row::-webkit-scrollbar{display:none} .spx-card{flex:0 0 calc((100% - 18px)/3.15);aspect-ratio:3/4.1;position:relative;border-radius:16px;overflow:hidden;cursor:pointer;scroll-snap-align:start;background:#e9e0ea;box-shadow:0 10px 22px -12px rgba(0,0,0,.55);transition:transform .15s} .spx-card:active{transform:scale(.96)} .spx-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block} .spx-img svg{width:100%;height:100%} .spx-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,3,8,.82) 0%,rgba(10,3,8,.25) 38%,transparent 60%)} .spx-on{position:absolute;top:9px;left:9px;width:11px;height:11px;border-radius:50%;background:#3ddc6f;box-shadow:0 0 0 2px rgba(255,255,255,.85);z-index:2} .spx-hr{position:absolute;top:7px;right:7px;width:22px;height:22px;color:#fff;z-index:2;filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))} .spx-hr svg{width:100%;height:100%}.spx-hr.on{color:#ff4d7d} .spx-tx{position:absolute;inset-inline:8px;bottom:8px;z-index:2;color:#fff;text-shadow:0 1px 5px rgba(0,0,0,.6)} .spx-tx b{display:block;font-size:14px;font-weight:900;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .spx-tx span{display:flex;align-items:center;gap:3px;font-size:11.5px;font-weight:700;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .spx-tx span svg{width:12px;height:12px;flex:none;color:#ffc21a} .ad-dots{display:flex;justify-content:center;gap:6px;margin-top:10px;position:relative;z-index:1} .ad-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45);transition:.3s} .ad-dots i.on{width:20px;border-radius:999px;background:#fff} .boost-cta{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:11px;padding:10px;border-radius:13px; border:none;cursor:pointer;font:inherit;font-weight:900;font-size:13px;color:var(--coral);background:#fff;position:relative;z-index:1;box-shadow:0 8px 18px -10px rgba(0,0,0,.4)} .boost-cta:active{transform:scale(.98)} .boost-cta svg{width:14px;height:14px} .boost-cta b{font-weight:900} /* گریدِ پاپ‌آپِ «مشاهدهٔ همه»ی اسپات‌لایت */ .sa-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px} .sa-card{position:relative;aspect-ratio:1/1.15;border-radius:14px;overflow:hidden;cursor:pointer;box-shadow:0 10px 22px -14px rgba(0,0,0,.5);background:#e9e0ea} .sa-card:active{transform:scale(.97)} .sa-card .ad-img,.sa-card .ad-ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} .sa-card .ad-ph svg{width:100%;height:100%} .feat-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px} .feat-badge{display:inline-flex;align-items:center;gap:5px;font-size:13.5px;font-weight:900;letter-spacing:.5px; background:linear-gradient(90deg,var(--coral),var(--gold),var(--coral));background-size:200% auto; -webkit-background-clip:text;background-clip:text;color:transparent;animation:featShine 3s linear infinite} .feat-badge svg{width:15px;height:15px;color:var(--gold);-webkit-text-fill-color:var(--gold)} @keyframes featShine{to{background-position:200% center}} .feat-cta{display:inline-flex;align-items:center;gap:5px;border:none;cursor:pointer;font:inherit;font-size:11.5px;font-weight:800;color:#fff; border-radius:999px;padding:7px 13px;background:linear-gradient(135deg,var(--lavender),var(--coral)); box-shadow:0 8px 18px -8px rgba(180,155,240,.9);transition:transform .14s} .feat-cta:active{transform:scale(.93)} .feat-cta svg{width:13px;height:13px} .feat-cta b{font-weight:900} .ads-window{overflow:hidden;direction:ltr;-webkit-mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)} .ads-track{display:flex;gap:11px;width:max-content;direction:ltr;animation:adscroll 42s linear infinite;will-change:transform;padding:4px 0 2px} .ads-track:hover{animation-play-state:paused} @keyframes adscroll{to{transform:translateX(-50%)}} .feat-card{flex:none;position:relative;width:104px;height:140px;border-radius:18px;overflow:hidden;cursor:pointer; box-shadow:0 12px 26px -12px rgba(80,40,90,.5);background:var(--blush);border:2px solid #fff;transition:transform .16s} .feat-card:active{transform:scale(.96)} .feat-img,.feat-ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} .feat-ph .portrait{width:100%;height:100%} .feat-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,8,25,.8) 0%,rgba(20,8,25,.14) 44%,transparent 68%)} .feat-nm{position:absolute;left:0;right:0;bottom:9px;text-align:center;color:#fff;font-size:13px;font-weight:800; text-shadow:0 1px 4px rgba(0,0,0,.55);padding:0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:2} .feat-dot{position:absolute;top:8px;inset-inline-end:8px;width:11px;height:11px;border-radius:50%;background:var(--online); border:2px solid #fff;animation:pulseDot 1.8s ease-out infinite;z-index:3} .feat-crown{position:absolute;top:6px;inset-inline-start:6px;color:var(--gold);z-index:3;animation:twinkle 2.4s ease-in-out infinite;filter:drop-shadow(0 1px 3px rgba(0,0,0,.45))} .feat-crown svg{width:16px;height:16px} .feat-card.me{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold),0 12px 26px -12px rgba(255,180,60,.75);animation:adglow 1.8s ease-in-out infinite} @keyframes adglow{0%,100%{box-shadow:0 0 0 2px var(--gold),0 12px 26px -12px rgba(255,180,60,.6)}50%{box-shadow:0 0 0 6px rgba(255,192,106,.18),0 12px 26px -12px rgba(255,180,60,.6)}} .adpop-ic{width:60px;height:60px;border-radius:20px;margin:2px auto 10px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--lavender),var(--coral));box-shadow:0 12px 26px -10px rgba(255,92,138,.7)} .adpop-ic svg{width:30px;height:30px} .adpop-sub{text-align:center;color:var(--ink-soft);font-size:13px;line-height:1.95;margin:0 4px 14px} .adpop-feats{display:flex;flex-direction:column;gap:9px;margin-bottom:14px} .adpop-feat{display:flex;align-items:center;gap:10px;background:var(--glass-strong);border:1px solid var(--line);border-radius:14px;padding:10px 12px} .adpop-feat .fi{width:32px;height:32px;border-radius:10px;flex:none;display:grid;place-items:center;color:var(--coral);background:rgba(255,92,138,.1)} .adpop-feat .fi svg{width:17px;height:17px} .adpop-feat span{font-size:13px;font-weight:600;color:var(--plum)} .adpop-cost{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;text-align:center;font-size:13px;font-weight:700;color:var(--plum);background:rgba(255,192,106,.18);border:1px solid rgba(255,192,106,.55);border-radius:14px;padding:11px;margin-bottom:8px} .adpop-cost b{color:var(--coral)} /* برچسبِ «در انتظار تایید» روی عکسِ کاربر */ .evpend{position:absolute;top:0;inset-inline-start:0;inset-inline-end:0;display:flex;align-items:center;justify-content:center;gap:5px; background:linear-gradient(135deg,rgba(255,176,32,.96),rgba(255,140,60,.96));color:#3a2233;font-size:10.5px;font-weight:800; padding:5px 4px;padding-inline-end:38px;z-index:3;backdrop-filter:blur(2px)} .evpend svg{width:12px;height:12px} .evphoto.pend img{filter:saturate(.6) brightness(.92)} /* کاشیِ آپلودِ درحال‌بارگذاری با درصد */ .evphoto.evup{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px; background:linear-gradient(160deg,rgba(255,92,138,.12),rgba(255,138,107,.12));border:2px dashed var(--coral)} .evup-ring{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--coral); border:3px solid rgba(255,92,138,.25);border-top-color:var(--coral);animation:evspin .8s linear infinite} .evup-ring svg{width:16px;height:16px} @keyframes evspin{to{transform:rotate(360deg)}} .evup-pct{font-family:var(--font-display);font-weight:700;font-size:18px;color:var(--coral)} /* پاپ‌آپِ نتیجهٔ بررسیِ عکس */ .rpop-bg{position:absolute;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:30px; background:rgba(40,12,32,.5);backdrop-filter:blur(6px);animation:fade .25s ease both} .rpop-bg.on{display:flex} .rpop{width:100%;max-width:300px;background:linear-gradient(180deg,var(--cream),var(--blush));border-radius:26px; padding:30px 24px 24px;text-align:center;box-shadow:var(--shadow);animation:rpopIn .4s cubic-bezier(.2,.9,.3,1) both} @keyframes rpopIn{from{opacity:0;transform:scale(.85) translateY(12px)}to{opacity:1;transform:none}} .rpop-ic{width:84px;height:84px;border-radius:50%;margin:0 auto 16px;display:grid;place-items:center;color:#fff; animation:rpopPulse .5s ease both .15s} @keyframes rpopPulse{0%{transform:scale(.5);opacity:0}60%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}} .rpop-ic.ok{background:linear-gradient(135deg,#34d399,#10b981)} .rpop-ic.no{background:linear-gradient(135deg,#fb7185,#e11d48)} .rpop-ic svg{width:46px;height:46px} .rpop h2{font-size:20px;color:var(--plum);margin-bottom:6px} .rpop p{font-size:13.5px;color:var(--ink-soft);line-height:1.8;margin-bottom:18px} .rpop button{width:100%;border:none;cursor:pointer;border-radius:14px;padding:13px;font:inherit;font-weight:700;font-size:15px;color:#fff; background:linear-gradient(120deg,var(--coral),var(--coral-2))} .toast{position:fixed;left:50%;top:calc(16px + env(safe-area-inset-top)); transform:translateX(-50%) translateY(-260%);opacity:0;z-index:4000; display:flex;align-items:center;gap:11px; background:linear-gradient(135deg,#5B2348,#7E3A78 70%,#8A4A86);color:#fff; font-size:13.5px;font-weight:600;line-height:1.7;padding:12px 15px;border-radius:18px; box-shadow:0 22px 46px -16px rgba(91,35,72,.78),0 0 0 1px rgba(255,255,255,.1) inset; width:min(360px,88%);text-align:start; transition:transform .55s cubic-bezier(.2,.95,.3,1.25),opacity .35s ease} .toast.show{transform:translateX(-50%) translateY(0);opacity:1} .toast-ic{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center; background:var(--grad);box-shadow:0 6px 14px -6px rgba(255,92,138,.8)} .toast-ic svg{width:16px;height:16px;color:#fff} .toast-tx{flex:1;min-width:0} .toast-btn{flex:none;background:#fff;color:#5B2348;border:none;border-radius:12px;padding:8px 14px;font:inherit;font-size:12.5px;font-weight:800;cursor:pointer;white-space:nowrap;box-shadow:0 4px 10px -4px rgba(0,0,0,.4)} .toast-btn:active{transform:scale(.95)} /* نوتیفِ ترغیبی برای کاربرِ پسرِ رایگان (پیام/لایک جدید) */ .rnotif{position:absolute;left:50%;top:calc(16px + env(safe-area-inset-top)); transform:translateX(-50%) translateY(-260%);opacity:0;z-index:96; display:flex;align-items:center;gap:13px;cursor:pointer; background:linear-gradient(135deg,#141018,#1d1626 72%,#241a2e); border:1px solid rgba(255,255,255,.08); padding:12px 16px 12px 13px;border-radius:20px; box-shadow:0 26px 52px -18px rgba(10,4,10,.85),0 0 0 1px rgba(255,255,255,.05) inset; width:min(370px,90%);text-align:start; transition:transform .55s cubic-bezier(.2,.95,.3,1.25),opacity .35s ease} .rnotif.show{transform:translateX(-50%) translateY(0);opacity:1} .rnotif-av{position:relative;flex:none;width:54px;height:54px;border-radius:50%;overflow:hidden; border:2px solid rgba(255,255,255,.14);background:linear-gradient(120deg,var(--coral),var(--coral-2))} .rnotif-av .portrait,.rnotif-av img{width:100%;height:100%;object-fit:cover;filter:blur(7px);transform:scale(1.15)} .rnotif-badge{position:absolute;top:-4px;inset-inline-start:-4px;z-index:2;min-width:22px;height:22px;padding:0 6px; border-radius:999px;background:linear-gradient(120deg,var(--coral),var(--coral-2));color:#fff; font-size:12px;font-weight:800;display:none;align-items:center;justify-content:center; border:2px solid #141018;box-shadow:0 4px 10px -3px rgba(255,92,138,.8)} .rnotif-tx{flex:1;min-width:0} .rnotif-tt{font-family:var(--font-display);font-weight:600;font-size:17px;line-height:1.3; color:#7be6b0;letter-spacing:-.01em} [dir=rtl] .rnotif-tt{letter-spacing:0} .rnotif-sb{font-size:13px;color:rgba(255,255,255,.62);margin-top:2px} .rnotif-go{flex:none;color:rgba(255,255,255,.45)} .rnotif-go svg{width:20px;height:20px} [dir=rtl] .rnotif-go svg{transform:scaleX(-1)} /* credit pill + popup */ .head-actions{display:flex;align-items:center;gap:9px} body.free-domain .credpill,html.free-domain-early .credpill{display:none!important} body.sup-closed #supIcon{display:none!important} body.free-user #supIcon{display:none!important} /* کاربرِ «همه‌چیز رایگان»: دکمهٔ Support نمایش داده نشود */ .credpill{display:inline-flex;align-items:center;gap:6px;height:42px;padding:0 8px 0 12px;border-radius:14px;cursor:pointer; border:1.5px solid #f0d49a;background:linear-gradient(120deg,#fff7ea,#ffe9d8);color:#9a6a1e;font:inherit;font-weight:800;font-size:14px; box-shadow:0 8px 20px -13px rgba(201,150,40,.85);transition:transform .14s} .credpill:active{transform:scale(.95)} .credpill .gem{width:18px;height:18px;color:#e8a32a;flex:none;filter:drop-shadow(0 1px 1px rgba(201,150,40,.35))} .credpill .credNum{font-variant-numeric:tabular-nums} .credpill .plus{width:19px;height:19px;border-radius:50%;display:grid;place-items:center;flex:none;color:#fff;background:var(--grad)} .credpill .plus svg{width:11px;height:11px} .cred-title-row{display:flex;align-items:center;justify-content:center;gap:9px} .gem-inline{width:26px;height:26px;color:#e8a32a;flex:none;filter:drop-shadow(0 3px 7px rgba(201,150,40,.45));animation:gemFloat 3.4s ease-in-out infinite} .cred-hero{position:relative;text-align:center;margin:0 0 2px;padding:0} .cred-hero::before{content:"";position:absolute;top:-18px;left:50%;transform:translateX(-50%);width:150px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(232,163,42,.2),transparent 62%);pointer-events:none} .cred-hero .gem{position:relative;display:block;width:42px;height:42px;color:#e8a32a;margin:0 auto 5px;filter:drop-shadow(0 5px 11px rgba(201,150,40,.5));animation:gemFloat 3.4s ease-in-out infinite} @keyframes gemFloat{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-7px) rotate(3deg)}} .cred-bal{position:relative;font-family:var(--font-display);font-weight:600;font-size:40px;color:var(--plum);line-height:1;animation:balPop .6s cubic-bezier(.2,.9,.3,1.4) both} @keyframes balPop{0%{transform:scale(.55);opacity:0}100%{transform:scale(1);opacity:1}} .cred-bal small{font-family:var(--font-body);font-size:14px;color:var(--ink-soft);font-weight:700;margin-inline-start:6px} .cred-sec{font-weight:700;color:var(--plum);font-size:14px;margin:13px 2px 8px;text-align:start} .cred-row{display:flex;align-items:center;gap:11px;padding:13px 13px;border-radius:16px;background:var(--glass-strong);border:1px solid var(--line);margin-bottom:8px;animation:payQIn .2s ease-out both;transition:transform .18s,border-color .18s,box-shadow .18s} .cred-row:hover{transform:translateY(-2px);border-color:rgba(255,92,138,.3);box-shadow:0 10px 22px -14px rgba(255,92,138,.5)} @keyframes credIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} .cred-row .ci{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,rgba(255,92,138,.16),rgba(255,92,138,.06));color:var(--coral)} .cred-row .ci svg{width:20px;height:20px} .cred-row .cl{flex:1;min-width:0;text-align:start} .cred-row .cl .t{display:block;font-weight:800;color:var(--ink);font-size:14.5px} .cred-row .cl .d{display:block;font-size:12px;color:var(--ink-soft);margin-top:3px;line-height:1.7} .cred-row .cv{font-family:var(--font-body);font-weight:800;color:#d8456a;font-size:12px;flex:none;background:rgba(216,69,106,.1);padding:6px 11px;border-radius:999px;white-space:nowrap;align-self:flex-start;margin-top:2px} .cred-pkgs{display:flex;gap:9px;margin-top:16px;padding-top:6px} .cred-pkg{position:relative;flex:1;border:1.5px solid var(--line);background:#fff;border-radius:16px;padding:16px 6px 13px;cursor:pointer;text-align:center;animation:payQIn .2s ease-out both;transition:transform .16s,box-shadow .2s,border-color .2s} .cred-pkg:active{transform:scale(.97)} .cred-pkg:hover{transform:translateY(-4px);box-shadow:0 16px 30px -16px rgba(255,92,138,.6);border-color:var(--coral)} .cred-pkg.best{border-color:var(--coral);background:linear-gradient(180deg,rgba(255,92,138,.09),rgba(255,92,138,.03))} .cred-pkg .n{position:relative;display:block;font-family:var(--font-display);font-weight:600;color:var(--plum);font-size:20px} .cred-pkg .p{position:relative;display:block;font-size:11.5px;color:var(--ink-soft);margin-top:4px} .cpk-unit{font-family:var(--font-body);font-size:11px;font-weight:800;color:var(--ink-soft);margin-inline-start:4px} .pay-redir{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px 10px 8px;animation:credIn .3s ease} .pr-spin{width:46px;height:46px;border-radius:50%;border:4px solid rgba(255,92,138,.18);border-top-color:var(--coral);animation:prSpin .8s linear infinite;margin-bottom:16px} @keyframes prSpin{to{transform:rotate(360deg)}} .pr-txt{font-weight:800;color:var(--plum);font-size:15.5px} .pr-sub{margin-top:6px;color:var(--ink-soft);font-size:12.5px} /* پیغامِ سهمیهٔ لایکِ روزانه */ .likeintro{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:26px;background:rgba(30,10,24,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:fade .25s ease both} .likeintro.on{display:flex} .likeintro.out{animation:fade .3s ease reverse both} .li-card{position:relative;width:100%;max-width:320px;background:linear-gradient(180deg,var(--cream),var(--blush));border-radius:26px;padding:30px 24px 22px;text-align:center;box-shadow:0 34px 74px -20px rgba(40,12,32,.6);animation:liPop .5s cubic-bezier(.2,.9,.3,1.4) both;overflow:hidden} .li-heart{font-size:52px;line-height:1;animation:liBeat 1.1s ease-in-out infinite} @keyframes liBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.22)}30%{transform:scale(1)}45%{transform:scale(1.15)}} @keyframes liPop{0%{transform:scale(.8);opacity:0}100%{transform:scale(1);opacity:1}} .li-hearts{position:absolute;inset:0;pointer-events:none;overflow:hidden} .li-hearts span{position:absolute;bottom:-20px;font-size:16px;opacity:0;animation:liFloat 2.6s ease-in infinite} .li-hearts span:nth-child(1){left:22%;animation-delay:.2s} .li-hearts span:nth-child(2){left:50%;font-size:13px;animation-delay:1s} .li-hearts span:nth-child(3){left:74%;animation-delay:1.7s} @keyframes liFloat{0%{transform:translateY(0) scale(.6);opacity:0}20%{opacity:.9}100%{transform:translateY(-120px) scale(1);opacity:0}} .li-title{position:relative;font-weight:900;font-size:19px;color:var(--plum);margin:12px 0 6px} .li-sub{position:relative;color:var(--ink);font-size:14px;line-height:1.9} .li-sub b{color:var(--coral);font-size:16px} .li-ok{position:relative;margin-top:18px;width:100%} /* اسکرولِ خودکار + هایلایتِ فیلدِ فعال در ثبت‌نام و پروفایل */ #signup .field,#profile .field{scroll-margin-top:74px;scroll-margin-bottom:24px;border-radius:14px;transition:background .3s ease,box-shadow .3s ease} #profile .field.sf-active{background:rgba(255,92,138,.05);box-shadow:0 0 0 1.5px rgba(255,92,138,.22)} #signup .field.sf-active>label{color:var(--coral)} #signup .field.sf-active .ctrl,#signup .field.sf-active .opt{border-color:var(--coral)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--coral) 16%,transparent)!important;transition:box-shadow .25s,border-color .25s} #signup .field.sf-done .ctrl{border-color:color-mix(in srgb,var(--coral) 45%,var(--line))} #signup .field.sf-done>label::after,#profile .field.sf-done>label::after{content:" ✓";color:var(--coral);font-weight:800;font-size:12px} .cpk-hint{position:relative;display:block;margin-top:8px;font-size:9.5px;font-weight:800;color:var(--coral);background:rgba(255,92,138,.1);border-radius:999px;padding:4px 6px} .pkg-badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);max-width:96%;background:var(--grad);color:#fff;font-size:9.5px;font-weight:800;padding:3px 9px;border-radius:999px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 6px 14px -6px rgba(255,92,138,.8);z-index:3} .pkg-badge.spot{background:linear-gradient(120deg,#f4c862,#ffb347,#f4c862);background-size:200% 100%;color:#5a3d00;box-shadow:0 7px 16px -6px rgba(244,200,98,.9);animation:spotBadge 1.9s ease-in-out infinite,spotBadgeSheen 3s linear infinite} @keyframes spotBadge{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.06)}} @keyframes spotBadgeSheen{to{background-position:-200% 0}} .cred-pkg.spotpick{border-color:#f4c862;background:linear-gradient(180deg,rgba(244,200,98,.14),rgba(244,200,98,.04));box-shadow:0 14px 30px -16px rgba(244,200,98,.7)} .cred-pkg .pkg-vip{display:block;margin-top:6px;font-size:10.5px;font-weight:800;color:var(--coral)} .cred-vipnote{display:none} /* تب‌های خرید/گزارش */ .cred-tabs{display:flex;gap:6px;background:var(--glass-strong);border:1px solid var(--line);border-radius:15px;padding:5px;margin:4px 0 2px} .cred-tab{flex:1;border:none;cursor:pointer;font:inherit;font-weight:800;font-size:13.5px;color:var(--ink-soft);background:transparent;padding:10px 8px;border-radius:11px;transition:.2s} .cred-tab.on{background:var(--grad);color:#fff;box-shadow:0 8px 18px -8px rgba(255,92,138,.55)} #credPaneBuy,#credPaneLog{animation:credIn .35s ease} /* پاپ‌آپِ اسپات‌لایت — بخشِ هزینه/موجودی */ .adpop-cost .sp-line{text-align:center;font-size:13.5px;color:var(--ink-soft);margin-bottom:12px;line-height:1.8} .adpop-cost .sp-cost,.adpop-cost .sp-bal{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border-radius:13px;margin-bottom:8px;font-weight:700;font-size:14px} .adpop-cost .sp-cost{background:rgba(255,92,138,.09);color:var(--plum)} .adpop-cost .sp-cost b{font-family:var(--font-display);color:var(--coral);font-size:16px} .adpop-cost .sp-bal{background:var(--glass-strong);border:1px solid var(--line);color:var(--ink)} .adpop-cost .sp-bal b{font-family:var(--font-display);font-size:16px} .adpop-cost .sp-bal.low b{color:#d8456a} .adpop-cost .sp-warn{text-align:center;font-size:12.5px;color:#d8456a;font-weight:700;margin-top:4px} /* گزارشِ اعتبار */ .cred-loglink{display:flex;align-items:center;gap:9px;width:100%;margin-top:14px;cursor:pointer;font:inherit;font-weight:800;font-size:13.5px;color:var(--plum);background:var(--glass-strong);border:1px solid var(--line);border-radius:14px;padding:12px 14px;transition:background .18s} .cred-loglink:hover{background:rgba(255,92,138,.06)} .cred-loglink svg{width:19px;height:19px;color:var(--coral)} .cred-loglink .chev{margin-inline-start:auto;transition:transform .25s;color:var(--ink-soft)} .cred-loglink.open .chev{transform:rotate(180deg)} .cred-log{max-height:0;overflow:hidden;transition:max-height .35s ease} .cred-log.open{max-height:340px;overflow-y:auto;margin-top:10px} .clog-item{display:flex;align-items:center;gap:11px;padding:11px 6px;border-bottom:1px solid var(--line);opacity:0;animation:credIn .45s ease forwards} .clog-item:last-child{border-bottom:none} .clog-ic{width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center} .clog-ic svg{width:18px;height:18px} .clog-ic.plus{background:rgba(45,190,120,.14);color:#1faa63} .clog-ic.minus{background:rgba(216,69,106,.12);color:#d8456a} .clog-tx{flex:1;min-width:0;text-align:start} .clog-tx .t{display:block;font-weight:700;color:var(--ink);font-size:13px} .clog-tx .d{display:block;text-align:right;unicode-bidi:isolate;font-size:11px;color:var(--ink-soft);margin-top:2px} .clog-v{font-family:var(--font-display);font-weight:700;font-size:15px;flex:none} .clog-v.plus{color:#1faa63}.clog-v.minus{color:#d8456a} .clog-empty{text-align:center;color:var(--ink-soft);font-size:12.5px;padding:16px 0} /* payment sheet */ .pay-sum{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;border-radius:16px; background:rgba(255,92,138,.07);border:1.5px solid rgba(255,92,138,.22);margin:4px 0 4px} .pay-sum .ps-c{font-weight:800;color:var(--plum);font-size:16px} .pay-sum .ps-p{font-weight:700;color:var(--coral);font-size:15px} .rw-bg{position:fixed;inset:0;z-index:2147483000;background:rgba(20,10,25,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px;animation:rwIn .18s ease} @keyframes rwIn{from{opacity:0}to{opacity:1}} .rw-box{width:100%;max-width:360px;background:#fff;border-radius:24px;padding:22px 18px 18px;text-align:center;direction:rtl;box-shadow:0 20px 50px rgba(0,0,0,.25);font-family:inherit;color:#2a1f2d} .rw-ic{width:54px;height:54px;border-radius:50%;margin:0 auto 10px;display:grid;place-items:center;font-size:26px;background:linear-gradient(135deg,#f6c25b,#e8913a);color:#fff} .rw-t{font-size:17px;font-weight:900;margin-bottom:14px} .rw-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 14px;border-radius:14px;background:#f6f1f5;margin-bottom:8px;font-size:13px} .rw-row b{font-size:16px;font-weight:900;direction:rtl;white-space:nowrap} .rw-row.rl{background:#fff4e2;border:2px solid #f0b350}.rw-row.rl b{color:#b4620a;font-size:18px} .rw-n{font-size:13px;line-height:1.9;margin:12px 2px 16px;color:#5a4a5e}.rw-n strong{color:#c0392b} .rw-ok{width:100%;border:0;border-radius:16px;padding:14px;font:inherit;font-size:15px;font-weight:800;color:#fff;background:linear-gradient(135deg,#a86e8c,#c08aa4);cursor:pointer} .rial-l{display:block;font-size:11.5px;font-weight:700;opacity:.85;margin-top:3px;letter-spacing:.02em;direction:rtl} .pay-card-row .val .rial-l{text-align:start} .pay-opt{display:flex;align-items:center;gap:13px;width:100%;text-align:start;padding:14px 14px;border-radius:16px; border:1.5px solid var(--line);background:#fff;cursor:pointer;font:inherit;margin-bottom:10px;transition:.15s;box-shadow:var(--shadow-sm)} .pay-opt:active{transform:scale(.99)} .pay-opt:hover{border-color:rgba(255,92,138,.4)} .pay-ic{width:44px;height:44px;border-radius:13px;flex:none;display:grid;place-items:center;color:var(--coral);background:rgba(255,92,138,.1)} .pay-ic svg{width:22px;height:22px} .pay-tx{flex:1;min-width:0} .pay-tx .t{display:block;font-weight:700;color:var(--plum);font-size:15px} .pay-tx .d{display:block;font-size:12px;color:var(--ink-soft);margin-top:2px} .pay-go{width:18px;height:18px;flex:none;color:var(--ink-soft)} [dir=rtl] .pay-go{transform:scaleX(-1)} .pay-card{border:1.5px solid var(--line);border-radius:16px;background:var(--glass-strong);padding:4px 14px;margin-top:2px} .pay-cr-sub{font-size:13px;color:var(--ink-soft);margin:6px 2px 10px} .cr-nets{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px} .cr-net{border:1.5px solid var(--line);background:var(--glass);color:var(--plum);font:inherit;font-weight:700;font-size:13px;padding:9px 14px;border-radius:12px;cursor:pointer;transition:.15s} .cr-net.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 8px 18px -10px var(--coral)} .cr-addr{word-break:break-all;font-family:monospace;font-size:12.5px;text-align:start;line-height:1.6;max-width:62%} .cr-addr{cursor:pointer;user-select:all;border-radius:9px;padding:3px 6px;margin:-3px -6px;transition:background .15s,transform .1s} .cr-addr:hover{background:rgba(0,0,0,.045)} .cr-addr:active{transform:scale(.985);background:rgba(0,0,0,.075)} .cr-copy-hint{margin-top:9px;text-align:center;font-size:12.5px;opacity:.72} .pay-cr-warn{font-size:12px;color:#c2410c;background:#fff4ec;border:1px solid #ffd9bf;border-radius:12px;padding:9px 11px;margin-top:10px;line-height:1.8} .cred-recover{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:12px;background:rgba(255,92,138,.09);border:1px solid rgba(255,92,138,.28);color:var(--coral);font:inherit;font-weight:700;font-size:12.7px;border-radius:13px;cursor:pointer;padding:11px 12px;text-decoration:none;transition:background .18s,transform .12s} .cred-recover svg{width:16px;height:16px;flex:none} .cred-recover:hover{background:rgba(255,92,138,.16)} .cred-recover:active{transform:scale(.98)} .cred-recover:disabled{opacity:.5;cursor:default} .pay-card-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)} .pay-card-row:last-child{border-bottom:none} .pay-card-row .lbl{font-size:13px;color:var(--ink-soft);font-weight:600} .pay-card-row .val{font-weight:800;color:var(--plum);font-size:15px;letter-spacing:.02em} .pay-back2{display:block;margin:10px auto 0;background:none;border:none;cursor:pointer;font:inherit;font-size:13.5px;font-weight:700;color:var(--ink-soft);padding:6px} .pay-form{display:flex;flex-direction:column;gap:11px;margin-top:2px} .pay-field{display:flex;flex-direction:column;gap:6px} .pay-field>span{font-size:12.5px;font-weight:600;color:var(--ink-soft);padding:0 2px} .pay-field input{width:100%;border:1.5px solid var(--line);background:#fff;border-radius:13px;padding:12px 13px;font:inherit;font-size:14.5px;color:var(--plum);font-weight:700;letter-spacing:.02em;transition:.15s} .pay-field input:focus{outline:none;border-color:var(--coral);box-shadow:0 0 0 3px rgba(255,92,138,.12)} .pay-field input::placeholder{color:#c9b8c4;font-weight:500;letter-spacing:.04em} .pay-field-row{display:flex;gap:10px} .pay-field-row .pay-field{flex:1;min-width:0} /* انتخابگرِ تاریخ/ساعت (سلکتی، ۲۴ ساعته، به وقتِ تهران) */ .dt-row{display:flex;gap:8px;align-items:center;width:100%} .dt-row.tm{direction:ltr} .dt-row .dt-col{font-weight:800;color:var(--plum);flex:none} .dt-sel{flex:1;min-width:0;-webkit-appearance:none;appearance:none;border:1.5px solid var(--line);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a08a99' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat;background-size:12px;background-position:left 11px center;border-radius:13px;padding:12px 30px 12px 12px;font:inherit;font-size:14.5px;font-weight:700;color:var(--plum);text-align:center;text-align-last:center;transition:.15s} [dir=rtl] .dt-sel{padding:12px 12px 12px 30px} [dir=ltr] .dt-sel{background-position:right 11px center;padding:12px 30px 12px 12px} .dt-sel.empty{color:#c9b8c4;font-weight:500} .dt-sel:focus{outline:none;border-color:var(--coral);box-shadow:0 0 0 3px rgba(255,92,138,.12)} .dt-sel.err{border-color:#ff5c8a;box-shadow:0 0 0 3px rgba(255,92,138,.15)} .sup-dtwrap{display:flex;align-items:center;gap:10px} .sup-dtwrap .sf-ic{position:static!important;transform:none!important;flex:none} .sup-dtwrap .dt-sel{border-radius:16px;background-color:rgba(255,255,255,.9);border-color:rgba(40,90,70,.12);padding-top:14px;padding-bottom:14px} .sup-dtwrap .dt-sel:focus{border-color:#41c98e;box-shadow:0 0 0 4px rgba(65,201,142,.14)} .pay-file{position:relative;display:flex;align-items:center;gap:12px;cursor:pointer;border:2px dashed rgba(34,170,90,.55);border-radius:18px;padding:14px;background:linear-gradient(135deg,rgba(52,199,89,.13),rgba(255,92,138,.08));color:var(--plum);text-align:start;transition:.2s;animation:pfPulse 2.2s ease-in-out infinite} .pay-file:active{transform:scale(.98)} .pay-file .pf-ic{position:relative;flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#34c759,#1fa35a);box-shadow:0 6px 16px rgba(31,163,90,.35)} .pay-file .pf-ic svg{width:27px;height:27px} .pay-file .pf-plus{position:absolute;top:-6px;inset-inline-end:-6px;width:21px;height:21px;border-radius:50%;background:#ff5c8a;color:#fff;font-size:16px;font-weight:900;line-height:20px;text-align:center;border:2px solid #fff} .pay-file .pf-thumb{display:none;flex:none;width:52px;height:52px;border-radius:14px;object-fit:cover;border:2px solid #34c759} .pay-file .pf-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px} .pay-file .pf-txt b{font-size:15px;font-weight:800;color:var(--plum)} .pay-file .pf-txt small{font-size:11.5px;font-weight:600;color:var(--ink-soft);line-height:1.6} .pay-file .pf-go{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#1fa35a;box-shadow:0 3px 10px rgba(0,0,0,.08)} .pay-file .pf-go svg{width:18px;height:18px;animation:pfBob 1.4s ease-in-out infinite} .pay-file.has{border-style:solid;border-color:#34c759;background:rgba(52,199,89,.12);animation:none} .pay-file.has .pf-ic{display:none}.pay-file.has .pf-thumb{display:block} .pay-file.has .pf-go{background:#34c759;color:#fff}.pay-file.has .pf-go svg{animation:none} @keyframes pfPulse{0%,100%{box-shadow:0 0 0 0 rgba(52,199,89,.0)}50%{box-shadow:0 0 0 6px rgba(52,199,89,.14)}} @keyframes pfBob{0%,100%{transform:translateY(1px)}50%{transform:translateY(-3px)}} .pay-status{margin-top:11px;text-align:center;font-size:13px;font-weight:800;padding:11px;border-radius:13px} .pay-status.review{color:#b06a00;background:rgba(255,176,32,.15)} .pay-status.ok{color:var(--ok);background:rgba(43,189,130,.13)} /* match popup */ .match-bg{position:absolute;inset:0;z-index:85;display:none;align-items:center;justify-content:center;padding:24px; background:radial-gradient(circle at 50% 32%,rgba(91,35,72,.55),rgba(20,6,16,.88));backdrop-filter:blur(9px);animation:fade .3s ease both} .match-bg.on{display:flex} .match-card{position:relative;width:100%;max-width:340px;border-radius:30px;padding:34px 26px 24px;text-align:center;overflow:hidden; background:linear-gradient(170deg,#ffffff,#ffeef1);box-shadow:0 30px 70px -18px rgba(91,35,72,.75); animation:matchPop .55s cubic-bezier(.2,1.1,.3,1) both} @keyframes matchPop{0%{opacity:0;transform:scale(.82) translateY(22px)}100%{opacity:1;transform:none}} .match-glow{position:absolute;top:-38%;left:50%;transform:translateX(-50%);width:130%;height:90%;pointer-events:none; background:radial-gradient(circle,rgba(255,92,138,.4),transparent 64%)} .match-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:30px} .confetti{position:absolute;top:-16px;width:9px;height:14px;border-radius:2px;opacity:.95;animation:confFall linear forwards} @keyframes confFall{0%{transform:translateY(-16px) rotate(0);opacity:1}100%{transform:translateY(440px) rotate(620deg);opacity:0}} .match-title{position:relative;font-family:var(--font-display);font-weight:700;font-size:34px;line-height:1.1; background:linear-gradient(120deg,var(--coral),var(--coral-2) 55%,var(--lavender));-webkit-background-clip:text;background-clip:text;color:transparent; animation:matchTitle .6s .15s cubic-bezier(.2,1.2,.3,1) both} @keyframes matchTitle{0%{opacity:0;transform:scale(.5)}100%{opacity:1;transform:none}} .match-sub{position:relative;color:var(--ink-soft);font-size:14px;margin-top:9px;animation:upFade .5s .35s both} .match-avs{position:relative;display:flex;align-items:center;justify-content:center;margin:24px 0 24px;height:112px} .match-av{width:104px;height:104px;border-radius:50%;overflow:hidden;border:4px solid #fff;position:relative; box-shadow:0 14px 30px -10px rgba(91,35,72,.55)} .match-av .portrait,.match-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} .match-av.me{margin-inline-end:-20px;z-index:1;animation:slideR .6s .25s cubic-bezier(.2,1.1,.3,1) both} .match-av.them{margin-inline-start:-20px;z-index:1;animation:slideL .6s .25s cubic-bezier(.2,1.1,.3,1) both} @keyframes slideR{0%{opacity:0;transform:translateX(46px) rotate(9deg)}100%{opacity:1;transform:none}} @keyframes slideL{0%{opacity:0;transform:translateX(-46px) rotate(-9deg)}100%{opacity:1;transform:none}} .match-heart{position:relative;z-index:3;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none; background:var(--grad);box-shadow:0 10px 24px -6px rgba(255,92,138,.85); animation:heartPop .5s .55s cubic-bezier(.2,1.5,.3,1) both} .match-heart svg{width:28px;height:28px} .match-heart::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--coral);animation:heartRing 1.7s .95s ease-out infinite} @keyframes heartPop{0%{opacity:0;transform:scale(0)}60%{transform:scale(1.28)}100%{opacity:1;transform:scale(1)}} @keyframes heartRing{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.2);opacity:0}} .match-msg{position:relative;display:flex;align-items:center;justify-content:center;gap:9px;animation:upFade .5s .5s both} .match-msg svg{width:20px;height:20px} .match-bg{background:radial-gradient(circle at 50% 38%,rgba(193,53,132,.55),rgba(14,4,20,.94) 70%)} .match-card{background:linear-gradient(165deg,rgba(255,255,255,.97),#ffe9f1);overflow:visible;border:1px solid rgba(255,255,255,.7)} .match-card::before{content:"";position:absolute;inset:-2px;border-radius:32px;z-index:-1;background:conic-gradient(from 0deg,#ff4d8d,#ffc06a,#b49bf0,#43c6ac,#ff4d8d);filter:blur(14px);opacity:.75;animation:mSpin 6s linear infinite} @keyframes mSpin{to{transform:rotate(360deg)}} .match-fx{position:absolute;inset:0;pointer-events:none;overflow:hidden} .mfx-h{position:absolute;bottom:-30px;opacity:0;animation:mRise linear forwards} @keyframes mRise{0%{transform:translateY(0) scale(.6);opacity:0}15%{opacity:.9}100%{transform:translateY(-105vh) scale(1.15) rotate(var(--r,12deg));opacity:0}} .match-flash{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 42%,#fff,rgba(255,180,210,.6) 30%,transparent 62%);opacity:0;animation:mFlash .9s .5s ease-out both} @keyframes mFlash{0%{opacity:0;transform:scale(.4)}25%{opacity:.85}100%{opacity:0;transform:scale(1.6)}} .match-title{font-size:38px;background-size:220% 100%;animation:matchTitle .6s .15s cubic-bezier(.2,1.2,.3,1) both,mShine 2.6s 1s linear infinite} @keyframes mShine{to{background-position:-220% 0}} .match-av.me{animation:mFlyR .8s .2s cubic-bezier(.2,1.1,.3,1) both} .match-av.them{animation:mFlyL .8s .2s cubic-bezier(.2,1.1,.3,1) both} @keyframes mFlyR{0%{opacity:0;transform:translateX(150px) rotate(24deg) scale(.7)}100%{opacity:1;transform:none}} @keyframes mFlyL{0%{opacity:0;transform:translateX(-150px) rotate(-24deg) scale(.7)}100%{opacity:1;transform:none}} .match-heart{animation:heartPop .5s .8s cubic-bezier(.2,1.5,.3,1) both,mBeat 1.3s 1.4s ease-in-out infinite} @keyframes mBeat{0%,100%{transform:scale(1)}20%{transform:scale(1.18)}40%{transform:scale(1)}60%{transform:scale(1.12)}} .match-cm{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:-6px 0 12px;animation:upFade .5s .75s both} .match-cm span{font-size:12px;font-weight:700;color:#c13584;background:rgba(193,53,132,.1);border-radius:999px;padding:4px 10px} .match-qk{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-bottom:12px;animation:upFade .5s .85s both} .match-qk button{font:inherit;font-size:13px;font-weight:700;border:1px solid rgba(193,53,132,.25);background:#fff;color:#8a2a63;border-radius:14px;padding:7px 12px;cursor:pointer} .match-qk button:active{transform:scale(.95)} .match-skip{position:relative;margin-top:12px;background:none;border:none;cursor:pointer;font:inherit;font-weight:700;color:var(--ink-soft);font-size:14px;animation:upFade .5s .6s both} .match-skip:active{transform:scale(.97)} /* privacy */ /* معرفیِ حریم خصوصی (بارِ اول برای دخترها) */ .priv-help{display:inline-grid;place-items:center;width:22px;height:22px;margin-inline-start:8px;border-radius:50%;border:none;cursor:pointer; background:var(--grad);color:#fff;font:inherit;font-size:13px;font-weight:900;vertical-align:1px;box-shadow:0 4px 10px -4px var(--coral);animation:supBeat 2.2s ease-in-out infinite} .priv-card.glow{animation:privGlow 1.6s ease-out 2} @keyframes privGlow{0%{box-shadow:0 0 0 0 rgba(65,201,142,.55)}100%{box-shadow:0 0 0 16px rgba(65,201,142,0)}} .pi-bg{position:fixed;inset:0;z-index:300;background:rgba(20,10,20,.45);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;transition:opacity .25s} .pi-bg.on{opacity:1} .pi-sheet{width:100%;max-width:460px;max-height:78vh;max-height:calc(100dvh - 40px);display:flex;flex-direction:column;overflow:hidden;background:var(--cream,#fff);border-radius:26px;padding:18px 16px 14px; transform:translateY(24px) scale(.96);opacity:0;transition:transform .38s cubic-bezier(.2,.9,.3,1.1),opacity .25s;box-shadow:0 24px 50px -20px rgba(0,0,0,.5);text-align:start} .pi-bg.on .pi-sheet{opacity:1} .pi-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:0 2px} .pi-foot{flex:none;padding-top:10px} .pi-bg.on .pi-sheet{transform:none} .pi-grab{display:none} .pi-hero{display:grid;place-items:center;width:52px;height:52px;margin:2px auto 8px;border-radius:22px;background:var(--grad);color:#fff;box-shadow:0 12px 24px -10px var(--coral);animation:supBeat 2.2s ease-in-out infinite} .pi-hero svg{width:30px;height:30px} .pi-t{text-align:center;font-weight:900;font-size:19px;color:var(--ink)} .pi-s{text-align:center;font-size:13.5px;color:var(--ink-soft);line-height:1.9;margin:6px 4px 16px} .pi-it{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:18px;background:#fff;border:1px solid var(--line);margin-bottom:9px;opacity:0;animation:supIn .4s ease forwards} .pi-ic{flex:none;width:40px;height:40px;border-radius:14px;display:grid;place-items:center;font-size:20px;background:rgba(65,201,142,.12)} .pi-it b{display:block;font-size:14px;color:var(--ink);margin-bottom:3px} .pi-it span{font-size:12.8px;color:var(--ink-soft);line-height:1.8} .pi-note{margin:0 0 10px;padding:11px 14px;border-radius:16px;background:rgba(65,201,142,.10);color:var(--ink);font-size:13px;line-height:1.9;text-align:center} .pi-ok{width:100%} .pi-it{padding:10px 12px}.pi-s{margin-bottom:12px} @media (prefers-reduced-motion:reduce){.pi-hero,.priv-help{animation:none}.pi-it{animation:none;opacity:1}} .priv-card{background:var(--glass-strong);border:1px solid var(--line);border-radius:18px;padding:2px 14px;margin-top:2px;text-align:start;box-shadow:var(--shadow-sm)} .pf-lang{display:flex;gap:8px} .lang-opt{flex:1;padding:13px 6px;border-radius:15px;border:1.5px solid var(--line);background:var(--glass-strong); font:inherit;font-size:14px;font-weight:700;color:var(--ink-soft);cursor:pointer;transition:.15s;box-shadow:var(--shadow-sm)} .lang-opt:active{transform:scale(.97)} .lang-opt.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 10px 22px -12px rgba(255,92,138,.8)} .pf-logout{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:26px;padding:15px; border-radius:16px;border:1.5px solid #ecc0cf;background:#fff;color:#d8456a;font:inherit;font-weight:700;font-size:15px; cursor:pointer;box-shadow:var(--shadow-sm);transition:.15s} .pf-logout:active{transform:scale(.98)} .pf-logout svg{width:18px;height:18px} /* انتخاب‌گرِ قالب — خلاقانه و جلب‌توجه */ .pf-theme-head{margin-top:26px;background:linear-gradient(135deg,var(--blush),#fff);border:1.5px solid var(--line);border-radius:16px;padding:13px 15px} .pf-theme-ttl{font-weight:800;color:var(--plum);font-size:15px;display:flex;align-items:center;gap:8px} .pf-theme-new{background:var(--grad);color:#fff;font-size:10px;font-weight:800;border-radius:999px;padding:2px 9px;letter-spacing:.3px;animation:themePulse 1.8s ease-in-out infinite} @keyframes themePulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.85}} .pf-theme-sub{font-size:12.5px;color:var(--ink-soft);margin-top:5px;line-height:1.7} .pf-theme-btn{display:flex;align-items:center;gap:12px;width:100%;text-align:start;font:inherit;cursor:pointer;margin-top:26px} .pf-theme-btn .pf-theme-head{margin:0} .pf-theme-cur{flex:none;width:42px;height:42px;border-radius:13px;box-shadow:0 6px 14px -6px rgba(0,0,0,.35)} .pf-theme-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px} .pf-theme-ch{flex:none;font-size:22px;color:var(--ink-soft);line-height:1} .th-pop{position:fixed;inset:0;z-index:9000;background:rgba(20,10,30,.5);display:flex;align-items:flex-end;justify-content:center;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)} .th-sheet{width:100%;max-width:520px;background:var(--bg,var(--cream,#fff));border-radius:24px 24px 0 0;padding:16px 16px calc(24px + env(safe-area-inset-bottom));box-shadow:0 -12px 40px rgba(0,0,0,.25)} .th-h{display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--plum);font-size:16px;margin-bottom:14px} .th-x{border:0;background:rgba(0,0,0,.06);width:34px;height:34px;border-radius:50%;font-size:15px;cursor:pointer;color:var(--ink-soft)} .th-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 8px;justify-items:center} .pf-themes{display:flex;gap:12px;overflow-x:auto;padding:14px 2px 6px;-webkit-overflow-scrolling:touch;scrollbar-width:none} .pf-themes::-webkit-scrollbar{display:none} .pf-theme{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:7px;background:none;border:none;cursor:pointer;font:inherit;padding:2px} .pf-theme-sw{width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px -8px rgba(0,0,0,.35);border:3px solid transparent;transition:transform .15s,border-color .15s} .pf-theme-sw svg{width:26px;height:26px} .pf-theme.on .pf-theme-sw{border-color:var(--plum);transform:scale(1.06)} .pf-theme:active .pf-theme-sw{transform:scale(.94)} .pf-theme-nm{font-size:11.5px;font-weight:700;color:var(--ink-soft)} .pf-theme.on .pf-theme-nm{color:var(--plum)} .priv-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)} .priv-row:last-child{border-bottom:none} .priv-row>span{font-size:13.5px;font-weight:600;color:var(--plum);line-height:1.6} .priv-age{padding:8px 0 12px;border-bottom:1px solid var(--line)} .priv-reason{display:inline-flex;align-items:center;gap:9px;background:rgba(180,155,240,.14);border:1px solid rgba(180,155,240,.45);color:var(--plum); font-weight:700;font-size:14px;padding:12px 16px;border-radius:15px;margin:2px 0 18px;line-height:1.6} .priv-reason svg{width:19px;height:19px;color:var(--lavender);flex:none} /* support bot */ .sup-av{background:var(--grad)!important;display:grid;place-items:center;color:#fff} .sup-av svg{width:24px;height:24px} .sup-panel{padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);max-height:52vh;overflow:hidden;min-height:0} /* فقط فیلدها اسکرول می‌شوند؛ «بازگشت» بالا و دکمهٔ ثبت پایین ثابت می‌مانند */ .sup-scroll{display:flex;flex-direction:column;gap:8px;overflow-y:auto;min-height:0;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-bottom:2px} .sup-panel:empty{display:none;padding:0;border:none} .sup-opt{width:100%;text-align:start;font:inherit;font-size:14px;font-weight:600;color:var(--plum);background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:13px 15px;cursor:pointer;box-shadow:var(--shadow-sm);transition:.15s} .sup-opt:active{transform:scale(.98)} .sup-opt:hover{border-color:var(--coral)} .sup-back{font-size:16px;font-weight:800;color:var(--coral);cursor:pointer;padding:8px 14px;align-self:center;text-align:center;width:100%} .sup-field{width:100%;font:inherit;font-size:15px;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;text-align:start} .sup-field:focus{border-color:var(--coral);outline:none;box-shadow:0 0 0 4px rgba(255,92,138,.12)} .sup-area{min-height:82px;resize:vertical;line-height:1.7} .sup-photo-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;font:inherit;font-weight:700;font-size:14px;color:var(--coral);background:rgba(255,92,138,.06);border:1.5px dashed var(--coral);border-radius:12px;padding:12px;cursor:pointer} .sup-photo-btn.done{color:#2bbd82;border-color:#7fd9b4;background:rgba(43,189,130,.08)} .sup-photo-btn svg{width:18px;height:18px} .sup-submit{width:100%;margin-top:2px;flex:none} .sup-back{flex:none} /* ===== پشتیبانی — طراحیِ جدید: گزینه‌های کارتی با آیکن، فیلدهای نرم، کارتِ ارسالِ فیش ===== */ .sup-panel{background:linear-gradient(180deg,rgba(255,255,255,0),rgba(65,221,156,.05))} .sup-opt2{position:relative;display:flex;align-items:center;gap:12px;width:100%;text-align:start;font:inherit;background:#fff;border:1.5px solid var(--line);border-radius:18px;padding:11px 12px 11px 14px;cursor:pointer;box-shadow:0 6px 18px -12px rgba(30,70,50,.35);transition:transform .15s,border-color .2s,box-shadow .2s;opacity:0;animation:supIn .38s cubic-bezier(.2,.9,.3,1.2) forwards} .sup-opt2:active{transform:scale(.975)} .sup-opt2:hover{border-color:var(--sc,var(--coral));box-shadow:0 10px 24px -14px var(--sc,var(--coral))} .sup-opt2 .so-ic{flex:none;width:42px;height:42px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--sc,#41dd9c),var(--sc2,#2bbd82));box-shadow:0 6px 14px -6px var(--sc,#41dd9c)} .sup-opt2 .so-ic svg{width:21px;height:21px} .sup-opt2 .so-tx{flex:1;min-width:0;font-size:14px;font-weight:700;color:var(--ink);line-height:1.55} .sup-opt2 .so-go{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.04);color:var(--ink-soft);transition:.2s} .sup-opt2:hover .so-go{background:var(--sc,var(--coral));color:#fff} .sup-opt2 .so-go svg{width:15px;height:15px} [dir=rtl] .sup-opt2 .so-go svg{transform:scaleX(-1)} .sup-opt2.hot .so-ic{animation:supBeat 1.8s ease-in-out infinite} @keyframes supIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}} @keyframes supBeat{0%,100%{transform:scale(1)}12%{transform:scale(1.12)}24%{transform:scale(.97)}36%{transform:scale(1.07)}50%{transform:scale(1)}} .sup-field{border-radius:16px;background:rgba(255,255,255,.9);border:1.5px solid rgba(40,90,70,.12);padding:14px 16px;transition:border-color .2s,box-shadow .2s,background .2s} .sup-field:focus{background:#fff;border-color:#41c98e;box-shadow:0 0 0 4px rgba(65,201,142,.14)} .sup-fwrap{position:relative;opacity:0;animation:supIn .35s ease forwards} .sup-fwrap .sf-ic{position:absolute;inset-inline-start:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:#8fb8a5;pointer-events:none} .sup-fwrap.area .sf-ic{top:16px;transform:none} .sup-fwrap .sup-field{padding-inline-start:42px} .sup-rcpt{position:relative;display:flex;align-items:center;gap:14px;width:100%;font:inherit;text-align:start;cursor:pointer;padding:14px;border-radius:22px;border:2px dashed rgba(65,201,142,.55);background:linear-gradient(135deg,rgba(65,221,156,.10),rgba(255,255,255,.7));box-shadow:0 10px 26px -18px rgba(43,189,130,.7);transition:.2s;opacity:0;animation:supIn .4s ease forwards} .sup-rcpt:active{transform:scale(.985)} .sup-rcpt .rc-cam{position:relative;flex:none;width:62px;height:62px;border-radius:18px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#5fd39a,#2e9d6a);box-shadow:0 10px 20px -10px #2e9d6a;overflow:visible} .sup-rcpt .rc-cam svg{width:30px;height:30px} .sup-rcpt .rc-cam img{width:100%;height:100%;object-fit:cover;border-radius:18px} .sup-rcpt .rc-plus{position:absolute;top:-7px;inset-inline-end:-7px;width:24px;height:24px;border-radius:50%;background:#ff5c8a;color:#fff;display:grid;place-items:center;border:2.5px solid #fff;font-weight:900;font-size:15px;line-height:1;animation:supBeat 1.8s ease-in-out infinite} .sup-rcpt .rc-tx{flex:1;min-width:0} .sup-rcpt .rc-t{font-size:15.5px;font-weight:800;color:var(--ink)} .sup-rcpt .rc-s{font-size:12.5px;color:var(--ink-soft);margin-top:3px;line-height:1.6} .sup-rcpt .rc-up{flex:none;width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;color:#2e9d6a;box-shadow:0 6px 16px -8px rgba(0,0,0,.3)} .sup-rcpt .rc-up svg{width:20px;height:20px} .sup-rcpt.busy .rc-up svg{animation:spin 1s linear infinite} .sup-rcpt.done{border-style:solid;border-color:#41c98e;background:linear-gradient(135deg,rgba(65,221,156,.18),#fff)} .sup-rcpt.done .rc-plus{background:#2bbd82;animation:none} @keyframes spin{to{transform:rotate(360deg)}} @media (prefers-reduced-motion:reduce){.sup-opt2,.sup-fwrap,.sup-rcpt{animation:none;opacity:1}.sup-opt2.hot .so-ic,.sup-rcpt .rc-plus{animation:none}} .sup-note{margin:auto;text-align:center;color:var(--ink-soft);font-size:13px;padding:18px;display:flex;flex-direction:column;align-items:center;gap:9px;line-height:1.8} /* ===== پیگیریِ پرداختِ درگاه (فهرستِ تلاش‌ها) ===== */ .spl-card{background:#fff;border:1.5px solid var(--line);border-radius:18px;padding:12px 14px;display:flex;flex-direction:column;gap:9px;box-shadow:0 6px 18px -12px rgba(30,70,50,.35);flex:none} .spl-top{display:flex;align-items:center;justify-content:space-between;gap:10px} .spl-when{font-size:13px;font-weight:700;color:var(--ink)} .spl-amt{font-size:13.5px;font-weight:800;color:var(--plum)} .spl-msg{font-size:13px;line-height:1.85;padding:9px 12px;border-radius:12px;font-weight:600} .spl-msg.ok{background:rgba(35,163,107,.12);color:#12794d} .spl-msg.bad{background:rgba(224,64,80,.1);color:#c0283a} .spl-msg.wait{background:rgba(245,185,74,.18);color:#8a5a00} .spl-msg.warn{background:rgba(108,140,255,.14);color:#2f48b8} .spl-btn{font:inherit;font-size:13.5px;font-weight:800;border-radius:12px;padding:10px 12px;cursor:pointer;border:1.5px solid var(--line);background:#fff;color:var(--ink);transition:.15s;width:100%} .spl-btn:active{transform:scale(.97)} .spl-btn[disabled]{opacity:.55;cursor:default;transform:none} .spl-pri{width:100%;margin:0} .spl-other{flex:none;text-align:center;font-size:12.5px;font-weight:700;color:var(--ink-soft);padding:6px;cursor:pointer;text-decoration:underline} .sup-note .dotpulse{width:9px;height:9px;border-radius:50%;background:var(--coral);animation:pulseDot 1.6s ease-out infinite} /* اعلانِ پاسخِ پشتیبانی */ #supIcon{position:relative;overflow:visible;width:auto!important;padding:0 12px 0 10px;gap:6px;display:inline-flex;align-items:center;justify-content:center} #supIcon svg{flex:none} #supIcon .sup-lbl{font-size:13px;font-weight:800;white-space:nowrap;line-height:1} /* پاسخِ جدید: متنِ درخشان + گرادیانِ متحرک */ #supIcon.sup-alert{background-size:220% 220%!important;animation:supGradMove 2.4s ease infinite} #supIcon.sup-alert .sup-lbl{animation:supLblGlow 1.2s ease-in-out infinite alternate} #supIcon.sup-alert svg{animation:supBell 2.4s ease-in-out infinite;transform-origin:50% 20%} @keyframes supGradMove{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} @keyframes supLblGlow{from{text-shadow:0 0 0 rgba(255,255,255,0)}to{text-shadow:0 0 10px rgba(255,255,255,.95)}} @keyframes supBell{0%,60%,100%{transform:rotate(0)}65%{transform:rotate(-16deg)}70%{transform:rotate(14deg)}75%{transform:rotate(-10deg)}80%{transform:rotate(6deg)}85%{transform:rotate(0)}} #supIcon .sup-ic-badge{position:absolute;top:-6px;inset-inline-start:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#ff3b6b;color:#fff;font-size:11px;font-weight:800;display:none;align-items:center;justify-content:center;box-shadow:0 4px 10px -2px rgba(255,59,107,.7);z-index:3} #supIcon .sup-ic-badge.on{display:flex;animation:supBadgePop .4s cubic-bezier(.2,.9,.3,1) both} @keyframes supBadgePop{from{transform:scale(0)}to{transform:scale(1)}} #supIcon.sup-alert{color:#fff;background:var(--grad);border-color:transparent;box-shadow:0 10px 22px -10px rgba(255,92,138,.8)} #supIcon.sup-alert::after{content:"";position:absolute;inset:-4px;border-radius:18px;border:2px solid var(--coral);opacity:0;animation:supRing 1.8s ease-out infinite} @keyframes supRing{0%{opacity:.7;transform:scale(.85)}70%{opacity:0;transform:scale(1.2)}100%{opacity:0}} #supIcon.sup-shake{animation:supShake .6s cubic-bezier(.36,.07,.19,.97) both} @keyframes supShake{10%,90%{transform:translateX(-1px) rotate(-4deg)}20%,80%{transform:translateX(2px) rotate(4deg)}30%,50%,70%{transform:translateX(-3px) rotate(-6deg)}40%,60%{transform:translateX(3px) rotate(6deg)}} .rnotif.sup .rnotif-av{background:var(--grad);display:grid;place-items:center} .rnotif.sup .rnotif-av svg{width:26px;height:26px;color:#fff;filter:none;transform:none} .fab-badge{position:absolute;top:-3px;inset-inline-end:-3px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#ff3b6b;color:#fff;font-size:11px;font-weight:800;display:none;align-items:center;justify-content:center;border:2px solid var(--cream);box-shadow:0 4px 10px -2px rgba(255,59,107,.7);z-index:4} .fab-badge.on{display:flex;animation:fabBadgePop .4s cubic-bezier(.2,.9,.3,1) both} @keyframes fabBadgePop{from{transform:scale(0)}to{transform:scale(1)}} /* راهنمای تنظیمِ اسلایدرِ قد/وزن */ .sl-tip{display:flex;align-items:center;justify-content:center;gap:5px;font-size:12.5px;font-weight:700;color:var(--coral);margin-top:9px;animation:slTipBob 1.4s ease-in-out infinite} @keyframes slTipBob{0%,100%{transform:translateY(0);opacity:.7}50%{transform:translateY(-3px);opacity:1}} input[type=range].sl-hint::-webkit-slider-thumb{animation:slThumb 1.5s ease-out infinite} input[type=range].sl-hint::-moz-range-thumb{animation:slThumb 1.5s ease-out infinite} @keyframes slThumb{0%{box-shadow:0 0 0 0 rgba(255,92,138,.6)}70%{box-shadow:0 0 0 12px rgba(255,92,138,0)}100%{box-shadow:0 0 0 0 rgba(255,92,138,0)}} @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.ads-track{animation:adscroll 40s linear infinite!important}} /* ── حالتِ سبک (litefx) برای WebViewِ اپ اندروید (sen ve ben) ── WebView در رندرِ blur/انیمیشنِ دائمی ضعیف است و هنگامِ بازشدنِ کیبورد کل صفحه resize و دوباره‌رندر می‌شود → لگ. این حالت فقط داخلِ اپ فعال می‌شود؛ مرورگر دست‌نخورده می‌ماند. - لایه‌های صرفاً تزئینی (حباب‌های بلور، قلب‌های شناور، مدارِ چرخان) حذف می‌شوند. - انیمیشن‌ها به‌جای حذف (که المان‌های popIn را نامرئی می‌کرد) «فوری» می‌شوند: duration=.01s + iteration=1 یعنی انیمیشن‌های forwards یک‌ضرب به حالتِ نهایی می‌رسند و انیمیشن‌های بی‌نهایت عملاً خاموش می‌شوند. */ html.litefx .aurora,html.litefx .li-hearts,html.litefx .orbit{display:none!important} html.litefx *,html.litefx *::before,html.litefx *::after{ animation-duration:.01s!important;animation-iteration-count:1!important;animation-delay:0s!important; transition-duration:.12s!important; /* فقط propertyهای ارزانِ کامپوزیتوری/رنگی — نه height/top که reflow می‌سازند */ transition-property:transform,opacity,background-color,border-color,color,box-shadow!important; backdrop-filter:none!important;-webkit-backdrop-filter:none!important; mix-blend-mode:normal!important; } html.litefx .phone{transition:none!important} /* تغییرِ سایزِ قاب باید یک‌ضرب باشد، نه انیمیت */ /* گلایدرهای کیبورد: transform اینها هر فریم آپدیت می‌شود؛ transition رویشان = لختی/عقب‌ماندن از کیبورد */ html.litefx .cp-composer,html.litefx .cp-pend,html.litefx .cp-emoji,html.litefx .cp-msgs{transition:none!important} /* اسکرول روان‌تر روی اندروید: کانتینرهای اسکرول‌شونده کامپوزیت می‌شوند تا حین اسکرول repaint کمتری بخورند */ html.litefx .cp-msgs,html.litefx .scroll,html.litefx .deck{transform:translateZ(0);will-change:scroll-position} /* ===================== اعتبار و پرداخت — ظاهرِ جدید ===================== */ #credPop,#payPop{padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom))} #credPop .fsheet,#payPop .fsheet{max-width:min(370px,100%)!important;max-height:100%;padding:18px 16px 18px;scrollbar-width:none;overscroll-behavior:contain;animation:cwSheet .5s cubic-bezier(.2,.9,.3,1.2) both} #credPop .fsheet::-webkit-scrollbar,#payPop .fsheet::-webkit-scrollbar{display:none} @keyframes cwSheet{from{opacity:0;transform:translateY(30px) scale(.94)}to{opacity:1;transform:none}} #credPop h2,#payPop h2{font-size:19px;margin:4px 0 14px} #credPop .fx,#payPop .fx,#payPop .fback{transition:transform .2s} #credPop .fx:active,#payPop .fx:active{transform:rotate(90deg) scale(.9)} @keyframes cwAur{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}} @keyframes cwShine{0%,50%{transform:translateX(-170%) skewX(-18deg)}100%{transform:translateX(330%) skewX(-18deg)}} @keyframes cwTw{0%,100%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1)}} @keyframes cwSpin{to{transform:rotate(360deg)}} @keyframes cwIn{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}} .cw-shine{position:relative;overflow:hidden} .cw-shine::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);animation:cwShine 4.8s ease-in-out infinite;animation-delay:var(--sd,0s);pointer-events:none} .cw-st{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff;animation:cwTw 3s ease-in-out infinite;pointer-events:none} /* کارتِ موجودی */ .cred-hero{margin:0 0 12px} .cred-hero::before{display:none} .cw-card{position:relative;overflow:hidden;border-radius:24px;padding:18px 18px 20px;color:#fff;text-align:start;background:var(--grad);background-size:220% 220%;animation:cwIn .55s cubic-bezier(.2,.9,.3,1.2) both,cwAur 9s ease infinite;box-shadow:0 20px 36px -22px var(--coral),inset 0 1px 0 rgba(255,255,255,.35)} .cw-glow{position:absolute;width:260px;height:260px;top:-150px;inset-inline-start:-80px;border-radius:50%;background:conic-gradient(from 0deg,rgba(255,255,255,.0),rgba(255,255,255,.35),rgba(255,255,255,0) 40%);animation:cwSpin 9s linear infinite;pointer-events:none} .cw-top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px} .cw-lbl{font-size:12.5px;font-weight:800;opacity:.92;letter-spacing:.02em} .cw-gem{width:44px;height:44px;color:#ffd36e;filter:drop-shadow(0 6px 12px rgba(0,0,0,.25));animation:gemFloat 3.4s ease-in-out infinite} .cw-card .cred-bal{color:#fff;font-size:44px;margin-top:2px;text-shadow:0 4px 16px rgba(0,0,0,.18)} .cw-card .cred-bal small{color:rgba(255,255,255,.88)} .cw-chip{position:relative;display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:11.5px;font-weight:800;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3);padding:5px 11px;border-radius:999px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)} .cw-card.low .cw-chip{animation:supBeat 1.8s ease-in-out infinite} /* تب‌ها با نشانگرِ لغزان */ .cred-tabs{position:relative;margin:0 0 4px} .cred-tabs::before{content:"";position:absolute;top:5px;bottom:5px;width:calc((100% - 22px)/3);inset-inline-start:5px;border-radius:11px;background:var(--grad);box-shadow:0 8px 18px -8px var(--coral);transition:inset-inline-start .35s cubic-bezier(.2,.9,.3,1.2)} .cred-tabs.log::before{inset-inline-start:calc(5px + (100% - 22px)/3 + 6px)} .cred-tabs.pay::before{inset-inline-start:calc(5px + 2*((100% - 22px)/3 + 6px))} .cred-tabs .cred-tab{font-size:12.5px;padding:8px 2px} #credPanePay{max-height:58vh;overflow-y:auto;padding-top:12px} .cred-tab{position:relative;z-index:1} .cred-tab.on{background:transparent!important;box-shadow:none!important;color:#fff} /* ردیفِ هزینه */ .cred-row{border-radius:18px;padding:13px;box-shadow:0 10px 22px -18px rgba(0,0,0,.35);animation:payQIn .2s ease-out both} .cred-row .ci{border-radius:14px;background:var(--grad);color:#fff;box-shadow:0 8px 16px -8px var(--coral);animation:gemFloat 3.6s ease-in-out infinite} /* بسته‌ها */ .cred-pkgs{gap:10px;margin-top:18px;align-items:stretch} .cred-pkg{border-radius:20px;padding:20px 8px 12px;background:var(--glass-strong,#fff);box-shadow:0 12px 24px -18px rgba(0,0,0,.4);animation:payQIn .2s ease-out both;overflow:visible} .cred-pkg::after{content:"";position:absolute;inset:0;border-radius:inherit;overflow:hidden;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 45%,transparent 60%);background-size:300% 100%;animation:cwSweep 4.5s ease-in-out infinite;animation-delay:var(--sd,0s);pointer-events:none} @keyframes cwSweep{0%,55%{background-position:150% 0}100%{background-position:-150% 0}} .cpk-gem{display:block;width:34px;height:34px;margin:0 auto 6px;color:#e8a32a;filter:drop-shadow(0 5px 9px rgba(201,150,40,.45));animation:gemFloat 3s ease-in-out infinite;animation-delay:var(--gd,0s)} .cred-pkg .n{font-size:26px;line-height:1.1} .cred-pkg .p{font-size:12.5px;font-weight:700;margin-top:6px;color:var(--ink)} .cpk-hint{margin-top:10px;padding:7px 4px;border-radius:12px;background:var(--grad)!important;color:#fff!important;font-size:11px!important;box-shadow:0 8px 14px -10px var(--coral)} .cred-pkg.spotpick{border:2px solid transparent;background:linear-gradient(var(--cream,#fff),var(--cream,#fff)) padding-box,linear-gradient(120deg,#f4c862,#ffb347,#ffe29a,#f4c862) border-box;background-size:100% 100%,300% 300%;animation:cwIn .55s cubic-bezier(.2,.9,.3,1.2) forwards,cwBorder 3s linear infinite;box-shadow:0 18px 34px -16px rgba(244,200,98,.85)} @keyframes cwBorder{to{background-position:0 0,300% 0}} .cred-pkg.spotpick .cpk-gem{width:40px;height:40px;color:#f0a818} .cred-pkg.spotpick .cpk-hint{background:linear-gradient(120deg,#f4c862,#ffb347)!important;color:#5a3d00!important} .pkg-badge{top:-12px;font-size:10px;padding:4px 10px;z-index:2} .cred-recover{border-style:dashed;border-radius:16px;margin-top:14px} .cred-sec{display:flex;align-items:center;gap:8px} .cred-sec::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)} [dir=rtl] .cred-sec::after{background:linear-gradient(270deg,var(--line),transparent)} /* پرداخت: بلیتِ خلاصه */ .pay-sum{position:relative;overflow:hidden;border:none;border-radius:20px;padding:16px 18px;color:#fff;background:var(--grad);background-size:220% 220%;animation:cwIn .5s ease both,cwAur 9s ease infinite;box-shadow:0 16px 30px -20px var(--coral);margin:0 0 6px} .pay-sum::before,.pay-sum::after{content:"";position:absolute;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;background:var(--cream,#fff)} .pay-sum::before{left:-9px}.pay-sum::after{right:-9px} .pay-sum .ps-c,.pay-sum .ps-p{position:relative;color:#fff} .pay-sum .ps-c{font-size:18px;display:flex;align-items:center;gap:7px} .pay-sum .ps-c svg{width:22px;height:22px;color:#ffd36e;animation:gemFloat 3s ease-in-out infinite} .pay-sum .ps-p{font-size:14px;background:rgba(255,255,255,.22);padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.3)} /* روش‌های پرداخت */ .pay-opt{position:relative;overflow:hidden;border-radius:20px;padding:15px 14px;margin-bottom:10px;animation:payQIn .2s ease-out both;box-shadow:0 12px 24px -20px rgba(0,0,0,.45);transition:transform .15s,box-shadow .2s,border-color .2s} /* روش‌های پرداخت همان لحظه دیده می‌شوند (قبلاً با opacity:0 و تأخیر شروع می‌شدند و روی آیفون دیر ظاهر می‌شدند) */ @keyframes payQIn{from{transform:translateY(5px)}to{transform:none}} .pay-opt:active{transform:scale(.97)} .pay-opt:hover{transform:translateY(-2px);box-shadow:0 18px 28px -18px var(--coral)} .pay-ic{width:48px;height:48px;border-radius:16px;color:#fff;box-shadow:0 10px 18px -10px rgba(0,0,0,.4)} #payOnlineOpt .pay-ic{background:var(--grad)} #payCardOpt .pay-ic{background:linear-gradient(135deg,#f4b740,#e8862a)} #payCryptoOpt .pay-ic{background:linear-gradient(135deg,#26a17b,#1b7f63)} /* آیکنِ شیشه‌ایِ درگاهِ اینترنتی */ #gatewayChooser .pay-ic{position:relative;overflow:hidden;color:#fff; background:linear-gradient(145deg,rgba(255,122,162,.95),rgba(155,92,255,.92)); border:1px solid rgba(255,255,255,.55); box-shadow:0 12px 22px -10px rgba(155,92,255,.65),inset 0 1px 0 rgba(255,255,255,.7),inset 0 -6px 12px rgba(80,30,160,.25); -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)} #gatewayChooser .pay-ic::before{content:"";position:absolute;inset:0 0 50% 0;border-radius:inherit; background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));pointer-events:none} #gatewayChooser .pay-ic::after{content:"";position:absolute;top:-60%;left:-80%;width:50%;height:220%;transform:rotate(25deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:gwShine 3.4s ease-in-out infinite;pointer-events:none} #gatewayChooser .pay-ic svg{position:relative;z-index:1;filter:drop-shadow(0 1px 2px rgba(60,20,120,.45))} @keyframes gwShine{0%,55%{left:-80%}100%{left:160%}} @media (prefers-reduced-motion:reduce){#gatewayChooser .pay-ic::after{animation:none;display:none}} /* نوتیفِ پیام: دکمهٔ بستن + کشیدن به بالا */ .rnotif{touch-action:none} .rnotif.drag{transition:none} .rnotif-x{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:0;cursor:pointer; background:rgba(255,255,255,.1);color:rgba(255,255,255,.75);padding:0} .rnotif-x svg{width:15px;height:15px} .rnotif-x:active{background:rgba(255,255,255,.2)} .rnotif-grip{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:34px;height:4px;border-radius:4px;background:rgba(255,255,255,.18)} .pay-ic svg{animation:cwIc 3.2s ease-in-out infinite} #payCardOpt .pay-ic svg{animation-delay:.4s}#payCryptoOpt .pay-ic svg{animation-delay:.8s} @keyframes cwIc{0%,70%,100%{transform:none}78%{transform:scale(1.18) rotate(-8deg)}86%{transform:scale(1.1) rotate(6deg)}} .pay-go{transition:transform .2s;animation:cwNudge 2.2s ease-in-out infinite} @keyframes cwNudge{0%,60%,100%{translate:0}75%{translate:-4px 0}} [dir=ltr] .pay-go{animation-name:cwNudgeL} @keyframes cwNudgeL{0%,60%,100%{translate:0}75%{translate:4px 0}} /* کارت‌به‌کارت: شبیهِ کارتِ بانکی */ #payCardBox .pay-card{position:relative;overflow:hidden;border:none;border-radius:22px;padding:52px 18px 16px;color:#fff;background:linear-gradient(135deg,#2b2340,#4a3a6e 55%,#2b2340);background-size:200% 200%;animation:cwIn .5s ease both,cwAur 10s ease infinite;box-shadow:0 22px 36px -22px rgba(40,20,60,.9)} #payCardBox .pay-card::before{content:"";position:absolute;top:16px;inset-inline-end:18px;width:40px;height:30px;border-radius:7px;background:linear-gradient(135deg,#f6d77a,#c99a2e);box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)} #payCardBox .pay-card::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.18),transparent);animation:cwShine 5s ease-in-out infinite;pointer-events:none} #payCardBox .pay-card-row{border-bottom-color:rgba(255,255,255,.12);padding:10px 0} #payCardBox .pay-card-row .lbl{color:rgba(255,255,255,.7)} #payCardBox .pay-card-row .val{color:#fff} #payCardBox #payCardNum{font-size:19px;letter-spacing:.12em;font-family:ui-monospace,monospace} #payCardBox .pay-card-row:first-child{flex-direction:column;align-items:flex-start;gap:6px} #payCryptoBox .pay-card{border-radius:20px;box-shadow:0 14px 26px -20px rgba(0,0,0,.4);animation:cwIn .45s ease both} .cr-net{animation:cwIn .4s ease both} .pay-file{border-radius:20px!important;transition:transform .15s} .pay-file:active{transform:scale(.98)} @media (max-width:360px){.cred-pkgs{gap:7px}.cred-pkg{padding:18px 5px 10px}.cred-pkg .n{font-size:22px}.cw-card .cred-bal{font-size:38px}.pay-opt{padding:13px 12px}.pay-ic{width:42px;height:42px}} @media (prefers-reduced-motion:reduce){.cw-card,.cred-pkg,.pay-opt,.pay-sum,#payCardBox .pay-card,.cred-row{animation:none!important;opacity:1}.cw-shine::after,.cred-pkg::after,.cw-glow,.pay-go,.pay-ic svg,.cpk-gem,.cw-gem{animation:none}} /* ===== اعتبار — نسخهٔ جمع‌وجور + انیمیشنِ دکمهٔ اعتبار ===== */ #credPop h2{margin:2px 0 10px;font-size:18px} .cred-hero{margin:0 0 10px} .cw-card{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"gem top" "gem bal" "chip chip";column-gap:14px;align-items:center;padding:13px 16px 12px;border-radius:20px} .cw-top{grid-area:top}.cw-card .cred-bal{grid-area:bal;font-size:32px;margin:0} .cw-card .cw-top .cw-gem{display:none} .cw-gem2{grid-area:gem;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)} .cw-gem2 svg{width:28px;height:28px;color:#ffd36e;filter:drop-shadow(0 4px 8px rgba(0,0,0,.25));animation:gemFloat 3.4s ease-in-out infinite} .cw-lbl{font-size:12px} .cw-chip{grid-area:chip;justify-self:start;margin-top:9px;font-size:11px;padding:4px 10px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .cred-tabs{margin-bottom:0} .cred-tab{padding:8px} .cred-sec{margin:11px 2px 7px;font-size:13.5px} .cred-row{padding:10px 12px;margin-bottom:0} .cred-row .ci{width:36px;height:36px} .cred-row .cl .t{font-size:14px}.cred-row .cl .d{font-size:11.5px;line-height:1.65} .cred-pkgs{margin-top:14px;gap:9px} .cred-pkg{padding:15px 6px 10px} .cpk-gem{width:24px;height:24px;margin-bottom:3px} .cred-pkg.spotpick .cpk-gem{width:28px;height:28px} .cred-pkg .n{font-size:22px} .cred-pkg .p{font-size:12px;margin-top:3px} .cpk-hint{margin-top:8px;padding:6px 4px} .cred-recover{margin-top:10px;padding:10px 12px} #credPop .fsheet{padding:14px 14px 14px} /* دکمهٔ اعتبار در هدر */ .credpill{position:relative;overflow:hidden;isolation:isolate} .credpill::after{content:"";position:absolute;top:0;bottom:0;left:0;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:translateX(-160%) skewX(-18deg);animation:cpShine 4.2s ease-in-out infinite;pointer-events:none;z-index:2} @keyframes cpShine{0%,62%{transform:translateX(-160%) skewX(-18deg)}100%{transform:translateX(330%) skewX(-18deg)}} .credpill .gem{animation:cpGem 4.2s ease-in-out infinite;transform-origin:50% 60%} @keyframes cpGem{0%,55%,100%{transform:none;filter:drop-shadow(0 1px 1px rgba(201,150,40,.35))}62%{transform:translateY(-3px) rotate(-12deg) scale(1.18);filter:drop-shadow(0 0 6px rgba(255,200,60,.9))}70%{transform:translateY(0) rotate(8deg) scale(1.1)}78%{transform:none}} .credpill .plus{position:relative;animation:cpPlus 2.4s ease-in-out infinite} .credpill .plus::before{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--coral);opacity:0;animation:cpRing 2.4s ease-out infinite} @keyframes cpPlus{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}} @keyframes cpRing{0%{opacity:.7;transform:scale(.8)}100%{opacity:0;transform:scale(1.7)}} .credpill.bump .credNum{animation:cpBump .6s cubic-bezier(.2,.9,.3,1.6)} @keyframes cpBump{40%{transform:scale(1.4)}} @media (max-height:700px){.cpk-gem{display:none}.cred-pkg{padding-top:14px}.cred-row .cl .d{line-height:1.5}.cw-card{padding:11px 14px 10px}.cw-card .cred-bal{font-size:28px}.cw-chip{margin-top:6px}#credPop h2{margin-bottom:8px}} @media (prefers-reduced-motion:reduce){.credpill::after,.credpill .gem,.credpill .plus,.credpill .plus::before{animation:none}} /* ===================== پروفایل — گالریِ همهٔ عکس‌ها + انیمیشن ===================== */ .pv-photo{height:min(58%,calc(100vh - 300px));height:min(58%,calc(100dvh - 300px));min-height:320px} .pv-mainimg{transform-origin:50% 40%;animation:pvKen 14s ease-in-out infinite alternate} .pv-mainimg.swap{animation:pvSwap .55s cubic-bezier(.2,.9,.3,1) both,pvKen 14s ease-in-out .55s infinite alternate} @keyframes pvKen{from{transform:scale(1)}to{transform:scale(1.07)}} @keyframes pvSwap{from{opacity:.25;transform:scale(1.08);filter:blur(6px)}to{opacity:1;transform:scale(1);filter:none}} .pv-bars{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));left:14px;right:14px;z-index:4;display:flex;gap:5px;direction:ltr;pointer-events:none} [dir=rtl] .pv-bars{flex-direction:row-reverse} .pv-bars:empty{display:none} .pv-bars i{flex:1;height:3.5px;border-radius:9px;background:rgba(255,255,255,.35);overflow:hidden;position:relative;box-shadow:0 1px 4px rgba(0,0,0,.25)} .pv-bars i.done{background:rgba(255,255,255,.9)} .pv-bars i.on::after{content:"";position:absolute;inset:0;background:#fff;border-radius:inherit;animation:pvBarFill .5s ease both} @keyframes pvBarFill{from{transform:scaleX(0)}to{transform:scaleX(1)}} .pv-tap{position:absolute;top:0;bottom:0;width:38%;z-index:2;border:none;background:transparent;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent} .pv-tap.l{left:0}.pv-tap.r{right:0} .pv-tap:active{background:linear-gradient(90deg,rgba(255,255,255,.08),transparent)} .pv-tap.r:active{background:linear-gradient(270deg,rgba(255,255,255,.08),transparent)} .pv-count{position:absolute;z-index:4;bottom:48px;inset-inline-end:18px;font-size:12px;font-weight:800;color:#fff;padding:5px 11px;border-radius:999px;background:rgba(0,0,0,.32);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);animation:pvCapIn .5s ease .2s both} .pv-count:empty{display:none} .pv-photo .pv-back{z-index:5}.pv-photo .nstatus{z-index:5} .pv-photo .pv-back,.pv-photo #pvStatus{top:calc(28px + env(safe-area-inset-top,0px))} .pv-hint{position:absolute;z-index:4;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(0,0,0,.25);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;opacity:0;animation:pvHint 2.6s ease 1s 2 both;font-size:18px;font-weight:900} .pv-hint.n{inset-inline-end:12px} @keyframes pvHint{0%,100%{opacity:0;translate:0}30%,60%{opacity:1}45%{translate:-5px 0}} [dir=ltr] .pv-hint{animation-name:pvHintL} @keyframes pvHintL{0%,100%{opacity:0;translate:0}30%,60%{opacity:1}45%{translate:5px 0}} /* نوارِ بندانگشتی‌ها */ .pv-thumbs{justify-content:flex-start;overflow-x:auto;overflow-y:visible;gap:10px;margin:-58px 0 4px;padding:14px 18px 18px;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch} .pv-thumbs::-webkit-scrollbar{display:none} .pv-thumbs>:first-child{margin-inline-start:auto}.pv-thumbs>:last-child{margin-inline-end:auto} .pv-thumb{scroll-snap-align:center;width:56px;height:56px;opacity:0;animation:pvThIn .45s cubic-bezier(.2,.9,.3,1.4) forwards;position:relative} @keyframes pvThIn{from{opacity:0;transform:translateY(16px) scale(.6)}to{opacity:1;transform:none}} .pv-thumb.on{width:68px;height:68px;border-color:transparent;background:conic-gradient(from 0deg,var(--coral),#ffc06a,#b36cff,var(--coral)) border-box;border:3px solid transparent;transform:translateY(-4px)} .pv-thumb.on img{border-radius:50%;border:2px solid #fff;box-sizing:border-box} .pv-thumb img{transition:transform .3s} .pv-thumb:active img{transform:scale(.9)} @media (max-width:360px){.pv-thumb{width:48px;height:48px}.pv-thumb.on{width:60px;height:60px}.pv-name{font-size:26px}} @media (max-height:640px){.pv-photo{min-height:280px}} @media (prefers-reduced-motion:reduce){.pv-mainimg,.pv-mainimg.swap,.pv-thumb,.pv-hint{animation:none;opacity:1}} /* پروفایل — بدنه */ .pv-photo .pv-cap{bottom:62px} .pv-count{direction:ltr;bottom:auto;inset-inline-end:auto;top:calc(34px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%)} .pv-thumbs{gap:8px} .pv-thumb{width:50px;height:50px}.pv-thumb.on{width:62px;height:62px} .pv-body{padding-top:6px} .pv-stitle{display:flex;align-items:center;gap:8px;text-transform:none;letter-spacing:0;font-size:14px;opacity:1;margin:6px 2px 12px} .pv-stitle::before{content:"✨";font-size:15px;animation:gemFloat 3s ease-in-out infinite} .pv-stitle::after{content:"";flex:1;height:1.5px;border-radius:2px;background:linear-gradient(270deg,var(--coral),transparent);opacity:.35} [dir=ltr] .pv-stitle::after{background:linear-gradient(90deg,var(--coral),transparent)} .pv-tags{gap:9px} .pv-chip{position:relative;overflow:hidden;padding:7px 14px 7px 8px;gap:8px;border-radius:999px;font-weight:800;font-size:13.5px;box-shadow:0 8px 18px -14px var(--coral);border:1px solid rgba(255,92,138,.16)} [dir=rtl] .pv-chip{padding:7px 8px 7px 14px} .pv-ci{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--grad);color:#fff;flex:none;font-style:normal;box-shadow:0 6px 12px -6px var(--coral)} .pv-ci svg{width:15px;height:15px;color:#fff!important} .pv-chip::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.7),transparent);transform:translateX(-150%) skewX(-18deg);animation:pvChipShine 5s ease-in-out infinite;pointer-events:none} .pv-chip:nth-child(2)::after{animation-delay:.5s}.pv-chip:nth-child(3)::after{animation-delay:1s}.pv-chip:nth-child(4)::after{animation-delay:1.5s}.pv-chip:nth-child(5)::after{animation-delay:2s} @keyframes pvChipShine{0%,60%{transform:translateX(-150%) skewX(-18deg)}100%{transform:translateX(350%) skewX(-18deg)}} .pv-chip:active{transform:scale(.95)} .pvf-qod{position:relative;overflow:hidden;border-radius:22px;padding:16px 16px 14px;box-shadow:0 14px 26px -22px var(--coral)} .pvf-qod::before{content:"“";position:absolute;top:-18px;inset-inline-end:10px;font-size:90px;line-height:1;color:var(--coral);opacity:.12;font-family:Georgia,serif} .pvf-ans{font-size:16px} @media (prefers-reduced-motion:reduce){.pv-chip::after,.pv-stitle::before{animation:none}} /* دکمه‌های «پیام» و «لایک» همیشه پایینِ صفحه دیده می‌شوند (زیرِ نوارِ مرورگر گم نمی‌شوند) */ .pv-body .pv-actions{position:sticky;bottom:0;z-index:7;margin:18px -22px 0;padding:14px 22px calc(12px + env(safe-area-inset-bottom,0px)); background:linear-gradient(180deg,rgba(255,255,255,0),var(--cream) 34%);-webkit-backdrop-filter:none} .pv-body .pv-actions::before{content:"";position:absolute;left:22px;right:22px;top:4px;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);opacity:0;transition:opacity .2s} .pv-body .pv-actions .pv-act{animation:pvActIn .5s cubic-bezier(.2,.9,.3,1.3) .25s both} @keyframes pvActIn{from{opacity:0;transform:translateY(18px) scale(.95)}to{opacity:1;transform:none}} .pv-body{padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))} .pv-photo{height:min(52%,calc(100vh - 330px));height:min(52%,calc(100dvh - 330px));min-height:300px} @media (max-height:700px){.pv-photo{min-height:260px}.pv-name{font-size:26px}} /* ===================== ارتباط‌ها — ظاهرِ جدید ===================== */ .cn-hero{position:relative;overflow:hidden;flex:none;margin:calc(14px + env(safe-area-inset-top,0px)) 16px 12px;padding:20px 18px 16px;border-radius:26px;color:#fff; background:var(--grad);background-size:220% 220%;animation:cnAur 10s ease infinite,cnIn .6s cubic-bezier(.2,.9,.3,1.2) both;box-shadow:0 18px 34px -20px var(--coral)} @keyframes cnAur{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}} @keyframes cnIn{from{opacity:0;transform:translateY(-14px) scale(.96)}to{opacity:1;transform:none}} .cn-hero::before{content:"";position:absolute;width:220px;height:220px;border-radius:50%;top:-120px;inset-inline-end:-60px;background:radial-gradient(circle,rgba(255,255,255,.4),transparent 65%);animation:cnGlow 6s ease-in-out infinite} @keyframes cnGlow{50%{transform:translate(-20px,20px) scale(1.15);opacity:.7}} .cn-f{position:absolute;bottom:-24px;left:var(--x);font-style:normal;font-size:18px;opacity:0;animation:cnFloat 5.5s ease-in infinite;animation-delay:var(--d);pointer-events:none} @keyframes cnFloat{0%{transform:translateY(0) scale(.6) rotate(0);opacity:0}15%{opacity:.9}100%{transform:translateY(-130px) scale(1.1) rotate(20deg);opacity:0}} .cn-t{position:relative;display:flex;align-items:center;gap:9px;font-family:var(--font-display);font-weight:700;font-size:25px;text-shadow:0 3px 14px rgba(0,0,0,.15)} .cn-ic{display:inline-block;animation:cnBeat 2.2s ease-in-out infinite} @keyframes cnBeat{0%,100%{transform:scale(1)}12%{transform:scale(1.25)}24%{transform:scale(.95)}36%{transform:scale(1.12)}48%{transform:scale(1)}} .cn-s{position:relative;display:flex;flex-wrap:wrap;gap:7px;margin-top:10px} .cn-s:empty{display:none} .cn-s span{font-size:12px;font-weight:800;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)} /* تب‌ها */ .cn-segs{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:2px 16px 12px;overflow:visible} .cn-segs .cseg{flex-direction:column;gap:3px;padding:10px 4px 9px;border-radius:18px;min-width:0;font-size:12.5px;position:relative;animation:cnIn .5s ease both} .cn-segs .cseg:nth-child(3){animation-delay:.06s}.cn-segs .cseg:nth-child(4){animation-delay:.12s} .cn-segs .cseg span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%} .cs-e{font-size:19px;line-height:1;font-weight:400;transition:transform .3s cubic-bezier(.2,.9,.3,1.6)} .cn-segs .cseg.on .cs-e{transform:scale(1.2);animation:cnBeat 2.4s ease-in-out infinite} .cn-segs .cseg i{position:absolute;top:-6px;inset-inline-end:-2px;min-width:20px;height:20px;border:2px solid var(--cream);box-sizing:border-box;background:var(--coral);color:#fff} .cn-segs .cseg.on i{background:#fff;color:var(--coral)} .cn-segs .cseg.on{transform:translateY(-2px)} /* ردیف‌ها */ .favwrap{padding:4px 16px calc(120px + env(safe-area-inset-bottom,0px))} .favwrap.cn-anim .favrow{animation:cnRow .5s cubic-bezier(.2,.9,.3,1.2) both} @keyframes cnRow{from{opacity:0;transform:translateX(-24px) scale(.97)}to{opacity:1;transform:none}} [dir=rtl] .favwrap.cn-anim .favrow{animation-name:cnRowR} @keyframes cnRowR{from{opacity:0;transform:translateX(24px) scale(.97)}to{opacity:1;transform:none}} .favrow{position:relative;overflow:hidden;box-shadow:0 12px 24px -20px rgba(0,0,0,.45)} .favrow::after{content:"";position:absolute;top:0;bottom:0;left:0;width:35%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:translateX(-150%) skewX(-18deg);animation:cnShine 6s ease-in-out infinite;pointer-events:none} .favwrap .favrow:nth-child(2)::after{animation-delay:.8s}.favwrap .favrow:nth-child(3)::after{animation-delay:1.6s}.favwrap .favrow:nth-child(4)::after{animation-delay:2.4s} @keyframes cnShine{0%,70%{transform:translateX(-150%) skewX(-18deg)}100%{transform:translateX(380%) skewX(-18deg)}} .favrow.is-on .avwrap::before{content:"";position:absolute;inset:-5px;border-radius:50%;background:conic-gradient(from 0deg,#35e08f,#a8f5d0,#35e08f,transparent 70%,#35e08f);animation:cnSpin 3s linear infinite;z-index:0} .favrow.is-on .avwrap .av{position:relative;z-index:1;box-shadow:0 0 0 2.5px #fff!important} @keyframes cnSpin{to{transform:rotate(360deg)}} .cn-vf{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#3b9cff;color:#fff;font-size:9px;vertical-align:2px} .favrow .vtime{animation:cnIn .5s ease .3s both} @media (max-width:360px){.cn-t{font-size:22px}.cn-segs .cseg{font-size:11.5px}.avwrap .av{width:48px!important;height:48px!important}} @media (prefers-reduced-motion:reduce){.cn-hero,.cn-f,.cn-ic,.favrow::after,.favrow.is-on .avwrap::before,.favwrap.cn-anim .favrow{animation:none!important;opacity:1}} .head-actions{gap:14px} .head-actions .credpill+.iconbtn,.head-actions .credpill+.filterbtn{margin-inline-start:2px} /* ===================== پروفایلِ من — ظاهرِ جدید ===================== */ .pf{position:relative;padding-top:calc(8px + env(safe-area-inset-top,0px))} .pf-banner{position:absolute;top:0;left:12px;right:12px;height:150px;border-radius:0 0 34px 34px;overflow:hidden;background:var(--grad);background-size:220% 220%;animation:pfAur 10s ease infinite;opacity:.95;box-shadow:0 18px 34px -24px var(--coral)} .pf-banner~*{position:relative} @keyframes pfAur{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}} .pfb-glow{position:absolute;width:240px;height:240px;top:-130px;inset-inline-start:-60px;border-radius:50%;background:conic-gradient(from 0deg,rgba(255,255,255,0),rgba(255,255,255,.35),rgba(255,255,255,0) 40%);animation:pfSpin 10s linear infinite} @keyframes pfSpin{to{transform:rotate(360deg)}} .pfb-st{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff;animation:pfTw 3s ease-in-out infinite} @keyframes pfTw{0%,100%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1)}} .pfb-e{position:absolute;bottom:-20px;left:var(--x);font-size:16px;opacity:0;animation:pfFloat 6s ease-in infinite;animation-delay:var(--d)} @keyframes pfFloat{0%{transform:translateY(0) scale(.6);opacity:0}15%{opacity:.9}100%{transform:translateY(-140px) scale(1.1) rotate(15deg);opacity:0}} /* آواتار با حلقهٔ چرخان */ .pf-avwrap{width:112px;margin:26px auto 12px;z-index:2} .pf-avwrap::before{content:"";position:absolute;inset:-6px;border-radius:50%;background:conic-gradient(from 0deg,#fff,var(--coral),#ffc06a,#b36cff,#fff);animation:pfSpin 4s linear infinite;z-index:-1;box-shadow:0 14px 30px -12px var(--coral)} .pf-av{width:112px!important;height:112px!important;border:4px solid var(--cream);box-sizing:border-box;font-size:40px!important} .pf-cam{animation:pfCam 2.6s ease-in-out infinite;z-index:3} @keyframes pfCam{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}} .pf-upbtn{position:relative;overflow:hidden;background:var(--grad)!important;box-shadow:0 10px 22px -12px var(--coral)!important} .pf-upbtn::after,.pf-edit::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:translateX(-150%) skewX(-18deg);animation:pfShine 5s ease-in-out infinite;pointer-events:none} @keyframes pfShine{0%,65%{transform:translateX(-150%) skewX(-18deg)}100%{transform:translateX(380%) skewX(-18deg)}} .pf h2{font-size:26px;margin-top:6px} .pf .loc{display:inline-flex!important;padding:6px 14px;border-radius:999px;background:var(--glass-strong);border:1px solid var(--line);box-shadow:0 6px 16px -14px rgba(0,0,0,.4)} .pf-edit{position:relative;overflow:hidden;box-shadow:0 10px 22px -18px rgba(0,0,0,.5)} .pf-edit svg{color:var(--coral)} .pf-btns .pf-edit:nth-child(2)::after{animation-delay:1.2s} /* آمار */ .pf-row{gap:9px} .pf-stat{position:relative;overflow:hidden;border-radius:20px;padding:14px 6px 12px;box-shadow:0 12px 24px -20px rgba(0,0,0,.45);transition:transform .2s} .pf-stat:active{transform:scale(.96)} .pf-stat::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--grad);opacity:.8} .pf-si{display:block;font-style:normal;font-size:20px;margin-bottom:4px;animation:pfBob 3s ease-in-out infinite} .pf-stat:nth-child(2) .pf-si{animation-delay:.5s}.pf-stat:nth-child(3) .pf-si{animation-delay:1s} @keyframes pfBob{0%,100%{transform:none}50%{transform:translateY(-4px) rotate(6deg)}} .pf-stat .n{font-size:22px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent} /* عنوان بخش‌ها */ .pf-label{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:800} .pf-label::after{content:"";flex:1;height:1.5px;border-radius:2px;background:linear-gradient(270deg,var(--coral),transparent);opacity:.3} [dir=ltr] .pf-label::after{background:linear-gradient(90deg,var(--coral),transparent)} .pf-btns{flex-wrap:nowrap}.pf-btns .pf-edit{flex:1 1 0;justify-content:center;padding:11px 10px;min-width:0;font-size:13.5px;white-space:nowrap} /* علاقه‌مندی‌ها */ .pf-int{gap:9px} .pf-int .chip{position:relative;overflow:hidden;background:var(--glass-strong)!important;border:1px solid rgba(255,92,138,.16)!important;color:var(--plum)!important;padding:6px 8px 6px 14px!important;font-weight:800!important;box-shadow:0 8px 18px -14px var(--coral)} [dir=rtl] .pf-int .chip{padding:6px 14px 6px 8px!important} .pf-int .chip::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.7),transparent);transform:translateX(-150%) skewX(-18deg);animation:pfShine 6s ease-in-out infinite;pointer-events:none} .pf-int .chip:nth-child(2)::after{animation-delay:.6s}.pf-int .chip:nth-child(3)::after{animation-delay:1.2s}.pf-int .chip:nth-child(4)::after{animation-delay:1.8s} .priv-card{border-radius:22px;box-shadow:0 14px 28px -24px rgba(0,0,0,.5)} /* ورودِ پله‌پله فقط وقتی تب باز می‌شود */ .pf.pf-in>*:not(.pf-banner){animation:pfIn .55s cubic-bezier(.2,.9,.3,1.2) both} .pf.pf-in>*:nth-child(2){animation-delay:.04s}.pf.pf-in>*:nth-child(3){animation-delay:.08s}.pf.pf-in>*:nth-child(4){animation-delay:.12s}.pf.pf-in>*:nth-child(5){animation-delay:.16s} .pf.pf-in>*:nth-child(6){animation-delay:.2s}.pf.pf-in>*:nth-child(7){animation-delay:.24s}.pf.pf-in>*:nth-child(8){animation-delay:.28s}.pf.pf-in>*:nth-child(9){animation-delay:.32s}.pf.pf-in>*:nth-child(n+10){animation-delay:.36s} @keyframes pfIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}} .pf.pf-in .pf-int .chip{animation:pfIn .45s ease both} @media (max-width:360px){.pf-avwrap{width:96px}.pf-av{width:96px!important;height:96px!important}.pf-stat .n{font-size:18px}.pf-banner{height:130px}} @media (prefers-reduced-motion:reduce){.pf-banner,.pfb-glow,.pfb-st,.pfb-e,.pf-avwrap::before,.pf-cam,.pf-si,.pf-upbtn::after,.pf-edit::after,.pf-int .chip::after,.pf.pf-in>*{animation:none!important;opacity:1}} /* ===================== جستجوی کاربر — کارت‌های جدید ===================== */ .ngrid{gap:12px;padding:6px 16px calc(120px + env(safe-area-inset-bottom,0px))} .ncard{position:relative;border-radius:26px;background:#1d1020;box-shadow:0 18px 30px -22px rgba(0,0,0,.75);animation:ncIn .55s cubic-bezier(.2,.9,.3,1.2) both} @keyframes ncIn{from{opacity:0;transform:translateY(22px) scale(.94) rotate(-1deg)}to{opacity:1;transform:none}} .ngrid .ncard:nth-child(even){animation-delay:.08s} .ngrid .ncard:nth-child(n+3){animation-delay:.14s}.ngrid .ncard:nth-child(n+5){animation-delay:.2s}.ngrid .ncard:nth-child(n+7){animation-delay:.26s} .ncard-ph{aspect-ratio:3/4;border-radius:26px} .ncard-ph img,.ncard-ph .portrait{transition:transform .6s cubic-bezier(.2,.9,.3,1)} .ncard:active .ncard-ph img{transform:scale(1.06)} .ncard-ph::after{background:linear-gradient(180deg,rgba(0,0,0,.18) 0,transparent 24%,transparent 48%,rgba(18,5,16,.82) 100%)!important;z-index:1} .ncard-ph .nstatus{z-index:3} .ncard-info{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:10px 12px 12px!important;color:#fff;text-align:start} .ncard-nm{color:#fff!important;font-size:16.5px;text-shadow:0 2px 10px rgba(0,0,0,.45);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .ncard-lc{color:#fff!important;background:rgba(255,255,255,.18)!important;border:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:11.5px;max-width:100%;overflow:hidden;white-space:nowrap} .ncard-lc svg{color:#fff} /* آنلاین: قابِ نورانیِ سبز که آرام می‌تپد */ .ncard.is-on{box-shadow:0 0 0 2px rgba(53,224,143,.9),0 16px 30px -18px rgba(53,224,143,.85)} .ncard.is-on::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:4;pointer-events:none;box-shadow:inset 0 0 0 3px rgba(53,224,143,.95),0 0 22px 2px rgba(53,224,143,.55);opacity:0;animation:ncGlow 2.6s ease-in-out .6s infinite} @keyframes ncGlow{0%,100%{opacity:0}50%{opacity:1}} /* برقِ عبوری روی کارت‌ها (یکی‌یکی) */ .ncard::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;z-index:3;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:translateX(-160%) skewX(-18deg);animation:ncShine 7s ease-in-out infinite;pointer-events:none} .ngrid .ncard:nth-child(2)::after{animation-delay:1.2s}.ngrid .ncard:nth-child(3)::after{animation-delay:2.4s}.ngrid .ncard:nth-child(4)::after{animation-delay:3.6s}.ngrid .ncard:nth-child(5)::after{animation-delay:4.8s}.ngrid .ncard:nth-child(6)::after{animation-delay:6s} @keyframes ncShine{0%,80%{transform:translateX(-160%) skewX(-18deg)}100%{transform:translateX(360%) skewX(-18deg)}} .nc-liked{position:absolute;top:12px;inset-inline-end:12px;z-index:3;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:14px;background:rgba(255,255,255,.9);box-shadow:0 6px 14px -6px rgba(0,0,0,.5);animation:pvBeat 2.4s ease-in-out infinite} @media (max-width:360px){.ngrid{gap:10px;padding-inline:12px}.ncard-nm{font-size:15px}} @media (prefers-reduced-motion:reduce){.ncard,.ncard.is-on,.ncard::after,.nc-liked{animation:none!important;opacity:1}} /* ===================== گفتگوها — ظاهرِ جدید ===================== */ .chats-hero{position:relative;overflow:hidden;background-size:220% 220%!important;animation:chAur 11s ease infinite} @keyframes chAur{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}} .chats-hero>*{position:relative;z-index:1} .chats-hero .ch-glow{position:absolute;z-index:0;width:260px;height:260px;top:-140px;inset-inline-start:-70px;border-radius:50%;background:conic-gradient(from 0deg,rgba(255,255,255,0),rgba(255,255,255,.3),rgba(255,255,255,0) 40%);animation:chSpin 11s linear infinite;pointer-events:none} @keyframes chSpin{to{transform:rotate(360deg)}} .chats-hero .ch-bub{position:absolute;z-index:0;bottom:-24px;left:var(--x);font-style:normal;font-size:17px;opacity:0;animation:chFloat 6s ease-in infinite;animation-delay:var(--d);pointer-events:none} @keyframes chFloat{0%{transform:translateY(0) scale(.6);opacity:0}15%{opacity:.55}100%{transform:translateY(-150px) scale(1.1) rotate(-12deg);opacity:0}} .chats-title{display:inline-flex;align-items:center;gap:9px} .ch-ic{font-weight:400;font-size:22px;display:inline-block;animation:chWig 3.2s ease-in-out infinite;transform-origin:30% 90%} @keyframes chWig{0%,60%,100%{transform:none}66%{transform:rotate(-14deg) scale(1.15)}74%{transform:rotate(10deg) scale(1.12)}82%{transform:rotate(-5deg)}} .chats-srch{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)} /* تب‌ها */ .chsub{transition:transform .2s,box-shadow .2s;animation:chIn .45s cubic-bezier(.2,.9,.3,1.2) backwards} .chsub:active{transform:scale(.95)} .chsub.on i{animation:chPop 2.4s ease-in-out infinite} @keyframes chPop{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}} @keyframes chIn{from{opacity:0;transform:translateY(12px) scale(.96)}} /* ردیف‌ها — انیمیشن روی قابِ بیرونی تا کشیدن برای حذف خراب نشود */ #chatList>.chatswipe,#chatList>.chatrow.pend{animation:chIn .5s cubic-bezier(.2,.9,.3,1.2) backwards} #chatList>*:nth-child(2){animation-delay:.05s}#chatList>*:nth-child(3){animation-delay:.1s}#chatList>*:nth-child(4){animation-delay:.15s}#chatList>*:nth-child(5){animation-delay:.2s}#chatList>*:nth-child(n+6){animation-delay:.25s} .chatrow{position:relative;overflow:hidden;border-radius:22px;box-shadow:0 12px 26px -22px rgba(0,0,0,.5)} .chatrow::after{content:"";position:absolute;top:0;bottom:0;left:0;width:35%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:translateX(-160%) skewX(-18deg);animation:chShine 7s ease-in-out infinite;pointer-events:none} #chatList>*:nth-child(2) .chatrow::after,#chatList>.chatrow:nth-child(2)::after{animation-delay:1.3s} #chatList>*:nth-child(3) .chatrow::after,#chatList>.chatrow:nth-child(3)::after{animation-delay:2.6s} @keyframes chShine{0%,78%{transform:translateX(-160%) skewX(-18deg)}100%{transform:translateX(380%) skewX(-18deg)}} .chatrow .avwrap{position:relative} .chatrow .avwrap:has(.av-dot.on)::before{content:"";position:absolute;inset:-4px;border-radius:50%;background:conic-gradient(from 0deg,#35e08f,#a8f5d0,#35e08f,transparent 70%,#35e08f);animation:chSpin 3s linear infinite;z-index:0} .chatrow .avwrap .av{position:relative;z-index:1} /* درخواستِ در انتظار: قابِ رنگیِ متحرک */ .chatrow.pend{border:2px solid transparent!important;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(120deg,var(--coral),#ffc06a,#b36cff,var(--coral)) border-box!important;background-size:100% 100%,300% 300%!important;animation:chIn .5s cubic-bezier(.2,.9,.3,1.2) backwards,chBorder 4s linear infinite} @keyframes chBorder{to{background-position:0 0,300% 0}} .pend-yes{position:relative;overflow:hidden;box-shadow:0 10px 20px -12px var(--coral);padding:11px!important;border-radius:14px!important} .pend-yes::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:translateX(-160%) skewX(-18deg);animation:chShine 3.5s ease-in-out infinite} .pend-no{padding:11px!important;border-radius:14px!important;transition:transform .15s} .pend-yes:active,.pend-no:active{transform:scale(.95)} @media (prefers-reduced-motion:reduce){.chats-hero,.ch-glow,.ch-bub,.ch-ic,.chatrow::after,.chatrow.pend,.pend-yes::after,#chatList>*,.chsub{animation:none!important;opacity:1}} /* ===================== کارایی: انیمیشن‌ها فقط روی کارت‌گرافیک، بدونِ فشار روی گوشی‌های ضعیف ===================== */ /* کارت‌هایی که بیرونِ صفحه‌اند اصلاً رندر نمی‌شوند (لیست‌های بلند روان می‌مانند) */ /* content-visibility برداشته شد: در Safari بعد از عوض‌شدنِ صفحه کارت‌ها سفید/نامرئی می‌ماندند (حالا هر صفحه فقط ۳۰ کارت است) */ #chatList>.chatswipe,.favwrap .favrow{content-visibility:auto;contain-intrinsic-size:auto 84px} /* برقِ عبوری فقط روی چند کارتِ اول؛ بقیه بی‌حرکت (لایهٔ گرافیکیِ اضافه ساخته نمی‌شود) */ .ngrid .ncard:nth-child(n+7)::after,.favwrap .favrow:nth-child(n+5)::after,#chatList>*:nth-child(n+4) .chatrow::after,#chatList>.chatrow:nth-child(n+4)::after{animation:none;display:none} .ngrid .ncard:nth-child(n+13).is-on::before{animation:none} /* پروفایلِ بسته: هیچ انیمیشنی پشتِ صحنه اجرا نمی‌شود */ .pv-bg:not(.on),.pv-bg:not(.on) *,.pv-bg:not(.on) *::before,.pv-bg:not(.on) *::after{animation-play-state:paused!important} /* (برداشته شد) توقفِ همهٔ انیمیشن‌ها در پس‌زمینه: مرورگر خودش صفحهٔ دیده‌نشده را رسم نمی‌کند، پس صرفه‌ای نداشت؛ ولی در اپِ اندروید (TWA/WebView) رویدادِ «دوباره دیده شد» گاهی نمی‌آمد و انیمیشن‌ها برای همیشه متوقف می‌ماندند → اسم، شهر، علاقه‌مندی‌ها و دکمه‌های پروفایل/کارت (که با opacity:0 شروع می‌شوند) نامرئی می‌ماندند. */ /* حالتِ سبک (گوشیِ ضعیف / صرفه‌جوییِ باتری / کاهشِ حرکت): انیمیشن‌های تزئینیِ تکرارشونده یک‌بار اجرا و متوقف می‌شوند، افکتِ blurِ پشتِ شیشه (سنگین‌ترین افکت برای GPU) خاموش می‌شود. انیمیشن‌های کاربردی (لودینگ، تایپ، نوارِ تبلیغ) می‌مانند. */ html.lite *,html.lite *::before,html.lite *::after{animation-iteration-count:1!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important} html.lite .fx-spin,html.lite .fx-play.ld::before,html.lite .sup-rcpt.busy .rc-up svg,html.lite .pr-spin,html.lite .ai-dots i,html.lite .ham-b.typing i, html.lite .cvtyping i,html.lite .cpe-dots i,html.lite .voicechip .vc-wave i,html.lite .ads-track,html.lite .orbit .flow{animation-iteration-count:infinite!important} html.lite .fx-shine::before,html.lite .cw-shine::after,html.lite .favrow::after,html.lite .chatrow::after,html.lite .ncard::after,html.lite .pv-chip::after,html.lite .pf-int .chip::after, html.lite .credpill::after,html.lite .cred-pkg::after,html.lite .pv-act.msg::after,html.lite .pf-upbtn::after,html.lite .pf-edit::after,html.lite .pend-yes::after, html.lite .fx-st,html.lite .cw-st,html.lite .pfb-st,html.lite .pfb-e,html.lite .cn-f,html.lite .ch-bub,html.lite .fun-sp,html.lite .stg-cloud{display:none!important} html.lite .pv-mainimg,html.lite .pv-mainimg.swap{animation:none!important} /* ===================== ویس — ظاهرِ جدید ===================== */ /* دکمهٔ میکروفون: حلقهٔ نفس‌کشیدن وقتی متنی نوشته نشده */ .cp-send{position:relative} .cp-sw{position:relative;flex:none;display:inline-flex} .cp-fxbtn{position:absolute;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%);width:34px;height:34px;border-radius:50%;border:none;display:none;place-items:center;background:#fff;box-shadow:0 6px 14px -6px rgba(0,0,0,.35);font-size:16px;cursor:pointer;z-index:2} .cp-sw.has-text .cp-fxbtn{display:grid} #cpPrevBar{flex:1;min-width:0;display:none;align-items:center;gap:8px;padding:0 4px;border:0;background:transparent;animation:none} #cpPrevBar .cp-rec-send{display:none} #cpPrevBar .cp-rec-wave{min-width:0} .cp-send.has-text::after{display:none} .cp-send::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--coral);opacity:0;animation:vMicRing 2.8s ease-out infinite;pointer-events:none} @keyframes vMicRing{0%{transform:scale(.9);opacity:.6}70%,100%{transform:scale(1.45);opacity:0}} /* نوارِ ضبط */ .cp-recbar{position:relative;overflow:hidden;animation:vBarIn .35s cubic-bezier(.2,.9,.3,1.2) both;background:linear-gradient(180deg,rgba(255,255,255,.6),var(--cream))} @keyframes vBarIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}} #cpRecBar::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 140% at 50% 120%,rgba(224,53,107,.14),transparent 60%);animation:vRecGlow 1.6s ease-in-out infinite;pointer-events:none} @keyframes vRecGlow{50%{opacity:.35}} .cp-rec-live{font-size:15px;min-width:52px} .cp-rec-dot{box-shadow:0 0 0 0 rgba(224,53,107,.6);animation:vDot 1.2s ease-in-out infinite} @keyframes vDot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.7);opacity:.45}} .cp-rec-wave{flex:1;min-width:0;height:34px;display:flex;align-items:center;justify-content:space-between;gap:2px;direction:ltr;cursor:pointer} .cp-rec-wave i{flex:1;max-width:4px;height:100%;border-radius:3px;background:var(--grad);transform:scaleY(.12);transform-origin:center;transition:transform .09s linear} .cp-rec-wave.prev{direction:inherit} .cp-rec-wave.prev i{background:rgba(0,0,0,.18);transition:background .15s} .cp-rec-wave.prev i.on{background:var(--coral)} #cpRecBar .cp-rec-send{position:relative;animation:vStopPulse 1.6s ease-in-out infinite} @keyframes vStopPulse{0%,100%{box-shadow:0 0 0 0 rgba(224,53,107,.45)}50%{box-shadow:0 0 0 9px rgba(224,53,107,0)}} .cp-rec-cancel{transition:transform .15s,background .2s} .cp-prev-play{transition:transform .15s} .cp-prev-play.on{animation:vStopPulse 1.6s ease-in-out infinite} #cpPrevBar .cp-rec-send{animation:vSendNudge 2.4s ease-in-out infinite} @keyframes vSendNudge{0%,70%,100%{transform:none}80%{transform:translate(-3px,-3px) rotate(-8deg)}90%{transform:translate(2px,2px)}} /* پیامِ صوتی در چت */ .vmsg{gap:9px;min-width:190px;padding:2px 0} .vplay{position:relative;width:38px;height:38px;background:rgba(255,255,255,.95);color:var(--coral);box-shadow:0 6px 14px -8px rgba(0,0,0,.4);transition:transform .15s} .vplay:active{transform:scale(.9)} .cbubble.them .vplay{background:var(--grad);color:#fff} .vplay svg{width:16px;height:16px} .vmsg.playing .vplay::after,.vmsg.loading .vplay::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;opacity:.5} .vmsg.playing .vplay::after{animation:vMicRing 1.6s ease-out infinite} .cbubble.me .vmsg.playing .vplay::after{border-color:#fff} .vmsg.loading .vplay::after{border-color:transparent;border-top-color:currentColor;animation:spin .8s linear infinite;opacity:1} .vwave{flex:1;gap:2px;height:26px;cursor:pointer;justify-content:space-between} .vwave i{width:3px;opacity:.4;transition:opacity .2s,transform .2s} .vwave i.on{opacity:1} .vmsg.playing .vwave i{animation:vBounce 1s ease-in-out infinite;animation-delay:calc(var(--k) * -70ms)} @keyframes vBounce{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.6)}} .vside{display:flex;flex-direction:column;align-items:center;gap:3px;flex:none} .vdur{font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums;opacity:.95} .vspd{direction:ltr;border:none;cursor:pointer;font:inherit;font-size:10.5px;font-weight:900;padding:1px 7px;border-radius:999px;background:rgba(255,255,255,.25);color:inherit;line-height:1.6} .cbubble.them .vspd{background:rgba(255,92,138,.12);color:var(--coral)} .vspd.pop{animation:cpBump .4s cubic-bezier(.2,.9,.3,1.6)} html.lite .vmsg.playing .vwave i{animation:none} @media (prefers-reduced-motion:reduce){.cp-send::after,#cpRecBar::before,.vmsg.playing .vwave i,#cpPrevBar .cp-rec-send{animation:none}} /* عکس‌های معلق داخلِ بنر + آمارِ جمع‌وجور */ .pf-banner{height:168px;pointer-events:auto} .pf-avwrap{margin-top:30px} .pf-orbit{position:absolute;inset:0;z-index:2} .pf-ob{position:absolute;width:var(--s);height:var(--s);padding:0;border-radius:50%;overflow:hidden;cursor:pointer;border:2.5px solid rgba(255,255,255,.95);background:rgba(255,255,255,.3); box-shadow:0 8px 18px -8px rgba(0,0,0,.55);animation:pfObIn .6s cubic-bezier(.2,.9,.3,1.4) var(--a) both,pfObFloat 4.2s ease-in-out calc(var(--d) + .6s) infinite} .pf-ob img{width:100%;height:100%;object-fit:cover;display:block} .pf-ob b{position:absolute;inset:0;display:grid;place-items:center;background:rgba(20,6,18,.5);color:#fff;font-size:13px;font-weight:900} .pf-ob:active{transform:scale(.9)} @keyframes pfObIn{from{opacity:0;transform:scale(.3) rotate(-20deg)}to{opacity:1;transform:none}} @keyframes pfObFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(3deg)}} .pf-row{gap:8px;margin:14px 0 8px} .pf-stat{display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 6px;border-radius:16px;min-width:0} .pf-stat::before{height:3px} .pf-si{font-size:17px;margin:0} .pf-stat .n{font-size:17px;line-height:1.1} .pf-stat .l{font-size:10.5px;margin:0;white-space:nowrap} .pf-stat>.n,.pf-stat>.l{display:block} .pf-stat{flex-wrap:wrap;row-gap:0} .pf-stat .l{flex-basis:100%;text-align:center} @media (max-width:360px){.pf-ob{--s:36px!important}.pf-stat .n{font-size:15px}} html.lite .pf-ob{animation:pfObIn .6s ease both} /* ===================== حالتِ ساده و آرام (پیش‌فرض برای همه) ===================== انیمیشن‌های تزئینی فقط یک‌بار موقعِ ورود اجرا می‌شوند و بعد ثابت می‌مانند؛ فقط انیمیشن‌های کاربردی (لودینگ، درحال‌نوشتن، ضبط/پخشِ صدا) تکرار می‌شوند. */ *,*::before,*::after{animation-iteration-count:1!important} .fx-spin,.fx-play.ld::before,.sup-rcpt.busy .rc-up svg,.pr-spin,.ai-dots i,.ham-b.typing i,.cvtyping i,.cpe-dots i, .voicechip .vc-wave i,.ads-track,.vmsg.playing .vwave i,.vmsg.loading .vplay::after,.vmsg.playing .vplay::after, #cpRecBar::before,#cpRecBar .cp-rec-send,.cp-rec-dot,.sup-note .dotpulse,.orbit .flow, [class*="spin"],[class*="loading"]::after,.st-add::before{animation-iteration-count:infinite!important} /* برق‌زدن‌ها، ستاره‌ها و ایموجی‌های معلق حذف */ .fx-shine::before,.cw-shine::after,.favrow::after,.chatrow::after,.ncard::after,.pv-chip::after,.pf-int .chip::after, .credpill::after,.cred-pkg::after,.pv-act.msg::after,.pf-upbtn::after,.pf-edit::after,.pend-yes::after, .fx-st,.cw-st,.pfb-st,.pfb-e,.pfb-glow,.cn-f,.ch-bub,.fun-sp,.stg-cloud,.spark,.li-hearts{display:none!important} /* پروفایل: بنرِ ساده، بدونِ عکس‌های معلق و حلقهٔ چرخان */ .pf-banner,.pf-orbit{display:none!important} .pf-avwrap{margin-top:18px!important} .pf-strip{display:flex;gap:8px;justify-content:flex-start;overflow-x:auto;padding:12px 4px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch} .pf-strip::-webkit-scrollbar{display:none} .pf-sp{flex:0 0 auto;width:56px;height:56px;padding:0;border:2px solid #fff;border-radius:14px;overflow:hidden;cursor:pointer;background:var(--line);box-shadow:0 4px 12px -6px rgba(0,0,0,.35)} .pf-sp img{width:100%;height:100%;object-fit:cover;display:block} .pf-sp:active{transform:scale(.94)} .pf-sp:first-child{margin-inline-start:auto}.pf-sp:last-child{margin-inline-end:auto} .pf-avwrap::before{animation:none!important;background:#fff!important;inset:-4px!important;box-shadow:0 10px 24px -14px rgba(0,0,0,.35)!important} .pf-cam,.pf-si{animation:none!important} .pf-stat::before{display:none!important} .pf-stat{box-shadow:none!important} .pf.pf-in>*:not(.pf-banner){animation-duration:.3s!important;animation-timing-function:ease-out!important} /* ===== کارتِ کاوش — فقط انیمیشن‌های ظریف ===== */ .card .portrait{animation:cdZoom 16s ease-in-out infinite alternate;transform-origin:50% 35%} @keyframes cdZoom{from{transform:scale(1)}to{transform:scale(1.06)}} .card::before{content:"";position:absolute;top:0;bottom:0;left:0;width:45%;z-index:3;pointer-events:none; background:linear-gradient(100deg,transparent,rgba(255,255,255,.16),transparent);transform:translateX(-160%) skewX(-18deg);animation:cdShine 7s ease-in-out 1.2s infinite} @keyframes cdShine{0%,72%{transform:translateX(-160%) skewX(-18deg)}100%{transform:translateX(330%) skewX(-18deg)}} .meta .nm,.meta .loc,.meta .chip,.card .online{animation:cdUp .6s cubic-bezier(.2,.9,.3,1.1) backwards} .meta .nm{animation-delay:.05s}.meta .loc{animation-delay:.14s} .meta .chip:nth-child(1){animation-delay:.22s}.meta .chip:nth-child(2){animation-delay:.29s}.meta .chip:nth-child(3){animation-delay:.36s} .card .online{animation-name:cdFade;animation-delay:.1s} @keyframes cdUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}} @keyframes cdFade{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}} .actions .act{animation:cdPop .5s cubic-bezier(.3,1.6,.5,1) backwards} .actions .act:nth-child(1){animation-delay:.1s}.actions .act:nth-child(2){animation-delay:.18s}.actions .act:nth-child(3){animation-delay:.26s} @keyframes cdPop{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}} .act.like{position:relative} .act.like::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--coral);opacity:0;pointer-events:none;animation:cdHalo 2.4s ease-out 1s infinite} @keyframes cdHalo{0%{opacity:.6;transform:scale(.9)}70%{opacity:0;transform:scale(1.3)}100%{opacity:0}} .act.like svg{animation:cdBeat 2.4s ease-in-out 1s infinite} @keyframes cdBeat{0%,40%,100%{transform:scale(1)}10%{transform:scale(1.18)}20%{transform:scale(1)}30%{transform:scale(1.1)}} html.lite .card .portrait,html.lite .card::before,html.lite .act.like::after,html.lite .act.like svg, html.litefx .card .portrait,html.litefx .card::before,html.litefx .act.like::after,html.litefx .act.like svg{animation:none!important} html.lite .card::before,html.litefx .card::before{display:none} @media (prefers-reduced-motion:reduce){.card .portrait,.card::before,.act.like::after,.act.like svg{animation:none!important}} /* ===== ارتباط‌ها — ساده و شیک ===== */ .cn-hero{background:none!important;animation:cnIn .5s ease both!important;box-shadow:none!important;color:var(--plum);padding:6px 6px 2px;margin-bottom:10px} .cn-hero::before,.cn-f,.cn-s{display:none!important} .cn-t{font-size:24px;text-shadow:none;gap:8px} .cn-ic{animation:none;font-size:20px} .cn-segs{display:flex;gap:4px;margin:0 16px 14px;padding:4px;border-radius:16px;background:rgba(255,255,255,.75);border:1px solid var(--line);box-shadow:0 8px 20px -18px rgba(0,0,0,.4)} .cn-segs .cseg{flex:1 1 0;flex-direction:row;gap:6px;padding:9px 6px;border-radius:12px;border:none;background:transparent;box-shadow:none;color:var(--ink-soft);font-size:13px;font-weight:700;animation:none;transform:none!important;transition:background .25s,color .25s} .cn-segs .cs-e{display:none} .cn-segs .cseg i{position:static;border:none;min-width:18px;height:18px;font-size:10.5px;background:var(--line);color:var(--ink-soft)} .cn-segs .cseg.on{background:var(--grad);color:#fff;box-shadow:0 6px 14px -8px var(--coral)} .cn-segs .cseg.on i{background:rgba(255,255,255,.28);color:#fff} #t-favorites .favrow::after{display:none} #t-favorites .favrow{padding:10px 12px;border-radius:18px;box-shadow:0 6px 18px -16px rgba(0,0,0,.45)} #t-favorites .favrow .lc{background:none!important;padding:0!important} #t-favorites .favrow .hb{background:none;animation:none;width:34px;height:34px;padding:7px;opacity:.85} /* ===================== ممیزیِ سرعت (Perf Audit) ===================== انیمیشن‌های بی‌نهایت که هر فریم «رنگ‌آمیزیِ دوباره» (repaint) می‌سازند — box-shadow، background-position، filter، text-shadow — روی گوشی‌های متوسط باعثِ داغی، مصرفِ باتری و لگِ اسکرول می‌شوند. اینجا یا به نسخهٔ GPU-محور (transform/opacity) تبدیل شده‌اند، یا بعد از چند بار تکرار متوقف می‌شوند. ظاهر همان است. */ /* نقطهٔ آنلاین (در همهٔ لیست‌ها، ده‌ها بار در صفحه): box-shadow → opacity/scale */ @keyframes pulseDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.82)}} /* هدرهای گرادیانیِ بزرگ: حرکتِ پس‌زمینه = repaint کلِ کادر در هر فریم → ثابت */ .chats-hero,.pf-banner,.cn-hero,.fxh-hero,.stg,.cw-card,.pay-sum,#payCardBox .pay-card{animation-name:none!important} .pf-banner,.chats-hero{background-size:100% 100%!important} /* المان‌هایی که همیشه روی صفحه‌اند: چند بار جلوه، بعد آرام */ .credpill .gem,.fun-hbtn,#supIcon.sup-alert,#supIcon.sup-alert .sup-lbl,.feat-badge,.feat-card.me,.cred-pkg::after,.cred-pkg.spotpick, .pkg-badge.spot,.ct-spot,.fh-ring,.ai-orb,.ed-go,.ed-magic img,.ed-magic::before,.pay-file,.pv-act.msg::after{animation-iteration-count:3!important} .chatrow.pend{animation-iteration-count:1,3!important} .credpill .gem{filter:none} /* blur پشتِ المان‌های تکراری در گرید/لیست (هر کارت یک لایهٔ blur جدا) → پس‌زمینهٔ نیمه‌شفافِ ساده */ .nstatus,.ncard-lc,.pv-count,.cw-chip{-webkit-backdrop-filter:none!important;backdrop-filter:none!important} .nstatus.on{background:rgba(8,5,12,.55)!important} .nstatus.off{background:rgba(60,50,58,.6)!important} .ncard-lc{background:rgba(0,0,0,.32)!important} /* لیست‌های بلند: رندرِ تنبل برای ردیف‌های خارج از دید */ .favwrap>.favrow{content-visibility:auto;contain-intrinsic-size:auto 78px} /* زومِ عکسِ کارت فقط روی کارتِ رو؛ کارت‌های پشتی ساکن */ .card:has(~ .card) .portrait{animation:none} /* ===== پنجرهٔ «اعتبار من» — جمع‌وجور: موجودی کنارِ عنوان، بسته‌ها زیرِ هم ===== */ .cred-title-row{flex-wrap:wrap;gap:8px;padding:0 44px} .cred-balpill{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:999px;background:var(--grad);color:#fff;font-size:15px;line-height:1;box-shadow:0 8px 16px -10px var(--coral)} .cred-balpill svg{width:15px;height:15px;color:#ffd36e} .cred-balpill b{font-family:var(--font-display);font-weight:700;font-size:17px} .cred-balpill small{font-size:11px;font-weight:700;opacity:.9} .cred-balpill.low{animation:supBeat 1.8s ease-in-out infinite} .cred-subchip{text-align:center;font-size:11.5px;font-weight:700;color:var(--ink-soft);margin:6px 0 2px} .cred-subchip:empty{display:none} .cred-pkgs{display:flex!important;flex-direction:column!important;gap:12px!important;margin-top:14px!important} .cred-pkg.cpk-row{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"gem n hint" "gem p hint";align-items:center;column-gap:12px;row-gap:2px;width:100%;padding:13px 14px!important;text-align:start;border-radius:16px} .cred-pkg.cpk-row .cpk-gem{grid-area:gem;margin:0!important;width:30px!important;height:30px!important} .cred-pkg.cpk-row .n{grid-area:n;font-size:21px!important;margin:0} .cpk-inf{display:table;margin-top:4px!important;font-style:normal;font-size:10px;font-weight:800;color:#1a9b5a;background:rgba(45,212,150,.14);border:1px solid rgba(45,212,150,.35);border-radius:999px;padding:1px 7px;margin-inline-start:0;white-space:nowrap;letter-spacing:0} .cred-pkg.cpk-row .p{grid-area:p;margin:0!important;font-size:12.5px} .cred-pkg.cpk-row .cpk-hint{grid-area:hint;margin:0!important;padding:8px 10px!important;white-space:nowrap;font-size:11.5px!important;max-width:100%} .cred-pkg.cpk-row{overflow:visible;box-sizing:border-box;max-width:100%} .cred-pkg.cpk-row .pkg-vip{grid-column:1/-1;margin-top:4px} .cred-pkg.cpk-row .pkg-badge{left:auto;right:auto;inset-inline-start:14px;transform:none;top:-10px} .cred-pkg.cpk-row:hover{transform:translateY(-2px)} /* ===== فیلتر: سه گزینهٔ تک‌انتخابی + جملهٔ راهنما ===== */ .flt-q{font-size:13.5px;font-weight:800;color:var(--plum);margin:2px 2px 9px} .flt-tiles3{grid-template-columns:repeat(2,1fr)!important;gap:8px!important;margin-bottom:8px!important} .flt-tiles3 .ftile{align-items:center;text-align:center;padding:14px 6px 11px;gap:7px} .flt-tiles3 .ft-t{font-size:12px;line-height:1.45} .flt-tiles3 .ft-ck{top:7px;inset-inline-end:7px;width:17px;height:17px} .ft-ic2{color:#e8a32a;background:rgba(244,200,98,.18)} .ft-ic3{color:#5b7cfa;background:rgba(91,124,250,.13)} .flt-tiles3 .ftile{flex-direction:row;justify-content:flex-start;text-align:start;padding:12px 10px} .flt-pick{font-size:12px;font-weight:700;color:var(--ink-soft);text-align:center;padding:9px 10px;border-radius:13px;border:1.5px dashed var(--line);margin-bottom:12px;line-height:1.7} .flt-pick.on{border-style:solid;border-color:transparent;background:color-mix(in srgb,var(--coral) 11%,transparent);color:var(--plum);animation:fltPop .35s cubic-bezier(.2,.9,.3,1.3)} .flt-pick b{color:var(--coral)} .flt-pick button{margin-inline-start:6px;border:0;background:#fff;color:var(--ink-soft);font:inherit;font-size:11px;padding:3px 10px;border-radius:999px;cursor:pointer;box-shadow:0 2px 6px -3px rgba(0,0,0,.3)} @keyframes fltPop{0%{transform:scale(.94);opacity:.4}100%{transform:none;opacity:1}} /* بسته‌ها: راست = تعداد اعتبار + توضیح، چپ = قیمت + دکمه */ .cred-pkg.cpk-row{grid-template-columns:auto 1fr auto!important;grid-template-areas:"gem n left" "gem d left"!important;row-gap:3px!important;padding:16px 12px 13px!important} .cred-pkg.cpk-row .cpk-desc{grid-area:d;display:block;font-size:11.5px;font-weight:600;line-height:1.65;color:var(--ink-soft);padding-inline-end:6px} .cred-pkg.cpk-row .cpk-desc b{color:var(--coral);font-weight:800} .cred-pkg.cpk-row .cpk-left{grid-area:left;display:flex;flex-direction:column;align-items:center;gap:7px;min-width:104px} .cred-pkg.cpk-row .cpk-left .p{font-size:13.5px!important;font-weight:800;color:var(--plum);white-space:nowrap;margin:0!important} .cred-pkg.cpk-row .cpk-left .cpk-hint{width:100%;text-align:center} /* انتخابِ جنسیت با آواتارِ دختر/پسر */ .seg .opt.gopt{flex-direction:column;gap:7px;padding:14px 10px 12px;font-weight:800} .gav{display:block;width:58px;height:58px;border-radius:50%;transition:transform .25s cubic-bezier(.2,.9,.3,1.4),box-shadow .25s,filter .25s;filter:saturate(.75);box-shadow:0 6px 14px -8px rgba(0,0,0,.35)} .gav svg{width:100%!important;height:100%!important;display:block} .seg input:checked+.opt.gopt .gav{transform:scale(1.12) translateY(-2px);filter:none} .seg input:checked+.opt.gopt .gav-f{box-shadow:0 0 0 3px #fff,0 0 0 5.5px #ff7fa8,0 10px 20px -8px rgba(255,92,138,.6)} .seg input:checked+.opt.gopt .gav-m{box-shadow:0 0 0 3px #fff,0 0 0 5.5px #4f8df5,0 10px 20px -8px rgba(79,141,245,.6)} .seg label:has(input[value="male"]:checked) .opt.gopt{border-color:#4f8df5;color:#3a76de;background:rgba(79,141,245,.08);box-shadow:0 0 0 3px rgba(79,141,245,.12)} .seg label:has(input[value="female"]:checked) .opt.gopt{border-color:#ff7fa8;color:#e0497a;background:rgba(255,92,138,.08)} .seg.locked .opt.gopt .gav{filter:grayscale(.3)} /* وزن/قد تنظیم‌نشده: کادر قرمز + لرزش */ #profile .field.sl-need{border-radius:16px;box-shadow:0 0 0 2px #e5484d,0 0 0 6px rgba(229,72,77,.15);animation:slShake .45s ease;padding:8px 10px} #profile .field.sl-need .sl-tip{color:#e5484d!important;font-weight:800} @keyframes slShake{0%,100%{transform:none}20%{transform:translateX(-7px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}} /* ===== اعتبار: برچسبِ «ویژه» همیشه سمتِ راست ===== */ .cred-pkg.cpk-row .pkg-badge,.cred-pkg.cpk-row .pkg-badge.spot{left:auto!important;right:14px!important;inset-inline-start:auto!important;transform:none!important;animation:spotBadgeSheen 3s linear infinite!important} /* ===== بستهٔ ویژه: نوارِ «امکان تماس صوتی» ===== */ .cred-pkg.cpk-row .cpk-call{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;border-radius:14px;text-align:start;background:linear-gradient(120deg,#2b1630,#5a2450 55%,#7a2d5a);color:#fff;box-shadow:0 10px 22px -12px rgba(122,45,90,.8),inset 0 0 0 1.5px rgba(244,200,98,.75);position:relative;overflow:hidden} .cred-pkg.cpk-row .cpk-call::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,226,154,.35) 45%,transparent 60%);background-size:250% 100%;animation:ccSheen 2.6s linear infinite} .cred-pkg.cpk-row .cpk-call .cc-ic{flex:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f4c862,#ffb347);color:#4a2a00;animation:ccRing 1.6s ease-in-out infinite;box-shadow:0 0 0 0 rgba(244,200,98,.6)} .cred-pkg.cpk-row .cpk-call .cc-ic svg{width:18px;height:18px} .cred-pkg.cpk-row .cpk-call .cc-tx{display:flex;flex-direction:column;gap:2px;position:relative} .cred-pkg.cpk-row .cpk-call b{font-size:13.5px;font-weight:900;color:#ffe29a} .cred-pkg.cpk-row .cpk-call small{font-size:11px;font-weight:600;line-height:1.6;opacity:.92} .cred-pkg.cpk-row .cpk-perks .cc-ic{font-size:18px;animation:none}.cpk-perks .pk-list{display:flex;flex-wrap:wrap;gap:4px 5px;margin-top:3px}.cpk-perks .pk-list i{font-style:normal;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.13);white-space:nowrap} @keyframes ccSheen{from{background-position:150% 0}to{background-position:-100% 0}} @keyframes ccRing{0%,100%{transform:rotate(0);box-shadow:0 0 0 0 rgba(244,200,98,.55)}10%{transform:rotate(-14deg)}20%{transform:rotate(12deg)}30%{transform:rotate(-8deg)}40%{transform:rotate(0)}60%{box-shadow:0 0 0 9px rgba(244,200,98,0)}} @media (prefers-reduced-motion:reduce){.cpk-call::before,.cpk-call .cc-ic{animation:none!important}} /* ===== پاپ‌آپ سرگرمی: جمع‌وجور، همه‌چیز داخلِ کادر، دکمهٔ بستنِ واضح ===== */ .fx-hub .fxh-hero{padding:12px 14px 13px} .fx-hub .fxh-t{font-size:19px}.fx-hub .fxh-s{font-size:12px;margin-top:3px} .fx-hub .fx-body{padding:10px 10px 0!important;gap:8px!important;display:flex;flex-direction:column} .fx-hub .fx-feat{padding:10px 12px;gap:10px;border-radius:18px} .fx-hub .fx-feat .ic{width:42px;height:42px;font-size:22px;border-radius:14px} .fx-hub .fx-feat b{font-size:14.5px}.fx-hub .fx-feat .d{font-size:11.5px;line-height:1.5} .fx-hub .fx-grid{grid-template-columns:repeat(3,1fr)!important;gap:7px!important} .fx-hub .fx-tile{min-height:0!important;padding:10px 8px!important;border-radius:16px!important;align-items:center;text-align:center;gap:2px} .fx-hub .fx-tile .deco{display:none} .fx-hub .fx-te{width:38px;height:38px;font-size:20px;border-radius:12px;margin:0 0 4px} .fx-hub .fx-tile b{font-size:12.5px}.fx-hub .fx-tile small{font-size:10px;line-height:1.45} .fxh-close{width:auto!important;height:34px!important;padding:0 12px 0 10px;gap:5px;display:flex!important;align-items:center;border-radius:999px!important;background:#fff!important;color:#7a2d5a!important;border:none!important;font:inherit;font-size:13px;font-weight:800;box-shadow:0 6px 14px -6px rgba(0,0,0,.35)} .fxh-close svg{width:15px!important;height:15px!important} /* ===== پشتیبانی: گزینه‌ها داخلِ کادر و قابلِ اسکرول ===== */ .sup-panel{overflow-y:auto!important;max-height:68%!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain} #supportpop .cp-msgs{min-height:80px} /* پیامِ خصوصیِ ادمین: پاپ‌آپِ اجباری (فقط با «مشاهدهٔ پیغام» بسته می‌شود) */ .adm-force{position:fixed;inset:0;z-index:99999;background:rgba(20,8,24,.62);display:none;align-items:center;justify-content:center;padding:22px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)} .adm-force.on{display:flex} .adm-force .af-card{width:100%;max-width:340px;background:#fff;border-radius:24px;padding:26px 20px 20px;text-align:center;box-shadow:0 24px 60px -12px rgba(0,0,0,.45);animation:afIn .28s ease} @keyframes afIn{from{transform:translateY(14px) scale(.96);opacity:0}to{transform:none;opacity:1}} .adm-force .af-ic{width:66px;height:66px;margin:0 auto 14px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--coral),var(--coral-2));color:#fff;box-shadow:0 10px 24px -8px var(--coral)} .adm-force .af-ic svg{width:32px;height:32px} .adm-force .af-t{font-size:17px;font-weight:800;color:#3A2233;margin-bottom:8px;line-height:1.6} .adm-force .af-s{font-size:13.5px;color:#7A6270;line-height:1.8;margin-bottom:18px} .adm-force .af-btn{width:100%;border:none;border-radius:15px;padding:14px;font:inherit;font-size:15px;font-weight:800;color:#fff;background:linear-gradient(120deg,var(--coral),var(--coral-2));cursor:pointer} .adm-force .af-btn:active{transform:scale(.98)} .cbubble audio.sup-audio{display:block;width:220px;max-width:100%;height:40px} .sup-opt2{padding:8px 10px 8px 12px!important;border-radius:15px!important} /* ===== فیلتر: دکمه‌های پایین همیشه دیده می‌شوند ===== */ .fsheet.flt{padding-bottom:0} .fsheet.flt .flt-head{margin-bottom:10px}.fsheet.flt .flt-badge{display:none} .flt-foot{position:sticky;bottom:0;z-index:5;margin:6px -20px 0;padding:10px 20px 12px;background:linear-gradient(180deg,rgba(255,255,255,0),var(--blush,#fff) 28%)} .flt-foot .flt-apply{width:100%;margin:0} .flt-foot .flt-reset{margin-top:6px} /* ===== صفحه‌بندیِ کاربران ===== */ .nb-pager{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 2px 110px} .nbp-btn{flex:1;max-width:150px;border:none;border-radius:14px;padding:12px 10px;font:inherit;font-weight:800;font-size:13.5px;color:#fff;background:var(--grad);box-shadow:0 10px 20px -12px var(--coral);cursor:pointer} .nbp-btn[disabled]{opacity:.35;cursor:default;box-shadow:none} .nbp-n{font-weight:800;color:var(--plum);font-size:13.5px;white-space:nowrap} .nb-pager.loading .nbp-next{opacity:.6;pointer-events:none} /* ===== فیلتر: جمع‌وجورتر تا استان/شهر و دکمه‌ها بدونِ اسکرول دیده شوند ===== */ .fsheet.flt{padding-top:14px} .fsheet.flt .flt-head{margin-bottom:6px}.fsheet.flt .flt-head h2{font-size:18px;margin:0} .fsheet.flt .flt-q{margin:0 2px 6px;font-size:12.5px} .fsheet.flt .flt-tiles3{gap:6px!important;margin-bottom:6px!important} .fsheet.flt .flt-tiles3 .ftile{padding:8px 8px;border-radius:14px;gap:6px} .fsheet.flt .flt-tiles3 .ft-ic{width:28px;height:28px;border-radius:9px} .fsheet.flt .flt-tiles3 .ft-ic svg{width:15px;height:15px} .fsheet.flt .flt-tiles3 .ft-t{font-size:11.5px} .fsheet.flt .flt-tiles3 .ft-ck{top:5px;inset-inline-end:5px;width:14px;height:14px} .fsheet.flt .flt-pick{display:none} .fsheet.flt .flt-pick.on{display:block;padding:6px 8px;margin-bottom:8px;font-size:11.5px} .fsheet.flt .flt-card{padding:9px 12px 9px;margin-bottom:8px;border-radius:16px} .fsheet.flt .flt-ch{margin-bottom:2px} .fsheet.flt .age-big{font-size:15px;padding:3px 10px} .fsheet.flt .dual{margin:6px 0 6px} .fsheet.flt .flt-card button,.fsheet.flt .age-chip,.fsheet.flt .agep{padding:5px 4px!important;font-size:11.5px!important;border-radius:10px!important} .fsheet.flt .flt-card .ctrl{padding:9px 12px;font-size:13.5px;border-radius:12px} .fsheet.flt .flt-card label{font-size:12px;margin-bottom:4px} .fsheet.flt .flt-foot{padding:6px 20px 10px} .flt-foot .flt-reset{background:#fff;border:1.5px solid var(--line,#e6d9ee);border-radius:999px;padding:11px 14px;color:var(--plum,#6b3fa0);font-size:14px;font-weight:800;box-shadow:0 6px 14px -10px rgba(60,20,50,.45);margin-top:8px} .fsheet.flt .flt-apply{padding:13px;font-size:15px} .fsheet.flt .flt-card .field{margin-bottom:0}.fsheet.flt .age-pre{gap:5px} #nearbyGrid .ncard{opacity:1!important} /* ===== صفحه‌های سرگرمی (تاروت، ادیت عکس و…): جمع‌وجور تا کلِ صفحه بدونِ اسکرول دیده شود ===== */ .fx-sheet .stg{padding:10px 12px 10px;border-radius:18px;margin-bottom:8px} .fx-sheet .stg-art{height:46px;margin-bottom:2px} .fx-sheet .stg-em{font-size:32px} .fx-sheet .stg-art>*:not(.stg-em){transform:scale(.5)} .fx-sheet .stg b{font-size:16px} .fx-sheet .stg small{font-size:11.5px;line-height:1.6;margin-top:2px} .fx-sheet.fx-tall{min-height:0!important} .fx-sheet .fx-head{padding-top:8px!important;padding-bottom:6px!important;margin-bottom:2px!important} .tar-slots{width:70%;margin:6px auto 8px!important;gap:8px!important} .tar-slot{border-radius:12px} .tar-deck{grid-template-columns:repeat(8,1fr)!important;gap:5px!important;margin-top:8px!important} .tar-back{border-radius:6px!important} .ed-drop{min-height:92px!important;border-radius:18px} .ed-drop .ed-ph span{font-size:28px!important} .ed-drop .ed-ph b{font-size:14px}.ed-drop .ed-ph small{font-size:11px} #edBody .ed-lbl{margin:8px 2px 6px!important} #edBody .qod-in{min-height:58px!important;height:58px;padding:9px 12px} #edBody .ed-go{margin-top:8px!important;padding:13px!important} #edBody .ed-note{font-size:11px;margin-top:6px} /* ===== پروفایل: دکمه‌های پیام / پسندیدن / بلاک به‌صورتِ آیکون در گوشهٔ پایین‌چپِ عکس ===== */ .pv-fab{position:absolute;z-index:6;bottom:58px;inset-inline-end:14px;display:flex!important;flex-direction:row;align-items:flex-start;gap:10px;margin:0!important;padding:0!important;background:none!important;box-shadow:none!important} .pv-fab::before{display:none!important} .pv-fab .pvf{position:relative;display:flex!important;flex-direction:column;align-items:center;gap:5px;width:auto!important;height:auto!important;flex:none!important;margin:0!important;padding:0!important;border:none!important;background:none!important;box-shadow:none!important;color:#fff;font:inherit;cursor:pointer;animation:none} .pv-fab .pvf::after{display:none!important} .pv-fab .pvf svg{box-sizing:content-box;width:22px!important;height:22px!important;padding:13px;border-radius:50%;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 18px -8px rgba(0,0,0,.55);transition:transform .15s} .pv-fab .pvf:active svg{transform:scale(.9)} .pv-fab .pv-act.msg svg{background:var(--grad);border-color:rgba(255,255,255,.6)} .pv-fab .pv-act.like svg{color:#ff5c8a;background:#fff;border-color:#fff} .pv-fab .pv-block svg{color:#fff;background:rgba(216,69,106,.55);border-color:rgba(255,255,255,.4)} .pv-fab .pv-block.on svg{background:#2bbd82} .pv-fl{font-size:11.5px;font-weight:800;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.6);white-space:nowrap} .pv-fab .fl-on{display:none}.pv-fab .pv-block.on .fl-on{display:inline}.pv-fab .pv-block.on .fl-off{display:none} .blockedview .pv-fab .pv-act.msg svg{background:#9b8f97} .pv-photo .pv-cap{inset-inline-end:200px} @media (max-width:380px){.pv-fab{gap:7px}.pv-fab .pvf svg{padding:11px;width:20px!important;height:20px!important}.pv-photo .pv-cap{inset-inline-end:175px}} /* ===== داکِ شناور بین عکس و باکس: پسندیدن | پیام | بلاک ===== */ .pv-dock{position:relative!important;inset:auto!important;z-index:8;margin:-62px auto 0!important;width:max-content;display:flex!important;align-items:flex-end;justify-content:center;gap:26px!important; padding:12px 22px 10px!important;border-radius:30px;background:rgba(255,255,255,.72)!important;-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6); border:1px solid rgba(255,255,255,.9)!important;box-shadow:0 18px 40px -18px rgba(60,30,90,.55),inset 0 1px 0 #fff!important} .pv-dock .pv-fl{color:var(--plum);text-shadow:none;font-size:11.5px;opacity:.85} .pv-dock .pvf svg{box-sizing:content-box;width:22px!important;height:22px!important;padding:13px;border-radius:20px;border:none;-webkit-backdrop-filter:none;backdrop-filter:none;transition:transform .2s cubic-bezier(.2,.9,.3,1.4)} .pv-dock .pv-act.like svg{color:#fff;background:linear-gradient(145deg,#ff8aa8,#ff3d77);box-shadow:0 10px 18px -8px rgba(255,61,119,.75);transform:rotate(-8deg)} .pv-dock .pv-block svg{color:#c2416a;background:#fff;box-shadow:0 0 0 1.5px rgba(194,65,106,.25),0 8px 16px -10px rgba(0,0,0,.35);transform:rotate(8deg)} .pv-dock .pv-block.on svg{color:#fff;background:#2bbd82} .pv-dock .pv-act.msg svg{width:28px!important;height:28px!important;padding:17px;border-radius:50%;color:#fff;background:var(--grad);box-shadow:0 0 0 5px rgba(255,255,255,.95),0 14px 26px -8px var(--coral)} .pv-dock .pv-act.msg{margin-top:-26px!important} .pv-dock .pv-act.msg::before{content:"";position:absolute;top:0;left:50%;width:62px;height:62px;margin-left:-31px;border-radius:50%;box-shadow:0 0 0 0 var(--coral);animation:dockPulse 2.4s ease-out infinite;pointer-events:none} @keyframes dockPulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--coral) 55%,transparent)}100%{box-shadow:0 0 0 18px transparent}} .pv-dock .pvf:active svg{transform:scale(.88)} .pv-dock .pv-act.msg .pv-fl{font-size:12.5px;opacity:1;color:var(--coral)} .pv-photo .pv-cap{inset-inline-end:22px!important;bottom:112px!important} .pv-dock .pvf{overflow:visible!important} .pv-body .pv-thumbs:empty+.pv-stitle,.pv-body .pv-stitle{margin-top:22px!important} /* نسخهٔ ۲: بدونِ باکسِ پشت؛ آیکون‌های شیشه‌ای */ .pv-dock{background:none!important;border:none!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;padding:0!important;gap:34px!important;margin-top:-50px!important} .pv-dock .pvf svg{border-radius:50%!important;transform:none!important;padding:15px!important; background:linear-gradient(145deg,rgba(255,255,255,.55),rgba(255,255,255,.12))!important; -webkit-backdrop-filter:blur(14px) saturate(1.8)!important;backdrop-filter:blur(14px) saturate(1.8)!important; border:1.5px solid rgba(255,255,255,.75)!important; box-shadow:inset 0 2px 1px rgba(255,255,255,.9),inset 0 -6px 12px rgba(255,255,255,.12),0 12px 24px -10px rgba(40,10,60,.55)!important} .pv-dock .pv-act.like svg{color:#ff3d77!important} .pv-dock .pv-block svg{color:#c2416a!important} .pv-dock .pv-block.on svg{color:#1f9e6b!important} .pv-dock .pv-act.msg svg{width:28px!important;height:28px!important;padding:18px!important;color:#fff!important; background:linear-gradient(145deg,color-mix(in srgb,var(--coral) 85%,#fff),color-mix(in srgb,var(--coral) 55%,transparent))!important; box-shadow:inset 0 2px 1px rgba(255,255,255,.75),0 0 0 6px rgba(255,255,255,.28),0 16px 28px -10px var(--coral)!important} .pv-dock .pv-act.msg{margin-top:-18px!important} .pv-dock .pv-fl{color:var(--plum)!important;font-weight:800;text-shadow:0 1px 0 rgba(255,255,255,.8)!important} .pv-dock .pv-act.like svg,.pv-dock .pv-block svg{background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(255,255,255,.45))!important} .pv-body::before{display:none!important} .pv-dock{margin-top:28px!important} .pv-photo .pv-cap{bottom:50px!important} .pv-dock .pv-act.msg{margin-top:-10px!important} .pv-dock .pv-act.like svg,.pv-dock .pv-block svg{background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--coral) 10%,#fff))!important;border:1.5px solid color-mix(in srgb,var(--coral) 22%,#fff)!important;box-shadow:inset 0 2px 1px #fff,0 10px 22px -12px color-mix(in srgb,var(--coral) 70%,#000)!important} .pv-dock{gap:22px!important} .pv-dock .pv-rep2 svg{color:#b7791f!important;background:linear-gradient(145deg,#fff,#fff6e6)!important;border:1.5px solid #f3d9a6!important} /* گالری بالا (روی لبهٔ عکس)، دکمه‌ها زیرش؛ نوشتهٔ شهر همیشه خوانا */ .pv-thumbs:empty{display:none!important} .pv-thumbs:not(:empty)+.pv-dock{margin-top:14px!important} .pv-city{background:rgba(20,10,25,.55)!important;border-color:rgba(255,255,255,.28)!important;color:#fff!important;text-shadow:0 1px 3px rgba(0,0,0,.5)} .pv-name{text-shadow:0 2px 12px rgba(0,0,0,.55),0 1px 2px rgba(0,0,0,.4)} .pv-photo .pv-cap{bottom:86px!important} /* عکسِ پروفایل کامل دیده شود (بدونِ زوم/برش)؛ دورش همان عکس به‌صورتِ محو پر می‌شود */ .pv-mainimg,.pv-mainimg.swap{object-fit:contain!important;height:calc(100% - 30px)!important;animation:none!important;transform:none!important} .pv-mainimg.swap{animation:pvSwap .45s ease both!important} .pv-photo::before{content:"";position:absolute;inset:-30px;z-index:0;background:var(--pvbg,none) center/cover no-repeat;filter:blur(26px) brightness(.75) saturate(1.2);transform:scale(1.08);opacity:0;transition:opacity .3s} .pv-photo.has-bg::before{opacity:1} /* دکمه‌های پروفایل: همان مدلِ قدیمی (پیامِ پهن + قلبِ مربعی)؛ بلاک و گزارش برداشته شد */ .pv-hidden{display:none!important} #profileView:has(.pv-thumbs:empty) .pv-photo .pv-cap{bottom:44px!important} #profileView:not(:has(.pv-thumbs:empty)) .pv-photo .pv-cap{bottom:74px!important} /* سافاری iOS: بعد از برگشتن از پس‌زمینه گاهی لایه‌های گرادیانی/مات (دکمهٔ لایک، دکمهٔ چت) بی‌رنگ رسم می‌شوند. با برگشتن به اپ، این کلاس دو فریم روشن می‌شود و مرورگر لایه‌ها را از نو می‌سازد (بدونِ هیچ درخواستی). */ html.rp .act,html.rp .fab,html.rp .nav,html.rp .card,html.rp .credpill{will-change:transform} /* آیکونِ مکان همه‌جای اپ سبزِ پررنگ */ svg:has(> path[d^="M12 21s7-5.7"]){color:#15803d!important;stroke:#15803d} .meta svg:has(> path[d^="M12 21s7-5.7"]),.ad-card svg:has(> path[d^="M12 21s7-5.7"]){color:#22c55e!important;stroke:#22c55e} /* راهنماهای مرحله‌ای خاموش: هیچ کارت/لایهٔ آموزشی نباید فضا اشغال کند. */ #chatTour,.chat-tour,.ct-ov,#tourFinger,#funHint{display:none!important;pointer-events:none!important} #supMic.rec{color:#e5484d;animation:supRecP 1s infinite}@keyframes supRecP{50%{opacity:.35}} .spx-card{position:relative} .spx-onl{position:absolute;top:6px;left:24px;z-index:3;font-size:10.5px;font-weight:800;color:#d9ffe9;background:rgba(0,0,0,.45);padding:2px 7px;border-radius:999px;backdrop-filter:blur(4px)} .spx-tm{position:absolute;bottom:62px;left:8px;z-index:3;font-size:10.5px;font-weight:800;color:#fff;background:rgba(229,72,77,.82);padding:2px 8px;border-radius:999px} .spx-hi{position:absolute;top:36px;right:5px;z-index:3;width:34px;height:34px;border:0;border-radius:50%;font-size:17px;background:rgba(255,255,255,.88);box-shadow:0 4px 10px rgba(0,0,0,.25);cursor:pointer} .nq-bar{grid-column:1/-1;display:flex;gap:7px;align-items:center;padding:2px 2px 4px;overflow-x:auto} .nq-c{flex:none;border:0;border-radius:999px;padding:8px 13px;font:inherit;font-size:12.5px;font-weight:800;background:rgba(127,127,127,.12);color:inherit;cursor:pointer} .nq-c.on{background:var(--grad,linear-gradient(120deg,#8a5cf0,#b36cff));color:#fff} .nq-v{margin-inline-start:auto;flex:none;border:0;border-radius:12px;width:36px;height:34px;font-size:16px;background:rgba(127,127,127,.12);color:inherit;cursor:pointer} .ncard{position:relative} .nc-lk{position:absolute;bottom:10px;left:10px;z-index:4;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:#e5484d;font-size:18px;line-height:1;box-shadow:0 4px 10px rgba(0,0,0,.25);cursor:pointer} .nc-com{margin-top:4px;font-size:11px;font-weight:800;opacity:.85} .nc-burst{position:absolute;inset:0;display:grid;place-items:center;font-size:84px;z-index:6;pointer-events:none;animation:ncB .8s ease-out forwards} @keyframes ncB{0%{transform:scale(.3);opacity:0}30%{transform:scale(1.15);opacity:1}100%{transform:scale(1.5);opacity:0}} .ngrid.nb-list{grid-template-columns:1fr!important} .ngrid.nb-list .ncard{display:flex;align-items:center;gap:12px;aspect-ratio:auto!important;height:96px} .ngrid.nb-list .ncard-ph{width:84px;height:84px!important;flex:none;border-radius:16px;aspect-ratio:auto!important;position:relative} .ngrid.nb-list .ncard-info{position:static!important;background:none!important;padding:0!important} .ex-box{padding:6px 12px 12px!important} .ex-t{font-size:13px;font-weight:900;margin:10px 2px 6px} .ex-row{display:flex;flex-wrap:wrap;gap:7px} .ex-c{border:0;border-radius:999px;padding:8px 13px;font:inherit;font-size:12.5px;font-weight:800;background:rgba(127,127,127,.12);color:inherit;cursor:pointer} .ex-c.on{background:var(--grad,linear-gradient(120deg,#8a5cf0,#b36cff));color:#fff} .filterbtn{position:relative} .fx-n{position:absolute;top:-6px;inset-inline-end:-4px;min-width:20px;height:20px;border-radius:10px;padding:0 5px;background:#e5484d;color:#fff;font-size:11px;font-weight:900;display:grid;place-items:center} .cn-bar{padding:2px 2px 8px;display:flex} .cn-grp{font-size:12px;font-weight:900;opacity:.65;margin:12px 4px 4px} .cn-new{display:inline-block;margin-inline-start:6px;font-size:10px;font-weight:900;color:#fff;background:#e5484d;border-radius:999px;padding:1px 7px;vertical-align:middle} .cn-cm{font-size:11px;font-weight:800;opacity:.8;margin-top:2px} .cn-acts{display:flex;gap:6px;margin-inline-end:6px} .cn-ab{width:34px;height:34px;border:0;border-radius:50%;font-size:16px;line-height:1;background:rgba(127,127,127,.14);color:#e5484d;cursor:pointer} .cn-ab.chat{background:linear-gradient(135deg,#8a5cf0,#b36cff);color:#fff} .cseg i.has{background:#e5484d!important;color:#fff!important;font-weight:900} .cn-pc{margin:6px 6px 14px;padding:14px;border-radius:20px;background:rgba(127,127,127,.08)} .cn-pct{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}.cn-pct b{font-size:22px}.cn-pct span{font-size:12px;opacity:.7} .cn-pbar{height:9px;border-radius:9px;background:rgba(127,127,127,.18);overflow:hidden}.cn-pbar i{display:block;height:100%;border-radius:9px;background:var(--grad,linear-gradient(90deg,#8a5cf0,#ff6aa0))} .cn-tip{font-size:13px;font-weight:800;margin:10px 2px} .cn-btns{display:flex;gap:8px;flex-wrap:wrap} .cn-sg{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:900;margin:14px 8px 10px;color:var(--plum,#2a1a5a)} .cn-sg::before{content:'';width:10px;height:10px;border-radius:50%;background:#3ddc6f;box-shadow:0 0 0 4px rgba(61,220,111,.25)} .ab-card{margin:14px 0 6px;padding:14px;border-radius:20px;background:rgba(127,127,127,.08);text-align:start} .ab-h{display:flex;align-items:center;justify-content:space-between;font-weight:900;font-size:14px;margin:12px 0 6px} .ab-ed{border:0;border-radius:999px;padding:6px 13px;font:inherit;font-size:12px;font-weight:800;background:var(--grad,linear-gradient(120deg,#8a5cf0,#b36cff));color:#fff;cursor:pointer} .ab-miss{margin-top:12px;padding:10px 12px;border-radius:14px;background:rgba(255,160,0,.12);border:1px dashed rgba(255,160,0,.5);cursor:pointer}.ab-miss-t{font-size:12.5px;font-weight:800;margin-bottom:6px}.ab-bio{font-size:14px;line-height:1.7}.ab-empty{font-size:12.5px;opacity:.7} .ab-st{font-size:12.5px;font-weight:800;margin:4px 2px 0;opacity:.85} .ab-pr{margin-top:10px;padding:10px 12px;border-radius:14px;background:rgba(127,127,127,.1)}.ab-pr b{display:block;font-size:12px;opacity:.7;margin-bottom:3px}.ab-pr span{font-size:14px;font-weight:700} .ab-ta,.ab-in,.ab-sel{width:100%;box-sizing:border-box;border:1.5px solid rgba(127,127,127,.25);border-radius:14px;padding:11px 13px;font:inherit;font-size:14px;background:#fff;color:#2a1a3a;margin-top:6px} .ab-err{color:#e5484d;font-size:12px;font-weight:800;min-height:0;margin-top:3px} .pf-det{margin-top:18px}.pf-det>summary{cursor:pointer;font-weight:900;font-size:14px;padding:12px 14px;border-radius:16px;background:rgba(127,127,127,.1);list-style:none} .pf-det>summary::-webkit-details-marker{display:none} .pv-chip.com{background:linear-gradient(135deg,#8a5cf0,#b36cff)!important;color:#fff!important}.pv-chip.com .pv-ci{color:#fff} .pv-bdg{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.pv-bdg span{font-size:11.5px;font-weight:800;color:#fff;background:rgba(0,0,0,.35);backdrop-filter:blur(6px);border-radius:999px;padding:4px 10px} .pv-ice{margin:12px 0 4px}.pv-ice-t{font-size:12.5px;font-weight:900;margin:0 2px 8px;opacity:.75} .pv-ice button{display:inline-block;margin:0 0 7px 7px;border:1.5px solid rgba(127,127,127,.25);border-radius:999px;padding:9px 14px;font:inherit;font-size:13px;font-weight:800;background:rgba(127,127,127,.08);color:inherit;cursor:pointer} .pv-more{position:absolute;top:calc(30px + env(safe-area-inset-top,0px));inset-inline-start:68px;z-index:6;width:42px;height:42px;border:0;border-radius:14px;font-size:22px;font-weight:900;line-height:1;background:rgba(255,255,255,.85);color:#2a1a3a;cursor:pointer} .pv-more-m{position:absolute;top:calc(80px + env(safe-area-inset-top,0px));inset-inline-start:18px;z-index:7;display:flex;flex-direction:column;gap:2px;background:#fff;border-radius:16px;padding:6px;box-shadow:0 10px 30px rgba(0,0,0,.3)} .pv-more-m button{border:0;background:none;padding:11px 16px;font:inherit;font-size:14px;font-weight:800;text-align:start;color:#2a1a3a;border-radius:12px;cursor:pointer;white-space:nowrap} #profileView.on .pv-body{animation:pvUp .38s cubic-bezier(.2,.9,.3,1) both} @keyframes pvUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}} /* نظر ۵ ستاره (play_review) */ .pr-card{width:100%;display:flex;align-items:center;gap:10px;margin:8px 0;padding:11px 13px;border:0;border-radius:18px;cursor:pointer;color:#fff;font-family:inherit;text-align:start;background:linear-gradient(120deg,#FFB020,#FF5C8A 60%,#B06CFF);background-size:200% 100%;animation:prSh 4s linear infinite;box-shadow:0 10px 24px -12px rgba(255,92,138,.8)} .pr-card.pend{background:linear-gradient(120deg,#8a7f9a,#a79bb8);animation:none;box-shadow:none} @keyframes prSh{0%{background-position:0 0}100%{background-position:200% 0}} .pr-tx{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.pr-tx b{font-size:13.5px;font-weight:800;line-height:1.5}.pr-tx small{font-size:11px;opacity:.92} .pr-go{font-size:22px;animation:prBob 1.6s ease-in-out infinite}@keyframes prBob{50%{transform:translateY(-3px) rotate(8deg)}} .pr-stars{display:flex;direction:ltr;font-size:13px;color:#FFE27A;text-shadow:0 0 8px rgba(255,226,122,.9)}.pr-stars i{font-style:normal;animation:prTw 1.8s ease-in-out infinite} .pr-stars i:nth-child(2){animation-delay:.15s}.pr-stars i:nth-child(3){animation-delay:.3s}.pr-stars i:nth-child(4){animation-delay:.45s}.pr-stars i:nth-child(5){animation-delay:.6s} @keyframes prTw{50%{transform:scale(1.35);opacity:.7}} .pr-slot{padding:0 14px} .pr-bg{position:fixed;inset:0;z-index:300;background:rgba(40,12,32,.55);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:16px;animation:fade .25s ease both} .pr-sh{position:relative;width:100%;max-width:360px;max-height:92vh;overflow:auto;background:var(--cream,#fff);color:var(--ink,#3A2233);border-radius:26px;padding:18px 16px 16px;box-shadow:var(--shadow);animation:fsIn .3s ease both} .pr-sh h3{margin:0 28px 12px 0;font-size:16px;font-weight:800;line-height:1.6} .pr-x{position:absolute;top:12px;inset-inline-end:12px;width:30px;height:30px;border-radius:50%;border:0;background:var(--blush,#eee);color:inherit;cursor:pointer} .pr-dots{display:flex;justify-content:center;gap:6px;margin:9px 0 4px}.pr-dots i{width:7px;height:7px;border-radius:50%;background:var(--line);transition:.3s}.pr-dots i.on{width:20px;border-radius:8px;background:var(--coral)} .pr-cap{min-height:40px;text-align:center;font-size:12.5px;line-height:1.7;font-weight:600;margin-bottom:8px} .pr-btn{display:flex;align-items:center;justify-content:center;width:100%;margin-top:8px;padding:12px;border-radius:16px;border:0;font-family:inherit;font-weight:800;font-size:14px;cursor:pointer;box-sizing:border-box} .pr-btn.gp{background:#1a73e8;color:#fff;animation:prPulse2 1.8s ease-in-out infinite}@keyframes prPulse2{50%{box-shadow:0 0 0 7px rgba(26,115,232,.18)}} .pr-btn.pick{background:var(--blush,#fff3f1);color:var(--coral);border:1.5px dashed var(--coral)}.pr-btn.send{background:var(--grad);color:#fff} .pr-prev{display:block;width:100%;max-height:200px;object-fit:contain;margin-top:8px;border-radius:12px;border:1px solid var(--line)} .pr-wait{text-align:center;padding:14px 6px 8px}.pr-wait p{font-size:13px;line-height:1.8;opacity:.8}.pr-hg{font-size:46px;margin-bottom:6px;animation:prBob 1.6s ease-in-out infinite} .pr-rej{background:#ffe9ee;color:#c0254f;border-radius:12px;padding:8px 10px;font-size:12px;margin-bottom:6px;text-align:center} .pr-phone{position:relative;height:262px;border-radius:20px;background:#fff;border:2px solid #cfd3da;overflow:hidden;direction:ltr;text-align:left;font-family:Roboto,Arial,sans-serif;color:#202124} .pr-bar{position:absolute;top:0;left:0;right:0;z-index:5;height:34px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#fff;border-bottom:1px solid #e8eaed;font-size:15px}.pr-gp{font-size:12.5px;font-weight:700;color:#5f6368} .pr-page{position:absolute;top:34px;left:0;right:0;padding:10px 12px;transition:transform .9s cubic-bezier(.5,0,.2,1)} .pr-phone[data-s="1"] .pr-page,.pr-phone[data-s="2"] .pr-page{transform:translateY(-170px)}.pr-phone[data-s="3"] .pr-page{transform:translateY(-150px)}.pr-phone[data-s="4"] .pr-page{transform:translateY(-150px)} .pr-app{position:relative;display:flex;align-items:center;gap:10px}.pr-ic{font-size:30px;background:var(--grad);border-radius:14px;padding:5px 8px}.pr-ic.img{width:48px;height:48px;padding:0;border-radius:12px;object-fit:cover;background:#eee}.pr-nm b{display:block;font-size:14.5px}.pr-nm small{color:#5f6368;font-size:10.5px} .pr-inst{margin:10px 0 8px;text-align:center;padding:7px;border-radius:18px;background:#01875f;color:#fff;font-weight:700;font-size:12.5px} .pr-shots{display:flex;gap:6px;height:64px}.pr-shots i{flex:1;border-radius:9px;background:linear-gradient(160deg,#ffd9e6,#e9dcff)} .pr-abt{margin:12px 0 10px;font-size:12.5px;font-weight:700} .pr-rate{position:relative;padding:10px 6px 8px;text-align:center;border-top:1px solid #e8eaed}.pr-rate b{display:block;font-size:13.5px}.pr-rate small{color:#5f6368;font-size:10.5px} .pr-wr{display:inline-block;margin-top:8px;padding:6px 16px;border:1px solid #dadce0;border-radius:18px;color:#01875f;font-weight:700;font-size:12px} .pr-st5{position:relative;display:flex;justify-content:center;direction:ltr;gap:6px;font-size:30px;line-height:1.3;color:#c4c7cc;margin-top:4px}.pr-st5.sm{font-size:22px}.pr-st5 i{font-style:normal} .pr-st5.on i{color:#FFB020} .pr-phone[data-s="2"] .pr-rate .pr-st5 i{animation:prFill .45s ease both}.pr-phone[data-s="2"] .pr-rate .pr-st5 i:nth-of-type(2){animation-delay:.35s}.pr-phone[data-s="2"] .pr-rate .pr-st5 i:nth-of-type(3){animation-delay:.7s}.pr-phone[data-s="2"] .pr-rate .pr-st5 i:nth-of-type(4){animation-delay:1.05s}.pr-phone[data-s="2"] .pr-rate .pr-st5 i:nth-of-type(5){animation-delay:1.4s} .pr-phone[data-s="3"] .pr-rate .pr-st5 i,.pr-phone[data-s="4"] .pr-rate .pr-st5 i{color:#FFB020} @keyframes prFill{0%{color:#c4c7cc;transform:scale(1)}60%{transform:scale(1.45)}100%{color:#FFB020;transform:scale(1)}} .pr-ring{position:absolute;display:none;border:3px solid #ff3d71;border-radius:14px;pointer-events:none;box-shadow:0 0 0 0 rgba(255,61,113,.6);animation:prRing 1.2s ease-out infinite} @keyframes prRing{0%{box-shadow:0 0 0 0 rgba(255,61,113,.55)}100%{box-shadow:0 0 0 12px rgba(255,61,113,0)}} .pr-ring.r0{inset:-4px auto -4px -4px;width:calc(100% - 4px)}.pr-ring.r1{inset:-2px -4px -2px -4px}.pr-ring.r3{inset:-4px} .pr-phone[data-s="0"] .r0{display:block}.pr-phone[data-s="1"] .r1,.pr-phone[data-s="2"] .r1{display:block}.pr-phone[data-s="3"] .r3{display:block} .pr-form{position:absolute;left:0;right:0;bottom:0;z-index:6;padding:10px 14px 12px;background:#fff;border-top:1px solid #dadce0;border-radius:18px 18px 0 0;box-shadow:0 -10px 24px -8px rgba(0,0,0,.25);text-align:center;transform:translateY(105%);transition:transform .6s ease;height:140px} .pr-form b{font-size:12.5px}.pr-phone[data-s="3"] .pr-form,.pr-phone[data-s="4"] .pr-form{transform:none}.pr-phone[data-s="4"] .pr-form{transform:translateY(105%)} .pr-typ{margin:4px 0 8px;min-height:30px;border:1px solid #dadce0;border-radius:10px;padding:6px 9px;font-size:12px;text-align:start;overflow:hidden;white-space:nowrap} .pr-phone[data-s="3"] .pr-typ span{display:inline-block;overflow:hidden;white-space:nowrap;max-width:0;vertical-align:bottom;animation:prType 2s steps(22) .8s forwards}@keyframes prType{to{max-width:100%}} .pr-post{position:relative;display:inline-block;padding:6px 26px;border-radius:18px;background:#01875f;color:#fff;font-weight:700;font-size:12px} .pr-bub{position:absolute;z-index:8;display:none;left:10px;right:10px;padding:6px 9px;border-radius:11px;background:#202124;color:#fff;font:700 11.5px/1.5 Vazirmatn,Tahoma,sans-serif;direction:rtl;text-align:center;box-shadow:0 6px 16px -6px rgba(0,0,0,.5)} .pr-bub.b0,.pr-bub.b1,.pr-bub.b2{bottom:10px}.pr-bub.b3{top:8px;z-index:9} .pr-phone[data-s="0"] .b0,.pr-phone[data-s="1"] .b1,.pr-phone[data-s="2"] .b2,.pr-phone[data-s="3"] .b3{display:block;animation:fade .4s ease both} .pr-fg{position:absolute;z-index:9;display:none;font-size:26px;animation:prTap 1.1s ease-in-out infinite}@keyframes prTap{0%,100%{transform:translate(0,0)}50%{transform:translate(-5px,-8px) scale(.9)}} .pr-fg.f1{left:68%;top:150px}.pr-fg.f2{left:67%;top:138px}.pr-fg.f3{left:56%;top:216px} .pr-phone[data-s="1"] .f1{display:block;animation:prSc 1.4s ease-in-out infinite}@keyframes prSc{0%{transform:translateY(20px);opacity:0}30%{opacity:1}100%{transform:translateY(-34px);opacity:0}} .pr-phone[data-s="2"] .f2{display:block}.pr-phone[data-s="3"] .f3{display:block} .pr-shotv{position:absolute;inset:34px 0 0 0;z-index:10;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.18)}.pr-phone[data-s="4"] .pr-shotv{display:flex} .pr-shotc{width:62%;background:#fff;border:1px solid #dadce0;border-radius:12px;padding:10px;display:flex;flex-direction:column;align-items:center;gap:4px;font:600 10.5px Vazirmatn,Tahoma,sans-serif;direction:rtl;box-shadow:0 8px 24px -8px rgba(0,0,0,.4);animation:prFlash 1.6s ease-in-out infinite} @keyframes prFlash{0%,60%,100%{box-shadow:0 8px 24px -8px rgba(0,0,0,.4)}70%{box-shadow:0 0 0 60px rgba(255,255,255,.95)}} .pr-cam{position:absolute;right:14px;bottom:12px;font-size:32px;animation:prFl 1.6s ease-in-out infinite}@keyframes prFl{0%,60%,100%{transform:scale(1)}70%{transform:scale(1.4)}} /* ── عکسِ محوشونده ── */ .vb{display:flex;align-items:center;gap:10px;min-width:190px;padding:2px 0;cursor:pointer;-webkit-user-select:none;user-select:none} .vb.me{cursor:default} .vb .vbi{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:19px;background:rgba(255,255,255,.14);position:relative;flex:none} .vb:not(.done):not(.me) .vbi::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px dashed rgba(255,255,255,.7);animation:vbSpin 6s linear infinite} .vb .vbt{display:flex;flex-direction:column;line-height:1.5;font-size:13px} .vb .vbt small{opacity:.75;font-size:11px} .vb.done{opacity:.6;cursor:default} .vb.done .vbi{filter:grayscale(1)} .vb.dissolve{animation:vbDis .9s ease forwards} @keyframes vbSpin{to{transform:rotate(360deg)}} @keyframes vbDis{0%{filter:blur(0);opacity:1;transform:scale(1)}60%{filter:blur(6px);opacity:.5;transform:scale(1.04)}100%{filter:blur(0);opacity:.6;transform:scale(1)}} #vbOv{position:fixed;inset:0;z-index:99999;background:#000;display:flex;align-items:center;justify-content:center;animation:vbIn .25s ease;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none} #vbOv canvas{max-width:100%;max-height:100%;object-fit:contain;pointer-events:none} #vbOv.out{animation:vbOut .7s ease forwards} #vbOv .vbr{position:absolute;top:calc(env(safe-area-inset-top,0px) + 14px);right:14px;width:46px;height:46px} #vbOv .vbr svg{transform:rotate(-90deg)} #vbOv .vbr circle{fill:rgba(0,0,0,.45);stroke-width:4} #vbOv .vbr .bg{stroke:rgba(255,255,255,.25)} #vbOv .vbr .fg{stroke:#fff;stroke-linecap:round;stroke-dasharray:113;stroke-dashoffset:0} #vbOv .vbr b{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:16px} @keyframes vbIn{from{opacity:0}to{opacity:1}} @keyframes vbOut{0%{opacity:1;filter:blur(0);transform:scale(1)}100%{opacity:0;filter:blur(18px);transform:scale(1.08)}} @media print{#vbOv{display:none!important}} #vbSheet{position:fixed;inset:0;z-index:99998;background:rgba(0,0,0,.55);display:flex;align-items:flex-end;justify-content:center;animation:vbIn .2s ease} #vbSheet .box{width:100%;max-width:520px;background:var(--bg2,#1b1830);color:inherit;border-radius:22px 22px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px));max-height:88vh;overflow:auto;animation:vbUp .28s cubic-bezier(.2,.9,.3,1)} @keyframes vbUp{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}} #vbSheet h3{margin:0 0 10px;font-size:16px} #vbSheet .chips{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 12px} #vbSheet .chip{padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.2);font-size:14px;cursor:pointer;background:transparent;color:inherit} #vbSheet .chip.on{background:linear-gradient(135deg,#6d5dfc,#a56cff);border-color:transparent;color:#fff} #vbSheet .info{font-size:12.5px;line-height:1.9;opacity:.9;background:rgba(255,255,255,.06);border-radius:14px;padding:10px 12px;margin-bottom:12px;display:none} #vbSheet .info.on{display:block;animation:vbIn .3s ease} #vbSheet .acts{display:flex;gap:10px} #vbSheet .acts button{flex:1;padding:12px;border-radius:14px;border:0;font-size:15px;cursor:pointer} #vbSheet .go{background:linear-gradient(135deg,#6d5dfc,#a56cff);color:#fff} #vbSheet .no{background:rgba(255,255,255,.1);color:inherit} #vbSheet img{width:56px;height:56px;border-radius:12px;object-fit:cover;float:left;margin:0 0 6px 10px;filter:blur(3px)} .cp-composer{position:relative} .cp-plusmenu{position:absolute;left:12px;bottom:calc(100% + 60px);z-index:6;display:none;flex-direction:column;gap:2px;min-width:270px;max-width:calc(100vw - 24px);padding:8px;border-radius:20px;background:var(--card,#fff);color:var(--ink,#222);box-shadow:0 12px 40px rgba(0,0,0,.3);transform-origin:bottom left} .cp-plusmenu.on{display:flex;animation:pmIn .22s cubic-bezier(.2,.9,.3,1)} @keyframes pmIn{from{opacity:0;transform:scale(.85) translateY(10px)}to{opacity:1;transform:none}} .cp-plusmenu button{display:flex;align-items:center;gap:12px;padding:11px 12px;border:0;border-radius:14px;background:transparent;color:inherit;font:inherit;font-size:15px;cursor:pointer;text-align:start} .cp-plusmenu .pt{display:flex;flex-direction:column;line-height:1.5;min-width:0} .cp-plusmenu .pt b{font-weight:600;font-size:15px} .cp-plusmenu .pt small{font-size:11.5px;opacity:.65;font-weight:400} .cp-plusmenu button:active{background:rgba(127,127,127,.15)} .cp-plusmenu .pi{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:17px;background:rgba(127,127,127,.14);flex:none} .mm{display:flex;align-items:center;gap:10px;min-width:210px;max-width:260px} .mm .mi{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;font-size:22px;background:rgba(255,255,255,.16);flex:none} .mm .mt{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.5} .mm .mt b{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .mm .mt small{opacity:.75;font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .mm button{width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.22);color:inherit;font-size:14px;cursor:pointer;flex:none} .mm.pl .mi{animation:mmPulse 1s ease-in-out infinite} @keyframes mmPulse{50%{transform:scale(1.1)}} #mmSheet{position:fixed;inset:0;z-index:99998;background:rgba(0,0,0,.55);display:flex;align-items:flex-end;justify-content:center;animation:vbIn .2s ease} #mmSheet .box{width:100%;max-width:520px;height:70vh;background:var(--bg2,#1b1830);color:inherit;border-radius:22px 22px 0 0;padding:14px;display:flex;flex-direction:column;animation:vbUp .28s cubic-bezier(.2,.9,.3,1)} #mmSheet input{padding:12px 16px;border-radius:999px;border:1.5px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:inherit;font:inherit;font-size:16px;margin:8px 0} #mmSheet .res{flex:1;overflow:auto} #mmSheet .it{display:flex;align-items:center;gap:10px;padding:8px 4px;border-radius:12px} #mmSheet .it img{width:46px;height:46px;border-radius:8px;object-fit:cover} #mmSheet .it .tx{flex:1;min-width:0;display:flex;flex-direction:column;font-size:14px} #mmSheet .it .tx small{opacity:.7} #mmSheet .it button{border:0;border-radius:999px;padding:8px 14px;cursor:pointer;font:inherit} #mmSheet .it .pv{background:rgba(255,255,255,.14);color:inherit;padding:8px 11px} #mmSheet .it .pk{background:linear-gradient(135deg,#6d5dfc,#a56cff);color:#fff} .cbubble.vbub{padding:0;background:transparent!important;box-shadow:none!important;border:0} .vc{position:relative;width:210px;height:150px;border-radius:18px;overflow:hidden;color:#fff;cursor:pointer;background:radial-gradient(120% 120% at 30% 20%,#3b2a63,#1c1233 60%,#120b24);border:2px solid #6d5dfc;-webkit-user-select:none;user-select:none} .vc.me{cursor:default;border-color:#8b7bff} .vc-dots,.vc-dots.d2{position:absolute;inset:-40px;pointer-events:none;background-image:radial-gradient(circle,#fff 1.2px,transparent 1.6px),radial-gradient(circle,rgba(255,255,255,.8) 1px,transparent 1.5px),radial-gradient(circle,rgba(255,255,255,.6) 1.4px,transparent 1.9px);background-size:23px 27px,31px 19px,17px 37px;background-position:0 0,9px 11px,5px 3px;animation:vcDrift 2.4s linear infinite,vcTw 1.6s ease-in-out infinite alternate} .vc-dots.d2{background-size:29px 33px,13px 41px,37px 23px;background-position:4px 8px,2px 20px,14px 6px;animation-duration:3.3s,2.1s;animation-direction:normal,alternate-reverse;opacity:.8} @keyframes vcDrift{to{transform:translate(23px,-27px)}} @keyframes vcTw{from{opacity:.35}to{opacity:1}} .vc-badge{position:absolute;top:8px;left:8px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.4);font-size:13px;font-weight:700;backdrop-filter:blur(4px);z-index:2} .vc-core{position:absolute;left:50%;top:48%;width:74px;height:74px;margin:-37px 0 0 -37px;border-radius:50%;display:grid;place-items:center;background:rgba(10,6,22,.6);z-index:2;animation:vcPulse 1.8s ease-in-out infinite} .vc-core svg{width:38px;height:38px} @keyframes vcPulse{50%{transform:scale(1.09);box-shadow:0 0 28px rgba(165,108,255,.7)}} .vc-lbl{position:absolute;left:0;right:0;bottom:12px;text-align:center;font-size:12px;opacity:.85;z-index:2;padding:0 70px 0 10px} .vc-time{position:absolute;right:8px;bottom:8px;padding:3px 10px;border-radius:999px;background:rgba(0,0,0,.4);font-size:12px;z-index:3;display:flex;align-items:center;gap:4px;direction:ltr} .vc-time .cticks{position:static;display:inline-flex;width:18px} .vc.done{border-color:#555;filter:saturate(.3)} .vc.done .vc-dots{animation:none;opacity:.15} .vc.done .vc-core{animation:none;opacity:.5} .vc.dissolve{animation:vcGone 1s ease forwards} @keyframes vcGone{0%{filter:blur(0) saturate(1);transform:scale(1)}40%{filter:blur(10px) saturate(1.6);transform:scale(1.07)}100%{filter:blur(0) saturate(.3);transform:scale(1)}} .cp-fxbtn{display:none!important} .cp-plus{position:absolute;left:14px;bottom:calc(100% + 10px);width:46px;height:46px;border-radius:50%;border:0;padding:0;background:transparent;cursor:pointer;z-index:5;filter:drop-shadow(0 6px 14px rgba(109,93,252,.45));animation:plFloat 3.2s ease-in-out infinite} .cp-plus .pl-ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,#6d5dfc,#e8607f,#ffb36b,#a56cff,#6d5dfc);animation:plSpin 4s linear infinite} .cp-plus .pl-core{position:absolute;inset:3px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#4a3bd6,#c64d9a);overflow:hidden} .cp-plus .pl-core::after{content:"";position:absolute;top:-60%;left:-30%;width:60%;height:220%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:rotate(25deg);animation:plShine 3.4s ease-in-out infinite} .cp-plus svg{position:absolute;width:22px;height:22px;transition:transform .35s cubic-bezier(.2,.9,.3,1),opacity .25s} .cp-plus .pl-star{animation:plTw 2s ease-in-out infinite} .cp-plus .pl-x{opacity:0;transform:rotate(-90deg) scale(.5)} .cp-plus.on .pl-star{opacity:0;transform:rotate(180deg) scale(.4);animation:none} .cp-plus.on .pl-x{opacity:1;transform:none} .cp-plus.on{animation:none;transform:scale(.94)} @keyframes plSpin{to{transform:rotate(360deg)}} @keyframes plFloat{50%{transform:translateY(-3px)}} @keyframes plTw{50%{transform:scale(1.18) rotate(12deg)}} @keyframes plShine{0%,60%{left:-60%}100%{left:130%}} @media (prefers-reduced-motion:reduce){.cp-plus,.cp-plus .pl-ring,.cp-plus .pl-core::after,.cp-plus .pl-star{animation:none}}