/* Motion: page enter, headline word rise, scroll reveals, progress bar, radio beat pulse. Off for reduced motion. */
/* Base: reset, type scale, buttons, forms, generic layout helpers, modal, toast, tooltip, radio bar. */
*{box-sizing:border-box}
/* Motion: page enter, headline word rise, scroll reveals, progress bar, radio beat pulse. Off for reduced motion. */
.scrollbar{position:fixed;left:0;right:0;top:0;height:3px;background:var(--accent);transform-origin:0 50%;transform:scaleX(0);z-index:var(--z-progress);pointer-events:none;box-shadow:0 0 0 1px rgba(21,20,14,.08)}
.motion #view.enter{animation:pageIn .5s cubic-bezier(.2,.7,.2,1) both}
@keyframes pageIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
/* M-09: word-rise wrapper keeps room for descenders (g, y, p) */
.display .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.22em;margin-bottom:-.22em}
.motion .display .w > span{display:inline-block;animation:wordUp .9s cubic-bezier(.2,.75,.15,1) both;animation-delay:calc(var(--d) + 120ms)}
@keyframes wordUp{from{transform:translateY(105%)}to{transform:none}}
/* M-12: motion never hides content. Reveals only slide (opacity stays 1), short and small */
.motion .rv{opacity:1;transform:translateY(16px);transition:transform .4s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 60ms)}
.motion .rv.in{opacity:1;transform:none}
.motion.scrolled .hdr{box-shadow:0 1px 0 var(--hair-strong)}
.motion .mcard .record{animation:peek 1s cubic-bezier(.2,.8,.2,1) both}
@keyframes peek{from{transform:translateX(-10%)}to{transform:translateX(12%)}}
.motion.radio-on .mcard .record,.motion .sleeve-hero .record{animation:peek 1s cubic-bezier(.2,.8,.2,1) both,turn 1.8s linear infinite 1s}
@keyframes turn{from{transform:translateX(12%) rotate(0)}to{transform:translateX(12%) rotate(360deg)}}
.motion .dw-pin,.motion .bigstat,.motion .logo-word,.motion .radio .pbtn{transition:transform .09s ease-out}
.motion.kick .dw-pin{transform:translateX(-50%) scale(1.15)}
.motion.kick .logo-word{transform:scale(1.06)}
.motion.kick .radio .pbtn{transform:scale(1.08)}
.motion.radio-on .panel-blue{transition:background-color .12s}
.motion.radio-on.kick .panel-blue{background-color:var(--accent-light)}
.still *,.still *::before,.still *::after{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}
.still .mq-pause{display:none}
/* page enter slides only; it never starts from invisible (a throttled background tab would leave the page blank) */
.motion #view:not(.app-main).enter{animation-name:pageInSlide}
@keyframes pageInSlide{from{transform:translateY(12px)}to{transform:none}}