/* Alpine motion: stable records, a softly breathing material around them. */
:root{--motion-ink:#30425f;--motion-blue:#8ba8c6;--motion-ease:cubic-bezier(.22,.75,.2,1)}
.motion-nav-marker{position:absolute;top:7px;height:36px;border-radius:20px;background:#90acc41c;pointer-events:none;z-index:0}
.bottom-nav .nav-item{z-index:1}
.life-periods.motion-tabs{position:relative}.life-periods.motion-tabs button[aria-pressed="true"]{border-bottom-color:transparent}
.motion-period-marker{height:2px;background:#61768e;position:absolute;bottom:-1px;pointer-events:none}
.motion-clock-second{display:inline-block;min-width:2ch;text-align:left;font-variant-numeric:tabular-nums}
.compass-ambient{pointer-events:none}
.compass-membrane,.compass-inner-light,.compass-inner-current{transform-box:view-box;transform-origin:160px 156px}
.compass-membrane-back{transform:rotate(-6deg) scale(1.13,.98)}
.compass-membrane-front{transform:rotate(5deg) scale(.98,1.12)}
.life-compass .life-ambient-toggle{position:absolute;right:0;bottom:0;display:grid;place-items:center;width:44px;height:44px;padding:0;color:#60738c;border:0;background:transparent;border-radius:50%}
.life-compass .life-ambient-toggle svg{width:18px;height:18px;aspect-ratio:1;overflow:visible}
.life-ambient-toggle .ambient-play-icon{display:none}
.life-ambient-toggle[aria-pressed="true"] .ambient-play-icon{display:block}
.life-ambient-toggle[aria-pressed="true"] .ambient-pause-icon{display:none}
.life-ambient-toggle:disabled{opacity:.45;cursor:default}
.home-time-track [data-time-now]{position:absolute;top:0;bottom:0;width:1.5px;background:#526b8c;box-shadow:0 0 0 2px #f5f8fc88;z-index:2;pointer-events:none;transition:left 1s linear}
.life-motion-ready .home-now-card{position:relative;overflow:hidden}
.life-motion-ready .home-now-card::after{content:"";position:absolute;bottom:0;left:0;width:32%;height:2px;background:linear-gradient(90deg,transparent,#7f9fc9b3,transparent);transform:translateX(-100%);pointer-events:none}
@media(prefers-reduced-motion:no-preference){
 .life-motion-ready .home-now-card::after{animation:focus-time-flow 4.6s linear infinite}
 .life-motion-ready :is(.nav-item,.life-compass-label,.life-compass-center,.life-source-row,.life-tools-trigger,.home-pause,.task-focus,.icon-button){transition:transform 160ms var(--motion-ease),color 160ms ease}
 .life-motion-ready :is(.nav-item,.life-compass-label,.life-compass-center,.life-source-row,.life-tools-trigger,.home-pause,.task-focus,.icon-button):active{transform:scale(.96)}
 /* Compass labels already use a layout transform. Keep that anchor during press. */
 .life-motion-ready :is(.life-compass-label,.life-compass-center):active{transform:translate(-50%,-50%) scale(.96)}
 @keyframes focus-time-flow{to{transform:translateX(420%)}}
}
body.motion-paused .home-now-card::after,body.motion-paused .home-focus-ring{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){
 .life-motion-ready .home-now-card::after{display:none}
 .life-motion-ready .home-focus-ring{animation:none!important}
 .life-motion-ready .home-time-track [data-time-now]{transition:none}
 .life-motion-ready #screen,.life-motion-ready .bottom-nav *,.life-motion-ready .life-page *{scroll-behavior:auto}
}
