/* Small feedback only. Reduced motion disables every decorative animation. */
:root{--motion-fast:140ms;--motion-page:240ms;--motion-ease:cubic-bezier(.2,.75,.25,1)}
.btn,.nav-link,.client-nav a,.mobile-nav a,.day-btn,.j-day,.swap-option{transition:background-color var(--motion-fast) ease,color var(--motion-fast) ease,border-color var(--motion-fast) ease,transform var(--motion-fast) var(--motion-ease)}
.btn:active:not(:disabled),.swap-option:active{transform:scale(.98)}
.field{transition:border-color var(--motion-fast) ease,background-color var(--motion-fast) ease}
.main.motion-enter,.client-main.motion-enter{animation:page-in var(--motion-page) var(--motion-ease) both}
.modal-backdrop{animation:backdrop-in 150ms ease both}.modal{animation:dialog-in 220ms var(--motion-ease) both}
#toast.show{animation:toast-in 200ms var(--motion-ease) both}.login-box{animation:page-in 360ms var(--motion-ease) both}.login-story-copy{animation:page-in 460ms var(--motion-ease) both}
.access-logout{font-size:12px;min-height:44px}.client-header .access-logout{padding-inline:12px}
@keyframes page-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes dialog-in{from{opacity:0;transform:translateY(12px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}@keyframes toast-in{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:390px){.client-header .actions{gap:6px}.client-header .actions>.pill{display:none}}

.top-actions .btn.access-logout{min-height:44px}

.client-header .btn.access-logout{min-height:44px}
@media(max-width:360px){.top-actions [data-action=preview]{width:44px;min-height:44px;padding:0;justify-content:center}.preview-label{display:none}}