/* v152 · دیسکاور (کارت‌های آشنایی) */
#s-home.dc152on{ padding-left:0 !important; padding-right:0 !important }
#s-home.dc152on > *:not(#dc152host){ display:none !important }

.dc152{ --ink:#1F1433; color:var(--ink); max-width:480px; margin:0 auto; padding:4px 14px calc(84px + env(safe-area-inset-bottom)); user-select:none; -webkit-user-select:none }
.dc152 button{ font-family:inherit }

/* سربرگ */
.dh152{ display:flex; align-items:center; gap:10px; margin-bottom:10px }
.lk152{ flex:1; min-width:0; display:flex; align-items:center; gap:10px; height:46px; padding:0 14px 0 6px; border:0; border-radius:16px; cursor:pointer; text-align:start;
  background:#fff; box-shadow:0 6px 18px rgba(76,29,149,.08), inset 0 0 0 1.5px #F1ECF8; color:var(--ink) }
.lk152 b{ flex:1; min-width:0; font-size:13px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.lka152{ position:relative; flex:none; width:34px; height:34px; border-radius:12px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#FDA4AF,#F43F5E) }
.lka152 svg{ width:18px; height:18px }
.lka152 i{ position:absolute; top:-6px; inset-inline-end:-6px; min-width:18px; height:18px; padding:0 4px; box-sizing:border-box; border-radius:99px; font-style:normal; font-size:10px; font-weight:900; line-height:18px; text-align:center; color:#fff; background:#7C3AED; box-shadow:0 0 0 2px #fff }
.lk152.on{ background:linear-gradient(90deg,#FFF1F4,#F5EEFF); box-shadow:0 8px 22px rgba(244,63,94,.18), inset 0 0 0 1.5px #FBCFE8 }
.lk152.on .lka152{ animation:hb152 1.4s ease-in-out infinite }
@keyframes hb152{ 0%,100%{ transform:scale(1) } 15%{ transform:scale(1.14) } 30%{ transform:scale(1) } 45%{ transform:scale(1.08) } }
.fb152{ position:relative; flex:none; width:46px; height:46px; border:0; border-radius:16px; display:grid; place-items:center; cursor:pointer; color:#4C1D95;
  background:#fff; box-shadow:0 6px 18px rgba(76,29,149,.08), inset 0 0 0 1.5px #F1ECF8 }
.fb152 svg{ width:22px; height:22px }
.fb152 i{ position:absolute; top:-5px; inset-inline-end:-5px; width:18px; height:18px; border-radius:50%; font-style:normal; font-size:10px; font-weight:900; line-height:18px; text-align:center; color:#fff; background:#F43F5E }

/* ═══ استک کارت‌ها ═══ */
.st152{ position:relative; height:clamp(400px, calc(100dvh - 300px), 620px) }
.cd152{ --lk:0; --np:0; --su:0; position:absolute; inset:0; border-radius:28px; overflow:hidden; background:#241640; color:#fff; touch-action:none;
  transform:translateY(calc(var(--k) * 12px)) scale(calc(1 - var(--k) * .045)); transition:transform .35s cubic-bezier(.2,.9,.25,1.05), opacity .3s;
  box-shadow:0 18px 40px rgba(31,20,51,.28) }
.cd152:not(.top){ filter:brightness(.92) }
.cd152.top{ cursor:grab; transform:none }
.cd152.drag{ transition:none; cursor:grabbing }
.cd152.fly{ transition:transform .42s ease-in, opacity .42s ease-in; opacity:0; pointer-events:none }
.cd152.back{ animation:bk152 .45s cubic-bezier(.2,1.2,.3,1) }
@keyframes bk152{ from{ transform:translate(-120%,-4%) rotate(-18deg) } }
.cd152.sk{ background:linear-gradient(110deg,#ECE7F5 30%,#F7F4FB 50%,#ECE7F5 70%); background-size:250% 100%; animation:sk152 1.3s linear infinite; box-shadow:none }
@keyframes sk152{ to{ background-position:-150% 0 } }
.ph152{ position:absolute; inset:0 }
.ph152 img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .25s; pointer-events:none }
.ph152 img.on{ opacity:1 }
.np152{ position:absolute; inset:0; display:grid; place-items:center; background:radial-gradient(90% 70% at 30% 20%,hsl(var(--h) 80% 70%),transparent 60%),linear-gradient(160deg,hsl(var(--h) 60% 45%),hsl(calc(var(--h) + 60) 55% 25%)) }
.np152 em{ font-style:normal; font-size:120px; font-weight:900; color:rgba(255,255,255,.85); text-shadow:0 10px 40px rgba(0,0,0,.25) }
.gb152{ position:absolute; top:10px; left:14px; right:14px; z-index:2; display:flex; gap:4px }
.gb152 i{ flex:1; height:3.5px; border-radius:99px; background:rgba(255,255,255,.35) }
.gb152 i.on{ background:#fff; box-shadow:0 0 6px rgba(255,255,255,.7) }
.tg152{ position:absolute; top:22px; left:14px; right:14px; z-index:2; display:flex; flex-wrap:wrap; gap:6px }
.on152, .rc152, .lm152{ display:inline-flex; align-items:center; gap:5px; height:26px; padding:0 10px; border-radius:99px; font-size:11px; font-weight:900;
  background:rgba(0,0,0,.35); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px) }
.on152 i{ width:7px; height:7px; border-radius:50%; background:#4ADE80; box-shadow:0 0 0 3px rgba(74,222,128,.3) }
.rc152{ color:#E9E4FF }
.lm152{ background:linear-gradient(90deg,#F43F5E,#EC4899); box-shadow:0 4px 12px rgba(244,63,94,.4); animation:hb152 1.8s ease-in-out infinite }
.lm152.su{ background:linear-gradient(90deg,#38BDF8,#6366F1); box-shadow:0 4px 12px rgba(56,189,248,.4) }
.lm152 svg{ width:13px; height:13px }
/* مهرها */
.sp152{ position:absolute; top:70px; z-index:3; padding:4px 14px; border:4px solid; border-radius:12px; font-size:34px; font-weight:900; letter-spacing:2px; font-family:system-ui,sans-serif; pointer-events:none }
.sp152.like{ left:22px; color:#4ADE80; border-color:#4ADE80; transform:rotate(-16deg); opacity:var(--lk) }
.sp152.nope{ right:22px; color:#F43F5E; border-color:#F43F5E; transform:rotate(16deg); opacity:var(--np) }
.sp152.super{ left:50%; top:auto; bottom:210px; color:#38BDF8; border-color:#38BDF8; transform:translateX(-50%) rotate(-6deg); opacity:var(--su) }
.cd152.fly.like .sp152.like, .cd152.fly.pass .sp152.nope, .cd152.fly.super .sp152.super{ opacity:1 }
/* اطلاعات */
.in152{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:80px 16px 16px; cursor:pointer; text-align:start;
  background:linear-gradient(0deg,rgba(10,4,24,.92) 0%,rgba(10,4,24,.6) 50%,transparent) }
.nm152{ display:flex; align-items:baseline; gap:8px; padding-inline-end:78px }
.nm152 b{ font-size:26px; font-weight:900; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:0 2px 8px rgba(0,0,0,.4) }
.nm152 em{ font-style:normal; font-size:21px; font-weight:600; opacity:.9 }
.vf152{ display:inline-block; width:20px; height:20px; align-self:center; flex:none }
.vf152 svg{ width:100%; height:100%; display:block }
.vp152{ display:inline-block; width:18px; height:18px; align-self:center; color:#FFC940 }
.vp152 svg{ width:100%; height:100% }
.lc152{ display:flex; align-items:center; gap:4px; margin-top:4px; font-size:12.5px; font-weight:700; opacity:.85 }
.lc152 svg{ width:14px; height:14px }
.bi152{ margin:8px 0 0; padding-inline-end:70px; font-size:13px; font-weight:600; line-height:1.6; opacity:.92; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; unicode-bidi:plaintext }
.ti152{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px }
.ti152 span{ height:26px; padding:0 11px; border-radius:99px; display:inline-flex; align-items:center; font-size:11.5px; font-weight:800; background:rgba(255,255,255,.14); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px) }
.ti152 span.sh{ color:#3B1D00; background:linear-gradient(90deg,#FFE08A,#F5C542); box-shadow:0 3px 10px rgba(245,197,66,.35) }
.ti152 span.sh::before{ content:"✓"; margin-inline-end:4px; font-weight:900 }
.ti152.lt span{ color:#6D28D9; background:#F3EDFF }
.ti152.lt span.sh{ color:#3B1D00; background:linear-gradient(90deg,#FFE08A,#F5C542) }
.cm152{ position:absolute; bottom:18px; inset-inline-end:16px; width:62px; height:62px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:radial-gradient(closest-side,rgba(20,10,40,.85) 78%,transparent 80% 100%), conic-gradient(var(--c) calc(var(--p) * 1%), rgba(255,255,255,.18) 0) }
.cm152 b{ font-size:16px; font-weight:900; line-height:1; direction:ltr }
.cm152 b small{ font-size:10px }
.cm152 > small{ font-size:8.5px; font-weight:800; opacity:.8; margin-top:2px }
.if152{ position:absolute; bottom:88px; inset-inline-end:28px; width:38px; height:38px; border:0; border-radius:50%; display:grid; place-items:center; cursor:pointer; color:#fff;
  background:rgba(255,255,255,.2); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); box-shadow:inset 0 0 0 1px rgba(255,255,255,.3) }
.if152 svg{ width:20px; height:20px }

/* ═══ دکمه‌ها ═══ */
.ab152{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:16px }
.b152{ position:relative; flex:none; border:0; border-radius:50%; display:grid; place-items:center; cursor:pointer; background:#fff; transition:transform .15s;
  box-shadow:0 8px 20px rgba(31,20,51,.12), inset 0 0 0 1.5px #F1ECF8 }
.b152:active{ transform:scale(.88) }
.b152:disabled{ opacity:.4; cursor:default }
.b152.rw, .b152.ms{ width:46px; height:46px }
.b152.no, .b152.su{ width:58px; height:58px }
.b152.ye{ width:72px; height:72px; color:#fff; background:linear-gradient(135deg,#FF7A9A,#F43F5E 50%,#E11D48); box-shadow:0 12px 28px rgba(244,63,94,.45), inset 0 1px 0 rgba(255,255,255,.4) }
.b152 svg{ width:24px; height:24px }
.b152.rw{ color:#F59E0B } .b152.no{ color:#F43F5E } .b152.su{ color:#3B82F6 } .b152.ms{ color:#8B5CF6 }
.b152.no svg{ width:26px; height:26px } .b152.su svg{ width:27px; height:27px } .b152.ye svg{ width:34px; height:34px }
.b152.hit{ animation:ht152 .45s cubic-bezier(.3,1.8,.5,1) }
@keyframes ht152{ 40%{ transform:scale(1.2) } }
.b152.hit::after{ content:""; position:absolute; inset:0; border-radius:50%; border:3px solid currentColor; animation:rp152 .6s ease-out forwards }
.b152.ye.hit::after{ border-color:#F43F5E }
@keyframes rp152{ to{ transform:scale(1.6); opacity:0 } }

/* ═══ خالی: رادار ═══ */
.em152{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:20px; text-align:center; border-radius:28px;
  background:radial-gradient(80% 60% at 50% 35%,#F5EEFF,#FFF 70%); box-shadow:inset 0 0 0 1.5px #F1ECF8 }
.rd152{ position:relative; width:170px; height:170px; display:grid; place-items:center; margin-bottom:10px }
.rd152 i{ position:absolute; inset:0; border-radius:50%; border:2px solid rgba(139,92,246,.5); animation:rd152 2.7s ease-out infinite }
.rd152 i:nth-child(2){ animation-delay:.9s } .rd152 i:nth-child(3){ animation-delay:1.8s }
@keyframes rd152{ from{ transform:scale(.35); opacity:1 } to{ transform:scale(1.1); opacity:0 } }
.rd152 span{ position:relative; width:78px; height:78px; border-radius:50%; overflow:hidden; display:grid; place-items:center; color:#fff;
  background:linear-gradient(135deg,#A78BFA,#F472B6); border:4px solid #fff; box-shadow:0 10px 26px rgba(139,92,246,.35) }
.rd152 span img{ width:100%; height:100%; object-fit:cover }
.rd152 span svg{ width:36px; height:36px }
.em152 > b{ font-size:17px; font-weight:900 }
.em152 > small{ max-width:280px; font-size:12.5px; font-weight:600; line-height:1.7; color:#8A82A0 }
.em152 > div:not(.rd152){ display:flex; gap:8px; margin-top:10px }
.em152 > div button{ display:inline-flex; align-items:center; gap:6px; height:42px; padding:0 16px; border:0; border-radius:14px; cursor:pointer; font-size:13px; font-weight:900; color:#4C1D95; background:#F3EDFF }
.em152 > div button svg{ width:18px; height:18px }
.em152 > div button.go{ color:#fff; background:linear-gradient(90deg,#FF3D7F,#8B5CF6); box-shadow:0 8px 18px rgba(236,72,153,.3) }

/* ═══ جزئیات ═══ */
.dtc152{ padding-bottom:calc(16px + env(safe-area-inset-bottom)) }
.dth152{ display:flex; align-items:center; justify-content:center; gap:6px; padding:2px 0 12px }
.dth152 b{ font-size:19px; font-weight:900 }
.dts152{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px }
.dts152 span{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:12px 4px; border-radius:16px; background:#F7F5FB }
.dts152 b{ font-size:18px; font-weight:900; color:#7C3AED; direction:ltr }
.dts152 small{ font-size:11px; font-weight:700; color:#8A82A0 }
.dtb152{ margin:14px 2px 0; font-size:13.5px; font-weight:600; line-height:1.8; color:#3F3656; unicode-bidi:plaintext }
.dtl152{ margin:14px 2px 0; font-size:13px; font-weight:900 }
.dtp152{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; height:50px; margin-top:16px; border:0; border-radius:16px; cursor:pointer;
  font-family:inherit; font-size:14.5px; font-weight:900; color:#fff; background:linear-gradient(90deg,#FF3D7F,#8B5CF6); box-shadow:0 10px 22px rgba(236,72,153,.3) }
.dtp152 svg{ width:20px; height:20px }

/* ═══ فیلتر ═══ */
.flc152{ padding-bottom:calc(16px + env(safe-area-inset-bottom)) }
.flh152{ display:flex; align-items:center; justify-content:space-between; padding:2px 2px 8px }
.flh152 b{ font-size:17px; font-weight:900 }
.flh152 button{ border:0; background:none; cursor:pointer; font-family:inherit; font-size:13px; font-weight:800; color:#E11D48 }
.flt152{ display:flex; align-items:center; justify-content:space-between; margin:14px 2px 8px; font-size:13.5px; font-weight:900 }
.fav152{ font-style:normal; color:#7C3AED; direction:ltr }
.fg152{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; padding:4px; border-radius:16px; background:#F5F2FA }
.fg152 button{ height:40px; border:0; border-radius:12px; cursor:pointer; font-family:inherit; font-size:13px; font-weight:800; color:#8A82A0; background:none }
.fg152 button.on{ color:#fff; background:linear-gradient(90deg,#FF3D7F,#8B5CF6); box-shadow:0 6px 14px rgba(236,72,153,.3) }
.fr152{ position:relative; height:36px; direction:ltr }
.frt152{ position:absolute; left:10px; right:10px; top:16px; height:5px; border-radius:99px; background:#EDE7F6 }
.frt152 i{ position:absolute; top:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#FF3D7F,#8B5CF6) }
.fr152 input{ position:absolute; left:0; right:0; top:6px; width:100%; margin:0; background:none; pointer-events:none; -webkit-appearance:none; appearance:none; height:24px }
.fr152 input::-webkit-slider-thumb{ -webkit-appearance:none; pointer-events:auto; width:24px; height:24px; border-radius:50%; background:#fff; border:3px solid #8B5CF6; box-shadow:0 3px 8px rgba(0,0,0,.2); cursor:pointer }
.fr152 input::-moz-range-thumb{ pointer-events:auto; width:20px; height:20px; border-radius:50%; background:#fff; border:3px solid #8B5CF6; cursor:pointer }
.ft152{ display:flex; align-items:center; gap:12px; margin-top:10px; padding:12px 14px; border-radius:16px; background:#F7F5FB; cursor:pointer }
.ft152 span{ flex:1; display:flex; flex-direction:column; gap:2px }
.ft152 b{ font-size:14px; font-weight:800 }
.ft152 small{ font-size:11.5px; font-weight:600; color:#8A82A0 }
.ft152 input{ display:none }
.ft152 i{ position:relative; flex:none; width:46px; height:28px; border-radius:99px; background:#DDD6E8; transition:background .2s }
.ft152 i::after{ content:""; position:absolute; top:3px; inset-inline-start:3px; width:22px; height:22px; border-radius:50%; background:#fff; box-shadow:0 2px 5px rgba(0,0,0,.2); transition:transform .2s }
.ft152 input:checked + i{ background:linear-gradient(90deg,#FF3D7F,#8B5CF6) }
.ft152 input:checked + i::after{ transform:translateX(18px) }
[dir=rtl] .ft152 input:checked + i::after{ transform:translateX(-18px) }
.fap152{ width:100%; height:52px; margin-top:16px; border:0; border-radius:16px; cursor:pointer; font-family:inherit; font-size:15px; font-weight:900; color:#fff;
  background:linear-gradient(90deg,#1F1433,#4C1D95); box-shadow:0 10px 22px rgba(76,29,149,.3) }

@media (max-width:350px){
  .ab152{ gap:8px }
  .b152.ye{ width:64px; height:64px }
  .b152.no, .b152.su{ width:52px; height:52px }
  .nm152 b{ font-size:22px }
}
@media (prefers-reduced-motion:reduce){ .lm152, .lk152.on .lka152, .rd152 i{ animation:none } }
