/* Artwork positions and focus beats mirror the app's bootSchedule and AnimatedLogo. */
.animated-app-logo{position:relative;display:inline-block;flex:none;width:42px;aspect-ratio:978/964;vertical-align:middle;isolation:isolate}.animated-app-logo img{display:block;margin:0;border:0;border-radius:0;max-width:none;object-fit:contain}.animated-app-logo .logo-fallback{position:absolute;inset:0;width:100%;height:100%;opacity:1}.logo-art{position:absolute;inset:0;display:block;opacity:0}.logo-ready .logo-art{opacity:1}.logo-ready .logo-fallback{opacity:0}.animated-app-logo .logo-tile{position:absolute;inset:0;width:100%;height:100%}.animated-app-logo .logo-layer{position:absolute;left:var(--logo-left);top:var(--logo-top);width:var(--logo-width);height:auto;aspect-ratio:var(--logo-aspect);transform-origin:center;pointer-events:none}.logo-flash{position:absolute;inset:0;background:white;border-radius:20.5%;opacity:0;pointer-events:none}.logo-glint{position:absolute;top:-10%;left:-30%;height:120%;width:26%;background:linear-gradient(90deg,transparent,#ffffff85,transparent);transform:translateX(-150%) rotate(22deg);opacity:0;pointer-events:none}.logo-art{clip-path:inset(-22% round 20%)}.motion-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 13px;border:1px solid #c8d2be;border-radius:30px;background:transparent;color:#50694d;font:500 10px/1.4 'DM Sans',sans-serif;cursor:pointer}.motion-toggle:hover{background:#edf1e4}.motion-icon{font-size:11px;letter-spacing:-2px;min-width:10px}.hero-bottom{gap:15px;flex-wrap:wrap}.reading-progress{height:2px;background:#75915f;position:fixed;top:0;left:0;right:0;transform:scaleX(0);transform-origin:left;pointer-events:none;z-index:1000;opacity:.85}html[data-motion=active] .hero-phone{animation:phone-drift 6s 1s ease-in-out infinite}html[data-motion=active] .float-scan{animation:badge-drift 6s 1.4s ease-in-out infinite}html[data-motion=active] .float-plan{animation:badge-drift 6.5s 2s ease-in-out infinite}html[data-motion=active] .app-halo{animation:halo-breathe 8s 1.5s ease-in-out infinite}.button,.nav-cta,.product-tab,.tour-controls button,.product-feature,.daily-grid article{transition:transform .25s cubic-bezier(.2,.7,.2,1),background .25s,border-color .25s,box-shadow .25s}.button>span,.nav-cta>span,.text-link>span{display:inline-block;transition:transform .25s cubic-bezier(.2,.7,.2,1)}.button:hover>span,.button:focus-visible>span,.nav-cta:hover>span{transform:translate(2px,-2px)}.tour-controls button:hover{transform:translateY(-2px);background:#e2ebcf}.product-tab:hover{border-color:#91a27d}.product-feature:hover{transform:translateY(-3px)}.daily-grid article:hover{transform:translateY(-4px);box-shadow:0 12px 26px #193c3009}.hero-art{will-change:auto}.motion-toggle:focus-visible{outline:3px solid #779665;outline-offset:3px}
@keyframes phone-drift{0%,100%{translate:0 0}50%{translate:0 -9px}}@keyframes badge-drift{0%,100%{translate:0 0}50%{translate:0 -4px}}@keyframes halo-breathe{0%,100%{scale:1;opacity:1}50%{scale:1.025;opacity:.8}}
@media(max-width:600px){.animated-app-logo{width:38px}.hero-bottom .motion-toggle{order:3;margin:0;min-height:44px;font-size:10px}.hero-bottom>span{max-width:calc(50% - 12px)}.hero-bottom .motion-toggle .motion-icon{font-size:11px}.hero-bottom{padding:16px 0;row-gap:12px}html[data-motion=active] .hero-phone{animation-name:phone-drift-small}html[data-motion=active] .float-scan,html[data-motion=active] .float-plan{animation-name:badge-drift-small}@keyframes phone-drift-small{0%,100%{translate:0 0}50%{translate:0 -5px}}@keyframes badge-drift-small{0%,100%{translate:0 0}50%{translate:0 -2px}}}
@media(max-width:360px){.animated-app-logo{width:34px}}
html[data-motion=paused] .hero-phone,html[data-motion=paused] .float-scan,html[data-motion=paused] .float-plan,html[data-motion=paused] .app-halo{animation:none!important}html[data-motion=paused] .bmi-dialog *{animation:none!important;transition:none!important}html[data-motion=paused] .scan-line{animation:none!important}html[data-motion=paused] .button,html[data-motion=paused] .button>span,html[data-motion=paused] .product-feature,html[data-motion=paused] .daily-grid article{transition:none!important}
@media(hover:none){.product-feature:hover,.daily-grid article:hover{transform:none;box-shadow:none}}
@media(prefers-reduced-motion:reduce){.hero-phone,.float-scan,.float-plan,.app-halo{animation:none!important}*,*::before,*::after{transition:none!important}.reading-progress{display:none}}
html.hero-outside-view .hero-phone,html.hero-outside-view .float-scan,html.hero-outside-view .float-plan,html.hero-outside-view .app-halo,html.page-away .hero-phone,html.page-away .float-scan,html.page-away .float-plan,html.page-away .app-halo{animation-play-state:paused!important}
.hero-bottom .motion-toggle>span{max-width:none}.motion-toggle .motion-label{white-space:nowrap}