/* Screenshot and callout animations play once and settle within five seconds. */
.fv-screenshot-stage{position:relative;isolation:isolate;max-width:505px;margin:0 auto;padding:16px 0 24px}
.fv-screenshot-stage::before{content:'';position:absolute;inset:8% -3%;z-index:-1;background:radial-gradient(ellipse,#1aa3f529,transparent 68%);pointer-events:none}
.fv-screenshot{display:block;width:260px;max-width:73%;margin:0 auto;border:1px solid #346383;border-radius:14px;overflow:hidden;box-shadow:0 25px 65px #020b1566,0 0 35px #1aa3f510;transform:rotate(-2deg)}
.fv-screenshot img{display:block;width:100%;height:auto}
.fv-screenshot:hover{border-color:#67caff}
.fv-spend-callout{position:absolute;left:0;bottom:50px;width:249px;padding:20px 22px;border:1px solid #346a8c;border-radius:14px;background:linear-gradient(145deg,#153950,#0b2236);box-shadow:0 18px 45px #020b1566,inset 0 1px #7ccfff25;color:#eaf4fd;overflow:hidden}
.fv-spend-callout::before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#7cdcff10 48%,transparent 65%);transform:translateX(-120%);pointer-events:none}
.fv-callout-label{display:block;font-size:9px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#8eacc4}
.fv-callout-tenure{display:block;margin-top:15px;padding-top:12px;border-top:1px solid #2b4c64;font-size:10px;color:#8eacc4}
.fv-callout-tenure strong{font-weight:600;color:#adcde3}
.fv-callout-total{display:block;font-family:'Bricolage Grotesque',sans-serif;font-size:39px;line-height:1.15;letter-spacing:-.045em;margin-top:8px;font-variant-numeric:tabular-nums;color:#67caff;text-shadow:0 0 24px #159ce42b}
.fv-callout-total>span{font-size:.65em}
.fv-callout-period{display:block;font-size:10px;color:#8eacc4;margin-top:5px}
.fv-callout-tip{display:flex;justify-content:space-between;gap:10px;font-size:11px;margin-top:18px;color:#adcde3}
.fv-callout-tip strong{font-weight:600;font-variant-numeric:tabular-nums;color:#eaf4fd}
.fv-callout-track{display:block;height:4px;background:#234257;border-radius:4px;margin-top:8px;overflow:hidden}
.fv-callout-track i{position:relative;display:block;width:79.26%;height:100%;border-radius:4px;background:linear-gradient(90deg,#1aa3f5,#65d4ff);transform-origin:left;overflow:hidden}
.fv-callout-track i::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#e1f8ff,transparent);transform:translateX(-100%)}
.fv-screenshot-label{display:block;text-align:right;margin-top:22px;padding-right:10px;font-size:8px;text-transform:uppercase;letter-spacing:.12em;color:#8eacc4}
.ps-art .fv-proof-caption{font-size:11px;color:#9bb5c5;max-width:430px;margin:6px auto 0;line-height:1.6}
.fv-proof-caption a{color:#91cdef;text-decoration:none;white-space:nowrap}
.fv-proof-caption a:hover{text-decoration:underline;text-underline-offset:3px}
.fs-inbox{width:100%;max-width:505px;margin:0 auto;border:1px solid #355365;border-radius:18px;background:#102737;box-shadow:0 24px 64px #020b1538;overflow:hidden}
.fs-inbox-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 27px;border-bottom:1px solid #284354}
.fs-inbox-brand{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:700;color:#edf8f5}
.fs-inbox{background:#102439;border-color:#2f4f6a}
.fs-inbox-head{padding:19px 24px;border-color:#2c4258}
.fs-inbox-brand img{width:31px;height:auto}
.fs-inbox-head>span{font-size:10px;color:#8fabbe}
.fs-inbox-head>.fs-inbox-brand{font-size:15px;color:#edf8f5}
.fs-audiences{display:flex;gap:7px;align-items:center;padding:19px 24px 0;list-style:none;margin:0}
.fs-audiences li{font-size:10px;border:1px solid #304c65;border-radius:5px;padding:5px 11px;color:#94b0c8;white-space:nowrap}
.fs-audiences .is-selected{color:#d2edff;border-color:#5489ad;background:#1a3d58}
.fs-conversation{padding:20px 24px 23px;display:grid;gap:15px}
.fs-fan-message{max-width:77%;font-size:13px;line-height:1.5;padding:13px 15px;background:#203a50;color:#dbeaf4;border-radius:10px 10px 10px 2px;margin:0}
.fs-team-message{max-width:86%;justify-self:end;font-size:13px;line-height:1.55;background:#154a70;color:#e8f6ff;border:1px solid #276386;border-radius:10px 10px 2px 10px;padding:13px 15px;margin:0}
.fs-content-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fs-content-item{border:1px solid #35536a;border-radius:8px;overflow:hidden;background:#0d2033}
.fs-content-art{height:55px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 15% 140%,#6fa8c779,transparent 60%),linear-gradient(135deg,#285a73,#112a41)}
.fs-content-item+div .fs-content-art{background:radial-gradient(ellipse at 90% 150%,#8182b878,transparent 70%),linear-gradient(135deg,#243450,#13263c)}
.fs-content-art svg{width:25px;height:25px;color:#add4e7}
.fs-content-label{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 8px;padding:10px 11px;font-size:11px;color:#d5e6f2}
.fs-content-label small{font-size:8px;letter-spacing:.04em;text-transform:uppercase;color:#8ad3bc}
.fs-content-item+div small{color:#85c9f4}
.fs-inbox-foot{border-top:1px solid #29445b;padding:15px 24px;font-size:10px;color:#93aec4;display:flex;align-items:center;gap:9px}
.fs-inbox-foot svg{width:14px;height:14px;flex:none;color:#8ad3bc}
@media(prefers-reduced-motion:no-preference){
 .fv-screenshot-stage.is-visible .fv-screenshot{animation:fv-screen-enter .85s cubic-bezier(.2,.7,.2,1) backwards}
 .fv-screenshot-stage.is-visible .fv-spend-callout{animation:fv-callout-enter 1.2s .5s cubic-bezier(.2,.7,.2,1) backwards,fv-card-float 2.8s 1.7s ease-in-out}
 .fv-screenshot-stage.is-visible .fv-callout-track i{animation:fv-spend-reveal 1.3s 1s cubic-bezier(.2,.7,.2,1) backwards}
 .fv-screenshot-stage.is-visible .fv-callout-track i::after{animation:fv-tip-signal 2s 2.3s ease-in-out}
 .fv-screenshot-stage.is-visible .fv-spend-callout::before{animation:fv-card-sheen 2.5s 2.3s ease-in-out}
 .fv-screenshot-stage.is-visible::before{animation:fv-halo 4.5s ease-in-out}
 @keyframes fv-screen-enter{from{opacity:0;transform:translateY(16px) rotate(0)}to{opacity:1;transform:rotate(-2deg)}}
 @keyframes fv-callout-enter{from{opacity:0;transform:translate(-12px,22px)}to{opacity:1;transform:translate(0,0)}}
 @keyframes fv-spend-reveal{from{transform:scaleX(0)}to{transform:scaleX(1)}}
 @keyframes fv-card-float{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
 @keyframes fv-tip-signal{0%,15%{transform:translateX(-100%)}70%,100%{transform:translateX(100%)}}
 @keyframes fv-card-sheen{0%,45%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
 @keyframes fv-halo{0%,100%{opacity:.6;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
 .fs-team-message{animation:fs-reply-reveal .65s .2s ease-out backwards}
 .fs-content-pair{animation:fs-reply-reveal .65s .4s ease-out backwards}
 @keyframes fs-reply-reveal{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
}
@media(max-width:1000px) and (min-width:821px){
 .fs-inbox-head,.fs-inbox-foot,.fs-conversation{padding-left:18px;padding-right:18px}
 .fs-audiences{padding-left:18px;padding-right:18px;gap:5px}
 .fs-audiences li{padding-inline:7px;font-size:9px}
}
@media(max-width:500px){
 .fv-screenshot-stage{padding-top:20px}
 .fv-screenshot{width:250px}
 .fv-spend-callout{width:220px;padding:17px 19px;bottom:48px}
 .fv-callout-total{font-size:35px}
 .fv-screenshot-label{font-size:7px}
 .fs-inbox-head{padding:18px}
 .fs-audiences{padding:18px 18px 0;gap:6px}
 .fs-audiences li{font-size:9px;padding:5px 8px}
 .fs-conversation{padding:18px;gap:12px}
 .fs-fan-message,.fs-team-message{font-size:12px;padding:11px 13px}
 .fs-inbox-foot{padding:14px 18px;font-size:9px}
 .fs-content-label{font-size:10px;padding:9px}
 .fs-content-label small{font-size:7px}
}
@media(max-width:359px){
 .fv-spend-callout{width:195px;padding:15px 16px}
 .fv-callout-total{font-size:31px}
 .fv-callout-label{font-size:8px}
 .fv-callout-tip{margin-top:12px}
 .fs-audiences{gap:4px;padding-inline:14px}.fs-audiences li{padding-inline:6px;font-size:8px}
 .fs-conversation{padding:17px 14px}.fs-team-message{max-width:94%}
}
