@font-face{font-family:Jakarta;src:url('./fonts/PlusJakartaSans-VF.ttf') format('truetype');font-weight:200 800;font-display:swap}
@font-face{font-family:Borel;src:url('./fonts/Borel-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
:root{--ink:#25232a;--muted:#66636d;--paper:#fff;--lime:#c5f464;--purple:#7736ff;--purple-surface:#6942c6;--lavender:#ede5ff;--line:#e6e4e9;--page:1248px;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:105px;-webkit-text-size-adjust:100%}body{margin:0;background:var(--paper);color:var(--ink);font-family:Jakarta,Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}img{display:block;max-width:100%;height:auto}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--purple);outline-offset:5px}figure,p,h1,h2,h3{margin:0}h1,h2,h3{text-wrap:balance}::selection{background:#e8ddff;color:#291c37}
.container{width:min(calc(100% - 96px),var(--page));margin-inline:auto}.skip-link{position:fixed;left:20px;top:12px;z-index:100;padding:12px 20px;background:var(--ink);color:white;transform:translateY(-150%)}.skip-link:focus{transform:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.header{position:sticky;top:0;z-index:30;background:#fff;transition:box-shadow .18s}.header.is-scrolled{box-shadow:0 1px 0 #e8e5ec}.header-inner{height:80px;display:flex;align-items:center;justify-content:space-between;gap:28px}.wordmark{display:inline-flex;align-items:center;gap:11px;font-weight:800;font-size:37px;letter-spacing:-2.4px;line-height:1;min-height:44px}.app-icon{width:44px;height:44px;border-radius:11px;flex:none}.nav{display:flex;gap:31px;margin-left:auto;margin-right:16px;font-size:13px;font-weight:550}.nav a{display:flex;align-items:center;min-height:44px}.nav a:hover{text-decoration:underline;text-underline-offset:5px}.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:18px;border-radius:30px;background:var(--ink);color:#fff;padding:12px 23px;font-size:13px;font-weight:600;transition:transform .18s,background .18s}.button:hover{background:#43384f;transform:translateY(-2px)}.button:active{transform:scale(.97)}.button span{font-size:20px}.store-badge{display:inline-flex;align-items:center;flex-shrink:0;border-radius:9px;min-height:52px;transition:transform .18s}.store-badge:hover{transform:translateY(-3px)}.store-badge img{width:156px;height:52px}.text-link{display:inline-flex;gap:13px;align-items:center;min-height:44px;font-size:13px;font-weight:600}.text-link:hover{text-decoration:none}.text-link-label{font:inherit}.text-link:hover .text-link-label{text-decoration:underline;text-underline-offset:5px}.text-link-arrow{width:20px;height:20px;flex:none}

h2{font-size:clamp(38px,4.4vw,62px);line-height:1.1;letter-spacing:-.035em;font-weight:600}

.privacy-section{background:var(--lime);padding-block:76px}
.privacy-layout{display:grid;grid-template-columns:1fr 1fr;gap:82px;align-items:center}
.privacy-layout .eyebrow{margin-bottom:22px}
.privacy-layout h2{font-size:48px;max-width:390px}
.privacy-copy>p{max-width:460px;color:var(--ink);font-size:17px;line-height:1.9}
.privacy-copy .text-link{margin-top:18px}
.faq-section{display:grid;grid-template-columns:1fr 1.15fr;gap:80px;padding-block:116px 124px}
.faq-section h2{margin-top:0;font-size:48px}
.faq-intro>p{max-width:240px;margin-top:25px;color:var(--muted);font-size:14px;line-height:1.8}
.faq-mascot{width:280px;margin:16px 0 0;transform:rotate(-8deg);pointer-events:none;user-select:none}
.brand-meaning{margin-top:18px;max-width:330px}
.brand-meaning-heading{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px}
.brand-meaning-heading span:first-child{font-family:Borel,cursive;font-size:28px;line-height:1.7}
.brand-pronunciation{font-size:16px;line-height:1.4;color:var(--muted);white-space:nowrap}
.brand-meaning-meta{font-size:12px;color:var(--muted);margin-bottom:5px}
.brand-meaning>p:last-child{font-size:16px;line-height:1.65}
.faq-list{border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line)}
summary{list-style:none;min-height:77px;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;font-size:15px;font-weight:600;padding:20px 0}
summary::-webkit-details-marker{display:none}
summary span{font-size:24px;line-height:1;font-weight:400}
details[open] summary span{transform:rotate(45deg)}
.faq-answer p{font-size:14px;line-height:1.85;color:var(--muted);padding:0 34px 25px 0}
.closing{background:var(--purple-surface);color:#fff;text-align:center;overflow:hidden}
.closing-inner{padding-block:69px 75px;position:relative}
.closing-cast{position:absolute;inset:0;pointer-events:none;user-select:none}
.closing-cast img{position:absolute;aspect-ratio:1;height:auto}
.closing-companion--left{width:220px;left:-28px;top:160px;transform:rotate(-12deg)}
.closing-companion--right{width:270px;right:-56px;top:90px;transform:rotate(17deg)}
.closing h2{font-size:67px;letter-spacing:-.035em;margin-top:24px;margin-bottom:30px;position:relative;z-index:1}
.closing .store-badge{position:relative;z-index:1}.closing a:focus-visible{outline-color:#fff}
.closing-note{font-size:12px;color:#f0e9ff;margin-top:15px}
.footer-wrap{background:#101713;color:#fff}
.footer-wrap a:focus-visible{outline-color:var(--lime)}
.footer{display:flex;align-items:center;gap:39px;min-height:143px;padding-block:30px}
.footer>.wordmark{font-size:36px}
.footer p{font-size:12px;line-height:1.9;color:#c9ceca}
.footer p a{text-decoration:none}
.footer nav{margin-left:auto;display:flex;gap:29px;font-size:12px}
.footer nav a{min-height:44px;display:flex;align-items:center}
.footer nav a:hover{text-decoration:underline;text-underline-offset:5px}
summary:focus-visible{outline-offset:-3px;border-radius:8px}
.reveal-ready{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s var(--ease)}.reveal-ready.is-visible{opacity:1;transform:none}
/* Selected product composition B: a native screen and an open editorial spread. */
.product-section{padding-block:100px 96px}
.product-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:18px}
.product-heading h2{font-size:32px;max-width:470px}
.product-tabs{display:none;align-items:center;gap:35px;margin-bottom:24px;padding-bottom:12px}
.js .product-tabs{display:flex}
.product-tabs button{position:relative;border:0;background:transparent;padding:15px 4px;min-height:50px;display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:var(--muted);white-space:nowrap;transition:color .2s}
.product-tabs button[aria-selected="true"]{color:var(--purple);font-weight:700}
.product-tabs button:hover{color:var(--ink)}
.product-tabs button>span{font-size:12px;font-weight:500}
.product-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:80px;align-items:center;min-height:510px;padding:8px 45px}
.product-panel:focus-visible{outline:3px solid var(--purple);outline-offset:8px;border-radius:12px}
.product-media{position:relative;width:100%;max-width:360px;justify-self:center}
.product-phone{position:relative;width:224px;margin-inline:auto;rotate:-5deg;border:5px solid var(--ink);border-radius:38px;overflow:hidden;background:#faf8ef;box-shadow:0 14px 24px -18px #00000045}
.product-phone img{width:100%;height:auto;aspect-ratio:1206/2622}
.product-phone .screen-outgoing{position:absolute;inset:0;pointer-events:none}
.product-companion{position:absolute;width:162px;aspect-ratio:1;left:calc(50% + 62px);top:calc(100% - 152px);pointer-events:none}
.product-companion[data-pose="1"]{left:calc(50% - 192px);top:36px}
.product-companion[data-pose="2"]{left:calc(50% + 35px);top:145px}
.product-mascot{width:100%;height:auto;aspect-ratio:1;transform:rotate(12deg);transform-origin:50% 72%;user-select:none}
.product-companion[data-pose="1"] .product-mascot{transform:rotate(-12deg)}
.product-companion[data-pose="2"] .product-mascot{transform:rotate(8deg)}
.product-annotation{font:17px/1.6 Borel,cursive;margin-top:15px;text-align:center;color:var(--purple)}
.product-feature{max-width:475px}
.product-kicker{font-size:12px;color:var(--purple);font-weight:700;letter-spacing:.065em;text-transform:uppercase;margin-bottom:21px}
.product-feature-title{font-size:65px;max-width:460px;font-weight:650;letter-spacing:-.04em;line-height:1.06}
.product-body,.product-detail{max-width:350px;font-size:16px;line-height:1.8;color:var(--muted)}
.product-body{margin-top:24px}
.product-detail{margin-top:14px}
.product-requirements{font-size:12px;line-height:1.75;color:var(--muted);max-width:850px;margin:38px auto 0;text-align:center}
.product-static{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:40px}
.product-static h3{font-size:24px;line-height:1.2;margin-bottom:16px}
.product-static p{font-size:14px;color:var(--muted);line-height:1.8}
@media(max-width:1050px){.product-section{padding-block:84px}.product-panel{gap:38px;padding-inline:8px}.product-feature-title{font-size:55px}.product-companion{left:calc(50% + 46px)}.product-companion[data-pose="1"]{left:calc(50% - 170px)}.product-companion[data-pose="2"]{left:calc(50% + 18px)}}
@media(max-width:760px){
 .product-heading{display:block;margin-bottom:23px}.product-heading h2{font-size:36px;max-width:500px}
 .product-tabs{gap:12px;justify-content:space-between;margin-bottom:30px}.product-tabs button{font-size:12px;gap:7px}.product-tabs button>span{font-size:11px}
 .product-panel{gap:30px;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);padding:0;min-height:450px}.product-phone{width:min(100%,227px);rotate:-3deg}
 .product-companion{width:116px;left:calc(50% + 40px);top:calc(100% - 124px)}.product-companion[data-pose="1"]{left:calc(50% - 150px);top:30px}.product-companion[data-pose="2"]{left:calc(50% + 28px);top:120px}.product-feature-title{font-size:40px}.product-kicker{margin-bottom:15px}.product-body{margin-top:19px}.product-detail{margin-top:12px}
 .product-annotation{font-size:14px}.product-requirements{line-height:1.9;margin-top:46px;text-align:left}
}
@media(max-width:500px){
 .product-section{padding-block:70px}.product-heading h2{font-size:33px}.product-tabs{gap:8px}.product-tabs button{gap:6px;padding-inline:0}
 .product-panel{display:flex;flex-direction:column;gap:33px;min-height:0}.product-feature{order:0;width:100%;max-width:none}.product-media{order:1;width:258px;max-width:100%;margin-bottom:7px}
 .product-feature-title{font-size:45px;max-width:350px}.product-body,.product-detail{max-width:none}.product-body{margin-top:18px}
 .product-phone{width:223px}.product-companion{width:136px;left:calc(50% + 38px);top:calc(100% - 150px)}.product-companion[data-pose="1"]{left:calc(50% - 168px);top:30px}.product-companion[data-pose="2"]{left:calc(50% + 24px);top:130px}.product-annotation{font-size:16px;margin-top:16px}.product-requirements{margin-top:28px}.product-static{grid-template-columns:1fr}
}
@media(max-width:359px){.product-tabs{gap:6px}.product-tabs button{gap:4px;font-size:11px}.product-tabs button>span{font-size:11px}.product-companion{left:calc(50% + 2px)}.product-companion[data-pose="1"]{left:calc(50% - 142px)}.product-companion[data-pose="2"]{left:calc(50% + 2px)}.product-feature-title{font-size:40px}}
@media(max-width:1100px){.container{width:calc(100% - 64px)}.privacy-layout{gap:44px}.faq-section{gap:48px}.closing-companion--left{width:170px;left:-22px;top:206px}.closing-companion--right{width:190px;right:-30px;top:126px}.closing h2{font-size:55px}}
@media(max-width:1000px){.closing-cast{position:relative;inset:auto;display:flex;align-items:center;justify-content:center;gap:24px;margin:0 auto 24px}.closing-cast img{position:relative;inset:auto}.closing-companion--left{width:140px}.closing-companion--right{width:160px}}
@media(max-width:800px){.nav{gap:20px;margin-right:0}.header-inner{gap:18px}.product-hero h1{font-size:48px}.product-hero{padding-top:30px}.product-hero .description{max-width:470px}.privacy-layout h2,.faq-section h2{font-size:40px}}
@media(max-width:700px){html{scroll-padding-top:92px}.container{width:calc(100% - 40px)}.header-inner{height:76px;gap:14px}.wordmark{font-size:33px;letter-spacing:-2px;gap:9px}.app-icon{width:36px;height:36px;border-radius:9px}.nav{display:none}.header-cta{min-height:44px;padding:11px 17px;font-size:12px;gap:13px}.product-hero{padding-top:23px}.product-hero .intro{padding:0 20px}.product-hero h1{font-size:clamp(30px,8.2vw,48px);letter-spacing:-.025em}.product-hero .eyebrow{margin-bottom:16px}.product-hero .description{font-size:15px;max-width:350px;margin-top:20px}.hero-actions{gap:19px;margin-top:24px}.hero-actions .text-link{font-size:12px}.store-badge,.store-badge img{width:144px;height:48px;min-height:48px}.try-section{padding-top:8px}h2{font-size:39px;letter-spacing:-.035em}.privacy-section{padding-block:58px}.privacy-layout{grid-template-columns:1fr;gap:28px}.privacy-layout h2{font-size:clamp(32px,10.5vw,41px)}.privacy-copy>p{font-size:15px;line-height:1.85}.privacy-copy .text-link{font-size:12px}.faq-section{grid-template-columns:1fr;gap:29px;padding-block:70px}.faq-section h2{font-size:39px;margin:0}.faq-intro>p{font-size:14px;margin-top:21px}.faq-intro>p br{display:none}summary{min-height:76px;font-size:14px}.faq-answer p{font-size:14px}.closing-inner{padding-block:55px}.closing-cast{gap:18px;margin-bottom:22px}.closing-companion--left{width:108px}.closing-companion--right{width:128px}.closing h2{font-size:44px;margin-top:0}.footer{flex-wrap:wrap;gap:24px;padding-block:34px 25px}.footer>.wordmark{font-size:34px}.footer p{font-size:12px}.footer nav{margin:0;width:100%;gap:25px;font-size:12px;justify-content:space-between;border-top:1px solid #ffffff30;padding-top:12px}}
@media(max-width:390px){.product-hero h1{font-size:32px}.product-hero .intro{padding:0 14px}.try-section{width:calc(100% - 28px)}.hero-actions{gap:14px}.try-section .card-description{font-size:14px}.try-section .playground[data-step="2"] .card-description{font-size:13px;max-width:94px}}
@media(max-width:340px){.product-hero h1{font-size:27px}.product-hero .description{font-size:14px;max-width:280px}.hero-actions{gap:11px}.hero-actions .text-link{gap:8px}.try-section{width:calc(100% - 24px)}.closing h2{font-size:38px}}
@media(prefers-reduced-motion:no-preference){.product-hero .intro{animation:hero-in .65s var(--ease) both}.product-hero .showcase{animation:hero-in .9s var(--ease) both}@keyframes hero-in{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal-ready{opacity:1;transform:none}.product-hero .device{will-change:auto}}

.try-section .arrow{width:15px;height:15px;display:block;flex-shrink:0}
@media(max-width:700px){.product-hero .eyebrow{display:none}.product-hero .description{margin-top:15px}.hero-actions{margin-top:20px}}

/* The opening is one open, moving Tunto scene. */
.header{background:var(--purple-surface);color:#fff}.header.is-scrolled{background:#fff;color:var(--ink)}
.header-cta,.header.is-scrolled .header-cta{background:#101713;color:#fff;gap:10px;padding:14px 24px;white-space:nowrap}.header-cta:hover,.header.is-scrolled .header-cta:hover{background:#29332d}.header-cta-icon{width:17px;height:21px;flex:none}.header:not(.is-scrolled) .header-cta:focus-visible{outline-color:#fff}
@media(max-width:700px){.header-cta,.header.is-scrolled .header-cta{padding:11px 17px;gap:8px}.header-cta-icon{width:15px;height:19px}}
.motion-hero{background:var(--purple-surface);color:#fff;overflow:clip;position:relative}
.hero-inner{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-top:20px;padding-bottom:18px}
.hero-copy{padding-top:47px;position:relative;z-index:3}
.hero-eyebrow{font-size:13px;font-weight:500;display:flex;gap:10px;align-items:center;margin-bottom:24px}
.hero-eyebrow>span{width:7px;height:7px;background:#c5f464;border-radius:50%;box-shadow:0 0 0 4px #ffffff16}
.motion-hero h1{font-size:clamp(52px,5.15vw,76px);font-weight:700;letter-spacing:-.04em;line-height:1.065;text-wrap:initial}

.hero-description{font-size:16px;line-height:1.75;color:#f0e9ff;margin-top:25px;max-width:475px}
.hero-actions{display:flex;align-items:center;justify-content:flex-start;gap:24px;margin-top:28px}
.motion-hero button:focus-visible,.motion-hero a:focus-visible{outline-color:#fff}
.motion-stage{position:relative;min-width:0;--scene-ease:cubic-bezier(.2,.8,.2,1);--pointer-x:0px;--pointer-y:0px}
.scene-world{height:544px;position:relative;isolation:isolate;transform:translate(var(--pointer-x),var(--pointer-y));transition:transform .35s var(--scene-ease)}

.loose-thought{position:absolute;z-index:2;background:#f0e8ff;color:#4c2a78;padding:18px 23px;display:flex;align-items:center;gap:14px;font-size:15px;font-weight:600;border-radius:17px;box-shadow:0 5px 0 #5925bc;transition:transform .6s var(--scene-ease),opacity .5s}
.loose-thought>span{width:18px;height:18px;border:1.5px solid #8e73b2;border-radius:50%;flex:none}
.thought-room{left:27px;top:45px;transform:rotate(-10deg)}.thought-project{left:-7px;top:129px;transform:rotate(5deg)}
.hero-phone{position:absolute;right:17px;top:36px;width:216px;padding:5px;border:0;border-radius:35px;background:#d8cee9;box-shadow:11px 19px 0 #5622b352,0 20px 35px #00000018;transform:rotate(9deg);transition:transform .65s var(--scene-ease);z-index:1}
.hero-phone img{border:3px solid #24152e;border-radius:29px;width:100%;height:auto}
.hero-phone figcaption{position:absolute;left:0;right:0;bottom:-31px;text-align:center;font-size:12px;color:#fff;font-weight:500}
.task-object{position:absolute;left:3px;top:210px;width:352px;height:304px;z-index:4;transform:rotate(-5deg);transition:transform .6s var(--scene-ease)}
.task-object::before{content:'';position:absolute;inset:8px -5px -9px 10px;background:#b7ee66;border-radius:25px;transform:rotate(3deg);transition:transform .6s var(--scene-ease)}
.task-paper{position:relative;padding:24px;border-radius:25px;background:#fff;color:#291c37;height:100%;display:flex;flex-direction:column;box-shadow:0 18px 28px #0000001c}
.card-kicker{display:flex;justify-content:space-between;align-items:center;font-size:12px;gap:10px;color:#756982;font-weight:550}.card-kicker>span:last-child{white-space:nowrap}
.card-content{position:relative;flex:1;padding-top:16px;display:flex;flex-direction:column;justify-content:center}
.task-glyph{display:grid;place-items:center;width:29px;height:29px;color:#7736ff;margin-bottom:9px}
.task-glyph svg{width:25px;height:25px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.task-paper h2{font-size:29px;letter-spacing:-.035em;line-height:1.17;font-weight:650;text-wrap:initial;position:relative;z-index:1}
#card-description{font-size:12px;line-height:1.55;color:#776781;margin-top:11px;max-width:245px}
.card-bottom{display:flex;gap:14px;align-items:center;margin-top:18px}
.scene-action{border:0;background:#291c37;color:white;border-radius:12px;display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:48px;padding:12px 17px;font-size:12px;font-weight:600;flex:1;transition:transform .15s}
.scene-action:hover{transform:translateY(-2px)}.scene-action:active{transform:scale(.97)}.action-arrow{font-size:21px;line-height:1}.task-paper button:focus-visible{outline-color:#7736ff}
.scene-reset{display:none;border:0;background:none;color:#776781;min-height:44px;padding:10px 0;font-size:12px;text-decoration:underline;text-underline-offset:3px}
.mascot-buddy{position:absolute;right:-18px;bottom:-3px;width:190px;z-index:5;transform:rotate(8deg);transition:transform .65s var(--scene-ease)}
.mascot-buddy button{display:block;border:0;padding:0;width:100%;background:none;border-radius:50%;transition:transform .25s var(--scene-ease)}
.mascot-buddy button:hover{transform:rotate(-9deg) scale(1.06)}.mascot-buddy img{width:100%;filter:drop-shadow(0 8px 0 #5520b652);user-select:none;-webkit-user-drag:none}
#mascot-caption{position:absolute;bottom:calc(100% - 2px);left:-15px;white-space:nowrap;font-size:12px;line-height:1.4;color:#fff;padding:10px 14px;background:#291c37;border-radius:14px 14px 2px 14px;transform:rotate(-8deg);box-shadow:0 5px 0 #5925bc}
.focus-ring{display:none;grid-area:1 / 1;width:var(--focus-diameter,151px);height:var(--focus-diameter,151px);z-index:0;pointer-events:none}.focus-ring svg{width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}.focus-ring circle{fill:none;stroke-width:3}.ring-track{stroke:#ffffff20}.ring-progress{stroke:#c5f464;stroke-dasharray:100;stroke-dashoffset:var(--timer-offset,0);stroke-linecap:round}
.motion-stage[data-step="1"] .task-object{transform:translateY(-19px) rotate(0)}.motion-stage[data-step="1"] .task-object::before{transform:rotate(-3deg)}
.motion-stage[data-step="1"] .thought-room,.motion-stage[data-step="2"] .thought-room{transform:translate(-24px,-16px) rotate(-15deg);opacity:.35}
.motion-stage[data-step="1"] .thought-project,.motion-stage[data-step="2"] .thought-project{transform:translate(-14px,-12px) rotate(9deg);opacity:.25}
.motion-stage[data-step="1"] .hero-phone{transform:translate(6px,-8px) rotate(5deg)}
.motion-stage[data-step="1"] .mascot-buddy{transform:translate(-5px,-7px) rotate(-5deg)}
.motion-stage[data-step="2"] .task-object{transform:translateY(-18px) rotate(-2deg)}
.motion-stage[data-step="2"] .task-paper{background:#291c37;color:white}
.motion-stage[data-step="2"] .card-kicker,.motion-stage[data-step="2"] .scene-reset{color:#e0cbed}
.motion-stage[data-step="2"] .task-glyph{display:none}.motion-stage[data-step="2"] .card-content{display:grid;grid-template-columns:var(--focus-diameter,151px) minmax(0,1fr);align-items:center;justify-items:center;padding:0;margin-top:12px;min-height:150px;gap:16px}
.motion-stage[data-step="2"] #card-title{grid-area:1 / 1;width:100%;font-size:48px;letter-spacing:-.035em;line-height:1;font-weight:500;min-width:0;text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap}
.motion-stage[data-step="2"] #card-description{grid-area:1 / 2;justify-self:start;color:#e0cbed;max-width:118px;font-size:13px;margin:0;line-height:1.6}
.motion-stage[data-step="2"] .focus-ring{display:block}.motion-stage[data-step="2"] .scene-action{background:#c5f464;color:#291c37}.motion-stage[data-step="2"] .scene-reset{display:block}
.motion-stage[data-step="2"] .hero-phone{transform:translate(10px,-10px) rotate(2deg)}
.motion-stage[data-step="2"] .mascot-buddy{transform:translate(0,-4px) rotate(-9deg)}

.example-fallback{padding:20px;font-size:14px;line-height:1.7}html:not(.js) .card-bottom{display:none}
@media(prefers-reduced-motion:no-preference){
 .js .hero-copy{animation:copy-arrive .6s var(--ease) backwards}.js .hero-phone{animation:phone-arrive .8s var(--ease) backwards}.js .task-object{animation:task-arrive .65s .15s var(--ease) backwards}.js .loose-thought{animation:thought-arrive .65s .08s var(--ease) backwards}
 .js .mascot-buddy img{animation:buddy-breathe 4.5s ease-in-out infinite}.motion-stage[data-motion="paused"] .mascot-buddy img{animation-play-state:paused!important}
 @keyframes copy-arrive{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
 @keyframes phone-arrive{from{opacity:0;translate:55px 20px;rotate:5deg}to{opacity:1;translate:0 0;rotate:0deg}}
 @keyframes task-arrive{from{opacity:0;translate:-25px 30px;scale:.92}to{opacity:1;translate:0 0;scale:1}}
 @keyframes thought-arrive{from{opacity:0;translate:-30px -10px}to{opacity:1;translate:0 0}}
 @keyframes buddy-breathe{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-9px) rotate(2deg)}}
}
@media(min-width:1600px){.hero-inner{padding-top:34px;padding-bottom:26px}.motion-hero h1{font-size:78px}.scene-world{height:562px}}
@media(max-width:1200px){.hero-inner{gap:16px}.motion-hero h1{font-size:5.35vw}.hero-copy{padding-top:46px}.hero-description{font-size:15px}.wide-break{display:none}.hero-phone{width:200px;right:4px;top:57px}.task-object{width:314px;height:302px;left:0}.task-paper{padding:22px}.task-paper h2{font-size:27px}.mascot-buddy{right:-13px;width:157px;bottom:3px}#mascot-caption{font-size:12px;left:-20px}.thought-room{left:9px}.thought-project{left:-12px}.loose-thought{padding:16px 18px;font-size:13px}.hero-actions{gap:17px}.motion-stage[data-step="2"] #card-title{font-size:43px}.motion-stage[data-step="2"] #card-description{font-size:12px;max-width:107px}.motion-stage{--focus-diameter:132px}.motion-stage[data-step="2"] .card-content{gap:14px}.scene-action{gap:13px;padding-inline:14px}.card-kicker{font-size:12px}}
@media(max-width:960px) and (min-width:701px){.hero-inner{grid-template-columns:1fr;max-width:720px;padding-top:25px}.hero-copy{padding-top:5px;max-width:600px}.motion-hero h1{font-size:64px}.hero-description{max-width:500px}.motion-stage{width:600px;max-width:100%;margin:15px auto 0}.hero-phone{width:221px;right:38px}.task-object{width:350px;left:16px}.task-paper h2{font-size:29px}.mascot-buddy{right:7px;width:192px}}
@media(max-width:700px){
 .header-inner{height:72px}.header{box-shadow:none}.hero-inner{display:flex;flex-direction:column;gap:22px;padding-top:27px;padding-bottom:25px;width:calc(100% - 40px)}
 .hero-copy{padding:0}.hero-eyebrow{font-size:12px;margin-bottom:20px}.motion-hero h1{font-size:clamp(35px,8.95vw,60px);line-height:1.08;letter-spacing:-.035em}.hero-description{font-size:14px;line-height:1.65;margin-top:20px;max-width:360px}.hero-description br{display:none}.hero-actions{gap:23px;margin-top:22px}
 .motion-stage{width:100%;max-width:470px;align-self:center}.scene-world{height:444px;max-width:470px;margin:auto}.hero-phone{width:159px;right:8px;top:35px;border-radius:28px;padding:4px}.hero-phone img{border-radius:22px;border-width:2px}.hero-phone figcaption{font-size:12px;bottom:-24px}.thought-room{left:13px;top:29px}.thought-project{left:0;top:89px}.loose-thought{font-size:12px;padding:13px 14px;gap:9px;border-radius:12px}.loose-thought>span{width:15px;height:15px}
 .task-object{left:0;top:159px;width:260px;height:266px;transform:rotate(-4deg)}.task-object::before{border-radius:22px}.task-paper{padding:20px;border-radius:22px}.card-kicker{font-size:12px;gap:5px}.card-kicker>span:last-child{display:none}.task-glyph{width:25px;height:25px;margin-bottom:7px}.task-glyph svg{width:23px;height:23px}.task-paper h2{font-size:25px;line-height:1.18}.card-content{padding-top:11px}#card-description{font-size:12px;line-height:1.5;margin-top:10px;max-width:198px}.card-bottom{margin-top:15px;gap:10px}.scene-action{min-height:44px;padding:10px 13px;font-size:12px;gap:12px}.action-arrow{font-size:19px}.scene-reset{font-size:12px}
 .mascot-buddy{width:123px;right:-4px;bottom:-6px}#mascot-caption{font-size:12px;white-space:normal;width:117px;left:0;padding:9px 10px;bottom:calc(100% - 3px)}
 .motion-stage[data-step="1"] .task-object{transform:translateY(-8px) rotate(0)}.motion-stage[data-step="2"] .task-object{transform:translateY(-6px) rotate(-2deg)}.motion-stage[data-step="2"] .card-content{min-height:128px;gap:11px;margin-top:10px}.motion-stage[data-step="2"] #card-title{font-size:35px}.motion-stage[data-step="2"] #card-description{font-size:12px;max-width:93px}.motion-stage{--focus-diameter:114px}.motion-stage[data-step="2"] .card-kicker{font-size:12px}
}
@media(max-width:359px){.hero-inner{width:calc(100% - 32px);padding-top:20px;gap:17px}.motion-hero h1{font-size:clamp(28px,8.95vw,33px)}.hero-eyebrow{font-size:12px;margin-bottom:17px}.hero-description{font-size:13px;max-width:280px}.hero-actions{gap:15px}.hero-phone{width:139px;right:3px;top:45px}.scene-world{height:427px}.task-object{top:156px;width:239px;height:257px}.task-paper{padding:18px}.task-paper h2{font-size:23px}.task-glyph{margin-bottom:6px}.mascot-buddy{width:104px;right:-5px;bottom:-8px}#mascot-caption{width:100px;font-size:12px}.thought-room{left:4px}.thought-project{left:-4px}.loose-thought{font-size:12px;padding:12px 13px;gap:8px}.motion-stage[data-step="2"] #card-title{font-size:33px}.motion-stage{--focus-diameter:106px}.motion-stage[data-step="2"] #card-description{max-width:84px;font-size:12px}.scene-action{font-size:12px;gap:7px}.scene-reset{font-size:12px}}
@media(prefers-reduced-motion:reduce){.scene-world{transform:none}.js .hero-copy,.js .hero-phone,.js .task-object,.js .loose-thought{opacity:1;translate:none;scale:none}.motion-stage *{animation:none!important;transition:none!important}}

/* Secondary copy stays legible even at the narrowest supported width. */
.card-kicker,#mascot-caption{font-size:12px}
.task-paper{transition:transform .22s var(--scene-ease)}
@media(hover:hover){.task-paper:hover{transform:translateY(-4px)}}
@media(max-width:700px){.hero-copy .hero-description{font-size:14px}.loose-thought,.hero-phone figcaption,.card-kicker,#card-description,.scene-action,.scene-reset,.motion-stage[data-step="2"] .card-kicker,.motion-stage[data-step="2"] #card-description{font-size:12px}.mascot-buddy{width:106px;right:-9px;bottom:87px}#mascot-caption{font-size:12px;width:115px;left:-6px}.motion-stage[data-step="2"] #card-description{font-size:12px;max-width:95px}.scene-action{gap:8px;padding-inline:12px}}
@media(max-width:359px){.hero-inner{gap:12px}.scene-world{height:436px}.mascot-buddy{width:94px;right:0;top:54px;bottom:auto}.mascot-buddy #mascot-caption{font-size:12px;width:105px;left:-11px}.task-object{width:249px}.task-paper{padding:18px}.task-paper h2{font-size:24px}.scene-action,.scene-reset{font-size:12px}.hero-phone figcaption{display:none}.motion-stage[data-step="2"] #card-description{max-width:88px;font-size:12px}.card-kicker{font-size:12px}.motion-stage[data-step="2"] .card-kicker{font-size:12px}}
@media(min-width:360px) and (max-width:700px){.mascot-buddy{width:100px;right:0;top:50px;bottom:auto}#mascot-caption{font-size:12px;width:110px;left:-10px}}

@media(max-width:700px){.hero-copy .hero-description br{display:block}}

/* Use the same English title face as the native app. */
.wordmark{font-family:Borel,cursive;font-weight:400;font-size:34px;letter-spacing:0;line-height:1;gap:12px}
.wordmark>span{padding-top:14px}
.footer>.wordmark{font-size:32px;padding-top:14px}
.footer p{display:flex;align-items:baseline;flex-wrap:wrap;column-gap:4px;row-gap:3px}
.footer .copyright{margin-left:12px;white-space:nowrap}
@media(max-width:700px){.wordmark{font-size:29px;gap:10px}.wordmark>span{padding-top:12px}.footer{column-gap:26px}.footer p{font-size:12px;flex:1;min-width:160px}.footer .copyright{margin-left:0;flex-basis:100%}.footer>.wordmark{font-size:30px}}

.closing-ai-note{font-weight:600}.closing-requirements{display:block;margin:10px auto 0;padding-inline:16px;line-height:1.65}

/* Keep the FAQ companion beside the introduction on small screens. */
@media(max-width:700px){.faq-intro{display:grid;grid-template-columns:minmax(0,1fr) 116px;column-gap:12px;align-items:center}.faq-intro h2{grid-column:1/-1}.faq-intro>p{margin-top:18px}.faq-mascot{grid-column:2;grid-row:2;width:116px;margin:4px 0 0;align-self:center}}
@media(max-width:700px){.brand-meaning{grid-column:1/-1;margin-top:20px}.brand-meaning-heading span:first-child{font-size:25px}.brand-meaning>p:last-child{font-size:14px}}

/* Keep the download aligned with the hero copy. */
.closing-description{position:relative;z-index:1;max-width:560px;margin:0 auto 28px;font-size:20px;line-height:1.8;color:#f0e9ff}
.hero-download{display:flex;align-items:center;gap:24px;margin-top:28px;max-width:100%}
@media(max-width:700px){.hero-download{gap:16px;margin-top:24px}.closing-description{max-width:300px;margin-bottom:26px;font-size:17px}}

/* A reversible grid disclosure keeps the native summary and its keyboard behavior. */
.faq-enhanced .faq-answer{display:grid;grid-template-rows:1fr;opacity:1;transition:grid-template-rows .32s var(--ease),opacity .22s ease}
.faq-answer-inner{min-height:0;overflow:hidden}
.faq-enhanced[data-expanded="false"] .faq-answer{grid-template-rows:0fr;opacity:0}
summary span{transition:transform .24s var(--ease)}
.faq-enhanced[data-expanded="false"] summary span{transform:rotate(0)}
.faq-enhanced[data-expanded="true"] summary span{transform:rotate(45deg)}
@media(prefers-reduced-motion:reduce){.faq-enhanced .faq-answer,summary span{transition:none}}

/* Give the mobile scene its own space so companions clear copy and phone content. */
@media(max-width:500px){
 .scene-world{height:610px}
 .hero-phone{top:35px;right:8px}
 .thought-room{left:25px;top:18px}.thought-project{left:16px;top:76px}
 .mascot-buddy{width:96px;left:20px;right:auto;top:214px;bottom:auto}
 .mascot-buddy #mascot-caption{width:119px;left:0}
 .task-object{top:326px;left:calc((100% - 260px)/2)}
 .product-companion{left:calc(50% + clamp(2px,40vw - 128px,30px))}
 .product-companion[data-pose="1"]{width:96px;left:calc(50% - 148px);top:-26px}
 .product-companion[data-pose="2"]{width:104px;left:calc(50% + 48px);top:6px}
 .product-body,.product-detail,.product-requirements,.faq-answer p,.privacy-copy>p,.closing-description,.closing-requirements{text-wrap:pretty}
}
@media(max-width:359px){.scene-world{height:601px}.task-object{left:calc((100% - 249px)/2)}}