.demo{--u:calc(100cqw / 390);--app-bg:#000;--app-ink:#fff;--app-meta:#ccc;--app-ink-2:#969696;--app-tile:#1f1f21;--app-pill:#303030;--app-accent:#ff6a00;--app-accent-soft:#3d1a00;--app-card:#071525;--app-line:#2c2c2e;--app-online:#30d158;--app-sans:var(--font-outfit,ui-sans-serif, system-ui, sans-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-screens,.demo-match{container-type:inline-size}.demo-screen:focus,.demo-join-page:focus,.demo-match:focus{outline:none}:where(.demo-phone,.demo-phone *){letter-spacing:0}:where(.demo-phone){line-height:1.4}:where(.demo-phone button){font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:0 0;border:0;padding:0}:where(.demo-phone p,.demo-phone h2,.demo-phone h3,.demo-phone ul,.demo-phone hr){margin:0}:where(.demo-phone img){object-fit:cover;display:block}.demo-phone button:focus-visible,.demo-phone a:focus-visible{outline:2px solid var(--app-accent);outline-offset:2px}.demo-phone [hidden]{display:none!important}.demo-icon{width:calc(var(--s) * var(--u));height:calc(var(--s) * var(--u));flex:none;display:block}.demo-scroll{overscroll-behavior:contain;scrollbar-width:none;position:absolute;inset:0;overflow-y:auto}.demo-scroll::-webkit-scrollbar{display:none}.demo-round{width:calc(44 * var(--u));height:calc(44 * var(--u));background:var(--app-tile);box-shadow:inset 0 0 0 calc(.6 * var(--u)) #ffffff12;color:var(--app-ink);border-radius:50%;flex:none;justify-content:center;align-items:center;display:inline-flex}.demo-round--me{box-shadow:none}.demo-at-8,.demo-at-20,.demo-at-76,.demo-at-270,.demo-at-326{z-index:3;position:absolute;top:0}.demo-at-8{left:calc(8 * var(--u))}.demo-at-20{left:calc(20 * var(--u))}.demo-at-76{left:calc(76 * var(--u))}.demo-at-270{left:calc(270 * var(--u))}.demo-at-326{left:calc(326 * var(--u))}.demo-dot{width:calc(7 * var(--u));height:calc(7 * var(--u));background:var(--app-accent);border-radius:50%;flex:none}.demo-cta{justify-content:center;align-items:center;gap:calc(8 * var(--u));border-radius:calc(10.33 * var(--u));background:var(--app-accent);color:#000;font-size:calc(15 * var(--u));font-weight:500;line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));text-decoration:none;transition:background .2s,color .2s;display:flex}.demo-cta[aria-disabled=true]{background:var(--app-tile);color:var(--app-ink-2)}.demo-cta--dock{left:calc(20 * var(--u));right:calc(20 * var(--u));bottom:calc(42 * var(--u));height:calc(48.7 * var(--u));z-index:4;position:absolute}.demo-backdrop{background:#000;position:absolute;inset:-46px 0 0;overflow:hidden}.demo-backdrop img{inset:calc(-96 * var(--u));width:calc(100% + 192 * var(--u));height:calc(100% + 192 * var(--u));filter:blur(calc(48 * var(--u)));position:absolute;transform:scale(1.25)}.demo-backdrop:after{content:"";background:var(--tone);opacity:.55;position:absolute;inset:0}.demo-tabbar{left:0;right:0;bottom:calc(44 * var(--u));height:calc(61 * var(--u));z-index:5;pointer-events:none;position:absolute}.demo-tabs,.demo-tab-li{height:calc(61 * var(--u));box-shadow:inset 0 0 0 calc(.6 * var(--u)) #ffffff14;background:#1f1f21ed;border-radius:999px;position:absolute;top:0}.demo-tabs{left:calc(22.3 * var(--u));width:calc(271.3 * var(--u))}.demo-tab{top:calc(4.9 * var(--u));left:calc((3.5 + var(--i) * 86.05) * var(--u));width:calc(92.2 * var(--u));height:calc(51.3 * var(--u));color:var(--app-ink-2);border-radius:999px;position:absolute}.demo-tab.is-on{background:var(--app-pill);color:var(--app-accent)}.demo-tab .demo-icon{top:calc(5.6 * var(--u));left:calc(33.5 * var(--u));position:absolute}.demo-tab-label{top:calc(33.7 * var(--u));text-align:center;font-size:calc(10 * var(--u));font-weight:500;line-height:calc(12 * var(--u));letter-spacing:calc(.12 * var(--u));position:absolute;left:0;right:0}.demo-tab.is-on .demo-tab-label{font-weight:600}.demo-tab-li{left:calc(306.7 * var(--u));width:calc(61 * var(--u));justify-content:center;align-items:center;display:flex}.demo-tab-li img{width:calc(12.6 * var(--u));height:calc(21 * var(--u));object-fit:contain}.demo-topbar{height:calc(44 * var(--u));z-index:3;position:absolute;top:0;left:0;right:0}.demo-topbar--flow{position:relative}.demo-mark{top:calc(9 * var(--u));left:calc(158.7 * var(--u));width:calc(72.7 * var(--u));height:calc(26 * var(--u));color:var(--app-ink);position:absolute}.demo-mark path:last-child{fill:currentColor}.demo-topblur{height:calc(46px + 60 * var(--u));z-index:2;pointer-events:none;position:absolute;top:-46px;left:0;right:0}.demo-topblur i{left:0;right:0;top:calc(46px + var(--k) * 10 * var(--u));height:calc(10 * var(--u));-webkit-backdrop-filter:blur(calc(var(--b) * var(--u)));backdrop-filter:blur(calc(var(--b) * var(--u)));position:absolute}.demo-topblur i:first-child{--b:16;height:46px;top:0}.demo-topblur i:nth-child(2){--k:0;--b:14.67}.demo-topblur i:nth-child(3){--k:1;--b:12}.demo-topblur i:nth-child(4){--k:2;--b:9.33}.demo-topblur i:nth-child(5){--k:3;--b:6.67}.demo-topblur i:nth-child(6){--k:4;--b:4}.demo-topblur i:nth-child(7){--k:5;--b:1.33}.demo-home{padding:calc(91 * var(--u)) 0 calc(160 * var(--u))}.demo-mine{margin-left:calc(20.3 * var(--u));height:calc(20 * var(--u));font-size:calc(15 * var(--u));font-weight:600;line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));align-items:center;display:flex}.demo-album{width:calc(349.33 * var(--u));height:calc(479.1 * var(--u));margin:calc(11.4 * var(--u)) 0 0 calc(20.3 * var(--u));border-radius:calc(10.33 * var(--u));background:var(--tone);text-align:left;animation:2.4s ease-in-out infinite demo-hint;display:block;position:relative}.demo-album-cover{top:calc(20.6 * var(--u));left:calc(20.2 * var(--u));width:calc(309 * var(--u));height:calc(309 * var(--u));border-radius:calc(6.29 * var(--u));position:absolute}.demo-album-kicker,.demo-album-title,.demo-album-meta{left:calc(20.2 * var(--u));width:calc(309 * var(--u));white-space:nowrap;text-overflow:ellipsis;position:absolute;overflow:hidden}.demo-album-kicker,.demo-album-meta{font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));color:var(--app-meta)}.demo-album-kicker{top:calc(345.6 * var(--u))}.demo-album-title{top:calc(369.6 * var(--u));font-size:calc(20 * var(--u));font-weight:600;line-height:calc(25 * var(--u));letter-spacing:calc(-.45 * var(--u))}.demo-album-meta{top:calc(400.6 * var(--u));-webkit-line-clamp:2;white-space:normal;-webkit-box-orient:vertical;display:-webkit-box}.demo-rail-title{align-items:center;gap:calc(2 * var(--u));margin:calc(183.5 * var(--u)) 0 calc(14 * var(--u)) calc(20 * var(--u));font-size:calc(20 * var(--u));font-weight:600;line-height:calc(25 * var(--u));letter-spacing:calc(-.45 * var(--u));display:flex}.demo-rail-title .demo-icon{color:var(--app-ink-2)}.demo-rail-row{align-items:flex-start;gap:calc(12 * var(--u));min-height:calc(80 * var(--u));margin:0 calc(20 * var(--u)) calc(20 * var(--u));display:flex}.demo-rail-row img{width:calc(80 * var(--u));height:calc(80 * var(--u));border-radius:calc(8.7 * var(--u));flex:none}.demo-rail-body{flex:1;min-width:0}.demo-rail-name{font-size:calc(17 * var(--u));font-weight:600;line-height:calc(22 * var(--u));letter-spacing:calc(-.43 * var(--u))}.demo-rail-line{align-items:flex-start;gap:calc(5 * var(--u));margin-top:calc(4 * var(--u));font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));color:var(--app-ink-2);display:flex}.demo-rail-line+.demo-rail-line{margin-top:calc(2 * var(--u))}.demo-rail-line>:last-child{flex:1;min-width:0}.demo-rail-icon{width:calc(15 * var(--u));height:calc(20 * var(--u));flex:none;justify-content:center;align-items:center;display:flex}.demo-detail-hero{height:calc(46px + 300 * var(--u));-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 104 * var(--u)),transparent calc(100% - 24 * var(--u)));-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 104 * var(--u)),transparent calc(100% - 24 * var(--u)));mask-image:linear-gradient(to bottom,#000 calc(100% - 104 * var(--u)),transparent calc(100% - 24 * var(--u)));position:absolute;top:-46px;left:0;right:0}.demo-detail-hero img{width:100%;height:100%}.demo-detail-hero:after{content:"";background:linear-gradient(#0000 20%,#00000080 62%,#000000b3 85%);position:absolute;inset:0}.demo-detail-words{top:calc(173 * var(--u));left:calc(24 * var(--u));right:calc(24 * var(--u));position:absolute}.demo-detail-title{font-size:calc(24 * var(--u));font-weight:700;line-height:calc(30 * var(--u))}.demo-detail-place{margin-top:calc(4 * var(--u));font-size:calc(14.5 * var(--u));line-height:calc(19 * var(--u));letter-spacing:calc(.25 * var(--u));color:#ffffffd9}.demo-detail-flow{top:calc(244 * var(--u));left:calc(24 * var(--u));right:calc(24 * var(--u));position:absolute}.demo-timecard{min-height:calc(90 * var(--u));padding:calc(16 * var(--u)) calc(18 * var(--u)) calc(18 * var(--u));border-radius:calc(10.32 * var(--u));background:linear-gradient(to bottom right,#271406,#270609)}.demo-timecard-row,.demo-timecard-big{justify-content:space-between;align-items:baseline;display:flex}.demo-timecard-row{font-size:calc(13.5 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(.25 * var(--u));align-items:center}.demo-timecard-status{margin-left:calc(6 * var(--u));flex:1}.demo-timecard-count{margin-left:calc(10 * var(--u));color:var(--app-ink-2)}.demo-timecard-big{margin-top:calc(10 * var(--u))}.demo-timecard-words{-webkit-line-clamp:3;min-width:0;font-size:calc(22 * var(--u));font-weight:600;line-height:calc(28 * var(--u));-webkit-box-orient:vertical;flex:1;display:-webkit-box;overflow:hidden}.demo-timecard-right{white-space:nowrap;margin-left:calc(10 * var(--u));font-size:calc(16 * var(--u));line-height:calc(21 * var(--u));letter-spacing:calc(.25 * var(--u));flex:none}.demo-cta--join{width:100%;margin-top:calc(24 * var(--u));height:calc(56 * var(--u));font-size:calc(16 * var(--u));font-weight:600;line-height:calc(23 * var(--u));letter-spacing:calc(.2 * var(--u))}.demo-actions{margin:calc(20 * var(--u)) 0 0 calc(-6 * var(--u));gap:calc(16 * var(--u));display:flex}.demo-action{width:calc(104 * var(--u));flex-direction:column;align-items:center;display:flex}.demo-action-disc,.demo-where-disc{background:var(--app-tile);border-radius:50%;justify-content:center;align-items:center;display:flex}.demo-action-disc{width:calc(56 * var(--u));height:calc(56 * var(--u))}.demo-action-label{width:100%;margin-top:calc(8 * var(--u));font-size:calc(14.5 * var(--u));line-height:calc(19 * var(--u));letter-spacing:calc(.25 * var(--u));text-align:center;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.demo-where{margin-top:calc(28 * var(--u));height:calc(60 * var(--u));position:relative}.demo-where-disc{width:calc(40 * var(--u));height:calc(40 * var(--u));position:absolute;top:0;left:0}.demo-where-title,.demo-where-place{left:calc(54 * var(--u));position:absolute;right:0}.demo-where-title{top:calc(9 * var(--u));font-size:calc(16 * var(--u));line-height:calc(21 * var(--u));letter-spacing:calc(.25 * var(--u))}.demo-where-place{top:calc(38 * var(--u));font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));color:var(--app-meta)}.demo-join{z-index:10;background:#000;padding-top:46px;position:absolute;inset:-46px 0 0}.demo-join-page{height:100%;animation:.2s ease-out demo-fade;position:relative}.demo-join-title,.demo-join-sub{left:calc(20 * var(--u));right:calc(20 * var(--u));text-align:center;position:absolute}.demo-join-title{top:calc(60 * var(--u));font-size:calc(22 * var(--u));font-weight:600;line-height:calc(28 * var(--u))}.demo-join-sub{top:calc(94 * var(--u));font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));color:var(--app-ink-2)}.demo-join-label{left:calc(20 * var(--u));font-size:calc(15 * var(--u));font-weight:500;line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));color:var(--app-ink-2);position:absolute}.demo-join-label--identity{top:calc(138 * var(--u))}.demo-join-label--seen{top:calc(444 * var(--u))}.demo-personas{top:calc(166 * var(--u));left:calc(20 * var(--u));width:calc(350 * var(--u));gap:calc(8 * var(--u));flex-direction:column;display:flex;position:absolute}.demo-persona{height:calc(66 * var(--u));border-radius:calc(16 * var(--u));background:var(--app-tile);text-align:left;display:block;position:relative}.demo-persona-face{top:calc(10 * var(--u));left:calc(10 * var(--u));width:calc(46 * var(--u));height:calc(46 * var(--u));font-size:calc(21.16 * var(--u));letter-spacing:calc(.25 * var(--u));background:#000;border-radius:50%;justify-content:center;align-items:center;font-weight:600;display:flex;position:absolute}.demo-persona-name{top:calc(22 * var(--u));left:calc(68 * var(--u));right:calc(48 * var(--u));font-size:calc(17 * var(--u));font-weight:600;line-height:calc(22 * var(--u));letter-spacing:calc(-.43 * var(--u));position:absolute}.demo-persona .demo-radio{top:calc(22 * var(--u));left:calc(314 * var(--u));position:absolute}.demo-radio{color:#6a6a6a}.demo-radio--on{color:var(--app-ink);display:none}.demo-persona[aria-pressed=true],.demo-choice[aria-pressed=true]{box-shadow:inset 0 0 0 calc(1.5 * var(--u)) var(--app-ink)}[aria-pressed=true]>.demo-radio{display:none}[aria-pressed=true]>.demo-radio--on{display:block}.demo-persona-add{top:calc(392 * var(--u));left:calc(20 * var(--u));align-items:center;gap:calc(6 * var(--u));font-size:calc(15 * var(--u));font-weight:500;line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));display:flex;position:absolute}.demo-seen{top:calc(472 * var(--u));left:calc(20 * var(--u));gap:calc(8 * var(--u));display:flex;position:absolute}.demo-choice{width:calc(171 * var(--u));height:calc(76 * var(--u));border-radius:calc(16 * var(--u));background:var(--app-tile);text-align:left;display:block;position:relative}.demo-choice>.demo-icon:first-child{top:calc(14 * var(--u));left:calc(14 * var(--u));position:absolute}.demo-choice .demo-radio{top:calc(14 * var(--u));right:calc(14 * var(--u));position:absolute}.demo-choice-label{top:calc(44 * var(--u));left:calc(14 * var(--u));font-size:calc(15 * var(--u));font-weight:500;line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));position:absolute}.demo-join-notes{top:calc(560 * var(--u));left:calc(24 * var(--u));right:calc(24 * var(--u));font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(-.08 * var(--u));position:absolute}.demo-gate{color:var(--app-accent)}.demo-gate:not(:empty){margin-bottom:calc(6 * var(--u))}.demo-ghost-tip{color:var(--app-ink-2)}.demo-nearby{padding-bottom:calc(130 * var(--u))}.demo-modes{gap:calc(8 * var(--u));margin:calc(16 * var(--u)) 0 0 calc(20 * var(--u));display:flex}.demo-mode{height:calc(36 * var(--u));padding:0 calc(16 * var(--u));background:var(--app-tile);font-size:calc(15 * var(--u));font-weight:500;line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));border-radius:999px;align-items:center;display:inline-flex}.demo-mode.is-on{color:var(--app-accent);background:#331500}.demo-wall{gap:calc(12 * var(--u));margin-top:calc(18.6 * var(--u));padding:0 calc(20 * var(--u));display:flex}.demo-wall-col{gap:calc(12 * var(--u));flex-direction:column;flex:1 1 0;min-width:0;display:flex}.demo-tile{height:calc(var(--h) * var(--u));padding:0 calc(12 * var(--u)) calc(11 * var(--u));border-radius:calc(18 * var(--u));background:var(--app-tile);text-align:left;flex-direction:column;justify-content:flex-end;align-items:flex-start;display:flex;position:relative;overflow:hidden}.demo-tile img{width:100%;height:100%;position:absolute;inset:0}.demo-tile:after{content:"";background:linear-gradient(#0000,#000000b0);position:absolute;inset:50% 0 0}.demo-tile>span{z-index:1;position:relative}.demo-tile--you{--h:314;animation:2.4s ease-in-out infinite demo-call}.demo-tile-name{font-size:calc(16.5 * var(--u));font-weight:700;line-height:calc(24 * var(--u));letter-spacing:calc(.25 * var(--u));align-items:center;display:flex}.demo-online{width:calc(8 * var(--u));height:calc(8 * var(--u));margin-right:calc(6 * var(--u));background:#37b728;border-radius:50%;flex:none}.demo-tile-line{max-width:100%;margin-top:calc(2 * var(--u));font-size:calc(12 * var(--u));line-height:calc(17 * var(--u));letter-spacing:calc(.25 * var(--u));color:#ffffffd9;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.demo-tile-chip{margin-top:calc(6 * var(--u));padding:calc(3 * var(--u)) calc(8 * var(--u));border-radius:calc(8 * var(--u));font-size:calc(11.5 * var(--u));font-weight:500;line-height:calc(17 * var(--u));letter-spacing:calc(.25 * var(--u));background:#ffffff38}.demo-toast{left:calc(20 * var(--u));right:calc(20 * var(--u));bottom:calc(117 * var(--u));z-index:6;gap:calc(4 * var(--u));padding:calc(12 * var(--u)) calc(16 * var(--u));border-radius:calc(16 * var(--u));background:var(--app-pill);box-shadow:0 calc(10 * var(--u)) calc(30 * var(--u)) calc(-10 * var(--u)) #000;flex-direction:column;animation:.28s ease-out demo-rise;display:flex;position:absolute}.demo-toast-title{font-size:calc(15 * var(--u));font-weight:600;line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u))}.demo-toast-hint{font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(-.08 * var(--u));color:var(--app-meta)}.demo-namecard{top:calc(68 * var(--u));left:calc(21.835 * var(--u));width:calc(346.3 * var(--u));bottom:calc(114.7 * var(--u));border-radius:calc(10.33 * var(--u));background:var(--tone);box-shadow:inset 0 0 0 calc(1 * var(--u)) #ffffff1f;position:absolute;overflow:hidden}.demo-namecard-head,.demo-namecard-body{z-index:1;position:absolute;left:0;right:0}.demo-namecard-head{height:calc(140 * var(--u));top:0}.demo-namecard-photo{top:calc(33 * var(--u));left:calc(20 * var(--u));width:calc(96 * var(--u));height:calc(96 * var(--u));border-radius:50%;position:absolute}.demo-namecard-name{top:calc(20 * var(--u));left:calc(132 * var(--u));right:calc(20 * var(--u));font-size:calc(22 * var(--u));font-weight:600;line-height:calc(28 * var(--u));position:absolute}.demo-namecard-body{top:calc(140 * var(--u));padding:calc(24 * var(--u)) calc(20 * var(--u)) calc(88 * var(--u));overscroll-behavior:contain;scrollbar-width:none;bottom:0;overflow-y:auto}.demo-namecard-body::-webkit-scrollbar{display:none}.demo-namecard-tagline{font-size:calc(15 * var(--u));line-height:calc(23 * var(--u));letter-spacing:calc(-.23 * var(--u))}.demo-facts{margin-top:calc(10 * var(--u));gap:calc(7 * var(--u));flex-direction:column;padding:0;list-style:none;display:flex}.demo-facts li{align-items:center;gap:calc(10 * var(--u));font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));color:var(--app-meta);display:flex}.demo-facts .demo-icon,.demo-fieldchips .demo-icon{color:var(--app-ink-2)}.demo-namecard-body hr{height:calc(1 * var(--u));margin:calc(16 * var(--u)) calc(-20 * var(--u));background:#242424;border:0}.demo-namecard-body h3{font-size:calc(17 * var(--u));font-weight:600;line-height:calc(22 * var(--u));letter-spacing:calc(-.43 * var(--u))}.demo-namecard-list{margin-top:calc(10 * var(--u));font-size:calc(14 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(.25 * var(--u));color:#f0dfd8}.demo-fieldchips{gap:calc(8 * var(--u));flex-wrap:wrap;display:flex}.demo-fieldchips span{align-items:center;gap:calc(6 * var(--u));height:calc(36 * var(--u));padding:0 calc(12 * var(--u));font-size:calc(15 * var(--u));font-weight:500;line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));background:#373737;border-radius:999px;display:inline-flex}.demo-crossed{width:calc(94.6 * var(--u));height:calc(94.6 * var(--u));margin-top:calc(12 * var(--u));border-radius:calc(8.7 * var(--u))}.demo-crossed-name{width:calc(94.6 * var(--u));margin-top:calc(6 * var(--u));font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(-.08 * var(--u));color:var(--app-meta)}.demo-report{align-items:center;gap:calc(8 * var(--u));margin-top:calc(16 * var(--u));font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));color:#ee7e72;display:flex}.demo-namecard-sheen,.demo-namecard-darken{pointer-events:none;position:absolute;inset:0}.demo-namecard-sheen{z-index:0;background:linear-gradient(152.8deg,#0000 32.6%,#ffffff14 48.6%,#0000 64.6%)}.demo-namecard-darken{z-index:2;background:linear-gradient(#0000 82.7%,#000000b8)}.demo-meet-icon{display:none}.demo-meet[data-state=meet] .demo-meet-icon--meet,.demo-meet[data-state=sent] .demo-meet-icon--sent,.demo-meet[data-state=message] .demo-meet-icon--message{display:block}.demo-meet[data-state=sent]{background:var(--app-tile);color:var(--app-ink)}.demo-match{z-index:15;background:#000;animation:.3s ease-out demo-fade;position:absolute;inset:0}.demo-match-body{position:absolute;inset:0}.demo-match-close{top:46px}.demo-match-cards{top:calc(46px + 167 * var(--u));left:calc(18.5 * var(--u));gap:calc(10 * var(--u));display:flex;position:absolute}.demo-match-card{width:calc(171.5 * var(--u));height:calc(171.5 * var(--u));border-radius:calc(16 * var(--u));background:var(--tone);box-shadow:0 0 calc(140 * var(--u)) calc(20 * var(--u)) #ff6a0033,0 0 calc(24 * var(--u)) 0 #ff6a0024;flex-direction:column;display:flex;position:relative;overflow:hidden}.demo-match-card img,.demo-match-face{width:100%;height:calc(112.5 * var(--u));flex:none}.demo-match-face{background:var(--app-tile);font-size:calc(48 * var(--u));letter-spacing:calc(.25 * var(--u));justify-content:center;align-items:center;font-weight:600;display:flex}.demo-match-band{gap:calc(4 * var(--u));padding:calc(9.5 * var(--u)) calc(12 * var(--u)) 0;text-align:left;flex-direction:column;display:flex}.demo-match-name{font-size:calc(15 * var(--u));font-weight:600;line-height:calc(20 * var(--u));letter-spacing:calc(.25 * var(--u));white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.demo-match-line{font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(.25 * var(--u));color:#ababab;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.demo-match-title,.demo-match-sub{left:calc(20 * var(--u));right:calc(20 * var(--u));text-align:center;position:absolute}.demo-match-title{top:calc(46px + 373 * var(--u));font-size:calc(22 * var(--u));font-weight:600;line-height:calc(28 * var(--u));letter-spacing:calc(.25 * var(--u));animation:.4s ease-out demo-rise}.demo-match-sub{top:calc(46px + 409 * var(--u));justify-content:center;align-items:center;gap:calc(5 * var(--u));font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));color:var(--app-ink-2);display:flex}.demo-match-say{left:calc(20 * var(--u));right:calc(20 * var(--u));bottom:calc(42 * var(--u));height:calc(44 * var(--u));padding:0 calc(16 * var(--u));border-radius:calc(22 * var(--u));background:var(--app-tile);color:var(--app-ink-2);font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.23 * var(--u));text-align:left;position:absolute}.demo-chatbar{height:calc(54.5 * var(--u));border-bottom:calc(.5 * var(--u)) solid #242424;z-index:3;flex:none;position:relative}.demo-chatbar .demo-round{top:calc(4 * var(--u))}.demo-chatbar-photo{top:calc(7.8 * var(--u));left:calc(72 * var(--u));width:calc(36 * var(--u));height:calc(36 * var(--u));border-radius:50%;position:absolute}.demo-chatbar-text{top:calc(5.8 * var(--u));left:calc(118 * var(--u));right:calc(76 * var(--u));position:absolute}.demo-chatbar-name{font-size:calc(17 * var(--u));font-weight:600;line-height:calc(22 * var(--u));letter-spacing:calc(-.43 * var(--u))}.demo-chatbar-sub{font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(-.08 * var(--u));color:var(--app-ink-2);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.demo-chat-scroll{overscroll-behavior:contain;scrollbar-width:none;min-height:0;padding:0 calc(20 * var(--u)) calc(12 * var(--u));flex-direction:column;flex:1;display:flex;overflow-y:auto}.demo-chat-scroll::-webkit-scrollbar{display:none}.demo-chat-empty{justify-content:center;align-items:center;gap:calc(14 * var(--u));min-height:calc(150 * var(--u));padding-top:calc(16 * var(--u));font-size:calc(20 * var(--u));font-weight:600;line-height:calc(25 * var(--u));letter-spacing:calc(-.45 * var(--u));flex-direction:column;flex:1;display:flex}.demo-chat-empty img{width:calc(64 * var(--u));height:calc(64 * var(--u));border-radius:50%}.demo-thread{flex-direction:column;margin-top:auto;display:flex}.demo-thread:not(:empty){margin-bottom:calc(12 * var(--u))}.demo-thread:not(:empty):before{content:attr(data-day);margin:calc(16 * var(--u)) 0;font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(-.08 * var(--u));color:var(--app-ink-2);align-self:center}.demo-msg{max-width:calc(280.8 * var(--u));padding:calc(10 * var(--u)) calc(15 * var(--u));border-radius:calc(18 * var(--u));font-size:calc(14 * var(--u));line-height:calc(23 * var(--u));letter-spacing:calc(.25 * var(--u));color:#f0dfd8;-webkit-user-select:text;user-select:text;animation:.22s ease-out demo-pop}.demo-msg--me{background:var(--app-pill);border-bottom-right-radius:calc(5 * var(--u));align-self:flex-end}.demo-msg--them,.demo-msg--typing{background:var(--app-tile);border-bottom-left-radius:calc(5 * var(--u));align-self:flex-start}.demo-msg--typing{margin-bottom:calc(10 * var(--u));color:var(--app-ink-2)}.demo-msg-meta{margin:calc(3 * var(--u)) calc(4 * var(--u)) calc(10 * var(--u));font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(-.08 * var(--u));color:var(--app-ink-2)}.demo-msg-meta--me{align-self:flex-end}.demo-msg-meta--them{align-self:flex-start}.demo-openers{margin-top:auto}.demo-thread:not(:empty)~.demo-openers{margin-top:0}.demo-openers-label{margin:0 0 calc(8 * var(--u)) calc(4 * var(--u));font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(-.08 * var(--u));color:var(--app-ink-2)}.demo-openers-list{border-radius:calc(16 * var(--u));background:var(--app-tile);overflow:hidden}.demo-opener{align-items:center;gap:calc(10 * var(--u));width:100%;padding:calc(12 * var(--u)) calc(14 * var(--u)) calc(12.5 * var(--u)) calc(16 * var(--u));font-size:calc(15 * var(--u));line-height:calc(23 * var(--u));letter-spacing:calc(-.23 * var(--u));text-align:left;color:var(--app-ink-2);display:flex}.demo-opener span{color:var(--app-ink);flex:1}.demo-end{align-items:center;gap:calc(10 * var(--u));margin-top:calc(4 * var(--u));flex-direction:column;animation:.3s ease-out demo-rise;display:flex}.demo-end-note{font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));letter-spacing:calc(-.08 * var(--u));color:var(--app-ink-2);text-align:center}.demo-cta--end{width:100%;height:calc(48.7 * var(--u))}.demo-restart{padding:calc(4 * var(--u)) calc(10 * var(--u));font-size:calc(13 * var(--u));line-height:calc(18 * var(--u));color:var(--app-meta);text-underline-offset:3px;text-decoration:underline}.demo-inputbar{align-items:flex-end;gap:calc(8 * var(--u));margin:0 calc(20 * var(--u)) calc(42 * var(--u));flex:none;display:flex}.demo-pill{min-width:0;height:calc(44 * var(--u));border-radius:calc(22 * var(--u));background:var(--app-tile);flex:1;position:relative;overflow:hidden}.demo-input{transform-origin:0 0;width:123.077%;height:123.077%;padding:calc(10.5 * var(--u) / .8125) calc(16 * var(--u) / .8125);color:var(--app-ink);font:inherit;font-size:16px;line-height:calc(23 * var(--u) / .8125);letter-spacing:calc(-.23 * var(--u) / .8125);resize:none;-webkit-user-select:text;user-select:text;background:0 0;border:0;display:block;position:absolute;top:0;left:0;overflow:hidden;transform:scale(.8125)}.demo-input:focus{outline:none}.demo-input::placeholder{color:var(--app-ink-2)}.demo-send{bottom:calc(6 * var(--u));right:calc(6 * var(--u));width:calc(32 * var(--u));height:calc(32 * var(--u));background:var(--app-accent);color:#000;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute}.demo-inputbar:has(.demo-send:not([hidden])) [data-demo-camera]{display:none}.demo-pill:has(.demo-send:not([hidden])) .demo-input{padding-right:calc(44 * var(--u) / .8125)}@keyframes demo-pop{0%{opacity:0;transform:translateY(5px)scale(.97)}to{opacity:1;transform:none}}@keyframes demo-rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes demo-fade{0%{opacity:0}to{opacity:1}}@keyframes demo-call{0%,to{box-shadow:0 0 0 2px var(--app-accent)}50%{box-shadow:0 0 0 5px #ff6a0059}}@keyframes demo-hint{0%,to{box-shadow:0 0 #ff6a0000}50%{box-shadow:0 0 0 3px #ff6a0066}}@media (prefers-reduced-motion:reduce){.demo-phone *{transition:none!important;animation:none!important}}@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)}}