:root{--paper:#f9f6ee;--ink:#322d36;--muted:#635b65;--green:#405c39;--terracotta:#b9694d;--line:#e4ddd3;--sage:#e6ebd7;--font:'Nunito',ui-rounded,'SF Pro Rounded',system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:17px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}button{font:inherit;color:inherit;cursor:pointer}a,button,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:900;line-height:1.07;letter-spacing:-2px}p{line-height:1.65}button,a,summary{outline-offset:5px}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--terracotta)}header{position:absolute;top:0;left:0;width:100%;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:23px 5%;gap:24px}.wordmark{display:flex;align-items:center;font-size:25px;font-weight:950;letter-spacing:-1px;gap:10px;white-space:nowrap}.wordmark img{width:43px;height:43px;border-radius:11px}header nav{display:flex;gap:35px;font-size:15px;font-weight:800}header nav a:hover{text-decoration:underline;text-underline-offset:5px}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--ink);color:#fff;padding:18px 27px;border:0;border-radius:18px;box-shadow:0 4px 0 #201b23;font-size:17px;font-weight:850;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px);background:#4b414f}.button:active{transform:translateY(2px);box-shadow:0 2px 0 #201b23}.button-small{padding:12px 21px;font-size:14px;border-radius:13px}.button svg{width:25px;height:29px}.eyebrow{font-size:14px;font-weight:850;letter-spacing:.4px}.hero{position:relative;height:950px;min-height:780px;max-height:1120px;overflow:hidden;background:#edf2db}.hero-landscape{position:absolute;inset:0}.hero-landscape video{height:100%;width:100%;object-fit:cover;object-position:center 67%;display:block}.hero-landscape:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#f9f6eef2 0%,#f9f6eee8 8%,#f9f6ee93 34%,#f9f6ee00 66%,#322d3610 100%)}.hero-copy{position:relative;text-align:center;z-index:3;padding:138px 20px 0}.hero h1{font-size:clamp(76px,8vw,118px);line-height:.99;color:#304a2d;letter-spacing:-5px;margin:18px 0 21px}.hero-description{font-size:20px;font-weight:650;color:#3e4a34;margin-bottom:26px}.store-note{display:block;font-size:12px;color:#42553d;margin-top:14px;font-weight:750}.hero-cast{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);width:650px;height:435px;z-index:2;pointer-events:none}.hero-cast img{position:absolute;object-fit:contain;filter:drop-shadow(0 15px 9px #292b3b26)}.cast-doctor{height:410px;width:370px;left:146px;bottom:0}.cast-plum{width:205px;height:260px;left:5px;bottom:25px;transform:rotate(-6deg)}.cast-plant{width:185px;height:235px;right:-3px;bottom:27px;transform:rotate(4deg)}.motion-control{position:absolute;bottom:24px;right:28px;z-index:5;background:#fffdf3e8;backdrop-filter:blur(10px);border:1px solid #fff9;border-radius:30px;padding:10px 15px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:750;color:#31492e}.pause-icon{font-size:17px;font-weight:900}.download{text-align:center;padding:100px 20px;background:var(--sage)}.download h2{font-size:60px;margin:14px 0 18px}.download p:not(.eyebrow){margin-bottom:25px}.download #store-status{font-size:14px;margin-top:20px;margin-bottom:0}footer{max-width:1400px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:38px 5%}footer p{font-size:14px}footer small{max-width:380px;color:var(--muted);font-size:12px;line-height:1.8}.skip:not(:focus){position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.skip:focus{position:fixed;top:10px;left:10px;background:white;padding:15px;z-index:100}.sr-only{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}
@media(max-width:760px){html{scroll-padding-top:30px}header{padding:18px 5%}.wordmark{font-size:22px;gap:7px}.wordmark img{width:35px;height:35px}header nav{display:none}.button-small{padding:10px 15px;font-size:13px}.hero{height:860px;min-height:0;max-height:none}.hero-copy{padding-top:123px}.hero h1{font-size:76px;letter-spacing:-3.5px;line-height:1.02;margin:17px 0 18px}.hero-description{font-size:17px;max-width:300px;margin:0 auto 24px}.hero-landscape video{object-position:48% bottom}.hero-landscape:after{background:linear-gradient(#f9f6eef5 0%,#f9f6eed8 35%,#f9f6ee20 64%,transparent 100%)}.hero-cast{width:370px;height:320px;bottom:22px}.cast-doctor{height:300px;width:260px;left:65px}.cast-plum{width:125px;height:175px;left:-4px;bottom:18px}.cast-plant{width:105px;height:155px;right:-3px;bottom:17px}.motion-control{bottom:14px;right:16px;padding:9px 12px}.motion-label{display:none}.eyebrow{font-size:13px}.download{padding:65px 6%}.download h2{font-size:43px}footer{flex-wrap:wrap;padding:32px 6%}footer small{max-width:none;width:100%}footer p{font-size:12px}.button{font-size:16px}.button-small{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.section{max-width:1440px;margin:0 auto;padding:115px 7%}h2{font-size:clamp(45px,4.8vw,70px);letter-spacing:-2.7px;line-height:1.06}.journal{display:grid;grid-template-columns:1fr 1.1fr;gap:8%;align-items:center;min-height:920px}.journal-heading h2{margin:20px 0 23px}.journal-heading>p:not(.eyebrow){color:var(--muted);font-size:18px;line-height:1.8}.logging-icons{display:flex;gap:18px;margin:28px 0 40px;align-items:center}.logging-icons img{width:65px;height:65px;object-fit:contain}.screen-tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);max-width:390px}.screen-tabs button{border:0;border-bottom:3px solid transparent;padding:0 0 14px;background:none;font-size:16px;font-weight:800;color:var(--muted)}.screen-tabs button[aria-selected=true]{border-color:var(--terracotta);color:var(--ink)}.journal-description{padding-top:25px;min-height:130px;max-width:400px}.journal-description h3{font-size:25px;letter-spacing:-.6px;margin-bottom:10px}.journal-description p{font-size:16px;color:var(--muted)}.journal-visual{position:relative;min-height:655px;display:flex;justify-content:flex-end;align-items:flex-start;padding-right:15px}.device{position:relative;background:#362f30;border:3px solid #b4a79a;border-radius:46px;padding:7px;width:290px;box-shadow:16px 25px 60px #463b2926;overflow:hidden;transform:rotate(3deg);z-index:2}.device img{border-radius:36px;width:100%}.journal-companion{position:absolute;width:290px;left:-70px;bottom:45px;z-index:3;filter:drop-shadow(0 18px 8px #463b2920)}.growth{position:relative;display:grid;grid-template-columns:.85fr 1.25fr;min-height:690px;overflow:hidden;background:#eee7d9}.growth-intro{z-index:2;padding:95px 0 70px max(7vw,calc((100vw - 1240px)/2));width:calc(100% + 80px);position:relative}.growth-intro h2{font-size:clamp(45px,4.7vw,68px);color:#3e5135;margin:20px 0 25px}.growth-intro>p:last-of-type{max-width:350px;font-size:17px;color:#5b584e}.growth-message{display:flex;align-items:center;margin-top:37px;gap:18px;font-size:15px;font-weight:750;color:#4d5942;max-width:410px}.growth-message img{width:75px;height:95px;object-fit:contain}.growth-message p{line-height:1.6}.growth-world{position:relative;min-height:690px;isolation:isolate}.growth-world:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#eee7d9,transparent 40%);pointer-events:none}.growth-world picture{position:absolute;inset:0;z-index:-2}.orchard{height:100%;width:100%;object-fit:cover;object-position:58% center}.growing-plant{position:absolute;width:42%;height:56%;object-fit:contain;left:42%;top:25%;filter:drop-shadow(0 20px 10px #65431533);transition:opacity .15s,transform .3s}.growth-controls{position:absolute;bottom:30px;right:10%;left:24%;text-align:center;min-width:310px}.growth-controls>p{font-size:12px;font-weight:800;margin-bottom:10px;color:#3b4732}.growth-controls>div{display:inline-flex;padding:5px;border-radius:17px;background:#fffcf3ed;box-shadow:0 5px 20px #40331e1c;border:1px solid #fff9}.growth-controls button{padding:11px 17px;border:0;background:none;border-radius:12px;font-size:14px;font-weight:800}.growth-controls button[aria-pressed=true]{background:var(--green);color:white}.friends{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:8%;padding-top:140px;padding-bottom:140px}.friends-film{position:relative;border-radius:34% 34% 28px 28px;overflow:hidden;aspect-ratio:1/1.05;box-shadow:0 20px 70px #ad865116}.friends-film>video{width:100%;height:100%;display:block;object-fit:cover;object-position:50%}.friends-copy h2{margin:20px 0 28px}.friends-copy>p:not(.eyebrow){font-size:19px;color:var(--muted);max-width:340px}.friends-copy .friends-footnote{font-size:13px!important;margin-top:30px;border-top:1px solid var(--line);padding-top:20px;max-width:340px}.choose{border-top:1px solid var(--line);padding-top:90px;padding-bottom:100px}.choose-header{text-align:center}.choose-header h2{margin:17px 0 20px}.choose-header>p:last-child{color:var(--muted);font-size:17px}.mode-options{display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:1040px;margin:50px auto 0}.mode-art{height:320px;display:flex;align-items:center;justify-content:center;border-radius:24px;overflow:hidden}.mode-art video{width:100%;height:100%;object-fit:cover}.journal-art{background:#e7e9db}.journal-art img{height:95%;width:auto;object-fit:contain}.mode-caption{padding:25px 0;display:flex;align-items:baseline;justify-content:space-between;gap:15px}.mode-caption h3{font-size:25px;letter-spacing:-.8px}.mode-caption p{font-size:15px;color:var(--muted)}.questions{display:grid;grid-template-columns:1fr 1.3fr;gap:10%;border-top:1px solid var(--line);padding-top:85px;padding-bottom:110px}.questions-heading h2{font-size:48px;margin-top:20px}.answers details{border-bottom:1px solid var(--line)}.answers summary{list-style:none;cursor:pointer;padding:22px 35px 22px 0;font-size:18px;font-weight:800;position:relative}.answers summary::-webkit-details-marker{display:none}.answers summary:after{content:'+';position:absolute;right:0;font-size:23px;font-weight:500;top:19px}.answers details[open] summary:after{content:'−'}.answers p{font-size:16px;line-height:1.8;color:var(--muted);padding:0 15px 24px 0}.download{position:relative;overflow:hidden;background:#e6ebd7;padding:80px 20px 90px}.download-seed{width:125px;height:125px;object-fit:contain;margin:0 auto 15px}.download h2{color:var(--green);font-size:68px}.download>p:not(.eyebrow){font-size:19px}.store-buttons{display:flex;gap:15px;justify-content:center}.download #store-status{font-size:13px;max-width:440px;margin-left:auto;margin-right:auto}
@media(min-width:1500px){.hero{height:1000px}.hero-cast{height:460px}.cast-doctor{height:440px}.growth-intro{padding-left:calc((100vw - 1240px)/2)}.hero-copy{padding-top:155px}}
@media(max-width:1080px) and (min-width:761px){.journal{gap:4%;padding:90px 6%;min-height:800px}.journal-visual{min-height:600px}.device{width:250px;border-radius:37px}.device img{border-radius:28px}.journal-companion{width:220px;left:-35px;bottom:60px}.growth-intro{padding-left:6vw}.growth-intro h2{font-size:51px}.growth-intro>p:last-of-type{max-width:300px}.growth-message{font-size:13px}.growth-controls{left:10%;right:5%}.mode-caption{display:block}.mode-caption p{margin-top:9px}.friends{gap:6%;padding:85px 6%}.friends h2{font-size:51px}.mode-art{height:260px}}
@media(max-width:760px){.section{padding:65px 7%}h2{font-size:46px;letter-spacing:-1.9px}.journal{display:flex;flex-direction:column;gap:30px;min-height:0}.journal-heading{width:100%}.journal-heading h2{margin:17px 0 20px}.journal-heading>p:not(.eyebrow){font-size:17px}.logging-icons{gap:18px;margin:25px 0 35px}.logging-icons img{width:55px;height:55px}.screen-tabs{gap:25px}.screen-tabs button{font-size:16px}.journal-description{min-height:105px}.journal-visual{width:100%;max-width:390px;min-height:640px;padding-right:3px}.device{width:250px;border-radius:37px;padding:6px}.device img{border-radius:29px}.journal-companion{width:190px;left:-20px;bottom:50px}.growth{display:flex;flex-direction:column;min-height:0}.growth-intro{padding:60px 7% 20px;width:100%}.growth-intro h2{font-size:46px;margin:17px 0 23px}.growth-intro>p:last-of-type{max-width:none;font-size:17px}.growth-message{margin-top:25px;gap:13px;font-size:14px}.growth-message img{width:60px;height:80px}.growth-world{min-height:540px}.growth-world:after{background:linear-gradient(#eee7d9,transparent 30%)}.orchard{object-position:center 58%}.growing-plant{height:58%;width:68%;left:17%;top:15%}.growth-controls{left:0;right:0;bottom:25px;min-width:0}.growth-controls button{padding:11px 18px}.friends{display:flex;flex-direction:column-reverse;gap:35px;padding-top:70px;padding-bottom:65px;align-items:stretch}.friends-copy h2{margin:17px 0 23px}.friends-copy>p:not(.eyebrow){font-size:18px;max-width:none}.friends-copy .friends-footnote{margin-top:22px;padding-top:17px}.friends-film{aspect-ratio:1.1/1;border-radius:28% 28% 22px 22px;width:100%}.choose-header{text-align:left}.choose-header h2{font-size:43px}.choose-header>p:last-child{font-size:16px}.mode-options{grid-template-columns:1fr;gap:30px;margin-top:35px}.mode-art{height:240px}.mode-caption{padding:18px 0 0;display:block}.mode-caption h3{font-size:25px}.mode-caption p{font-size:16px;margin-top:7px}.questions{grid-template-columns:1fr;gap:25px}.questions-heading h2{font-size:42px;margin-top:17px}.answers summary{font-size:17px;padding-top:20px;padding-bottom:20px}.answers p{font-size:16px}.download h2{font-size:47px;letter-spacing:-2px}.download>p:not(.eyebrow){font-size:17px}.download{padding:50px 7% 65px}.download-seed{width:110px;height:110px}footer{gap:20px}.store-buttons{flex-wrap:wrap}}
.mobile-cta{display:none}
@media(max-width:760px){.mobile-cta:not([hidden]){position:fixed;bottom:0;left:0;right:0;z-index:30;display:flex;justify-content:space-between;align-items:center;gap:15px;background:#f9f6eef5;backdrop-filter:blur(12px);padding:13px 5% calc(13px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}.mobile-cta .wordmark{font-size:19px}.mobile-cta .wordmark img{width:32px;height:32px}footer{padding-bottom:100px}}
/* Usability refinement: navigation, touch targets, stable media, small screens. */
html{scroll-padding-bottom:100px}
header nav a{display:inline-flex;align-items:center;min-height:44px}
.mobile-menu{display:none}
.screen-tabs button,.growth-controls button{min-height:44px}
.motion-control{min-width:44px;min-height:44px}
.mode-art{position:relative}
.device img{aspect-ratio:402/874;object-fit:cover}
.hero-cast img{width:auto}
.cast-doctor{width:370px!important}.cast-plum{width:205px!important}.cast-plant{width:185px!important}
.store-note{font-size:14px}
@media(max-width:760px){
 header{gap:10px;flex-wrap:wrap}.wordmark{font-size:20px}.wordmark img{width:34px;height:34px}
 header>.button{margin-left:auto;min-height:44px;font-size:13px;padding:10px 14px}
 .mobile-menu{display:block;margin-left:auto}
 .mobile-menu summary{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 10px;cursor:pointer;font-size:14px;font-weight:800;list-style:none}
 .mobile-menu summary::-webkit-details-marker{display:none}
 .mobile-menu nav{display:flex;position:absolute;left:5%;right:5%;top:78px;flex-direction:column;gap:0;border-radius:18px;background:var(--paper);padding:12px 18px;box-shadow:0 10px 25px #322d3626;border:1px solid var(--line)}
 .mobile-menu nav a{padding:10px 8px;min-height:46px}
 header>.button{margin-left:0}
 .hero{height:800px;min-height:800px}
 .hero h1{font-size:clamp(2.7rem,14vw,3.5rem);letter-spacing:-.035em;line-height:1.04}
 .hero-copy{padding-top:120px}
 .hero-description{font-size:17px;max-width:300px}
 .hero-cast{bottom:25px}
 .cast-doctor{width:260px!important}.cast-plum{width:125px!important}.cast-plant{width:105px!important}
 .store-note{margin-top:16px;font-size:13px}
 .journal-companion{width:145px;left:-15px;bottom:60px;pointer-events:none}
 .device{width:min(250px,80vw)}
 .journal-visual{min-height:610px}
 .growth-controls button{padding:11px 15px}
 .screen-tabs{gap:18px}
 footer{padding-bottom:115px}
}
@media(max-width:360px){header>.wordmark{font-size:18px;gap:5px}header>.wordmark img{width:30px;height:30px}.mobile-menu summary{font-size:13px;padding:0 5px}header>.button{padding:10px;font-size:12px}.hero-cast{width:320px}.cast-doctor{left:35px}.cast-plum{left:-10px}.cast-plant{right:-8px}.hero-description{max-width:270px}.journal-visual{min-height:570px}.journal-companion{width:120px;bottom:60px}.screen-tabs{gap:15px}}
@media(max-width:760px){.journal-companion{display:none}.journal-visual{justify-content:center;padding-right:0}.device{transform:none}.journal-visual{min-height:620px}}
@media(max-width:360px){.journal-visual{min-height:605px}}
.mobile-menu:not([open]) nav{display:none}
.journal-companion{display:none}
.journal-visual{justify-content:center;padding-right:0}

/* Keep navigation within reach, and preserve the complete friendship film. */
header{position:fixed;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
header.is-scrolled{background:#f9f6eef5;backdrop-filter:blur(16px);box-shadow:0 1px 0 var(--line)}
header.is-hidden{transform:translateY(-110%)}
header:focus-within{transform:translateY(0)}
.growth-message{gap:20px;max-width:460px}
.growth-message img{width:160px;height:200px;flex:0 0 160px}
.friends{grid-template-columns:1.55fr 1fr;gap:6%}
.friends-film{aspect-ratio:16/9;border-radius:24px}
.friends-film>video{object-fit:contain}
@media(max-width:760px){
 html{scroll-padding-top:100px}
 .growth-message{gap:14px}
 .growth-message img{width:130px;height:170px;flex-basis:130px}
 .growth-message p{font-size:14px}
 .friends-film{aspect-ratio:16/9;border-radius:18px}
}

/* Center the phone naturally within the journal section. */
.journal-visual{flex-direction:column;align-items:center;justify-content:flex-start;min-height:0}
.journal-visual .device{flex:none}


/* Matched finished artwork; preserve each full composition at every width. */
.mode-art{height:auto;aspect-ratio:3/2;background:#eee9dc}
.mode-art>img{display:block;width:100%;height:100%;max-width:none;object-fit:contain}

/* Readable mode explanations and mobile download access. */
.mode-caption{padding-bottom:0;flex-wrap:wrap;row-gap:8px}
.mode-description{margin-top:14px;font-size:16px;line-height:1.75;color:var(--muted);max-width:48ch}
@media(max-width:760px){
 .mode-options{gap:38px}
 .mode-description{margin-top:12px;max-width:none}
 header{padding-top:max(18px,env(safe-area-inset-top));padding-left:max(5%,env(safe-area-inset-left));padding-right:max(5%,env(safe-area-inset-right))}
 .mobile-cta{padding-left:max(5%,env(safe-area-inset-left))!important;padding-right:max(5%,env(safe-area-inset-right))!important}
 .mobile-cta .button{min-height:48px}
 .mobile-menu nav{top:calc(78px + env(safe-area-inset-top));max-height:calc(100dvh - 170px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain}
 .store-buttons{width:100%}.store-buttons .button{width:100%;max-width:380px}
}

header>.wordmark,.mobile-cta>.wordmark{min-height:44px}

/* Keep the revised brand copy readable within the existing layout. */
.hero-description{max-width:650px;margin-left:auto;margin-right:auto}
@media(max-width:760px){.hero-description{max-width:310px}.hero h1{font-size:clamp(2.5rem,11.5vw,3.5rem)}.download h2{font-size:clamp(2.35rem,10vw,2.94rem)}}
