@font-face{font-family:Chewy;src:url('/assets/chewy.ttf') format('truetype');font-display:swap}
:root{--ink:#352012;--cream:#fff5db;--gold:#f5b847;--mx:0;--my:0;color-scheme:light}
*{box-sizing:border-box}
html{background:#436c29;scroll-behavior:smooth}
body{margin:0;min-width:320px;font-family:'Segoe UI',system-ui,sans-serif;color:var(--ink)}
a{-webkit-tap-highlight-color:transparent}
a{color:inherit}
a:focus-visible{outline:3px solid var(--cream);outline-offset:6px;box-shadow:0 0 0 9px var(--ink)}
[hidden]{display:none!important}
.scene{position:relative;isolation:isolate;display:grid;grid-template-rows:1fr;min-height:760px;min-height:max(700px,100svh);overflow:hidden;background:#a4b866}
.backyard{position:absolute;z-index:-5;inset:-2%;transform:translate3d(calc(var(--mx)*-.35px),calc(var(--my)*-.35px),0) scale(1.025);will-change:transform}
.backyard img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 52%}
.light{position:absolute;inset:0;z-index:-4;pointer-events:none;background:linear-gradient(180deg,rgba(255,245,219,.1),transparent 65%,rgba(24,39,15,.48))}
.main{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 20px 70px;z-index:2}
.brand{width:clamp(300px,46vw,550px);max-width:calc(100vw - 44px);position:relative;transform:translate3d(calc(var(--mx)*1px),calc(var(--my)*1px),0);will-change:transform}
h1{margin:0;font-size:0}
.logo{display:block;width:100%;height:auto;filter:drop-shadow(0 14px 10px rgba(45,55,16,.2));user-select:none;-webkit-user-drag:none}
.logo-float{animation:logo-float 7s ease-in-out infinite;transform-origin:50% 75%}
.brand:hover .logo-float{animation-duration:3.5s}
.download-area{display:flex;flex-direction:column;align-items:center;position:relative;z-index:2;margin-top:17px}
.download-button{display:flex;align-items:center;justify-content:center;gap:14px;min-height:68px;padding:16px 26px;border:3px solid var(--ink);border-radius:18px;background:var(--cream);box-shadow:0 6px 0 var(--ink),0 12px 30px rgba(38,41,14,.2);font:25px Chewy,cursive;text-decoration:none;transform:rotate(-1deg);transition:transform .2s,box-shadow .2s,background .2s}
.download-button:hover{transform:translateY(-4px) rotate(1deg);box-shadow:0 10px 0 var(--ink),0 15px 34px rgba(38,41,14,.2);background:#fffbed}
.download-button:active{transform:translateY(5px) rotate(0);box-shadow:0 1px 0 var(--ink)}
.download-arrow{animation:arrow-bob 3s ease-in-out infinite}
.release-note{margin:20px 0 0;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center;border-radius:50px;padding:7px 14px;color:var(--ink);background:rgba(255,245,219,.91);font-size:12px;font-weight:600;box-shadow:0 2px 10px rgba(20,30,8,.08)}
.spark{position:absolute;color:#fff5b9;font-size:35px;text-shadow:1px 2px 0 #785f20;animation:twinkle 5s ease-in-out infinite;pointer-events:none}
.spark-one{top:43%;left:-6%;animation-delay:-2s}
.spark-two{top:15%;right:4%;font-size:27px;animation-delay:-.8s}
.spark-three{bottom:9%;right:-7%;font-size:20px;animation-delay:-3.8s}
.atmosphere,.ant-trail,.foreground{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.atmosphere{z-index:1}
.mote{position:absolute;width:5px;height:5px;border-radius:50%;background:#fff7c6;box-shadow:0 0 7px rgba(255,244,180,.5);opacity:0;animation:mote-drift var(--duration) ease-in-out infinite;animation-delay:var(--delay)}
.butterfly{position:absolute;width:30px;height:24px;z-index:1;pointer-events:none;animation:butterfly-drift 17s ease-in-out infinite}
.butterfly:after{content:'';position:absolute;left:14px;top:8px;width:3px;height:12px;border-radius:5px;background:#513620;transform:rotate(12deg)}
.butterfly i,.butterfly b{position:absolute;width:15px;height:22px;top:0;background:#f5ad48;border:1.5px solid #714e26;box-shadow:inset 0 -5px 0 #e97e3e;border-radius:65% 50% 40% 70%;animation:wing .42s ease-in-out infinite alternate;transform-origin:100% 65%}
.butterfly b{left:15px;transform-origin:0 65%;border-radius:50% 65% 70% 40%;animation-delay:-.15s}
.butterfly-one{left:13%;top:44%;animation-delay:-6s}
.butterfly-two{right:15%;top:30%;animation-duration:21s;animation-delay:-12s;scale:.7;rotate:-15deg}
.butterfly-two i,.butterfly-two b{background:#f4dca1;box-shadow:inset 0 -5px 0 #c5a063}
.butterfly-three{right:27%;bottom:25%;animation-duration:23s;animation-delay:-4s;scale:.55;opacity:.8}
.butterfly-three i,.butterfly-three b{background:#d5b9e1;box-shadow:inset 0 -5px 0 #b098ca}
.ant-trail{z-index:3}
.tiny-ant{position:absolute;left:-55px;bottom:var(--bottom);width:var(--size);height:28px;animation:ant-walk var(--duration) linear infinite;animation-delay:var(--delay);opacity:.88;filter:drop-shadow(0 3px 1px rgba(20,20,8,.2))}
.tiny-ant svg{width:100%;height:100%;overflow:visible}
.ant-legs-a{animation:legs .22s linear infinite alternate;transform-origin:center}
.ant-legs-b{animation:legs .22s linear infinite alternate-reverse;transform-origin:center}
.foreground{z-index:1}
.leaf{position:absolute;width:160px;height:220px;bottom:-110px;transform-origin:100% 100%;animation:leaf-sway 8s ease-in-out infinite;filter:drop-shadow(2px 4px 3px rgba(25,38,12,.3))}
.leaf-left{left:-65px;rotate:18deg}
.leaf-right{right:-70px;scale:-1 1;rotate:-15deg;animation-delay:-3s;animation-duration:11s}
[data-motion=paused] *,[data-motion=paused] *:before,[data-motion=paused] *:after{animation-play-state:paused!important}
[data-motion=paused] .backyard,[data-motion=paused] .brand{transform:none;will-change:auto}
@keyframes logo-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-10px) rotate(1deg)}}
@keyframes arrow-bob{0%,60%,100%{transform:translateY(0)}70%{transform:translateY(3px)}80%{transform:translateY(0)}90%{transform:translateY(3px)}}
@keyframes twinkle{0%,100%{opacity:.3;transform:scale(.65) rotate(-10deg)}50%{opacity:1;transform:scale(1.1) rotate(12deg)}}
@keyframes mote-drift{0%,100%{opacity:0;transform:translate3d(0,10px,0)}20%,75%{opacity:.65}90%{opacity:0}100%{transform:translate3d(35px,-80px,0)}}
@keyframes wing{from{transform:scaleX(.35) rotate(8deg)}to{transform:scaleX(1) rotate(-8deg)}}
@keyframes butterfly-drift{0%,100%{transform:translate3d(0,0,0) rotate(-12deg)}25%{transform:translate3d(32px,-20px,0) rotate(16deg)}50%{transform:translate3d(70px,8px,0) rotate(-8deg)}75%{transform:translate3d(16px,30px,0) rotate(20deg)}}
@keyframes ant-walk{from{transform:translateX(0)}to{transform:translateX(calc(100vw + 110px))}}
@keyframes legs{from{transform:skewX(-14deg)}to{transform:skewX(14deg)}}
@keyframes leaf-sway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(4deg)}}
@media(min-width:1600px){.brand{width:min(630px,57vh)}.main{padding-bottom:60px}.backyard img{object-position:50% 60%}}
@media(max-height:800px) and (min-width:601px){.scene{min-height:max(620px,100svh)}.brand{width:min(440px,53vh)}.main{padding-bottom:30px}.download-button{min-height:60px;font-size:23px}}
@media(max-width:600px){.scene{min-height:max(690px,100svh)}.backyard img{object-position:48% 50%}.brand{width:min(88vw,440px)}.main{padding:10px 22px 90px}.download-area{margin-top:28px}.download-button{min-height:62px;gap:11px;padding:14px 19px;font-size:23px}.download-button>svg{width:20px}.release-note{font-size:11px;gap:6px;margin-top:18px}.spark-one{left:0;top:42%;font-size:24px}.spark-two{right:5%;top:10%}.spark-three{right:0;bottom:6%}.butterfly-one{left:7%;top:30%}.butterfly-two{right:12%;top:69%}.butterfly-three{right:15%;bottom:17%}.leaf{width:130px;height:180px;bottom:-90px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}html:not([data-motion=running]) *,html:not([data-motion=running]) *:before,html:not([data-motion=running]) *:after{animation:none!important;transition:none!important}.backyard,.brand{will-change:auto}}