.demo{--app-red:#930202;--app-pink:#feb5cf;--app-pink-bg:#fff8fa;--app-bg:#fff;--app-surface:#f5f5f5;--app-ink:#0e0e0e;--app-ink-2:#6d6d6d;--app-ink-3:#a7a7a7;--app-border:#e9e9e9;--app-sans:var(--font-outfit,ui-sans-serif, system-ui, sans-serif);--app-serif:var(--font-fraunces,Georgia, ui-serif, serif);justify-content:center;width:100%;display:flex}.demo-shell{flex-direction:column;align-items:center;gap:16px;width:100%;display:flex}.demo-phone{aspect-ratio:340/720;background:var(--app-bg);width:340px;max-width:100%;height:auto;color:var(--app-ink);font-family:var(--app-sans);-webkit-user-select:none;user-select:none;border-radius:2.75rem;position:relative;overflow:hidden;box-shadow:0 0 0 9px #101012,0 0 0 10px #00000040,0 34px 80px -30px #0000008c}.demo-notch{z-index:30;background:#101012;border-radius:0 0 16px 16px;width:130px;height:26px;position:absolute;top:0;left:50%;transform:translate(-50%)}.demo-statusbar{top:0;height:46px;color:var(--app-ink);z-index:20;justify-content:space-between;align-items:center;padding:14px 24px 0;font-size:13px;font-weight:600;display:flex;position:absolute;inset-inline:0}.demo-sb-right{align-items:center;gap:6px;display:inline-flex}.demo-sig{background:var(--app-ink);clip-path:polygon(0 70%,22% 70%,22% 100%,0 100%,26% 100%,26% 45%,48% 45%,48% 100%,52% 100%,52% 22%,74% 22%,74% 100%,78% 100%,78% 0,100% 0,100% 100%,0 100%);width:17px;height:11px}.demo-bat{border:1.5px solid var(--app-ink);border-radius:3px;width:22px;height:11px;position:relative}.demo-bat:after{content:"";background:var(--app-ink);border-radius:1px;position:absolute;inset:1.5px}.demo-screens{position:absolute;inset:46px 0 0}.demo-screen{flex-direction:column;display:flex;position:absolute;inset:0}.demo-screen[hidden]{display:none}.demo-i{flex:none;width:20px;height:20px}.demo-appbar{flex:none;align-items:center;gap:8px;padding:6px 14px;display:flex}.demo-appbar--discover{justify-content:space-between}.demo-brand-logo{width:auto;height:18px}.demo-iconbtn{width:36px;height:36px;color:var(--app-ink);cursor:pointer;background:0 0;border:none;border-radius:999px;justify-content:center;align-items:center;display:inline-flex}.demo-iconbtn svg{width:22px;height:22px}.demo-iconbtn--ghost{color:var(--app-ink);cursor:default}.demo-appbar--prefs{gap:12px;padding:6px 14px 2px}.demo-progress{flex:1;align-items:center;gap:5px;display:flex}.demo-seg{background:var(--app-red);border-radius:999px;height:5px}.demo-seg--part{background:linear-gradient(to right,var(--app-red) 100%,var(--app-border) 0)}.demo-seg--off{background:var(--app-border)}.demo-seg-heart{color:var(--app-border);font-size:13px;line-height:1}.demo-prefs-body{flex:1;padding-top:30px;position:relative;overflow-y:auto}.demo-pad{padding:6px 22px 22px}.demo-h1{font-family:var(--app-serif);letter-spacing:-.5px;color:var(--app-ink);margin-top:6px;font-size:29px;font-weight:600;line-height:1.08}.demo-sub{color:var(--app-ink-3);margin-top:10px;font-size:14px;line-height:1.45}.demo-pref-sec{padding:18px 0}.demo-pref-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.demo-pref-title{color:var(--app-ink);font-size:18px;font-weight:600}.demo-opentoall{cursor:pointer;color:var(--app-ink-2);background:0 0;border:none;align-items:center;gap:8px;font-family:inherit;font-size:13px;display:inline-flex}.demo-radio{border:1.5px solid var(--app-ink-3);border-radius:999px;width:20px;height:20px;position:relative}.demo-opentoall.is-on .demo-radio{border-color:var(--app-red)}.demo-opentoall.is-on .demo-radio:after{content:"";background:var(--app-red);border-radius:999px;position:absolute;inset:3px}.demo-divider{background:var(--app-border);height:1px}.demo-chips{flex-wrap:wrap;gap:8px;display:flex}.demo-chip{background:var(--app-surface);color:var(--app-ink);cursor:pointer;border:none;border-radius:999px;padding:8px 16px;font-family:inherit;font-size:15px;transition:background .15s}.demo-chip.is-on{background:var(--app-pink)}.demo-range{margin-top:4px}.demo-range-labels{color:var(--app-ink-2);justify-content:space-between;margin-bottom:10px;font-size:14px;display:flex}.demo-range-labels--end{color:var(--app-ink);justify-content:flex-end;font-weight:600}.demo-range-track{height:24px;position:relative}.demo-range-track:before{content:"";background:var(--app-border);border-radius:999px;height:6px;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.demo-range-fill{background:var(--app-pink);border-radius:999px;height:6px;position:absolute;top:50%;transform:translateY(-50%)}.demo-range-track input[type=range]{pointer-events:none;appearance:none;background:0 0;width:100%;margin:0;position:absolute;inset:0}.demo-range-track input[type=range]::-webkit-slider-thumb{appearance:none;pointer-events:auto;cursor:grab;background:#fff;border-radius:999px;width:28px;height:24px;box-shadow:0 2px 13px #0000002e,0 1px 4px #0000001f}.demo-range-track input[type=range]::-moz-range-thumb{pointer-events:auto;cursor:grab;background:#fff;border:none;border-radius:999px;width:28px;height:24px;box-shadow:0 2px 13px #0000002e,0 1px 4px #0000001f}.demo-range-track input[type=range]::-moz-range-track{background:0 0}.demo-prefs-spacer{height:64px}.demo-fab{background:var(--app-border);width:52px;height:52px;color:var(--app-ink-3);cursor:pointer;z-index:5;border:none;border-radius:999px;justify-content:center;align-items:center;display:flex;position:absolute;bottom:16px;right:13px;box-shadow:0 8px 20px -8px #0000004d}.demo-fab.is-active{background:var(--app-ink);color:#fff}.demo-fab svg{width:22px;height:22px}.demo-profile{flex:1;padding:0 16px 24px;display:block;overflow-y:auto}.demo-profile>*+*{margin-top:12px}.demo-photo{aspect-ratio:3/4;background:var(--app-surface);touch-action:pan-y;border-radius:24px;width:100%;position:relative;overflow:hidden;box-shadow:0 8px 24px -12px #00000059}[data-demo-swipe]{cursor:grab;touch-action:pan-y;transition:transform .3s cubic-bezier(.22,1,.36,1)}.demo-photo img{object-fit:cover;pointer-events:none;width:100%;height:100%;display:block}.demo-photo-grad{inset-inline:0;background:linear-gradient(#0000,#000000b3);height:112px;position:absolute;bottom:0}.demo-photo-name{font-family:var(--app-serif);letter-spacing:-.5px;color:#fff;font-size:28px;font-weight:600;position:absolute;bottom:16px;left:16px}.demo-photo-name span{font-weight:400}.demo-like{width:48px;height:48px;color:var(--app-red);cursor:pointer;background:#fff;border:none;border-radius:999px;justify-content:center;align-items:center;transition:transform .12s;display:flex;position:absolute;box-shadow:0 6px 16px -6px #0000004d}.demo-like:active{transform:scale(.9)}.demo-like svg{width:32px;height:32px}.demo-like--photo,.demo-like--card{bottom:16px;right:16px}.demo-swipe-fx{pointer-events:none;z-index:6;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.demo-swipe-fx-icon{opacity:0;background:#fffffff2;border-radius:999px;justify-content:center;align-items:center;width:96px;height:96px;display:flex;position:absolute;box-shadow:0 12px 32px -8px #0000004d}.demo-swipe-fx-icon svg{width:52px;height:52px}.demo-swipe-fx-like{color:var(--app-red);opacity:var(--like,0);transform:scale(calc(.6 + var(--like,0) * .4))}.demo-swipe-fx-nope{color:var(--app-ink);opacity:var(--nope,0);transform:scale(calc(.6 + var(--nope,0) * .4))}.demo-prompt{border:1px solid var(--app-border);background:#fff;border-radius:24px;padding:20px 24px 64px;position:relative;box-shadow:0 6px 18px -12px #0000004d}.demo-quote{font-family:var(--app-serif);color:var(--app-border);height:26px;font-size:52px;line-height:.6}.demo-prompt-q{color:var(--app-ink);margin-top:8px;font-size:15px}.demo-prompt-a{font-family:var(--app-serif);letter-spacing:-.6px;color:var(--app-ink);margin-top:12px;font-size:21px;font-weight:600;line-height:1.2}.demo-sec{padding:8px 4px}.demo-sec-title{font-family:var(--app-serif);letter-spacing:-.5px;color:var(--app-ink);margin-bottom:14px;font-size:22px;font-weight:600}.demo-row{color:var(--app-ink);align-items:flex-start;gap:14px;padding:7px 0;font-size:15px;line-height:1.35;display:flex}.demo-row-i{color:var(--app-ink);margin-top:1px;display:inline-flex}.demo-row--lang{align-items:flex-start}.demo-lang-pills{flex-wrap:wrap;gap:6px;display:flex}.demo-pill{background:var(--app-surface);color:var(--app-ink);border-radius:999px;padding:7px 14px;font-size:14px}.demo-badges{flex-wrap:wrap;gap:8px;display:flex}.demo-badge{background:var(--app-surface);color:var(--app-ink);border-radius:999px;align-items:center;gap:8px;padding:8px 14px;font-size:14px;display:inline-flex}.demo-badge-i{display:inline-flex}.demo-badge-i svg{width:17px;height:17px}.demo-referrals{scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px;margin-block-end:-20px;margin-inline:-16px;padding-block-end:24px;padding-inline:16px;scroll-padding-inline:16px;display:flex;overflow-x:auto}.demo-referrals::-webkit-scrollbar{display:none}.demo-referral{scroll-snap-align:start;border:1px solid var(--app-border);background:#fff;border-radius:26px;flex:0 0 100%;padding:24px;box-shadow:0 10px 30px -16px #00000040}.demo-ref-title{font-family:var(--app-serif);letter-spacing:0;color:var(--app-ink);font-size:18px;font-weight:600}.demo-ref-head{align-items:center;gap:12px;margin-top:16px;display:flex}.demo-ref-av{background:var(--app-surface);border-radius:999px;flex:none;justify-content:center;align-items:center;width:40px;height:40px;display:inline-flex}.demo-ref-av svg{color:#b3aba6;width:22px;height:22px}.demo-ref-name{font-family:var(--app-serif);letter-spacing:.5px;color:var(--app-ink);font-size:16px;font-weight:600}.demo-ref-text{color:var(--app-ink);margin-top:16px;font-size:15px;line-height:1.45}.demo-ref-tags{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.demo-ref-tag{background:var(--app-surface);font-family:var(--app-serif);color:var(--app-ink);border-radius:999px;align-items:center;gap:5px;padding:6px 10px;font-size:13px;font-weight:600;display:inline-flex}.demo-ref-dots{justify-content:flex-end;align-items:center;gap:6px;margin-top:18px;display:flex}.demo-ref-dots span{background:var(--app-border);border-radius:999px;width:7px;height:7px;transition:width .2s,background .2s}.demo-ref-dots span.is-on{background:var(--app-ink);width:18px}.demo-envelope{justify-content:space-between;align-items:center;gap:16px;padding:8px 0 4px;display:flex}.demo-dislike,.demo-scrolltop{border:1px solid var(--app-border);width:60px;height:60px;color:var(--app-ink);cursor:pointer;background:#fff;border-radius:999px;justify-content:center;align-items:center;display:flex;box-shadow:0 6px 16px -6px #00000040}.demo-dislike svg,.demo-scrolltop svg{width:26px;height:26px}.demo-report{color:var(--app-ink-3);cursor:pointer;background:0 0;border:none;font-family:inherit;font-size:13px;font-weight:600}.demo-report:hover{color:var(--app-red)}.demo-chat-top{flex:none;justify-content:space-between;align-items:center;padding:4px 14px;display:flex;position:relative}.demo-chat-topname{color:var(--app-ink);font-size:16px;font-weight:600;position:absolute;left:50%;transform:translate(-50%)}.demo-chat-scroll{scroll-behavior:smooth;flex:1;padding:0 16px;overflow-y:auto}@media (prefers-reduced-motion:reduce){.demo-chat-scroll{scroll-behavior:auto}}.demo-chat-intro{text-align:center;flex-direction:column;align-items:center;display:flex}.demo-chat-photo{object-fit:cover;border-radius:999px;width:90px;height:90px}.demo-chat-name{color:var(--app-ink);margin-top:10px;font-size:18px;font-weight:600}.demo-chat-connected{color:var(--app-ink-2);padding:8px 0 4px;font-size:12px}.demo-safety{text-align:left;background:var(--app-pink-bg);border:1px solid var(--app-pink);color:var(--app-ink);border-radius:24px;align-items:flex-start;gap:6px;margin:8px 0;padding:10px 12px;font-size:13px;line-height:1.35;display:flex}.demo-safety svg{width:18px;height:18px;color:var(--app-red);flex:none;margin-top:1px}.demo-datesep{text-align:center;color:var(--app-ink-2);padding:14px 0;font-size:11px;font-weight:500}.demo-thread{flex-direction:column;padding-bottom:8px;display:flex}.demo-msg{align-items:flex-end;gap:10px;margin-top:8px;display:flex}.demo-msg.is-consec{margin-top:4px}.demo-msg--me{flex-direction:row-reverse}.demo-msg-av{object-fit:cover;border-radius:999px;flex:none;width:28px;height:28px}.demo-msg-av--blank{background:0 0}.demo-bubble-col{flex-direction:column;max-width:calc(100% - 80px);display:flex}.demo-msg--me .demo-bubble-col{align-items:flex-end}.demo-msg-time{color:var(--app-ink-3);padding:0 6px 3px;font-size:11px}.demo-bubble{color:var(--app-ink);border-radius:24px;padding:10px 12px;font-size:15px;line-height:1.35;animation:.22s demo-pop}.demo-msg--them .demo-bubble{background:var(--app-surface);border-bottom-left-radius:6px}.demo-msg--me .demo-bubble{background:var(--app-pink);border-bottom-right-radius:6px}.demo-msg-react{border:1px solid var(--app-border);background:#fff;border-radius:999px;align-self:flex-start;margin-top:-8px;padding:1px 6px;font-size:12px;line-height:1.4}.demo-msg--me .demo-msg-react{align-self:flex-end}.demo-typing{background:var(--app-surface);border-radius:24px 24px 24px 6px;align-items:center;gap:4px;padding:12px 14px;display:inline-flex}.demo-typing span{background:var(--app-ink-3);border-radius:999px;width:7px;height:7px;animation:1s infinite demo-blink}.demo-typing span:nth-child(2){animation-delay:.2s}.demo-typing span:nth-child(3){animation-delay:.4s}.demo-replies{flex-direction:column;flex:none;gap:7px;padding:4px 16px 0;display:flex}.demo-replies:empty{display:none}.demo-reply{text-align:left;border:1.5px solid var(--app-red);color:var(--app-red);cursor:pointer;background:0 0;border-radius:999px;padding:11px 15px;font-family:inherit;font-size:14px;font-weight:600;transition:background .15s,color .15s}.demo-reply:hover{background:var(--app-red);color:#fff}.demo-chat-cta{background:var(--app-red);color:#fff;font-family:var(--app-sans);box-shadow:0 10px 24px -12px var(--app-red);border-radius:999px;justify-content:center;align-items:center;gap:6px;padding:13px 18px;font-size:15px;font-weight:700;text-decoration:none;display:flex}.demo-chat-cta svg{width:18px;height:18px}.demo-inputbar{flex:none;padding:8px 16px 14px}.demo-inputwrap{position:relative}.demo-input{border:1.5px solid var(--app-border);background:var(--app-surface);width:100%;color:var(--app-ink);border-radius:24px;padding:12px 56px 12px 16px;font-family:inherit;font-size:15px}.demo-input::placeholder{color:var(--app-ink-3)}.demo-input:focus-visible{border-color:var(--app-ink-3);outline:none}.demo-send{color:#fff;cursor:pointer;background:#1c1c1c;border:none;border-radius:999px;justify-content:center;align-items:center;width:38px;display:flex;position:absolute;top:5px;bottom:5px;right:5px}.demo-send svg{width:18px;height:18px}.demo-match{z-index:40;opacity:0;background:#fff;flex-direction:column;justify-content:center;align-items:center;gap:6px;transition:opacity .25s;display:flex;position:absolute;inset:0}.demo-match.is-on{opacity:1}.demo-spark{width:120px;height:110px;position:relative}.demo-spark span{background:var(--app-pink);clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);position:absolute}.demo-spark-1{width:84px;height:84px;animation:.7s ease-out 50ms forwards demo-spark;bottom:0;left:8px;transform:scale(0)}.demo-spark-2{width:40px;height:40px;animation:.7s ease-out .2s forwards demo-spark;top:6px;right:6px;transform:scale(0)}.demo-match-title{font-family:var(--app-serif);letter-spacing:-.5px;color:var(--app-ink);opacity:0;font-size:28px;font-weight:700;animation:.4s ease-out .35s forwards demo-rise;transform:translateY(8px)}@media (max-width:480px){.demo-shell{gap:12px}.demo-phone{border-radius:clamp(2rem,11vw,2.75rem);width:min(340px,100vw - 48px);box-shadow:0 0 0 7px #101012,0 0 0 8px #00000040,0 26px 62px -32px #0000008c}.demo-notch{border-radius:0 0 15px 15px;width:38%;height:24px}.demo-statusbar{padding-inline:22px}}@media (max-width:360px){.demo-phone{width:calc(100vw - 40px)}.demo-pad{padding-inline:18px}.demo-profile{padding-inline:14px}.demo-referrals{margin-inline:-14px;padding-inline:14px;scroll-padding-inline:14px}}@keyframes demo-pop{0%{opacity:0;transform:translateY(5px)scale(.97)}}@keyframes demo-blink{0%,to{opacity:.3}50%{opacity:1}}@keyframes demo-spark{to{transform:scale(1)}}@keyframes demo-rise{to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.demo-bubble,.demo-match,.demo-spark span,.demo-match-title,[data-demo-swipe]{opacity:1;transition:none;animation:none;transform:none}}
