:root{color-scheme:dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f6f3f5;background:#08090d;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}body{margin:0}html{scroll-behavior:smooth}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #b9ebff;outline-offset:6px}a:hover{color:#fff}.skip{position:fixed;top:8px;left:8px;z-index:100;background:#fff;color:#000;padding:12px;transform:translateY(-150%)}.skip:focus{transform:none}
.topbar{position:fixed;inset:0 0 auto;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:22px 5vw;background:linear-gradient(#08090df0, #08090d80 65%,transparent);pointer-events:none}.topbar a{pointer-events:auto}.brand{font-size:18px;font-weight:550;letter-spacing:-.04em}.brand span{display:block;font-size:9px;letter-spacing:.16em;text-transform:uppercase;margin-top:5px;color:#b8b7c3}nav{display:flex;gap:24px}nav a{font-size:12px;min-height:44px;display:grid;place-items:center;white-space:nowrap;color:#c0bec9;position:relative}nav a:after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:#fff;transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}nav a[aria-current]:after,nav a:hover:after{transform:scaleX(1)}
.chapter{height:160svh;position:relative;--color:85,135,255}.together{--color:240,140,172}.sakura{--color:232,114,171}.stage{height:100svh;min-height:680px;position:sticky;top:0;isolation:isolate;overflow:hidden;background:#08090d}.stage:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(transparent 82%,#08090d)}
.scenery{position:absolute;inset:-5%;z-index:-3;transform:scale(1.07)}.scenery picture{display:block;width:100%;height:100%}.scenery-img{width:100%;height:100%;object-fit:cover}.ambient{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#07080bf2 0%,#07080bb8 30%,#07080b15 68%),radial-gradient(ellipse at 70% 55%,rgba(var(--color),.1),transparent 65%)}.light-rays{position:absolute;inset:-10%;z-index:-1;pointer-events:none;background:conic-gradient(from 208deg at 78% 0%,transparent,rgba(var(--color),.12) 9deg,transparent 18deg,rgba(var(--color),.06) 24deg,transparent 34deg);animation:light-drift 18s ease-in-out infinite alternate;opacity:.55}
.copy{position:absolute;left:8vw;top:50%;translate:0 -44%;width:43%;max-width:670px;z-index:4;text-shadow:0 2px 22px #0005}.eyebrow{font-size:10px;line-height:1.5;text-transform:uppercase;letter-spacing:.19em;color:#c2b9c8;margin:0 0 25px}h1,h2{font-weight:400;letter-spacing:-.06em;line-height:1.05;margin:0}h1{font-size:clamp(72px,8.7vw,140px)}h2{font-size:clamp(43px,5.5vw,88px)}em{font-style:normal;color:#f6becf}.intro{font-size:clamp(19px,1.8vw,25px);line-height:1.5;color:#cbc7d0;max-width:28ch;margin:26px 0 0}.description{font-size:clamp(16px,1.45vw,20px);line-height:1.65;color:#d1c7d2;max-width:35ch;margin:24px 0}.app-name{font-size:13px;color:#f0cbd7;margin-top:24px}.app-icon-badge{width:38px;height:38px;border-radius:9px;vertical-align:middle;margin-right:12px;object-fit:cover}
.art{position:absolute;right:0;top:9%;width:56%;height:79%;display:grid;place-items:center;pointer-events:none;z-index:2;perspective:1000px}.art-rig{position:relative;width:100%;display:grid;place-items:center;animation:glass-float 8s ease-in-out infinite;transform-origin:50% 55%}.studio-art{right:0;width:59%;top:9%;height:85%}.studio-art .art-rig{animation-duration:10s}.studio-art img{display:block;width:100%;height:auto;clip-path:inset(0 0 25% 0)}.sculpture{display:block;width:100%;height:auto;object-fit:contain;max-width:760px;filter:drop-shadow(0 22px 26px #0006)}.reflection{height:auto;position:absolute;top:76%;width:86%;transform:scaleY(-.28);transform-origin:top;opacity:.13;mask-image:linear-gradient(transparent,black 90%);pointer-events:none}.halo{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(ellipse,rgba(var(--color),.16),transparent 68%);animation:halo-breathe 10s ease-in-out infinite alternate}.side-note{position:absolute;right:5vw;bottom:8vh;text-align:right;line-height:2;font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:#b9aebf;z-index:3;padding-right:20px;border-right:1px solid #ffffff40}.chapter-line{display:none}
.scroll-cue{display:inline-flex;align-items:center;gap:24px;min-height:44px;margin-top:40px;font-size:13px;color:#d2cbd8}.scroll-cue span{font-size:25px;transition:transform .4s var(--ease)}.scroll-cue:hover span{transform:translateY(5px)}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:22px;margin-top:28px}.button{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:30px;min-height:48px;padding:14px 24px;border:1px solid #ead0df85;border-radius:40px;font-size:14px;background:#ffffff0c;color:#fff;transition:transform .35s var(--ease),background .3s,border-color .3s;isolation:isolate}.button:before{content:"";position:absolute;inset:-100% -50%;background:linear-gradient(110deg,transparent 38%,#fff2 50%,transparent 62%);transform:translateX(-70%);transition:transform .7s var(--ease);z-index:-1}.button:hover{background:#ffffff18;border-color:#f6d6e5;transform:translateY(-2px)}.button:hover:before{transform:translateX(70%)}.button:active{transform:translateY(0) scale(.98)}.store{font-size:13px;text-decoration:underline;text-underline-offset:5px;min-height:44px;display:inline-flex;align-items:center}.availability{max-width:37ch;font-size:12px;color:#beb2c2;line-height:1.65;margin:15px 0}.utility{display:flex;gap:26px;margin-top:20px;font-size:13px;color:#d0c1d1}.utility a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:6px}
.floating-layer{position:absolute;inset:-4%;pointer-events:none;z-index:1}.petal{position:absolute;display:block;width:19px;height:29px;border-radius:75% 15% 70% 20%;background:linear-gradient(140deg,#fff5f7,#e992b4 60%,#812348);box-shadow:inset 1px 0 2px #fff9;opacity:.45;animation:petal-drift var(--duration,13s) ease-in-out infinite alternate;--dx:32px;--dy:65px;--angle:25deg}.p1{left:57%;top:14%;--duration:15s;animation-delay:-5s}.p2{left:88%;top:28%;--dx:-44px;--dy:85px;--angle:-35deg;--duration:18s;animation-delay:-11s;width:26px;height:38px;opacity:.3}.p3{left:72%;top:74%;--dx:32px;--dy:-48px;--duration:12s;animation-delay:-7s;width:13px;height:21px}.p4{left:45%;top:87%;--dx:60px;--dy:-36px;--duration:20s;animation-delay:-3s;opacity:.25}.p5{left:94%;top:62%;--dx:-40px;--dy:40px;--duration:16s;animation-delay:-8s}.glass-block{position:absolute;display:block;border-radius:18%;border:1px solid #f89bd477;background:linear-gradient(135deg,#ffc3e275,#f336ae20 35%,#70286150 60%,#ff9ecc50);box-shadow:inset 2px 2px 4px #fff6;animation:petal-drift 20s ease-in-out infinite alternate;--angle:20deg;--dx:-20px;--dy:35px;opacity:.32}.b1{width:65px;height:65px;right:8%;top:15%;animation-delay:-4s}.b2{width:32px;height:32px;right:48%;top:65%;--dy:-40px;animation-delay:-12s}.b3{width:85px;height:85px;right:3%;bottom:12%;animation-delay:-8s}.studio .petal{width:4px;height:4px;border-radius:50%;background:#b4dfff;box-shadow:0 0 12px #6faaff;opacity:.65}
@keyframes glass-float{0%,100%{transform:translate3d(-4px,8px,0) rotate(-1deg)}50%{transform:translate3d(5px,-16px,0) rotate(1deg)}}@keyframes petal-drift{from{transform:translate3d(0,0,0) rotate(var(--angle))}to{transform:translate3d(calc(var(--dx)*1.4),calc(var(--dy)*1.4),0) rotate(calc(var(--angle) + 65deg))}}@keyframes light-drift{from{transform:rotate(-4deg);opacity:.35}to{transform:rotate(4deg);opacity:.7}}@keyframes halo-breathe{from{transform:scale(.95);opacity:.6}to{transform:scale(1.08);opacity:1}}
.chapter .art-rig,.chapter .petal,.chapter .glass-block,.chapter .light-rays,.chapter .halo{animation-play-state:paused}.chapter.is-visible .art-rig,.chapter.is-visible .petal,.chapter.is-visible .glass-block,.chapter.is-visible .light-rays,.chapter.is-visible .halo{animation-play-state:running}.chapter.is-visible .art,.chapter.is-visible .scenery{will-change:transform}.page-hidden *{animation-play-state:paused!important}
.motion-ready .copy>*{opacity:0;transform:translateY(18px);transition:opacity .65s var(--ease),transform .8s var(--ease)}.motion-ready .copy.is-revealed>*{opacity:1;transform:none}.copy>*:nth-child(2){transition-delay:65ms}.copy>*:nth-child(3){transition-delay:130ms}.copy>*:nth-child(4){transition-delay:180ms}.copy>*:nth-child(n+5){transition-delay:220ms}.copy:focus-within>*{opacity:1!important;transform:none!important}
footer{padding:65px 8vw;display:flex;gap:45px;justify-content:space-between;flex-wrap:wrap;border-top:1px solid #ffffff18;font-size:13px;color:#bdb3c3;background:#08090d}footer p{margin-top:14px}.footer-apps{display:flex;gap:55px}.footer-apps div{display:flex;flex-direction:column;gap:14px}.footer-apps strong{color:#eee4ec;font-weight:500}footer>a{align-self:flex-start}
@media(max-width:750px){.topbar{padding:17px 20px 28px;background:linear-gradient(#08090df5 45%,transparent)}.brand{font-size:14px}.brand span{font-size:8px;letter-spacing:.1em}.topbar nav{gap:12px}.topbar nav a{font-size:10px}.chapter{height:120svh}.stage{height:100svh;min-height:740px;padding:88px 24px 34px;display:flex;flex-direction:column;justify-content:center;gap:8px}.scenery-img{object-position:68% center}.ambient{background:linear-gradient(0deg,#07080dda 0%,#07080b80 55%,#07080b20)}.art,.studio-art{position:relative;right:auto;top:auto;width:100%;height:29svh;min-height:165px;flex:none}.art-rig{width:min(100%,340px)}.studio-art .art-rig{width:min(110%,390px)}.studio-art{height:31svh}.sculpture{width:auto;max-height:29svh;max-width:100%;filter:none}.studio-art img{max-height:40svh;width:auto;max-width:120%}.copy{position:relative;left:auto;top:auto;translate:none;width:100%;max-width:none}.eyebrow{font-size:9px;letter-spacing:.14em;margin:0 0 14px}h1{font-size:58px}h2{font-size:37px}.intro{font-size:18px;margin-top:18px;max-width:29ch}.description{font-size:15px;line-height:1.55;margin:16px 0;max-width:38ch}.app-name{font-size:12px;margin:15px 0}.app-icon-badge{width:28px;height:28px;border-radius:7px;margin-right:9px}.actions{margin-top:18px;gap:14px}.button{padding:12px 20px;font-size:13px}.utility{margin-top:12px;font-size:12px}.availability{font-size:11px;margin:12px 0}.scroll-cue{margin-top:19px}.side-note,.reflection,.halo{display:none}.light-rays{inset:0;opacity:.25}.petal{width:12px;height:19px;opacity:.35;--dx:18px;--dy:35px}.p1{left:7%;top:16%}.p2{left:89%;top:20%}.p3{left:85%;top:48%}.p4,.p5,.b2,.b3{display:none}.b1{width:36px;height:36px;right:8%;top:14%}.floating-layer{z-index:1}.copy{z-index:4}footer{padding:44px 24px;gap:32px}.footer-apps{gap:35px}}
@media(max-width:750px) and (max-height:740px){.chapter{height:auto}.stage{position:relative;height:auto;min-height:100svh;padding-top:90px;padding-bottom:48px}.art,.studio-art{height:190px;min-height:0}.sculpture{max-height:200px}.studio-art img{max-height:270px}h1{font-size:48px}h2{font-size:33px}}
@media(min-width:751px) and (max-height:680px){.chapter{height:auto}.stage{position:relative;height:720px}}
@media(max-width:370px){.topbar{gap:10px}.topbar .brand{font-size:12px;white-space:nowrap;flex-shrink:0}.topbar .brand span{font-size:7px;letter-spacing:.06em}.topbar nav{gap:8px}.topbar nav a{font-size:8.5px}}

/* A moving wash of light follows the scroll; the ambient layer keeps breathing at rest. */
.scroll-light{position:absolute;inset:-15%;pointer-events:none;z-index:-1;background:radial-gradient(ellipse 40% 65% at 75% 50%,rgba(var(--color),.35),transparent 70%);opacity:.12;transform-origin:70% 50%}.chapter.is-visible .scroll-light,.chapter.is-visible .floating-layer{will-change:transform}
