@font-face{font-family:'DM Sans';src:url('/assets/fonts/dm-sans-latin.woff2') format('woff2');font-style:normal;font-weight:100 1000;font-display:swap}
:root{--ink:#252a36;--muted:#626978;--line:#dfe3eb;--paper:#fff;--canvas:#f7f8fa;--wash:#eef1f8;--accent:#4057cf;--accent-soft:#e8edff;--radius:24px;--content:1280px;font-family:'DM Sans',Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;color-scheme:light}
*{box-sizing:border-box}
body{margin:0}
button,input,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
p,figure,ul,ol{margin:0}
p{color:var(--muted);line-height:1.65}
h1,h2,h3,h4{margin:0;font-weight:500;letter-spacing:-.04em;text-wrap:balance}
h1{font-size:clamp(42px,4.3vw,64px);line-height:1.06}
h2{font-size:clamp(32px,3.2vw,46px);line-height:1.12}
h3{font-size:23px;line-height:1.25;letter-spacing:-.025em}
h4{font-size:14px;letter-spacing:0}
img{max-width:100%;display:block}
em,i{font-style:normal}
mark{color:var(--accent);background:var(--accent-soft);padding:0 .14em;border-radius:4px}
button,a,summary{touch-action:manipulation}
:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
[hidden]{display:none!important}
main>section,.nav-wrap,.footer-main,.footer-bottom{width:min(var(--content),calc(100% - 96px));margin-inline:auto}
main>section{padding-block:100px}
main>section+section{border-top:1px solid var(--line)}
section,article[id]{scroll-margin-top:104px}
main{overflow:clip}
.section-heading{max-width:740px;margin-bottom:48px}
.section-heading p{max-width:630px;margin-top:20px;font-size:18px}
.lead{font-size:18px;line-height:1.65}
.muted,.fine-print{color:var(--muted)}
.fine-print,figcaption{font-size:12px;line-height:1.6}
figcaption{color:var(--muted);margin-top:14px;text-align:center}
.small-label{display:block;font-size:12px;font-weight:500;letter-spacing:.01em;color:var(--muted);margin-bottom:8px}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin-top:30px}
.button{display:inline-flex;justify-content:center;align-items:center;padding:14px 21px;min-height:48px;white-space:nowrap;border-radius:10px;border:1px solid var(--accent);background:var(--accent);color:white;font-size:14px;font-weight:500;line-height:1.25;transition:background .15s,transform .15s}
.button:hover{background:#3047b8;border-color:#3047b8}
.button:active{transform:translateY(1px)}
.button:disabled{cursor:not-allowed;background:#e8ebf1;color:#656c79;border-color:#dfe3eb}
.button.secondary{background:var(--paper);color:var(--muted);border-color:var(--line)}
.text-link{display:inline-flex;align-items:center;gap:14px;font-size:14px;font-weight:500;line-height:1.5}
.text-link span{color:var(--accent);font-size:20px;transition:transform .18s}
.text-link:hover span{transform:translate(2px,-2px)}
.text-link:hover{color:var(--accent)}
.site-header{height:80px;position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.nav-wrap{height:100%;display:flex;align-items:center;gap:48px}
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:23px;letter-spacing:-.8px;white-space:nowrap}
.primary-nav{display:flex;gap:30px;align-items:center;margin-left:auto}
.primary-nav a{font-size:13px;color:var(--muted);white-space:nowrap}
.primary-nav a:hover,.primary-nav a[aria-current]{color:var(--accent)}
.nav-actions{display:flex;align-items:center;gap:14px}
.nav-actions .button{min-height:42px;padding:11px 17px;font-size:12px}
.menu-toggle{display:none;width:40px;height:40px;align-items:center;justify-content:center;border:0;background:transparent}
.menu-lines{width:20px;height:10px;border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink)}
.skip-link{position:fixed;top:0;left:20px;z-index:99;padding:12px 20px;background:var(--accent);color:white;transform:translateY(-110%)}
.skip-link:focus{transform:translateY(0)}
.scroll-destination:focus{outline:none}
.person{flex:none;text-align:center}
.person img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:50%;background:#fff}
.person>span{display:block;margin-top:9px;font-size:12px;color:var(--muted);line-height:1.3}
.reply-context{display:flex;align-items:center;gap:8px;margin:0 0 12px 12px;font-size:12px;color:var(--muted)}
.reply-demo{width:100%;margin:0}
.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:36px;counter-reset:step}
.steps>li{min-width:0}
.steps h3{margin:25px 0 14px}
.steps p{font-size:14px}
.step-number{display:block;font-size:12px;color:var(--muted);margin-bottom:20px}
.step-example{height:120px;background:var(--canvas);border-radius:15px;padding:24px;display:flex;align-items:center;justify-content:center;gap:12px}
.step-field{font-size:12px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px;color:var(--muted);white-space:nowrap}
.cursor-line{display:inline-block;width:1px;height:13px;background:var(--accent);vertical-align:middle;margin-left:3px}
.insert-mark{color:var(--accent);font-size:23px}
.options{gap:8px}
.options>span{padding:11px;border-radius:7px;color:var(--muted);background:white;border:1px solid var(--line);font-size:12px}
.options>span:first-child{border-color:var(--accent);color:var(--accent)}
#download{border:0;background:var(--wash);border-radius:var(--radius);padding:60px 64px;display:grid;grid-template-columns:1.5fr 1fr;align-items:center;gap:50px;margin-block:20px 90px}
#download h2{font-size:45px;line-height:1.13}
#download p{margin-top:20px;max-width:510px}
#download .fine-print{margin-top:19px}
#download .muted{font-size:12px}
footer{background:var(--canvas);padding-top:65px;border-top:1px solid var(--line)}
.footer-main{display:grid;grid-template-columns:2fr 1fr 1fr;gap:65px;padding-bottom:60px}
.footer-main p{font-size:14px;max-width:270px;margin-top:20px}
.footer-main nav{display:grid;align-content:start;gap:12px}
.footer-main h2{font-size:13px;letter-spacing:0;margin-bottom:10px;color:var(--ink)}
.footer-main nav a{font-size:13px;color:var(--muted)}
.footer-main nav a:hover{color:var(--accent)}
.footer-bottom{padding-block:24px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.inner-page main>section{padding-block:72px}
.inner-page .page-intro{padding-block:76px 64px;border-bottom:0}
.page-intro h1{max-width:880px;font-size:58px;line-height:1.08}
.page-intro .lead{margin-top:24px;max-width:655px}
.page-intro .button{margin-top:28px}
.feature-row{display:grid;grid-template-columns:.9fr 1.1fr;gap:110px;align-items:center}
.feature-row>div>p{font-size:16px;max-width:430px;margin-top:22px}
.feature-row>figure:not(.reply-demo){background:var(--wash);padding:35px;border-radius:var(--radius)}
.feature-row .reply-demo{padding:28px;background:var(--wash);border-radius:var(--radius)}
.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:38px}
.two-columns h3{margin-bottom:18px}
.two-columns p+p{margin-top:18px}
.example-panel{padding:30px;border:1px solid var(--line);background:white;border-radius:15px}
.example-panel h3{font-size:19px;margin-bottom:24px}
.example-panel dl{margin:0;display:grid;gap:18px}
.example-panel dl>div{display:grid;gap:5px}
.example-panel dt{color:var(--muted);font-size:11px}
.example-panel dd{margin:0;font-size:14px;line-height:1.6}
.example-panel p{font-size:14px}
.example-result{margin-top:22px!important;padding:12px 16px;border-radius:7px;background:var(--accent-soft);color:var(--accent);font-size:12px!important}
.task-list{list-style:none;padding:0}
.task-list li{display:flex;gap:20px;justify-content:space-between;padding-block:17px;font-size:13px;line-height:1.4}
.task-list li+li{border-top:1px solid var(--line)}
.task-list .muted{font-size:11px;flex:none}
.inner-page #download{margin-top:35px;padding:60px 64px}
.faq-list{max-width:920px}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list details:first-child{border-top:1px solid var(--line)}
.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:25px 0;cursor:pointer;list-style:none;font-size:18px;letter-spacing:-.02em;font-weight:500}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:'+';font-size:23px;font-weight:400;color:var(--muted);flex:none}
.faq-list details[open] summary::after{content:'×'}
.faq-list details p{max-width:770px;padding:0 30px 24px 0;font-size:15px}
.faq-list+.text-link{margin-top:30px}
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.plan{padding:30px 24px;background:var(--canvas);border:1px solid var(--line);border-radius:15px;display:flex;align-items:start;flex-direction:column}
.plan:first-child{border-color:#bfcaf2;background:#f0f3fd}
.plan h2{font-size:26px}
.plan-highlights{list-style:none;padding:0;margin:24px 0 30px;display:grid;gap:12px;color:var(--muted);font-size:13px;line-height:1.5}
.plan .button{margin-top:auto;font-size:12px;min-height:42px;padding:10px 16px}
.plan-grid+.fine-print{margin-top:20px}
.table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:15px}
table{border-collapse:collapse;width:100%;min-width:820px;font-size:13px;line-height:1.6;text-align:left}
caption{text-align:left;background:var(--canvas);padding:22px;font-size:15px;font-weight:500}
th,td{padding:18px 22px;border-top:1px solid var(--line);vertical-align:top}
thead th{color:var(--ink);font-weight:500}
tbody th{font-weight:500;width:24%;color:var(--ink)}
td{color:var(--muted);width:19%}
tbody tr:nth-child(even){background:var(--canvas)}
.downloads article{padding:40px;background:var(--canvas);border:1px solid var(--line);border-radius:var(--radius)}
.downloads h2{font-size:30px}
.downloads article>p{margin-top:18px}
.downloads .button{margin-top:30px}
.permission-example{margin-top:20px;border:1px solid var(--line);padding:15px;border-radius:10px;font-size:13px}
.permission-example>span{display:flex;justify-content:space-between;margin-top:14px}
.permission-example strong{font-weight:500}
@media(max-width:1199px){
main>section,.nav-wrap,.footer-main,.footer-bottom{width:calc(100% - 64px)}
.nav-wrap{gap:26px}
.primary-nav{gap:22px}
.steps{gap:24px}
.step-example{padding:14px;gap:8px}
.step-field{font-size:10px;padding:10px}
#download{padding:48px;gap:30px}
#download h2{font-size:39px}
.feature-row{gap:50px}
.plan-grid{gap:14px}
.plan{padding:25px 18px}
.page-intro h1{font-size:52px}
}
@media(max-width:1000px) and (min-width:801px){
.nav-wrap{gap:20px}
.primary-nav{gap:15px}
.primary-nav a{font-size:12px}
.brand{font-size:21px}
.nav-actions .button{padding-inline:12px}
.plan-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:800px){
.site-header{height:72px}
.nav-wrap{gap:20px;justify-content:space-between}
.brand{font-size:22px}
.primary-nav{display:none;position:absolute;top:71px;left:0;right:0;padding:20px 32px 28px;background:white;border-bottom:1px solid var(--line);box-shadow:0 16px 25px #3843620b}
.primary-nav.is-open{display:grid;gap:0}
.primary-nav a{padding:13px 0;font-size:15px}
.nav-actions{gap:10px}
.menu-toggle{display:flex}
main>section{padding-block:70px}
.section-heading{margin-bottom:34px}
.section-heading p{font-size:16px}
.steps{gap:18px}
.steps h3{font-size:20px}
.steps p{font-size:13px}
.step-example{height:100px;padding:10px;gap:5px}
.step-field{font-size:9px;padding:9px 7px;white-space:normal}
.options{gap:5px}
.options>span{padding:8px 5px;font-size:10px}
#download,.inner-page #download{padding:40px;gap:18px;grid-template-columns:1fr}
#download h2{font-size:40px}
.footer-main{gap:35px;grid-template-columns:1.5fr 1fr 1fr}
.footer-main p{font-size:13px}
.page-intro h1{font-size:48px}
.feature-row{gap:36px}
.feature-row h2{font-size:33px}
.feature-row>div>p{font-size:15px}
.feature-row .reply-demo,.feature-row>figure:not(.reply-demo){padding:20px}
.feature-row{grid-template-columns:1fr}
.feature-row>div>p{max-width:610px}
.feature-row .reply-demo{max-width:650px}
.feature-row>figure:not(.reply-demo){max-width:650px}
.plan-grid{grid-template-columns:1fr 1fr;gap:20px}
.downloads{grid-template-columns:1fr}
.downloads article{padding:30px}
.two-columns{gap:24px}
.two-columns h3{font-size:20px}
.two-columns p{font-size:14px}
}
@media(max-width:600px){
main>section,.nav-wrap,.footer-main,.footer-bottom{width:calc(100% - 40px)}
.site-header{height:68px}
.nav-wrap{gap:12px}
.brand{gap:7px;font-size:20px;letter-spacing:-.7px}
.nav-actions{gap:7px}
.nav-actions .button{font-size:11px;min-height:36px;padding:9px 11px;border-radius:8px}
.menu-toggle{width:30px;height:38px}
.primary-nav{top:67px;padding-inline:20px}
h1{font-size:37px}
h2{font-size:30px;line-height:1.17}
h3{font-size:22px}
main>section{padding-block:55px}
section,article[id]{scroll-margin-top:88px}
.section-heading{margin-bottom:30px}
.section-heading p{margin-top:17px;font-size:15px}
.reply-context{font-size:11px;margin:0 0 9px 7px}
figcaption{font-size:10px;margin-top:12px}
.steps{grid-template-columns:1fr;gap:30px}
.steps>li{position:relative;padding-left:33px}
.step-number{position:absolute;left:0;top:0;font-size:11px}
.step-example{height:94px;padding:18px;gap:14px}
.step-field{font-size:11px;padding:11px}
.options>span{font-size:11px;padding:12px}
.steps h3{font-size:21px;margin:18px 0 10px}
.steps p{font-size:14px}
.person>span{font-size:10px;margin-top:6px}
#stories>.fine-print{font-size:11px}
#download,.inner-page #download{padding:33px 24px;margin-block:0 55px;border-radius:18px}
#download h2{font-size:30px}
#download p{font-size:14px;margin-top:19px}
#download .actions{gap:16px;margin-top:24px}
#download .button{font-size:12px;padding:12px 17px;min-height:44px}
#download .muted{font-size:10px}
#download .fine-print{font-size:11px}
.footer-main{grid-template-columns:1fr 1fr;gap:36px 25px;padding-bottom:40px}
.footer-main>div{grid-column:1/-1}
.footer-main p{max-width:310px;font-size:13px;margin-top:15px}
.footer-main nav{gap:13px}
.footer-main nav a{font-size:12px}
.footer-main h2{font-size:12px;margin-bottom:3px}
footer{padding-top:42px}
.footer-bottom{font-size:11px;padding-block:20px}
.inner-page main>section{padding-block:48px}
.inner-page .page-intro{padding-block:42px 39px}
.page-intro h1{font-size:34px;max-width:100%;line-height:1.1}
.page-intro .lead{font-size:16px;margin-top:22px}
.feature-row{gap:28px}
.feature-row h2{font-size:30px}
.feature-row .reply-demo,.feature-row>figure:not(.reply-demo){padding:18px 12px}
.example-panel{padding:22px}
.example-panel h3{font-size:19px}
.feature-row>div>p{font-size:15px;margin-top:18px}
.two-columns{grid-template-columns:1fr}
.two-columns h3{font-size:21px}
.two-columns p{font-size:15px}
.faq-list summary{font-size:17px;padding-block:22px}
.faq-list details p{font-size:14px;padding-right:10px}
.plan-grid{grid-template-columns:1fr}
.plan{padding:28px}
.plan h2{font-size:28px}
.plan-highlights{font-size:14px;margin-block:22px 26px}
.plan .button{font-size:13px}
.downloads article{padding:26px}
.downloads h2{font-size:27px}
.downloads .button{font-size:12px;padding-inline:15px}
.downloads article>p{font-size:15px}
.downloads .fine-print{font-size:12px}
.permission-example{max-width:310px}
.task-list li{gap:12px;font-size:12px}
.task-list .muted{font-size:10px}
}
@media(max-width:359px){
main>section,.nav-wrap,.footer-main,.footer-bottom{width:calc(100% - 32px)}
.brand{font-size:18px;gap:6px}
.nav-actions .button{font-size:10px;padding-inline:9px}
.nav-actions{gap:4px}
.menu-toggle{width:25px}
h2{font-size:26px}
.section-heading p{font-size:14px}
.page-intro h1{font-size:29px}
#download h2{font-size:26px}
#download .actions{gap:12px}
#download .muted{font-size:9px}
.downloads .button{font-size:11px}
}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}

