.app-showcase{background:#eee7e0;padding:88px 0;color:#251b25;transition:background .5s,color .5s}.app-showcase.is-dark{background:#15141c;color:#fff}.showcase-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center}.showcase-copy h2{letter-spacing:-.06em}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:48px}.feature-number{font-size:13px;color:#be0062;font-weight:800}.is-dark .feature-number{color:#ff67af}.feature-grid h3{font-size:23px;margin:8px 0 12px;letter-spacing:-.035em}.feature-grid p{font-size:16px;line-height:1.65;opacity:.8}.showcase-demo{text-align:center;min-width:0}.showcase-demo .phone{width:min(100%,310px);margin:22px auto 0}.showcase-demo .phone img,.showcase-demo .phone video{width:100%;height:auto;aspect-ratio:1206/2622;display:block}.showcase-demo [hidden]{display:none!important}.view-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}.view-buttons button{font:inherit;font-size:14px;font-weight:750;border:0;border-bottom:2px solid transparent;color:inherit;background:transparent;padding:12px 10px;cursor:pointer;min-height:44px}.view-buttons button[aria-pressed=true]{color:#bb005d;border-color:currentColor}.is-dark .view-buttons button[aria-pressed=true]{color:#ff67af}.theme-toggle{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:20px;cursor:pointer;font-size:14px;min-height:44px}.theme-toggle input{position:absolute;opacity:0}.toggle-track{height:26px;width:46px;background:#948792;border-radius:30px;position:relative}.toggle-track:after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:white;transition:transform .25s}.theme-toggle input:checked+.toggle-track{background:#d90070}.theme-toggle input:checked+.toggle-track:after{transform:translateX(20px)}.theme-toggle input:focus-visible+.toggle-track{outline:3px solid currentColor;outline-offset:4px}.preview-caption{font-size:13px;margin:20px auto 0;opacity:.75}.open-faq{padding-block:80px}.open-faq>div{display:grid;grid-template-columns:1fr 1fr;gap:32px 64px;margin-top:40px}.open-faq article{border-top:1px solid #d8cfc5;padding-top:24px}.open-faq h3{font-size:19px;margin-bottom:12px}.open-faq p{font-size:16px;line-height:1.7;color:#57504c}
.lake-ending:before{background-image:url('assets/lake-seated.webp?v=3ce25d50f6');background-position:center;background-size:100% 100%}.lake-ending:after{background:linear-gradient(transparent 85%,#211d3060)}.lake-ending{min-height:1000px}.lake-bottom{padding-top:420px}.water-glow{position:absolute;pointer-events:none;inset:0;opacity:.16;background-image:repeating-linear-gradient(177deg,transparent 0 12px,#ffeadf80 13px 14px,transparent 15px 27px);background-size:calc(100% + 36px) calc(100% + 16px);background-repeat:no-repeat;mask-image:url('assets/lake-water-mask.webp?v=c2050dba5c');-webkit-mask-image:url('assets/lake-water-mask.webp?v=c2050dba5c');mask-size:cover;-webkit-mask-size:cover;mask-position:right bottom;-webkit-mask-position:right bottom;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;animation:lake-shimmer 11s ease-in-out infinite alternate;z-index:0}.water-glow{animation-play-state:paused}.lake-ending.is-visible .water-glow{animation-play-state:running}@keyframes lake-shimmer{from{background-position:0 0;opacity:.07}to{background-position:-18px -8px;opacity:.19}}
@media(max-width:799px){.app-showcase{padding:56px 0}.showcase-grid{grid-template-columns:1fr;gap:40px}.feature-grid{gap:26px 20px;margin-top:32px}.feature-grid h3{font-size:20px}.feature-grid p{font-size:15px}.showcase-demo .phone{width:min(100%,310px)}.open-faq{padding-block:56px}.open-faq>div{grid-template-columns:1fr;gap:20px}}
@media(max-width:599px){.lake-ending:before{background-image:url('assets/lake-seated-mobile.webp?v=d067b77ac5');background-size:100% 100%}.lake-ending{min-height:1050px}.lake-top p{max-width:290px}.lake-bottom{padding-top:390px}.lake-cta{padding-top:160px}.lake-cta h3{max-width:54%}.water-glow{mask-image:url('assets/lake-water-mask-mobile.webp?v=1990411148');-webkit-mask-image:url('assets/lake-water-mask-mobile.webp?v=1990411148');mask-size:auto 100%;-webkit-mask-size:auto 100%;mask-position:82% bottom;-webkit-mask-position:82% bottom}.view-buttons{gap:0}.view-buttons button{padding-inline:8px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.water-glow{animation:none!important;opacity:.1}.app-showcase,.toggle-track:after{transition:none}}
@media(min-width:1800px){.lake-ending{min-height:calc(100vw * .72)}}
/* Brand palette: white, vanilla, deep pink and the fox's warm orange. */
.app-art .fox{filter:none} /* The transparent poster already contains paw contact shadows. */
:root{--white:#fff;--paper:#fbf7ef;--pink:#d90070;--fox-orange:#f58a24;--fox-ink:#863b09}
.app-showcase{background:var(--white)}
.app-showcase .eyebrow{color:var(--fox-ink)}
.feature-number{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--fox-orange);color:#301908;font-weight:800}
.is-dark .feature-number{background:var(--fox-orange);color:#301908}
.is-dark .eyebrow{color:#ffad59}
.view-buttons button[data-view=guide][aria-pressed=true]{color:var(--fox-ink);border-color:var(--fox-orange);background:#fff1df;border-radius:5px 5px 0 0}
.is-dark .view-buttons button[data-view=guide][aria-pressed=true]{color:#ffb96d;background:#332316}
.benefits li:last-child svg{color:var(--pink)}
.signature:after{background:var(--fox-orange)}
.lake-cta .store-btn{background:var(--fox-orange);color:#301908}
.lake-cta .store-btn:hover{background:#ffad59;color:#301908}
.lake-cta .store-btn:focus-visible{outline:3px solid white;outline-offset:4px}
.open-faq h2:after{content:'';display:block;width:72px;height:5px;background:var(--fox-orange);margin-top:24px}
/* Natural image ratio: anchor the subject at the right; surplus spills left. */
.lake-ending:before{background-size:cover;background-position:right bottom}
@media(min-width:600px){.lake-ending{min-height:max(1000px,66.667vw)}}
@media(max-width:599px){.lake-ending:before{background-size:auto 100%;background-position:82% bottom}}
.showcase-demo{display:flex;flex-direction:column;align-items:center}
.view-buttons{display:grid;grid-template-columns:repeat(4,auto);gap:3px;padding:5px;background:#eeeae7;border:1px solid #d9d3cf;border-radius:12px;width:max-content;max-width:100%}
.view-buttons button,.view-buttons button[data-view=guide][aria-pressed=true]{border:0;border-radius:8px;background:transparent;color:#282328;padding:10px 12px;font-weight:750;min-height:44px;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s,box-shadow .15s}
.view-buttons button:hover{background:#fff}
.view-buttons button[aria-pressed=true],.view-buttons button[data-view=guide][aria-pressed=true]{background:#d90070;color:white;box-shadow:0 2px 5px #4a002522}
.view-buttons button:focus-visible{outline:2px solid #d90070;outline-offset:2px}
.theme-toggle{align-self:flex-end;margin:8px 0 0;font-size:12px;gap:8px;min-height:36px;padding:0 6px}
.showcase-demo .phone{margin-top:10px}
.toggle-track{width:38px;height:22px;background:#676067}.toggle-track:after{width:16px;height:16px}.theme-toggle input:checked+.toggle-track:after{transform:translateX(16px)}
.is-dark .view-buttons{background:#26232b;border-color:#49414a}.is-dark .view-buttons button{color:white}.is-dark .view-buttons button:hover{background:#443a46}.is-dark .view-buttons button[aria-pressed=true],.is-dark .view-buttons button[data-view=guide][aria-pressed=true]{background:#d90070;color:white}
.lake-cta .store-btn{background:#d90070;color:white}.lake-cta .store-btn:hover{background:#ae005a;color:white}
@media(max-width:599px){.view-buttons{width:100%;grid-template-columns:repeat(4,1fr)}.view-buttons button{font-size:11px;padding-inline:5px}.theme-toggle{margin-right:0}}

/* Let the lake sky emerge unevenly from the preceding vanilla section. */
.lake-ending{background:var(--paper)}
.lake-ending:after{
 background:
  linear-gradient(to bottom,var(--paper),#fbf7ef00) top / 100% 110px no-repeat,
  radial-gradient(ellipse at 25% 0%,var(--paper) 0 25%,#fbf7ef00 73%) left top / 78% 240px no-repeat,
  radial-gradient(ellipse at 80% 0%,var(--paper) 0 18%,#fbf7ef00 72%) right top / 57% 160px no-repeat,
  linear-gradient(transparent 85%,#211d3060);
}
@media(max-width:599px){.lake-ending:after{background-size:100% 80px,85% 170px,62% 115px,100% 100%}}
