/* Martin: motion.css — the motion system's token block (spec-round3 §1.2, §1.4.1, §1.9, §1.11). The only file outside the Lens's block that may write a cubic-bezier(, a linear( or a @keyframes; screen files add classes and call core/motion.js. */
:root{
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-in:cubic-bezier(.4,0,1,1);--ease-move:cubic-bezier(.2,.7,.3,1);
  --spring-sheet:linear(0, 0.0511, 0.168, 0.3105, 0.454, 0.5847, 0.6961, 0.7864, 0.8565, 0.9088, 0.9465, 0.9724, 0.9894, 0.9998, 1.0056, 1.0083, 1.0091, 1.0086, 1.0076, 1.0063, 1.005, 1.0038, 1.0028, 1.002, 1);--t-sheet:320ms;
  --spring-snap:linear(0, 0.0403, 0.1338, 0.2506, 0.3721, 0.4872, 0.5903, 0.679, 0.7529, 0.8131, 0.8609, 0.8984, 0.9271, 0.9487, 0.9648, 0.9765, 0.9849, 0.9907, 0.9947, 0.9974, 0.9991, 1.0001, 1.0007, 1.001, 1);--t-snap:200ms;
  --spring-pop:linear(0, 0.078, 0.2525, 0.4561, 0.6471, 0.8037, 0.9191, 0.9949, 1.038, 1.0566, 1.059, 1.0519, 1.0406, 1.0285, 1.0177, 1.0092, 1.0031, 0.9993, 0.9972, 0.9965, 0.9966, 0.9971, 0.9978, 0.9985, 1);--t-pop:280ms;
  --t-press:100ms;--t-x:140ms;--t-fade:160ms;--t-in:200ms;--t-grow:220ms;--t-fly:280ms;--t-far:320ms;--t-ring:600ms;
}
@supports not (animation-timing-function:linear(0,1)){
  :root{--spring-sheet:cubic-bezier(.23,1,.32,1);--spring-snap:cubic-bezier(.2,.7,.3,1);--spring-pop:cubic-bezier(.34,1.3,.64,1)}
}
@property --lit{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --p{syntax:'<number>';inherits:false;initial-value:0}

/* the one-shots every screen reaches for by class */
.enter{animation:mo-enter var(--t-in) var(--ease-out) both}
.rise{animation:mo-enter var(--t-in) var(--ease-out) both;animation-delay:calc(var(--i,0)*40ms)}
.travel{transition:transform var(--t-fly) var(--ease-move)}
.stamp{animation:mo-pop var(--t-pop) var(--spring-pop) both}
.fadein{animation:mo-fade var(--t-fade) var(--ease-out) both}
.dragging,.dragging *{transition:none!important}
.released{animation:mo-release var(--t-snap) var(--spring-snap)}
@keyframes mo-enter{from{opacity:0;transform:translateY(8px)}}
@keyframes mo-fade{from{opacity:0}}
@keyframes mo-pop{from{transform:scale(.6);opacity:0}}
@keyframes mo-release{from{transform:scale(.97)}}
/* the layers (§1.5.3): a sheet rises from below and a drawer from the left on the sheet spring (the JS settle; these are the
   stand-ins for a layer opened with no pointer), menus 160 from their anchor; every exit on --ease-in: 180 the surface, 140 a menu */
@keyframes mo-rise{from{transform:translateY(100%)}}
@keyframes mo-sink{to{transform:translateY(100%)}}
@keyframes mo-slidein{from{transform:translateX(-100%)}}
@keyframes mo-slideout{to{transform:translateX(-100%)}}
@keyframes mo-fadeout{to{opacity:0}}
@keyframes mo-menu{from{opacity:0;transform:scale(.96)}}
.layer>.scrim{animation:mo-fade var(--t-in) var(--ease-out)}
.layer>.sheet{animation:mo-rise var(--t-sheet) var(--spring-sheet) both}
.layer>.drawer{animation:mo-slidein var(--t-sheet) var(--spring-sheet) both}
.layer>.menu240{animation:mo-menu var(--t-fade) var(--ease-out);transform-origin:0 0}
.layer>.sheet.held,.layer>.drawer.held{animation:none}
.layer>.scrim.settling{transition:opacity var(--t-sheet) var(--spring-sheet)}
.layer.closing>.scrim{animation:mo-fadeout 180ms var(--ease-in) forwards}
.layer.closing>.sheet{animation:mo-sink 180ms var(--ease-in) forwards}
.layer.closing>.drawer{animation:mo-slideout 180ms var(--ease-in) forwards}
.layer.closing>.menu240{animation:mo-fadeout var(--t-x) var(--ease-in) forwards}
@keyframes mo-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes mo-comet{from{stroke-dashoffset:12}to{stroke-dashoffset:-100}}
@keyframes mo-shake{18%{transform:translateX(-2.5%)}42%{transform:translateX(3%)}66%{transform:translateX(-1.8%)}84%{transform:translateX(.8%)}}
.draw{stroke-dasharray:1;stroke-dashoffset:1;animation:mo-draw .4s var(--ease-move) forwards}
.comet .c{animation:mo-comet .9s var(--ease-move) forwards}
.shake{animation:mo-shake .45s ease-out 1}

/* rings and meters go to a value on --ease-move; countdowns set transition:none per second */
.ringsvg .v{transition:stroke-dasharray var(--t-ring) var(--ease-move)}

/* shared elements (§1.4.1) */
::view-transition-old(root){animation:vt-leave var(--t-x) var(--ease-in) both}
::view-transition-new(root){animation:vt-enter var(--t-in) var(--ease-out) both}
@keyframes vt-leave{to{opacity:0}}
@keyframes vt-enter{from{opacity:0;transform:translateY(8px)}}
::view-transition-group(*){animation-duration:var(--t-fly);animation-timing-function:var(--ease-move)}
::view-transition-image-pair(*){isolation:isolate}
::view-transition-old(*):not(:only-child){animation:vt-hold-old var(--t-fly) linear both}
::view-transition-new(*):not(:only-child){animation:vt-hold-new var(--t-fly) linear both}
@keyframes vt-hold-old{0%,60%{opacity:1}100%{opacity:0}}
@keyframes vt-hold-new{0%,60%{opacity:0}100%{opacity:1}}
::view-transition-group(vault-map),::view-transition-group(watch){animation-duration:var(--t-grow)}
::view-transition-old(vault-map),::view-transition-new(vault-map),::view-transition-old(watch),::view-transition-new(watch),::view-transition-old(watch-full),::view-transition-new(watch-full),::view-transition-old(cover),::view-transition-new(cover){object-fit:cover;height:100%}
::view-transition-group(voice-lens),::view-transition-group(cover){animation-duration:var(--t-sheet);animation-timing-function:var(--spring-sheet)}
::view-transition-group(watch-full){animation-duration:var(--t-far)}
/* an in-place change (motion.vt with root:'still'): the root is a cut, only the named groups travel */
:root[data-vt-root=still]::view-transition-old(root){animation:none;opacity:0}
:root[data-vt-root=still]::view-transition-new(root){animation:none}

/* the one-loop registry (§1.9): one claimant runs, the rest hold their frame */
.lens[data-claimed]:not([data-loops=on]) .body,.lens[data-claimed]:not([data-loops=on]) .veil,.lens[data-claimed]:not([data-loops=on]) .spec::before,.lens[data-claimed]:not([data-loops=on]) .arc,.lens[data-claimed]:not([data-loops=on]) .ring,.lens[data-claimed]:not([data-loops=on]) .glyph *{animation-play-state:paused}
.lens[data-claimed]:not([data-loops=on]) .arc{transform:rotate(45deg)}
.lens[data-offscreen] *{animation-play-state:paused}
:root[data-hidden] *{animation-play-state:paused!important}

/* M at 72 (§0.4): the House's machines; only the living one keeps the grain and the specular drift */
.lens[data-size=M].still .spec::before{animation:none}
.lens[data-size=M].still::after{display:none}

/* reduced motion: the CSS guard; the JS guard is motion.reduced() in every export */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:0s!important;transition-duration:0s!important}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}
:root[data-reduced] *{animation-duration:0s!important;transition-duration:0s!important}
:root[data-reduced] ::view-transition-group(*),:root[data-reduced] ::view-transition-old(*),:root[data-reduced] ::view-transition-new(*){animation:none!important}