/* Homepage: one continuous introduction and App demonstration. */
@font-face{font-family:'Gaegu';src:url('/assets/fonts/gaegu-regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
.home-page{
 --section-space:100px;
 --gradient-cool:radial-gradient(ellipse at 53% 32%,#f5f8ed 0%,#ecf2e2 12%,transparent 55%),radial-gradient(ellipse at 6% 100%,#839feb 0%,transparent 57%),radial-gradient(ellipse at 95% 72%,#b1d9c1 0%,transparent 55%),linear-gradient(130deg,#d1deed,#c5d9f5 52%,#dce8cb);
 --gradient-light:radial-gradient(ellipse at 72% 16%,#f5f7ea 0%,transparent 60%),radial-gradient(ellipse at 14% 91%,#a1c9da 0%,transparent 58%),linear-gradient(130deg,#c3d4f2,#d8e7e8 50%,#d5daf2);
}
.home-page main>section{padding-block:var(--section-space);border-top:0}
.home-page .section-heading{max-width:960px;margin-bottom:56px}
.home-page .section-heading h2{font-size:54px;line-height:1.08;letter-spacing:-.05em}
.home-page .section-heading p{font-size:18px;max-width:680px;margin-top:24px}
.home-page main>.home-intro{padding-block:36px 24px;text-align:center}
.home-intro h1{font-size:55px;line-height:1.06;letter-spacing:-.055em;max-width:920px;margin:auto}
.home-intro>p{font-size:17px;line-height:1.55;max-width:735px;margin:18px auto 0}
.home-intro .actions{justify-content:center;margin-top:22px}
.home-intro .button{min-height:44px;padding-block:12px}
.home-page main>.app-demo-section{width:100%;max-width:none;padding-block:16px 50px;--scene-width:1200px;--ui-left:305px;--ui-top:737px;--ui-width:480px}
.canvas-viewport{display:flex;align-items:stretch;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:max(48px,calc((100vw - var(--content))/2));padding-inline:max(48px,calc((100vw - var(--content))/2));scrollbar-width:none;cursor:grab;background:#fff}
.canvas-viewport::-webkit-scrollbar{display:none}
.canvas-viewport.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.app-panel{display:flex;flex:0 0 var(--scene-width);min-width:0;scroll-snap-align:start}
.app-stage{position:relative;isolation:isolate;width:100%;min-height:1200px;padding:0;background:#edf0f4}
.memory-art::before,.learning-example::before,.sending-example::before{content:'';position:absolute;inset:0;border-radius:inherit;background:url('/assets/gradient-grain.svg');opacity:.16;z-index:-1;pointer-events:none}
.app-backdrop{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:#edf0f4}
.app-backdrop::after{content:'';position:absolute;inset:0;background:#f5f7f526}
.native-window{position:absolute;inset:-8px;display:grid;grid-template-columns:242px 1fr;grid-template-rows:48px 1fr;filter:saturate(.9);transform:scale(1.015);font-family:Arial,sans-serif;font-size:13px;line-height:1.4;color:#30323b;background:#fff}
.native-icon{display:block;width:18px;height:18px;flex:none}
.native-avatar{display:block;width:38px;height:38px;flex:none;object-fit:contain;border-radius:50%;background:#fff;border:1px solid #dde2dd;padding:2px}
.native-tools{display:flex;align-items:center;gap:20px;color:inherit;flex:none}
.native-topbar{grid-column:1/-1;display:flex;align-items:center;gap:20px;padding:8px 22px;background:#431748;color:#fff;min-width:0}
.backdrop-search{display:flex;align-items:center;gap:12px;min-width:0;border-radius:7px;background:#ffffff24;padding:7px 12px;font-size:13px}
.backdrop-search>span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.backdrop-search>.native-icon{width:16px;height:16px}
.native-topbar .backdrop-search{width:min(560px,54%)}
.native-sidebar{grid-row:2;min-width:0;overflow:hidden;display:flex;background:#f2eaf3;color:#493d4b}
.native-sidebar-content{flex:1;min-width:0;padding:14px 12px}
.native-rail{width:48px;flex:none;display:flex;flex-direction:column;align-items:center;gap:24px;padding:12px 5px;background:#431748;color:#f5ecf6}
.native-rail>span{display:flex;flex-direction:column;align-items:center;gap:4px;width:38px;padding:5px 0;border-radius:8px}
.native-rail .selected{background:#ffffff2b}
.native-rail small{font-size:9px}
.native-rail .native-rail-bottom{margin-top:auto;gap:22px;padding-bottom:14px}
.native-rail .native-avatar{width:30px;height:30px;border-radius:6px}
.native-workspace{display:flex;align-items:center;gap:6px;min-height:34px;margin-bottom:16px;font-size:17px;color:#25242a}
.native-workspace>.native-icon:last-child{margin-left:auto}
.native-workspace>.native-tools{margin-left:auto}
.native-nav-item{display:flex;align-items:center;gap:9px;padding:6px 8px;min-height:30px;white-space:nowrap;border-radius:5px}
.native-nav-item small{margin-left:auto;font-size:11px}
.native-list-title{display:flex;align-items:center;gap:7px;margin:22px 4px 7px;font-size:12px;font-weight:400}
.native-list-title>.native-icon{width:14px;height:14px}
.native-list-title>.native-icon:last-child{margin-left:auto}
.native-slack-brand{display:flex;align-items:center;gap:8px;width:calc(var(--app-sidebar,242px) - 42px);flex:none;font-size:16px;font-weight:600}
.native-slack-brand img{width:20px;height:20px;filter:brightness(0) invert(1)}
.native-slack-contact .native-avatar{width:24px;height:24px;border-radius:5px;padding:1px}
.native-presence{position:relative;flex:none}
.native-presence::after{content:'';position:absolute;right:-2px;bottom:-1px;width:7px;height:7px;border-radius:50%;background:#318465;border:1.5px solid #f2eaf3}
.slack-backdrop .native-slack-contact.selected{background:#743e7b;color:#fff}
.native-main{min-width:0;position:relative;background:#fff}
.native-main>header{height:60px;border-bottom:1px solid #e4e6eb;display:flex;align-items:center;gap:9px;padding:12px var(--app-inset,36px);font-size:17px}
.native-main>header>.native-tools{margin-left:auto;color:#5b6268}
.slack-backdrop .native-main>header .native-avatar{width:30px;height:30px;border-radius:6px}
.native-chat-tabs{display:flex;align-items:center;gap:25px;height:35px;padding:0 var(--app-inset,36px);border-bottom:1px solid #eee;font-size:12px;color:#6b6570}
.native-chat-tabs>span:first-child{height:100%;display:flex;align-items:center;border-bottom:2px solid #743e7b;color:#333}
.native-chat-tabs>.native-icon{width:14px;height:14px}
.native-chat{padding:9px var(--app-inset,36px);position:relative;height:calc(100% - 60px)}
.native-day{display:flex;align-items:center;gap:8px;width:max-content;margin:0 auto;padding:3px 13px;border:1px solid #e2e2e2;border-radius:20px;font-size:11px;color:#62666a;background:#fff}
.native-day>.native-icon{width:12px;height:12px}
.native-input{position:absolute;left:32px;right:32px;bottom:36px;height:48px;border:1px solid #cdd4d0;border-radius:15px;padding:12px 14px;color:#737983;background:#fff}
.native-mobile-brand{display:none}
.whatsapp-backdrop{grid-template-columns:300px 1fr;grid-template-rows:1fr;background:#f1ede5}
.whatsapp-backdrop .native-sidebar{grid-row:1;background:#fff;color:#17251d;border-right:1px solid #dce1df}
.whatsapp-backdrop .native-rail{width:44px;padding-top:20px;background:#f0f2f1;color:#5a6962;gap:22px;border-right:1px solid #e0e5e2}
.whatsapp-backdrop .native-rail .selected{background:#d7e5dc;color:#176a43}
.whatsapp-backdrop .native-rail small{display:none}
.whatsapp-backdrop .native-rail .native-avatar{border-radius:50%}
.whatsapp-backdrop .native-sidebar-content{padding:16px 10px}
.native-whatsapp-brand{display:flex;align-items:center;gap:7px;color:#087e50;font-size:16px;font-weight:600;margin:0 4px 14px}
.native-whatsapp-brand img,.native-mobile-brand img{width:21px;height:21px}
.whatsapp-backdrop .native-workspace{font-size:21px;margin:0 5px 12px;min-height:28px}
.whatsapp-backdrop .native-workspace .native-tools{gap:16px}
.whatsapp-backdrop .backdrop-search{border-radius:9px;background:#f0f2f1;font-size:11px;padding:9px 10px;gap:8px}
.whatsapp-backdrop .backdrop-search>.native-icon:last-child{display:none}
.native-filters{display:flex;gap:6px;margin:12px 0;color:#68736d;font-size:11px}
.native-filters>span{padding:5px 10px;background:#f1f3f2;border-radius:18px}
.native-filters>.selected{background:#d9f6e4;color:#116d46}
.native-archived{display:flex;align-items:center;gap:16px;margin:5px 6px 9px;padding:8px 2px;font-size:12px}
.native-archived>.native-icon{color:#16875d}
.native-archived>small{margin-left:auto;color:#16875d;font-size:11px}
.native-contact{display:flex;align-items:center;gap:10px;padding:13px 8px;min-height:72px;border-radius:8px}
.native-contact.selected{background:#e8eeeb}
.native-contact .native-avatar{width:40px;height:40px}
.native-contact-copy{flex:1;min-width:0}
.native-contact-copy>div{display:flex;align-items:center;gap:6px;min-width:0}
.native-contact-copy>div+div{margin-top:6px}
.native-contact-copy b{font-size:13px;font-weight:500}
.native-contact-copy time{margin-left:auto;white-space:nowrap;font-size:9px;color:#758079}
.native-contact-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:11px;color:#69756e}
.native-contact-copy span>.native-icon{display:inline-block;width:14px;height:14px;vertical-align:middle;margin-right:3px;color:#54add0}
.native-contact-copy .native-unread{flex:none;margin-left:auto;min-width:17px;height:17px;border-radius:50%;background:#25b56b;color:#fff;text-align:center;font-size:10px;line-height:17px}
.native-contact.selected time{color:#17834f}
.whatsapp-backdrop .native-main{background:#f1ede5 url('/assets/apps/whatsapp-wallpaper.svg') repeat}
.whatsapp-backdrop .native-main>header{height:72px;background:#f8faf9;border-color:#dfe4df}
.native-contact-heading{display:flex;flex-direction:column;gap:3px}
.native-contact-heading strong{font-size:15px;font-weight:500}
.native-contact-heading small{font-size:11px;font-weight:400;color:#6b776f}
.whatsapp-backdrop .native-chat{padding-top:14px}
.whatsapp-backdrop .native-day{border:0;border-radius:7px;padding:5px 12px;box-shadow:0 1px 2px #20382912;color:#68736b}
.gmail-backdrop{background:#f2f6fc;grid-template-columns:230px 1fr;grid-template-rows:64px 1fr}
.gmail-backdrop .native-topbar{background:#f2f6fc;color:#4a5159;gap:20px;padding:10px 22px}
.gmail-backdrop .native-topbar>strong{display:flex;align-items:center;gap:14px;font-size:22px;font-weight:400;width:calc(var(--app-sidebar,230px) - 42px);flex:none}
.gmail-backdrop .native-topbar img:not(.native-avatar){width:28px;height:28px}
.gmail-backdrop .native-topbar>.native-avatar{margin-left:0;width:32px;height:32px}
.gmail-backdrop .native-topbar>.native-tools{margin-left:auto}
.gmail-backdrop .backdrop-search{background:#e5ecf7;padding:12px 18px;border-radius:25px;flex:1;max-width:600px}
.gmail-backdrop .native-sidebar{display:flex;flex-direction:column;background:#f2f6fc;color:#454c57;padding:8px 14px 0 0;gap:0}
.native-compose{display:flex;align-items:center;gap:14px;align-self:flex-start;margin:0 0 20px 12px;background:#c4e5ff;border-radius:16px;padding:18px 21px;font-size:14px;font-weight:500}
.gmail-backdrop .native-nav-item{padding:7px 16px 7px 24px;gap:17px;border-radius:0 22px 22px 0;font-size:13px}
.gmail-backdrop .native-sidebar>.selected{background:#d3e2fb;color:#223751;font-weight:600}
.gmail-backdrop .native-list-title{font-size:14px;margin:30px 10px 10px 24px}
.gmail-backdrop .native-main{margin-right:14px;border-radius:17px 17px 0 0}
.gmail-backdrop .native-main>header{height:46px;border:0;font-size:12px;padding:12px var(--app-inset,36px)}
.gmail-backdrop .native-main>header>.native-tools{margin-left:0;gap:24px}
.native-mail-count{margin-left:auto;font-size:11px;color:#6a747c}
.native-mail{padding:18px var(--app-inset,36px)}
.native-mail h3{font-family:Arial,sans-serif;font-size:22px;font-weight:400;line-height:1.3;color:#42474c;margin:0;letter-spacing:0}
.native-mail h3>span{display:inline-block;vertical-align:middle;margin-left:10px;padding:1px 5px;border-radius:3px;background:#e9ebed;font-size:10px;color:#62676d}
.native-mail-meta{position:absolute;top:var(--message-top);right:var(--app-inset);display:flex;align-items:center;gap:18px;font-size:11px;color:#7a8188;padding-top:9px}
@media(min-width:901px) and (max-height:800px){
 .gmail-backdrop .native-main>header{justify-content:flex-end}
 .gmail-backdrop .native-main>header>.native-tools{gap:16px}
 .gmail-backdrop .native-main>header>.native-tools .native-icon:nth-child(n+4){display:none}
 .gmail-backdrop .native-mail-count{display:none}
 .gmail-backdrop .native-mail h3{position:absolute;top:77px;left:calc(var(--app-sidebar) + var(--app-inset));font-size:18px}
}
@media(max-width:1199px) and (min-width:761px){
 .native-rail{display:none}
 .native-sidebar-content{padding-inline:10px}
 .native-topbar>.native-tools{display:none}
 .native-contact{padding-inline:4px;gap:7px}
 .native-contact .native-avatar{width:32px;height:32px}
 .native-contact-copy time{font-size:8px}
 .native-filters{gap:4px}
 .native-filters>span{padding-inline:8px}
 .native-mail h3{font-size:19px}
 .native-mail-meta{gap:10px}
 .gmail-backdrop .native-main>header>.native-tools{gap:17px}
}
@media(max-width:900px) and (min-width:761px){
 .native-workspace{font-size:14px}
 .native-workspace>.native-icon:last-child{display:none}
 .native-whatsapp-brand{font-size:13px;gap:4px;margin-inline:0}
 .native-whatsapp-brand img{width:18px;height:18px}
 .native-contact-copy time{display:none}
 .native-filters>span{padding:4px 7px;font-size:10px}
 .native-filters>span:last-child{display:none}
 .whatsapp-backdrop .native-workspace .native-icon:last-child{display:none}
 .gmail-backdrop .native-topbar>strong{gap:7px;font-size:18px}
 .gmail-backdrop .native-topbar>strong>.native-icon{display:none}
 .native-compose{gap:8px;padding:15px 12px;font-size:12px}
 .gmail-backdrop .native-nav-item{padding-left:16px;gap:12px}
}
@media(max-width:760px){
 .native-topbar{padding:8px 20px;gap:12px}
 .native-topbar>.native-tools{display:none}
 .native-slack-brand{width:auto;font-size:15px}
 .native-topbar .backdrop-search{width:auto;flex:1;font-size:11px;padding:5px 9px}
 .native-main>header{padding:8px 20px;font-size:15px}
 .native-main>header>.native-tools{gap:15px}
 .native-main>header .native-avatar{width:28px;height:28px}
 .native-chat-tabs,.native-day{display:none}
 .native-mobile-brand{display:flex;height:48px;align-items:center;gap:8px;padding:0 20px;background:#fff;color:#087e50;font-size:17px;font-weight:600}
 .whatsapp-backdrop{background:#f1ede5 url('/assets/apps/whatsapp-wallpaper.svg') repeat}
 .whatsapp-backdrop .native-main{background:transparent}
 .native-contact-heading{gap:0}
 .native-contact-heading strong{font-size:14px}
 .native-contact-heading small{font-size:10px}
 .whatsapp-backdrop .native-main>header>.native-tools .native-icon:nth-child(3){display:none}
 .gmail-backdrop .native-topbar{padding:8px 20px;gap:14px}
 .gmail-backdrop .native-topbar>strong{width:auto;gap:9px;font-size:19px}
 .gmail-backdrop .native-topbar img:not(.native-avatar){width:25px;height:25px}
 .gmail-backdrop .native-topbar>.native-tools,.gmail-backdrop .native-topbar>.native-avatar{display:none}
 .gmail-backdrop .native-topbar .backdrop-search>.native-icon:last-child{display:none}
 .gmail-backdrop{background:#fff}
 .gmail-backdrop .native-main{margin:0;border-radius:0}
 .gmail-backdrop .native-main>header>.native-tools{gap:19px}
 .gmail-backdrop .native-main>header>.native-tools>.native-icon:nth-child(n+5){display:none}
 .gmail-backdrop .native-mail{padding:0 20px}
 .native-mail h3{font-size:17px;line-height:24px;white-space:nowrap}
 .native-mail h3>span,.native-mail-meta{display:none}
}
.story-left{display:contents}
.message-note{position:absolute;left:923px;top:260px;width:255px;z-index:3;transform:rotate(-8deg)}
.message-identity{display:flex;align-items:center;gap:12px;margin-bottom:12px;min-height:44px}
.message-identity .demo-portrait{width:44px;height:44px;object-fit:contain;background:#fff;border:1px solid #e1e5e6;border-radius:50%;padding:2px}
.message-identity strong{display:block;font-size:14px;font-weight:600;color:#30363f;line-height:1.3}
.message-identity span{display:block;font-size:11px;color:#5b6574;margin-top:4px;line-height:1.3}
[data-app=slack] .message-note .message-identity strong,[data-app=slack] .message-note .message-identity span{color:#252a36}
.received-message,.history-message{padding:21px 23px;background:#fff;border:1px solid #e0e4e7;border-radius:4px 19px 19px 19px;box-shadow:0 10px 26px -16px #34415060}
.message-note .received-message{position:relative;padding:24px 19px 22px 54px}.received-message p{font-size:15px;line-height:1.55;color:#313943}
.demo-reply-field{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-height:34px;margin-top:12px;padding:0;background:transparent;font-size:11px;color:#647185}
.message-note .received-message::after{content:'';position:absolute;left:24px;top:-17px;width:14px;height:46px;border:2px solid #818780;border-radius:9px;box-shadow:inset 1px 0 #fff,1px 0 #f9faf6,2px 3px 2px #28342830;transform:rotate(8deg);pointer-events:none}
.message-note .received-message::before{content:'';position:absolute;left:29px;top:-12px;width:7px;height:32px;border:2px solid #a3a79e;border-bottom:0;border-radius:6px 6px 0 0;transform:rotate(8deg);pointer-events:none}
.trigger-object{position:absolute;left:214px;top:568px;width:134px;min-height:36px;display:flex;justify-content:center;margin:0;z-index:5}
.demo-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:8px 12px;border:1px solid #c8cec4;border-radius:6px;background:#fcfcf6;color:#465341;font-size:12px;font-weight:500;white-space:nowrap;box-shadow:0 2px 3px #2630210c}
.demo-trigger:hover{background:#edf1e7;border-color:#849379}
.demo-trigger:active{background:#e3e9dc}
.step-draft-label{font-size:11px;white-space:nowrap;color:var(--muted);border:1px solid #d1d7df;border-radius:5px;padding:5px 7px}
.app-demo-section [data-action]{scroll-margin-block:100px 24px;scroll-margin-inline:20px}
.story-right{display:block;position:static;padding:var(--ui-top) 0 148px var(--ui-left);min-width:0}
.story-result{scroll-margin-block:100px 24px;scroll-margin-inline:20px;position:relative;width:var(--ui-width);min-height:205px;margin:0;z-index:5}
.context-progress{display:flex;align-items:center;gap:10px;min-height:48px;margin-top:12px;font-size:12px;color:var(--accent)}
.context-spinner{width:13px;height:13px;flex:none;border:2px solid #dce3fc;border-top-color:var(--accent);border-radius:50%;animation:context-turn .75s linear infinite;animation-play-state:paused}
.app-demo-section.is-playing .context-spinner{animation-play-state:running}
.history-excerpt{left:413px;top:600px;width:207px;transform:rotate(7deg)}
.history-excerpt .message-identity .demo-portrait{width:30px;height:30px}
.history-excerpt .message-identity{min-height:30px;gap:9px;margin-bottom:9px}.history-excerpt .message-identity strong{font-size:12px}.history-excerpt .message-identity span{font-size:9px}
.history-message{padding:17px}
.history-message p{font-size:14px;line-height:1.45}
.stage-draft{margin:0;animation:reply-enter .45s cubic-bezier(.2,.7,.2,1) both}
.draft-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:20px}
.draft-actions button{padding:8px 2px;border:0;background:transparent;color:#4e5d82;font-size:12px;line-height:1.4;border-radius:6px}
.draft-actions button:hover{color:var(--accent);background:#f4f6fc}
.draft-actions .demo-action,.demo-action{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border:1px solid var(--accent);border-radius:7px;background:var(--accent);color:#fff;font-size:12px;line-height:1.4;min-height:38px}
.draft-actions .demo-action:hover,.demo-action:hover{background:#3047b8;color:#fff}
.draft-actions button:disabled{color:#8a919f;background:transparent;cursor:default}
.spanish-editor{margin-top:20px}
.spanish-editor label{display:block;font-size:13px;margin-bottom:10px}
.spanish-editor textarea{display:block;width:100%;padding:15px;border:1px solid #bdc8e9;border-radius:7px;color:var(--ink);background:#fff;resize:vertical;min-height:150px;font-size:15px;line-height:1.65}
.send-review,.invite-review{border-top:1px solid var(--line);padding-top:24px;margin-top:26px}
.send-review h3,.invite-review h3{font-size:19px;margin-bottom:15px}
.reviewed-reply{font-size:15px;line-height:1.7;color:#47536a}
.followup-conversation{margin-top:28px;border-top:1px solid var(--line);padding-top:24px}
.sent-reply{max-width:650px;margin-left:auto;background:#f0f3fb;padding:18px 22px;border-radius:12px 12px 3px 12px}
.sent-reply p{font-size:15px;color:var(--ink);line-height:1.65}
.sent-label{display:block;text-align:right;font-size:10px;color:#717e94;margin-top:12px}
.sam-response{margin:25px 0 18px}.sam-response .message-identity .demo-portrait{width:32px;height:32px}.sam-response .message-identity{min-height:32px;margin-bottom:10px}
.sam-response p{display:inline-block;font-size:16px;color:var(--ink);padding:12px 18px;background:#f1f3f5;border-radius:10px 10px 10px 3px}
.calendar-trigger-row{display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:12px;color:var(--muted);border-top:1px solid #e7ebf2;padding-top:16px}
.calendar-card{display:grid;grid-template-columns:46px 1fr auto;align-items:center;gap:18px;margin-top:25px;border:1px solid #dce2ef;border-radius:10px;padding:22px;background:#f6f8fc}
.calendar-glyph{display:grid;place-items:center;align-self:start;width:42px;height:46px;border:1px solid #c5cee2;border-top:8px solid #96a6d5;border-radius:6px;background:#fff;font-size:18px;font-weight:500;color:#455481}
.calendar-card h3{font-size:18px;margin:0 0 9px;letter-spacing:-.02em}
.calendar-card p{font-size:12px;line-height:1.6}
.invite-review dl{margin:0;display:grid;gap:15px}
.invite-review dl>div{display:grid;grid-template-columns:100px 1fr;gap:20px;font-size:13px;line-height:1.5}
.invite-review dt{color:var(--muted)}
.invite-review dd{margin:0;color:var(--ink)}
.calendar-added{padding:20px 0 0;color:#355b4c;font-size:16px}
.calendar-added>span{display:inline-grid;place-items:center;background:#edf5ef;border-radius:50%;width:26px;height:26px;margin-right:6px}
.calendar-added small{display:block;margin:8px 0 0 36px;font-size:11px;color:var(--muted)}
.outline-label{display:block;font-size:9px;letter-spacing:.025em;color:#626b5b;margin-bottom:15px}
.value-payoff{position:absolute;left:897px;top:935px;z-index:5;text-align:left;width:268px;margin:0;animation:payoff-enter .4s ease-out both}
.value-payoff>span{display:none}
.value-payoff p{font-family:Gaegu,monospace;font-size:25px;line-height:1.02;letter-spacing:0;color:#252c23;margin:0;text-wrap:pretty}
/* Each conversation surrounds the same fixed composer with its own arrangement. */
.app-panel:not([data-app=slack]) .received-message::before,.app-panel:not([data-app=slack]) .received-message::after{content:none}
.app-panel[data-app=whatsapp] .message-note{left:69px;top:430px;width:min(322px,calc(100vw - 40px));transform:rotate(-4deg)}
.app-panel[data-app=whatsapp] .received-message{padding:23px 25px;background:#f1f7ef;border-color:#d8e4d3;border-radius:20px 20px 20px 4px}
.app-panel[data-app=whatsapp] .received-message p{font-size:17px;line-height:1.5}
.app-panel[data-app=whatsapp] .trigger-object{left:210px;top:647px}
.app-panel[data-app=whatsapp] .value-payoff{left:889px;top:936px}
.app-panel[data-app=gmail] .message-note{left:291px;top:283px;width:min(365px,calc(100vw - 40px));transform:rotate(-5deg)}
.app-panel[data-app=gmail] .received-message{padding:24px 27px;border-radius:4px 4px 22px 22px}
.app-panel[data-app=gmail] .received-message p{font-size:17px;line-height:1.55}
.app-panel[data-app=gmail] .trigger-object{left:173px;top:683px}
.app-panel[data-app=gmail] .value-payoff{left:891px;top:913px}
/* Restore the collage; motion controls its visual density. */
.app-panel[data-app] .message-note{left:52px;top:270px;width:min(322px,calc(100vw - 40px));transform:none}
.app-panel[data-app] .message-note .received-message{padding:22px 24px}
.app-panel[data-app] .message-note .received-message::before,.app-panel[data-app] .message-note .received-message::after{content:none}
.app-panel[data-app] .trigger-object{left:72px;top:515px}
.app-panel[data-app] .story-result{padding-top:0}
.stage-draft,.value-payoff{animation:none}
.case-motion .message-note,.case-motion .trigger-object,.case-motion .story-result,.case-motion .value-payoff{visibility:hidden}
@keyframes note-enter{from{transform:translateY(8px)}to{transform:translateY(0)}}
@keyframes reply-enter{from{transform:translateY(14px)}to{transform:translateY(0)}}
@keyframes context-turn{to{transform:rotate(360deg)}}
@keyframes payoff-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.home-page #how-it-works .section-heading h2{font-size:44px}
.home-page .step-example{border-radius:8px}
.memory-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center}
.memory-art{padding:40px;background:var(--gradient-light);border-radius:9px;isolation:isolate;position:relative}
.memory-sheet{background:#fff;border:1px solid #dde3ee;border-radius:12px;padding:30px;box-shadow:0 18px 35px -18px #354b7440}
.memory-sheet h3{font-size:24px;line-height:1.25;max-width:320px}
.memory-sheet dl{margin:25px 0 0}
.memory-sheet dl>div{display:grid;grid-template-columns:85px 1fr;gap:18px;border-top:1px solid #e7eaf0;padding:16px 0;font-size:12px;line-height:1.6}
.memory-sheet dt{font-weight:500;color:#465783}
.memory-sheet dd{margin:0;color:var(--muted)}
.memory-people{display:flex;gap:12px;margin-top:12px}
.memory-people .person{width:40px}
.memory-copy article+article{margin-top:34px}
.memory-copy h3{font-size:26px;line-height:1.2;margin-bottom:16px}
.memory-copy p{font-size:17px;line-height:1.75;max-width:460px}
.memory-copy>.text-link{margin-top:30px}
.memory-copy .memory-apps{font-size:12px;margin-top:22px}
.trust-scenes{display:grid;grid-template-columns:1fr 1.2fr;gap:38px;align-items:start}
.trust-scenes article{min-width:0}
.learning-example,.sending-example{height:300px;padding:35px;display:flex;align-items:center;justify-content:center;background:var(--gradient-light);border-radius:9px;position:relative;isolation:isolate}
.sending-example{background:var(--gradient-cool);padding:24px}
.trust-scenes h3{font-size:25px;line-height:1.2;margin:30px 0 16px}
.trust-scenes article>p{font-size:16px;max-width:535px}
.privacy-foot{display:flex;justify-content:space-between;align-items:center;gap:45px;margin-top:42px}
.privacy-foot p{font-size:13px}
.privacy-foot .text-link{flex:none}
.home-faq{display:grid;grid-template-columns:1fr 1.2fr;align-items:start;column-gap:80px}
.home-page .home-faq .section-heading{margin-bottom:0}
.home-page .home-faq .section-heading h2{font-size:40px;max-width:400px}
.home-faq>.text-link{grid-column:2;margin-top:26px}
.home-page #download{display:block;text-align:center;padding:70px 40px;margin-block:30px 100px;border-radius:9px;background:var(--wash)}
.home-page #download h2{font-size:52px;max-width:850px;margin-inline:auto;line-height:1.08}
.home-page #download p{margin-inline:auto}
.home-page #download .actions{justify-content:center}
@media(max-width:1199px){
 .home-page{--section-space:82px}
 .home-page .section-heading h2{font-size:48px}
 .home-intro h1{font-size:50px}
 .memory-layout{gap:48px}
 .memory-art{padding:28px}
 .memory-sheet{padding:25px}
 .memory-copy p{font-size:16px}
 .trust-scenes{gap:26px}
 .learning-example,.sending-example{padding:24px}
 .sending-example{padding:18px}
 .home-faq{column-gap:48px}
}
@media(max-width:800px){
 .home-page{--section-space:72px}
 .home-page .section-heading{margin-bottom:44px}
 .home-page .section-heading h2{font-size:42px}
 .home-page .section-heading p{font-size:16px}
 .home-intro h1{font-size:46px}
 .home-intro>p{font-size:16px;max-width:660px}
 .memory-layout{grid-template-columns:1fr;gap:38px}
 .memory-art{max-width:650px;width:100%;padding:36px}
 .memory-copy{display:grid;grid-template-columns:1fr 1fr;gap:28px}
 .memory-copy article+article{margin-top:0}
 .memory-copy>.text-link,.memory-copy .memory-apps{margin-top:0}
 .memory-copy h3{font-size:24px}
 .trust-scenes{grid-template-columns:1fr 1fr;gap:24px}
 .learning-example,.sending-example{height:290px;padding:20px}
 .sending-example{padding:14px}
 .trust-scenes h3{font-size:22px}
 .trust-scenes article>p{font-size:14px}
 .privacy-foot{align-items:flex-start;gap:30px}
 .privacy-foot p,.privacy-foot .text-link{font-size:12px}
 .home-faq{grid-template-columns:1fr;gap:30px}
 .home-faq>.text-link{grid-column:1;margin-top:0}
}
@media(max-width:600px){
 .home-page{--section-space:60px}
 .home-page .section-heading{margin-bottom:36px}
 .home-page .section-heading h2{font-size:33px}
 .home-page .section-heading p{font-size:15px;margin-top:22px}
 .home-page main>.home-intro{padding-block:30px 22px;text-align:left}
 .home-intro h1{font-size:36px}
 .home-intro>p{font-size:15px;line-height:1.65;margin-top:18px}
 .home-intro .actions{justify-content:flex-start;gap:18px}
 .home-intro .button,.home-intro .text-link{font-size:12px}
 .home-intro .button{padding-inline:15px}
 .home-page #how-it-works .section-heading h2{font-size:31px}
 .memory-art{padding:23px 16px}
 .memory-sheet{padding:23px 20px}
 .memory-sheet h3{font-size:23px}
 .memory-sheet dl>div{grid-template-columns:70px 1fr;gap:12px;font-size:12px}
 .memory-people{gap:8px}
 .memory-people .person{width:35px}
 .memory-copy{grid-template-columns:1fr;gap:28px}
 .memory-copy p{font-size:15px}
 .trust-scenes{grid-template-columns:1fr;gap:46px}
 .learning-example,.sending-example{height:auto;min-height:245px;padding:27px;border-radius:7px}
 .sending-example{padding:28px 13px}
 .trust-scenes h3{font-size:24px;margin-top:26px;margin-bottom:16px}
 .trust-scenes article>p{font-size:15px}
 .privacy-foot{display:grid;gap:20px;margin-top:32px}
 .home-page .home-faq .section-heading h2{font-size:31px}
 .home-page #download{padding:46px 24px;margin-block:24px 60px;border-radius:7px;text-align:left}
 .home-page #download h2{font-size:31px}
 .home-page #download .actions{justify-content:flex-start}
}
@media(max-width:359px){
 .home-intro h1{font-size:30px}
 .home-intro .actions{gap:12px}
 .home-intro .button,.home-intro .text-link{font-size:11px}
 .home-intro .button{padding-inline:12px}
 .memory-people .person{width:30px}
 .home-page .section-heading h2{font-size:28px}
 .home-page #how-it-works .section-heading h2{font-size:27px}
 .home-page #download h2{font-size:26px}
}

/* The scene keeps its reference coordinates; narrow screens pan across it. */
@media(max-width:800px){
 .canvas-viewport{padding-inline:20px;scroll-padding-inline:20px}
}
@media(max-width:600px){
 .home-page main>.app-demo-section{--ui-width:min(480px,calc(100vw - 40px));padding-block:8px 32px}
 .app-panel[data-app] .trigger-object{top:560px}
 .draft-actions{gap:14px}
 .draft-actions button{font-size:11px}
 .calendar-card{grid-template-columns:38px 1fr;gap:14px;padding:18px 14px}
 .calendar-card>.demo-action{grid-column:1/-1;justify-self:start}
 .calendar-card h3{font-size:17px}
 .invite-review dl>div{grid-template-columns:65px 1fr;gap:12px;font-size:12px}
}

/* Foreground messages and the input share the native platform's geometry. */
.home-page main>.app-demo-section{--scene-width:min(1280px,calc(100vw - 64px));padding-block:8px}
.app-demo-section .canvas-viewport{align-items:flex-start;gap:32px;padding-block:12px;padding-inline:max(32px,calc((100vw - 1280px)/2));scroll-padding-inline:max(32px,calc((100vw - 1280px)/2));overflow-y:hidden}
.app-demo-section .app-stage{overflow:hidden;border-radius:28px;outline:1px solid #e7ebe7;box-shadow:0 4px 14px #2335290a;transform-origin:center}
.viewport-case{--scene-height:clamp(640px,calc(100svh - 112px),780px);--ui-width:480px;--app-sidebar:242px;--app-inset:36px;--message-top:164px;--message-width:390px}
.viewport-case[data-app=whatsapp]{--app-sidebar:300px;--message-top:132px}
.viewport-case[data-app=gmail]{--app-sidebar:230px;--message-top:184px}
.viewport-case .app-stage{display:grid;grid-template-columns:var(--app-sidebar) minmax(0,1fr) var(--ui-width);grid-template-rows:minmax(280px,max-content) minmax(min-content,1fr) 48px;gap:12px 0;min-height:var(--scene-height);padding:0 var(--app-inset) 32px}
.viewport-case .story-left,.viewport-case .story-right,.viewport-case .reply-group{display:contents;padding:0}
.viewport-case .native-window{inset:0;transform:none;grid-template-columns:var(--app-sidebar) 1fr}
.viewport-case .native-main,.viewport-case .native-chat,.viewport-case .native-mail{position:static}
.viewport-case .native-chat{min-height:0}
.viewport-case [data-native-incoming]{position:absolute;left:calc(var(--app-sidebar) + var(--app-inset));top:var(--message-top);width:var(--message-width);margin:0;opacity:.3}
.viewport-case .native-input{left:calc(var(--app-sidebar) + var(--app-inset));right:var(--app-inset);bottom:32px;height:48px;padding:12px 14px;border-radius:15px}
.viewport-case[data-app] .message-note{position:relative;inset:auto;grid-column:2/4;grid-row:1;align-self:start;margin-top:var(--message-top);width:var(--message-width);transform:none}
.viewport-case .message-identity{gap:10px;min-height:36px;margin-bottom:10px}
.viewport-case .message-identity .demo-portrait{width:36px;height:36px}
.viewport-case[data-app] .message-note .received-message{padding:16px 20px}
.viewport-case[data-app] .received-message p{font-size:15px;line-height:1.5}
.app-panel.viewport-case[data-app] .trigger-object{position:relative;inset:auto;grid-column:2/4;grid-row:3;width:100%;margin:0;align-self:stretch}
.viewport-case .story-result{grid-column:2/4;grid-row:2;align-self:end;justify-self:center;min-height:0;width:var(--ui-width);max-width:100%;z-index:5}
.viewport-case[data-app] .value-payoff{position:absolute;left:auto;right:var(--app-inset);top:calc(var(--message-top) + 46px);bottom:auto;width:min(240px,calc(100% - var(--app-sidebar) - var(--message-width) - 2 * var(--app-inset) - 32px));padding:0;margin:0}
.viewport-case .value-payoff p{font-size:23px;line-height:1.12}
@media(min-width:901px) and (max-height:800px){
 .viewport-case[data-app=gmail]{--message-top:120px}
}
@media(max-width:1199px) and (min-width:761px){
 .viewport-case{--app-sidebar:194px;--app-inset:28px;--ui-width:416px;--message-width:330px}
 .viewport-case[data-app=whatsapp],.viewport-case[data-app=gmail]{--app-sidebar:194px}
 .viewport-case .value-payoff p{font-size:20px}
}
@media(max-width:900px) and (min-width:761px){
 .viewport-case{--scene-height:clamp(840px,calc(100svh - 112px),900px);--app-sidebar:146px;--app-inset:20px;--ui-width:350px;--message-width:280px}
 .viewport-case[data-app=whatsapp],.viewport-case[data-app=gmail]{--app-sidebar:146px}
}
@media(max-width:760px){
 .home-page main>.app-demo-section{--scene-width:100%;padding-block:8px}
 .app-demo-section .canvas-viewport{padding-inline:16px;scroll-padding-inline:16px;gap:16px}
 .app-demo-section .app-stage{border-radius:20px}
 .viewport-case{--ui-width:100%;--app-sidebar:0px;--app-inset:20px;--message-width:100%}
 .viewport-case[data-app=whatsapp],.viewport-case[data-app=gmail]{--app-sidebar:0px}
 .viewport-case .native-sidebar{display:none}
 .viewport-case .native-window{display:block}
 .viewport-case .native-topbar{height:48px}
 .viewport-case .native-main>header{height:48px}
 .viewport-case .native-input,.viewport-case [data-native-incoming]{display:none}
 .viewport-case .app-stage{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;gap:24px;min-height:0;padding:124px 20px 40px}
 .viewport-case[data-app] .message-note{position:relative;inset:auto;grid-column:1;grid-row:1;width:100%;margin-top:0}
 .viewport-case .story-result{grid-column:1;grid-row:2}
 .app-panel.viewport-case[data-app] .trigger-object{grid-column:1;grid-row:3}
 .viewport-case[data-app] .value-payoff{position:relative;inset:auto;grid-column:1;grid-row:4;width:100%}
 .viewport-case .value-payoff p{font-size:22px}
}

/* Match the hero film at its 900px desktop display size, without resizing the card. */
.viewport-case .tb-reply .tb-text{font-size:15px;line-height:1.45;text-wrap:balance}
.viewport-case .tb-action>span{font-size:12px}
@media(max-width:760px){
 .viewport-case .tb-reply .tb-text{text-wrap:pretty}
}