/* Kestrel motion: one set of curves and one entrance, shared by the app and the Lab.
   Everything here is opacity/transform only (compositor-friendly) and collapses under prefers-reduced-motion (base.css). */
:root{--ease-out:cubic-bezier(.16,1,.3,1);--spring:cubic-bezier(.34,1.56,.64,1);--t-enter:380ms;}
html{scroll-behavior:smooth;-webkit-tap-highlight-color:transparent;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

/* Cross-document navigation (Kestrel <-> Lab) cross-fades instead of flashing. */
@view-transition{navigation:auto;}
::view-transition-old(root),::view-transition-new(root){animation-duration:200ms;animation-timing-function:var(--ease-out);}

@keyframes k-enter{from{opacity:0;transform:translate3d(0,12px,0);}to{opacity:1;transform:none;}}
@keyframes k-reveal{from{opacity:0;transform:translate3d(0,-6px,0);}to{opacity:1;transform:none;}}
@keyframes k-pop{from{opacity:0;transform:translate3d(0,8px,0) scale(.96);}to{opacity:1;transform:none;}}

/* A page or sub-view fades up each time it is shown (display none -> block restarts the animation). */
#pageSchedule,#pageTraining,#pageTeam,#pageYou,#pageRecord,
#schCalView,#schMeetsView,#schPlacesView,
#tpPlanView,#tpHawkyView,#tpLogView,#tpLibraryView,#tpFitnessView,
#youProfileView,#youRecordsView,#youBodyView,#youSettingsView,
#lab.lab-enter>*{animation:k-enter var(--t-enter) var(--ease-out) backwards;}
/* Cards inside a freshly shown view arrive one after another. */
:is(#pageSchedule,#pageTraining,#pageTeam,#pageYou,#pageRecord) .card{animation:k-enter var(--t-enter) var(--ease-out) backwards;}
:is(#pageSchedule,#pageTraining,#pageTeam,#pageYou,#pageRecord) .card:nth-of-type(2){animation-delay:50ms;}
:is(#pageSchedule,#pageTraining,#pageTeam,#pageYou,#pageRecord) .card:nth-of-type(3){animation-delay:100ms;}
:is(#pageSchedule,#pageTraining,#pageTeam,#pageYou,#pageRecord) .card:nth-of-type(n+4){animation-delay:140ms;}
.lab-enter .lab-grid>*{animation:k-enter var(--t-enter) var(--ease-out) backwards;}
.lab-enter .lab-grid>:nth-child(2){animation-delay:40ms;}.lab-enter .lab-grid>:nth-child(3){animation-delay:80ms;}.lab-enter .lab-grid>:nth-child(4){animation-delay:120ms;}
.lab-enter .lab-grid>:nth-child(n+5){animation-delay:150ms;}

/* Things that open in place. */
#splitBody:not([hidden]),#daySplitsBody:not([hidden]),.session-splits:not(:empty),#tlDayCard,#tlEmpty,.sync-menu,.split-row,.rec-splits li{animation:k-reveal 260ms var(--ease-out) backwards;}
.k-toast{animation:k-pop 300ms var(--spring) backwards;}

/* Every control answers a press, and hovers/focus settle on one curve. */
button,.k-btn,.page-tab,.seg-btn,.navbtn,.day,.tl-cell,.lab-card,.lab-card-repo{transition-timing-function:var(--ease-out);}
button:not(:disabled):active,.k-btn:active,a.k-btn:active{transform:scale(.97);}
button,.k-btn{transition-property:transform,background-color,color,border-color,box-shadow,opacity;transition-duration:180ms;}
.page-tab{transition-duration:260ms;}
.page-tab svg{transition:background-color 260ms var(--ease-out),color 260ms var(--ease-out),transform 260ms var(--spring);}
.page-tab.active svg{transform:translateY(-1px) scale(1.06);}
input,select,textarea{transition:border-color 160ms var(--ease-out),box-shadow 200ms var(--ease-out),background-color 160ms;}
input:focus-visible,select:focus-visible,textarea:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--gold,var(--accent)) 28%,transparent);}
