/* Motion system: short responses, gentle entrances, no navigation delays. */
:root{--motion-ease:cubic-bezier(.22,.68,.24,1)}
@view-transition{navigation:auto}
::view-transition-old(root){animation:motion-page-out .16s ease both}
::view-transition-new(root){animation:motion-page-in .24s var(--motion-ease) both}
@keyframes motion-page-out{to{opacity:0}}
@keyframes motion-page-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.motion-ready .reveal{transition-duration:.6s!important;transition-timing-function:var(--motion-ease)!important}
.motion-ready .reveal:not(.visible){transform:translateY(16px)}
.motion-section{transition:opacity .6s var(--motion-ease),transform .6s var(--motion-ease)}
.motion-section.motion-waiting{opacity:0;transform:translateY(18px)}
.motion-section.motion-entered{opacity:1;transform:none}
.metric-card strong{font-variant-numeric:tabular-nums}
.metric-card.motion-counting .metric-icon{animation:motion-icon-arrive .55s var(--motion-ease) both}
@keyframes motion-icon-arrive{from{transform:translateY(5px) scale(.9);opacity:.45}to{transform:none;opacity:1}}
.motion-ready .progress{overflow:hidden}
.motion-ready .progress>i{animation:none;transform-origin:left;transition:transform .95s var(--motion-ease)}
.motion-ready .progress.motion-waiting>i{transform:scaleX(0)}
.motion-ready .progress.motion-entered>i{transform:scaleX(1)}
.motion-tab-enter{animation:motion-tab-in .3s var(--motion-ease) both}
@keyframes motion-tab-in{from{opacity:.35;transform:translateY(7px)}to{opacity:1;transform:none}}
.tabbar{position:relative}
.tabbar button{transition:color .22s,background .22s,border-color .22s}
.tabbar button.active{background:linear-gradient(to top,#ec287d06,transparent)}
.motion-press{position:relative;isolation:isolate}
.motion-press:after{content:'';position:absolute;left:var(--press-x,50%);top:var(--press-y,50%);width:12px;height:12px;pointer-events:none;border-radius:50%;background:currentColor;opacity:0;transform:translate(-50%,-50%) scale(0);z-index:-1}
.motion-press.is-pressed:after{animation:motion-press-wave .42s ease-out both}
@keyframes motion-press-wave{0%{opacity:.12;transform:translate(-50%,-50%) scale(0)}100%{opacity:0;transform:translate(-50%,-50%) scale(14)}}
.field{position:relative}
.field:focus-within>label{color:#075aa5;transition:color .2s}
.field:focus-within input,.field:focus-within textarea,.field:focus-within select{box-shadow:0 0 0 3px #075aa50c;transition:border-color .2s,box-shadow .2s}
.footer a:not(.btn){position:relative;background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s}
.footer a:not(.btn):hover{background-size:100% 1px}
.directory-card .metric-icon{transition:transform .35s var(--motion-ease),background .25s}
.directory-card:hover .metric-icon{transform:rotate(-5deg) scale(1.05)}
.directory-card>.icon{transition:transform .3s var(--motion-ease)}
.directory-card:hover>.icon{transform:translateX(4px)}
.benefits .bubble{transition:transform .35s var(--motion-ease),box-shadow .35s}
.benefits>div:hover .bubble{transform:translateY(-4px);box-shadow:0 7px 20px #075aa510}
.photo img{transition:transform .65s var(--motion-ease)!important}
.photo-review img,.review-photo>img{transition:transform .45s var(--motion-ease),box-shadow .45s}
.photo-review img:hover,.review-photo>img:hover{transform:translateY(-2px);box-shadow:0 8px 20px #123d5a12}
.interest-item.motion-decision{animation:motion-confirmed .7s ease both}
@keyframes motion-confirmed{0%,100%{box-shadow:0 5px 24px #123d5d08}35%{box-shadow:0 0 0 3px #15977a1c}}
@media(hover:hover) and (pointer:fine){.profile-card:hover{transform:translateY(-5px)!important}.mini:hover{transform:translateY(-4px)!important}.ph-create:hover>.ph-icon{transform:translateX(4px)}}
.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none!important}.motion-section,.motion-tab-enter,.motion-press:after,.motion-decision{animation:none!important;transition:none!important;opacity:1!important;transform:none!important}.motion-ready .progress>i{transform:none!important;transition:none!important}.motion-section.motion-waiting{opacity:1;transform:none}.directory-card:hover .metric-icon,.directory-card:hover>.icon,.photo-review img:hover,.review-photo>img:hover{transform:none!important}}
@media print{.motion-section,.motion-section.motion-waiting{opacity:1!important;transform:none!important}}
