/* talk (reviews) section of the landing: a swipe of stories girls posted about their reading. owned by one agent. prefix .l-talk- */
.l-talk{--lt-out:cubic-bezier(.23,1,.32,1);--lt-spring:cubic-bezier(.34,1.56,.64,1);--lt-ink:#1a0a33;--lt-w:min(68vw,15.5rem);--lt-ring:#d9ff3d}
.l-talk:not(.l-talk-live) .fly,.l-talk:not(.l-talk-live) .gl{animation-play-state:paused}

/* ---------- the rail ---------- */
.l-talk-rail{position:relative;margin:0 -1.25rem}
.l-talk-sc{display:flex;gap:.9rem;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  padding:1.4rem calc(50% - var(--lt-w) / 2) 2.4rem;outline:none;user-select:none;-webkit-user-select:none}
.l-talk-sc::-webkit-scrollbar{display:none}
.l-talk-sc.l-talk-grab{scroll-snap-type:none;cursor:grabbing}
.l-talk-sc:focus-visible .l-talk-on{outline:2px solid #ff8ad0;outline-offset:4px}
@media(hover:hover){.l-talk-sc{cursor:grab}}
.l-talk-hint{display:flex;justify-content:center;align-items:center;gap:.45rem;margin-top:-.6rem;font-size:.78rem;color:#a58bd6;transition:opacity .5s var(--lt-out)}
.l-talk-hint .ic{width:.9rem;height:.9rem;color:#a58bd6}
.l-talk-used .l-talk-hint{opacity:0}

/* ---------- a card (story or chat), same frame ---------- */
.l-talk-card{position:relative;flex:none;width:var(--lt-w);aspect-ratio:9/16;margin:0;border-radius:1.4rem;overflow:hidden;scroll-snap-align:center;
  background:#120a1f;box-shadow:0 26px 60px #000b,0 0 0 1px #ffffff12;transform-origin:50% 115%;will-change:transform}
.l-talk-card img{display:block;-webkit-user-drag:none}

/* ---------- story: her selfie + what she typed on it ---------- */
.l-talk-ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.l-talk-story::before,.l-talk-story::after{content:"";position:absolute;left:0;right:0;pointer-events:none}
.l-talk-story::before{top:0;height:24%;background:linear-gradient(#0009,#0000)}
.l-talk-story::after{bottom:0;height:30%;background:linear-gradient(#0000,#000a)}
.l-talk-top{position:absolute;z-index:2;top:.8rem;left:.75rem;right:.75rem;display:flex;align-items:center;gap:.45rem;font-size:.8rem;color:#fff;text-shadow:0 1px 6px #0007}
.l-talk-top b{font-weight:600}.l-talk-top time{opacity:.72}
.l-talk-av{flex:none;display:block;width:1.95rem;height:1.95rem;padding:2px;border-radius:50%;background:var(--lt-ring)}
.l-talk-av img{width:100%;height:100%;object-fit:cover;border-radius:50%;border:2px solid #120a1f}

.l-talk-cap{position:absolute;z-index:2;left:.95rem;right:.95rem;margin:0;text-align:center;line-height:1.62;font-size:.93rem;font-weight:600;color:var(--lt-ink)}
.l-talk-story[data-y="top"] .l-talk-cap{top:17%}
.l-talk-story[data-y="mid"] .l-talk-cap{top:43%}
.l-talk-story[data-y="low"] .l-talk-cap{bottom:4.7rem}
.l-talk-cap span{padding:.2em .6em;border-radius:999px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.l-talk-hl span{background:#fff}
.l-talk-pk span{background:#ff8ad0}
.l-talk-dk span{background:#1a0a33e8;color:#fff}
.l-talk-fr{text-align:left;line-height:1.08;font-family:Fraunces,serif;font-variation-settings:"SOFT" 100,"WONK" 1,"opsz" 144;font-style:italic;font-weight:700;font-size:1.5rem;letter-spacing:-.015em;color:#fff;text-shadow:0 2px 16px #000b,0 1px 3px #0008}
.l-talk-fr span{padding:0}

.l-talk-stk{position:absolute;z-index:2;font-size:.74rem}
.l-talk-story[data-y="top"] .l-talk-stk{bottom:4.6rem;right:.9rem}
.l-talk-story[data-y="mid"] .l-talk-stk{top:4.2rem;left:.9rem}
.l-talk-story[data-y="low"] .l-talk-stk{top:4.2rem;right:.9rem}

.l-talk-bar{position:absolute;z-index:2;left:.75rem;right:.75rem;bottom:.8rem;display:flex;align-items:center;gap:.75rem;color:#fff}
.l-talk-reply{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:.5rem .85rem;border-radius:999px;border:1px solid #ffffffa0;font-size:.76rem}
.l-talk-bar .ic{width:1.4rem;height:1.4rem;color:#fff}
.l-talk-heart{display:grid;place-items:center}
.l-talk-on .l-talk-heart .ic{color:#ff8ad0;animation:l-talk-pop .5s .5s var(--lt-spring) both}
@keyframes l-talk-pop{0%{transform:scale(1)}45%{transform:scale(1.35)}100%{transform:scale(1)}}

/* ---------- chat: a screenshot of the group chat ---------- */
.l-talk-chat{display:flex;flex-direction:column;background:#0f0a19}
.l-talk-chd{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:.6rem;align-items:center;padding:.8rem .9rem .7rem;border-bottom:1px solid #ffffff12;background:#160f24}
.l-talk-chd .l-talk-faces{grid-row:1 / 3}
.l-talk-chd b{align-self:end;font-size:.86rem;font-weight:600;color:#f5f0fb}
.l-talk-chd small{align-self:start;font-size:.68rem;color:#8d7bb0}
.l-talk-faces{display:flex}
.l-talk-faces .l-talk-av{width:2.3rem;height:2.3rem;padding:0;background:none}
.l-talk-faces .l-talk-av+.l-talk-av{margin-left:-.7rem}
.l-talk-faces .l-talk-av img{border-color:#160f24}
.l-talk-faces .l-talk-av:only-child{width:2.4rem;height:2.4rem}
.l-talk-msgs{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:.4rem;padding:.8rem .7rem .3rem}
.l-talk-msg{display:flex;align-items:flex-end;gap:.4rem}
.l-talk-msg .l-talk-av{width:1.5rem;height:1.5rem;padding:0;background:none}
.l-talk-msg .l-talk-av img{border:0}
.l-talk-msg p{position:relative;margin:0;max-width:82%;padding:.5rem .78rem;border-radius:1rem;background:#2a2140;color:#f5f0fb;font-size:.84rem;line-height:1.32}
.l-talk-msg small{display:block;margin-bottom:.12rem;font-size:.66rem;color:#a58bd6}
.l-talk-me{justify-content:flex-end}
.l-talk-me p{background:#ff8ad0;color:var(--lt-ink)}
.l-talk-tap{position:absolute;top:-.8rem;right:-.6rem;display:grid;place-items:center;width:1.55rem;height:1.55rem;border-radius:50%;background:#3a2d55;border:2px solid #0f0a19}
.l-talk-me .l-talk-tap{right:auto;left:-.6rem}
.l-talk-tap .ic{width:.8rem;height:.8rem;color:#ff8ad0;stroke-width:2.4}
.l-talk-in{display:flex;align-items:center;justify-content:space-between;margin:.55rem .75rem .8rem;padding:.5rem .55rem .5rem .9rem;border-radius:999px;border:1px solid #ffffff22;font-size:.78rem;color:#8d7bb0}
.l-talk-in .ic{width:1.15rem;height:1.15rem;color:#8d7bb0}
/* when a chat lands in the middle, it plays out again like she just opened it */
.l-talk-chat.l-talk-on .l-talk-msg{animation:l-talk-msg .42s var(--lt-out) both;animation-delay:calc(.15s + var(--j,0) * .38s)}
.l-talk-chat.l-talk-on .l-talk-tap{animation:l-talk-tap .4s var(--lt-spring) both;animation-delay:calc(.45s + var(--j,0) * .38s)}
@keyframes l-talk-msg{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
@keyframes l-talk-tap{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}

@media(min-width:760px){
  .l-talk{--lt-w:16.5rem}
  .l-talk-sc{gap:1.2rem;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}

}
@media(max-width:370px){.l-talk-cap{font-size:.86rem}.l-talk-fr{font-size:1.32rem}.l-talk-msg p{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){
  .l-talk .fly,.l-talk .gl,.l-talk-on .l-talk-heart .ic,.l-talk-chat.l-talk-on .l-talk-msg,.l-talk-chat.l-talk-on .l-talk-tap{animation:none!important}
}
.l-talk-ph:not([src]),.l-talk-av img:not([src]){visibility:hidden}
.l-talk-gap{visibility:hidden}
/* a photo she dropped in the chat */
.l-talk-hasp p{padding:0;overflow:hidden;max-width:60%;width:60%}
.l-talk-hasp small{padding:.4rem .78rem .3rem;margin:0}
.l-talk-pic{display:block;width:100%;aspect-ratio:4/3;background:#2a2140}
.l-talk-pic img{width:100%;height:100%;object-fit:cover}
.l-talk-pic img:not([src]){visibility:hidden}