/* ═══════════════════════════════════════════════════════════════════════════
 *  v109 · استوری، هایلایت، کاوش، هدیه
 * ═══════════════════════════════════════════════════════════════════════════ */

/* ── پیام کوتاه ── */
#tt109{
  position:fixed; left:50%; bottom:calc(92px + env(safe-area-inset-bottom)); z-index:10080;
  transform:translate(-50%,20px); opacity:0; pointer-events:none;
  max-width:88vw; padding:10px 16px; border-radius:16px;
  background:rgba(28,25,23,.92); color:#fff; font-size:12.5px; font-weight:800; line-height:1.6; text-align:center;
  box-shadow:0 10px 30px rgba(0,0,0,.25); transition:opacity .2s, transform .2s;
}
#tt109.on{ opacity:1; transform:translate(-50%,0) }

/* ── شیت پایین ── */
.sh109{
  position:fixed; inset:0; z-index:10060; background:rgba(0,0,0,.45);
  display:flex; align-items:flex-end; justify-content:center; animation:sh109fade .18s ease;
}
.sh109.out{ opacity:0; transition:opacity .18s }
@keyframes sh109fade{ from{ opacity:0 } }
.sh109-p{
  width:100%; max-width:480px; max-height:86vh; overflow-y:auto;
  background:#fff; color:#1c1917; border-radius:26px 26px 0 0;
  padding:8px 16px calc(16px + env(safe-area-inset-bottom));
  box-shadow:0 -12px 40px rgba(0,0,0,.25); animation:sh109up .24s cubic-bezier(.2,.9,.3,1);
}
@keyframes sh109up{ from{ transform:translateY(40px); opacity:.4 } }
.sh109.dark .sh109-p{ background:linear-gradient(180deg,#221537,#150d24); color:#fff }
.sh109.tall .sh109-p{ min-height:60vh }
.sh109-grab{ display:block; width:40px; height:5px; border-radius:99px; background:rgba(120,113,108,.28); margin:2px auto 12px }
.sh109-t{ display:flex; align-items:center; gap:7px; font-weight:900; font-size:15.5px; margin:0 2px 12px }
.sh109-t em{ font-style:normal; background:#fef3c7; color:#b45309; border-radius:99px; padding:1px 9px; font-size:12px }
.sh109.dark .sh109-t em{ background:rgba(255,201,64,.18); color:#fde68a }
.sh109-row{
  width:100%; display:flex; align-items:center; gap:12px; padding:13px 10px; border:0; background:none;
  font-family:inherit; font-size:14px; font-weight:800; color:inherit; border-radius:14px; cursor:pointer; text-align:start;
}
.sh109-row:active{ background:rgba(127,127,127,.12) }
.sh109-row.danger{ color:#f43f5e }
.sh109-list{ display:flex; flex-direction:column; gap:2px; min-height:80px }
.sh109-u{
  display:flex; align-items:center; gap:11px; padding:8px 6px; border:0; background:none; color:inherit;
  font-family:inherit; border-radius:14px; cursor:pointer; text-align:start;
}
.sh109-u:active{ background:rgba(255,255,255,.07) }
.sh109-u .a{
  position:relative; flex:0 0 42px; width:42px; height:42px; border-radius:50%; overflow:hidden;
  background:linear-gradient(135deg,#FFC940,#FF9E2C); display:grid; place-items:center;
}
.sh109-u .a b{ color:#fff; font-weight:900 }
.sh109-u .a img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.sh109-u .n{ flex:1; font-weight:800; font-size:13.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.sh109-u small{ font-size:10.5px; opacity:.55; font-weight:700 }
.sh109-none{ text-align:center; opacity:.6; font-size:12.5px; font-weight:700; padding:22px 10px; line-height:1.8 }
.sh109-in{
  width:100%; margin:6px 0 12px; padding:13px 16px; border-radius:16px; border:2px solid #f5f5f4; background:#fafaf9;
  font-family:inherit; font-size:14px; font-weight:800; outline:none; color:#1c1917;
}
.sh109-in:focus{ border-color:#fbbf24; background:#fff }
.sh109-cta{
  width:100%; margin-top:8px; padding:14px; border:0; border-radius:18px; cursor:pointer;
  background:linear-gradient(135deg,#FFC940,#FF9E2C); color:#3b1d00; font-family:inherit; font-size:14.5px; font-weight:900;
  display:flex; align-items:center; justify-content:center; gap:6px;
  box-shadow:0 8px 20px rgba(255,158,44,.3);
}
.sh109-cta:disabled{ opacity:.45; box-shadow:none }
.sh109-cta.ghost{ background:#f5f5f4; color:#57534e; box-shadow:none }
.sh109-cta.danger{ color:#e11d48 }
.cf109-t{ font-weight:900; font-size:16px; text-align:center; margin:4px 0 6px }
.cf109-s{ font-size:12.5px; color:#78716c; text-align:center; line-height:1.8; margin:0 8px 14px }
.cf109-b{ display:flex; gap:10px }
.cf109-b button{ flex:1; padding:13px; border:0; border-radius:16px; font-family:inherit; font-weight:900; font-size:14px; cursor:pointer }
.cf109-b .no{ background:#f5f5f4; color:#57534e }
.cf109-b .yes{ background:linear-gradient(135deg,#FFC940,#FF9E2C); color:#3b1d00 }
.cf109-b .yes.danger{ background:#f43f5e; color:#fff }

/* ═══════════════ کاوش ═══════════════ */
.sw109-stamp{
  position:absolute; top:44px; z-index:30; padding:6px 16px; border-radius:12px;
  font:900 30px/1 system-ui,-apple-system,sans-serif; letter-spacing:2px; border:4px solid;
  animation:sw109stamp .3s cubic-bezier(.2,1.6,.4,1) both; pointer-events:none;
}
.sw109-stamp.like{ left:22px; color:#22c55e; border-color:#22c55e; transform:rotate(-16deg); background:rgba(255,255,255,.12) }
.sw109-stamp.super{ left:50%; margin-left:-70px; top:auto; bottom:170px; color:#38bdf8; border-color:#38bdf8; transform:rotate(-6deg) }
.sw109-stamp.pass{ right:22px; color:#f43f5e; border-color:#f43f5e; transform:rotate(16deg); background:rgba(255,255,255,.12) }
@keyframes sw109stamp{ from{ opacity:0; scale:2.2 } }
.sw109-big{
  position:absolute; left:50%; top:50%; z-index:29; width:130px; height:130px; margin:-65px 0 0 -65px;
  color:#ff3b6b; filter:drop-shadow(0 10px 26px rgba(255,59,107,.55));
  animation:sw109big .75s cubic-bezier(.2,1.4,.4,1) both; pointer-events:none;
}
.sw109-big.super{ color:#38bdf8; filter:drop-shadow(0 10px 26px rgba(56,189,248,.6)) }
.sw109-big svg{ width:100%; height:100% }
@keyframes sw109big{ 0%{ transform:scale(0); opacity:0 } 45%{ transform:scale(1.25); opacity:1 } 70%{ transform:scale(.95) } 100%{ transform:scale(1.05); opacity:1 } }
.sw109-p{
  position:absolute; left:50%; top:50%; z-index:28; width:26px; height:26px; margin:-13px 0 0 -13px;
  color:#ff5c85; pointer-events:none; animation:sw109p .8s ease-out both;
}
.sw109-p.super{ color:#7dd3fc }
.sw109-p svg{ width:100%; height:100% }
@keyframes sw109p{ from{ transform:translate(0,0) scale(.2); opacity:1 } to{ transform:translate(var(--dx),var(--dy)) scale(var(--s)); opacity:0 } }
.sw109-press{ animation:sw109press .38s ease }
@keyframes sw109press{ 30%{ transform:scale(.8) } 65%{ transform:scale(1.18) } }
.sw109-float{
  position:fixed; z-index:10000; width:22px; height:22px; color:#ff3b6b; pointer-events:none;
  animation:sw109float 1.3s ease-out both;
}
.sw109-float svg{ width:100%; height:100% }
@keyframes sw109float{ from{ transform:translateY(0) scale(.6); opacity:1 } to{ transform:translateY(-150px) translateX(var(--x,0)) scale(1.3); opacity:0 } }

/* «همدل شدید» */
#mt109{
  position:fixed; inset:0; z-index:10040; overflow:hidden;
  background:radial-gradient(120% 80% at 50% 20%, #ff4d7d 0%, #7c1d6f 45%, #1b0b2e 100%);
  display:grid; place-items:center; animation:sh109fade .25s ease;
}
#mt109.out{ opacity:0; transition:opacity .2s }
.mt109-rain i{
  position:absolute; top:-40px; width:26px; height:26px; color:rgba(255,255,255,.55);
  animation:mt109rain 3.4s linear infinite; transform:scale(var(--s));
}
.mt109-rain i svg{ width:100%; height:100% }
@keyframes mt109rain{ to{ transform:translateY(115vh) rotate(40deg) scale(var(--s)) } }
.mt109-c{ position:relative; text-align:center; width:100%; max-width:380px; padding:0 26px }
.mt109-k{
  margin:0; font-size:40px; font-weight:900; color:#fff; line-height:1.3;
  text-shadow:0 6px 30px rgba(255,77,125,.8); animation:mt109k .6s cubic-bezier(.2,1.5,.4,1) both;
}
@keyframes mt109k{ from{ transform:scale(.3); opacity:0 } }
.mt109-s{ color:rgba(255,255,255,.8); font-size:14px; font-weight:700; margin:8px 0 26px }
.mt109-pair{ position:relative; display:flex; justify-content:center; align-items:center; height:150px; margin-bottom:34px }
.mt109-av{
  position:relative; width:122px; height:122px; border-radius:50%; overflow:hidden; display:grid; place-items:center;
  border:4px solid #fff; background:linear-gradient(135deg,#FFC940,#FF9E2C); box-shadow:0 14px 40px rgba(0,0,0,.35);
}
.mt109-av b{ color:#fff; font-weight:900; font-size:44px }
.mt109-av img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.mt109-av.l{ transform:rotate(-8deg); margin-right:-18px; animation:mt109l .7s cubic-bezier(.2,1.3,.4,1) both }
.mt109-av.r{ transform:rotate(8deg); margin-left:-18px; animation:mt109r .7s cubic-bezier(.2,1.3,.4,1) both }
@keyframes mt109l{ from{ transform:translateX(-160px) rotate(-30deg); opacity:0 } }
@keyframes mt109r{ from{ transform:translateX(160px) rotate(30deg); opacity:0 } }
.mt109-h{
  position:absolute; z-index:2; width:54px; height:54px; color:#ff3b6b; background:#fff; border-radius:50%;
  display:grid; place-items:center; box-shadow:0 8px 24px rgba(0,0,0,.3);
  animation:mt109beat 1.1s ease-in-out .7s infinite, mt109k .5s .5s cubic-bezier(.2,1.5,.4,1) both;
}
.mt109-h svg{ width:30px; height:30px }
@keyframes mt109beat{ 0%,100%{ transform:scale(1) } 15%{ transform:scale(1.22) } 30%{ transform:scale(1) } 45%{ transform:scale(1.14) } }
.mt109-go{
  width:100%; padding:16px; border:0; border-radius:20px; cursor:pointer;
  background:#fff; color:#be185d; font-family:inherit; font-size:16px; font-weight:900; box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.mt109-no{ margin-top:14px; border:0; background:none; color:rgba(255,255,255,.75); font-family:inherit; font-weight:800; font-size:14px; cursor:pointer }

/* ═══════════════ گیرندهٔ هدیه در لایو تصویری ═══════════════ */
#gpTo109{ display:flex; align-items:center; gap:8px; padding:6px 14px 10px; overflow-x:auto }
#gpTo109 .l{ flex:0 0 auto; color:rgba(255,255,255,.5); font-size:11px; font-weight:800 }
#gpTo109 button{
  flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:3px; border:0; background:none; cursor:pointer; padding:0;
}
#gpTo109 .a{
  position:relative; width:36px; height:36px; border-radius:50%; overflow:hidden; display:grid; place-items:center;
  background:linear-gradient(135deg,#FFC940,#FF9E2C); border:2px solid transparent; opacity:.6; transition:.15s;
}
#gpTo109 .a b{ color:#fff; font-weight:900; font-size:13px }
#gpTo109 .a img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
#gpTo109 small{ color:rgba(255,255,255,.55); font-size:9.5px; font-weight:800 }
#gpTo109 button.on .a{ border-color:#FFC940; opacity:1; box-shadow:0 0 0 2px rgba(255,201,64,.35) }
#gpTo109 button.on small{ color:#fde68a }
#gpTo109 button.pk small{ color:#fda4af }
.gp109-busy{ opacity:.55; pointer-events:none }

/* ═══════════════ بینندهٔ استوری ═══════════════ */
body.sv109-open{ overflow:hidden }
#sv109{
  position:fixed; inset:0; z-index:10030; background:#000; color:#fff; overflow:hidden;
  touch-action:none; user-select:none; -webkit-user-select:none; animation:sv109in .22s ease;
}
#sv109.out{ opacity:0; transform:scale(.96); transition:opacity .2s, transform .2s }
@keyframes sv109in{ from{ opacity:0; transform:scale(.94) } }
.sv109-bg{ position:absolute; inset:-40px; background:#000 center/cover no-repeat; filter:blur(28px) brightness(.45); transform:scale(1.1) }
.sv109-media{ position:absolute; inset:0; display:grid; place-items:center }
.sv109-media img{ width:100%; height:100%; object-fit:contain; animation:sv109fade .25s ease }
@keyframes sv109fade{ from{ opacity:0 } }
.sv109-err{ font-weight:800; opacity:.7 }
.sv109-top{
  position:absolute; top:0; left:0; right:0; z-index:3;
  padding:calc(10px + env(safe-area-inset-top)) 12px 26px;
  background:linear-gradient(rgba(0,0,0,.55), transparent);
}
.sv109-seg{ display:flex; gap:4px }
.sv109-seg i{ flex:1; height:3px; border-radius:99px; background:rgba(255,255,255,.3); overflow:hidden }
.sv109-seg b{ display:block; height:100%; width:0; background:#fff; border-radius:99px }
.sv109-hd{ display:flex; align-items:center; gap:10px; margin-top:12px }
.sv109-av{
  position:relative; flex:0 0 38px; width:38px; height:38px; border-radius:50%; overflow:hidden; display:grid; place-items:center;
  background:linear-gradient(135deg,#FFC940,#FF9E2C); border:2px solid rgba(255,255,255,.85);
}
.sv109-av b{ font-weight:900 }
.sv109-av img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.sv109-who{ flex:1; min-width:0; display:flex; flex-direction:column; line-height:1.3 }
.sv109-who b{ font-size:14px; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-shadow:0 1px 4px rgba(0,0,0,.5) }
.sv109-who small{ font-size:11px; opacity:.75; font-weight:700 }
.sv109-ib{ flex:0 0 auto; width:38px; height:38px; border:0; border-radius:50%; background:rgba(0,0,0,.25); display:grid; place-items:center; cursor:pointer }
#sv109.paused .sv109-top, #sv109.paused .sv109-foot{ opacity:0; transition:opacity .2s }
.sv109-foot{
  position:absolute; left:0; right:0; bottom:0; z-index:3; display:flex; justify-content:center; gap:10px;
  padding:26px 14px calc(16px + env(safe-area-inset-bottom)); background:linear-gradient(transparent, rgba(0,0,0,.6));
}
.sv109-fb{
  display:flex; align-items:center; gap:6px; padding:10px 16px; border-radius:99px; cursor:pointer;
  border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.14); backdrop-filter:blur(10px);
  color:#fff; font-family:inherit; font-size:12.5px; font-weight:900;
}
.sv109-fb b{ font-size:13px }
.sv109-fb.del{ color:#fda4af }
.sv109-fb.hl{ color:#fde68a }
.sv109-fb.reply{ background:linear-gradient(135deg,#FFC940,#FF9E2C); color:#3b1d00; border:0 }
.sv109-spin{
  width:34px; height:34px; border-radius:50%; border:3px solid rgba(255,255,255,.25); border-top-color:#fff;
  animation:cl108spin .8s linear infinite; display:block; margin:auto;
}
.sv109-spin.dark{ margin:24px auto }

/* حلقهٔ استوری روی عکس پروفایل خودم */
.pf109-ring{ background:conic-gradient(#FFC940,#FF7A3D,#E84393,#8b5cf6,#FFC940) !important; box-shadow:0 6px 18px rgba(232,67,147,.3) }
@keyframes pf109spin{ to{ transform:rotate(360deg) } }
#pf109tag{
  position:absolute; left:50%; bottom:-9px; transform:translateX(-50%); z-index:2; white-space:nowrap;
  background:linear-gradient(135deg,#ff4d7d,#FF9E2C); color:#fff; font-size:9.5px; font-weight:900;
  padding:2px 8px; border-radius:99px; border:2px solid #fff;
}
#pf109tag.add{ display:none }
body.st109-up #newChatsRow .st108.me .st108-o{ background:conic-gradient(#FFC940 0 25%, #e7e5e4 0) ; animation:pf109spin 1s linear infinite }

/* ═══════════════ هایلایت‌ها ═══════════════ */
.hl109{ margin-top:14px }
.hl109.v{ margin:0 0 16px }
.hl109-s{ display:flex; gap:14px; overflow-x:auto; padding:2px 2px 4px; scrollbar-width:none }
.hl109-s::-webkit-scrollbar{ display:none }
.hl109-i{
  flex:0 0 68px; width:68px; display:flex; flex-direction:column; align-items:center; gap:6px;
  border:0; background:none; cursor:pointer; padding:0; font-family:inherit; -webkit-touch-callout:none;
}
.hl109-o{ width:64px; height:64px; border-radius:50%; padding:2.5px; background:linear-gradient(135deg,#e7e5e4,#d6d3d1) }
.hl109-o.big{ width:96px; height:96px; padding:3px; background:conic-gradient(#FFC940,#FF7A3D,#E84393,#8b5cf6,#FFC940) }
.hl109-c{
  position:relative; width:100%; height:100%; border-radius:50%; overflow:hidden; display:grid; place-items:center;
  background:#f5f5f4; border:3px solid #fff; color:#a8a29e;
}
.hl109-c img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.hl109-c b{ font-weight:900; color:#78716c; font-size:20px }
.hl109-i.new .hl109-o{ background:none; border:2px dashed #d6d3d1; padding:2px }
.hl109-i.new .hl109-c{ border:0; background:#fafaf9 }
.hl109-i small{ max-width:68px; font-size:11px; font-weight:800; color:#44403c; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.hl109-i:active .hl109-o{ transform:scale(.93) }
.sh109.dark .hl109-i small{ color:rgba(255,255,255,.85) }
.sh109.dark .hl109-i.new .hl109-o{ border-color:rgba(255,255,255,.3) }
.sh109.dark .hl109-i.new .hl109-c{ background:rgba(255,255,255,.08); color:#fff }
.hlp109-g{ display:flex; flex-wrap:wrap; gap:14px; padding:4px 2px 10px }

/* آرشیو استوری برای انتخاب */
.arc109-g{ display:grid; grid-template-columns:repeat(3,1fr); gap:4px; min-height:120px; margin-bottom:6px }
.arc109-c{
  position:relative; aspect-ratio:9/16; border:0; padding:0; border-radius:10px; overflow:hidden; cursor:pointer; background:#e7e5e4;
}
.arc109-c img{ width:100%; height:100%; object-fit:cover; transition:transform .15s }
.arc109-c.on img{ transform:scale(.92); border-radius:10px }
.arc109-c .dt{
  position:absolute; top:6px; inset-inline-start:6px; background:#fff; color:#1c1917; border-radius:8px;
  font-size:13px; font-weight:900; line-height:1; padding:4px 6px; text-align:center; display:flex; flex-direction:column;
}
.arc109-c .dt small{ font-size:8.5px; font-weight:800; color:#78716c }
.arc109-c .lv{ position:absolute; bottom:7px; inset-inline-start:7px; width:9px; height:9px; border-radius:50%; background:#22c55e; border:2px solid #fff }
.arc109-c .ck{
  position:absolute; top:6px; inset-inline-end:6px; width:24px; height:24px; border-radius:50%;
  border:2px solid #fff; background:rgba(0,0,0,.25); color:#fff; font-style:normal; font-size:12px; font-weight:900;
  display:grid; place-items:center;
}
.arc109-c.on .ck{ background:linear-gradient(135deg,#FFC940,#FF7A3D) }

/* ساختن و ویرایش */
.hln109-cv{ display:flex; justify-content:center; margin:2px 0 12px }
.hln109-strip{ display:flex; gap:6px; overflow-x:auto; padding:2px 0 4px }
.hln109-strip button{ flex:0 0 52px; height:80px; border-radius:10px; overflow:hidden; padding:0; border:2px solid transparent; cursor:pointer; background:#eee }
.hln109-strip button.on{ border-color:#f59e0b }
.hln109-strip img{ width:100%; height:100%; object-fit:cover }
.hln109-hint{ font-size:11px; color:#a8a29e; font-weight:700; text-align:center; margin:6px 0 2px }
.hle109-g{ display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin:6px 0 4px }
.hle109-c{ position:relative; aspect-ratio:9/16; border-radius:10px; overflow:hidden; cursor:pointer; border:2.5px solid transparent; transition:opacity .2s }
.hle109-c.cv{ border-color:#f59e0b }
.hle109-c.gone{ opacity:.3 }
.hle109-c img{ width:100%; height:100%; object-fit:cover }
.hle109-c .rm{
  position:absolute; top:4px; inset-inline-end:4px; width:22px; height:22px; border-radius:50%; border:0;
  background:rgba(0,0,0,.55); color:#fff; font-size:11px; font-weight:900; cursor:pointer;
}
.hle109-add{
  aspect-ratio:9/16; border:2px dashed #d6d3d1; border-radius:10px; background:#fafaf9; color:#a8a29e;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer; font-family:inherit;
}
.hle109-add small{ font-size:11px; font-weight:800 }

/* لایو صوتی: دکمهٔ عکس کنار ایموجی */
.vb108-ph{
  flex:0 0 auto; width:30px; height:30px; border:0; border-radius:50%;
  display:grid; place-items:center; cursor:pointer; color:#fff; background:rgba(255,255,255,.2);
}