/* motion.css: every decorative motion. Loaded under (prefers-reduced-motion: no-preference) only; every rule is also gated by html:not([data-motion="off"]). Transform, translate and clip-path only, never opacity. */
@keyframes blink{0%{clip-path:inset(0)}50%,100%{clip-path:inset(100%)}}
@keyframes mascot-blink{0%{transform:translateX(0)}98%,100%{transform:translateX(-50%)}}
html:not([data-motion="off"]) .cursor{animation:blink 1s step-end infinite}
html:not([data-motion="off"]) i.mascot>.strip{animation:mascot-blink 6s step-end infinite}
html:not([data-motion="off"]){scroll-behavior:smooth}
html:not([data-motion="off"]) :is(a,.btn,.key,.quest,.post-btn,.egg){transition:color var(--fast) var(--ease),background-color var(--fast) var(--ease),border-color var(--fast) var(--ease),text-decoration-color var(--fast) var(--ease),box-shadow var(--fast) var(--ease)}
html.theme-anim body{transition:background-color 150ms var(--ease),color 150ms var(--ease)}
html.js:not([data-motion="off"]) .bar:not(.is-in)::after{transform:scaleX(0)}
html.js:not([data-motion="off"]) .bar.is-in::after{transition:transform var(--draw) var(--ease)}
@keyframes reveal{from{transform:translateY(12px)}to{transform:none}}
@supports (animation-timeline:view()){
  html.js:not([data-motion="off"]):not(.no-sda) .reveal{animation:reveal linear both;animation-timeline:view();animation-range:entry 0% entry 35%}
}
html.js.no-sda:not([data-motion="off"]) .reveal{transform:translateY(12px);transition:transform var(--reveal) var(--ease)}
html.js.no-sda:not([data-motion="off"]) .reveal.is-in{transform:none}
html.js:not([data-motion="off"]):not(.no-sda) .reveal:focus-within{animation:none}
html.js.no-sda:not([data-motion="off"]) .reveal:focus-within{transform:none}
@keyframes flag-raise{from{transform:translateX(0)}to{transform:translateX(-75%)}}
@keyframes glint-show{from,to{clip-path:inset(0)}}
@keyframes glint-frames{from{transform:translateX(0)}to{transform:translateX(-50%)}}
html.js:not([data-motion="off"]) i.flag:not(.is-raised)>.strip{transform:translateX(0)}
html.js:not([data-motion="off"]) i.flag.is-raised>.strip{animation:flag-raise 480ms steps(4,jump-none) var(--d,0ms) both}
html.js:not([data-motion="off"]) i.flag.is-raised>.glint{animation:glint-show 200ms step-end calc(var(--d,0ms) + 480ms) 1}
html.js:not([data-motion="off"]) i.flag.is-raised>.glint>.strip{animation:glint-frames 200ms steps(2,jump-none) calc(var(--d,0ms) + 480ms) 1}
html.js:not([data-motion="off"]):not(.is-complete) .caption{clip-path:inset(0 100% 0 0)}
html:not([data-motion="off"]) .quest:is(:hover,:focus-within) i.quest-icon>.strip{animation:glint-frames 300ms steps(2,jump-none) 1}
@keyframes crt-open{from{clip-path:inset(48% 0 48% 0)}to{clip-path:inset(0)}}
@keyframes crt-bloom{0%{transform:scale(0)}35%{transform:scale(1)}100%{transform:scale(0)}}
html:not([data-motion="off"]) .monitor.is-on:not(.is-instant) .screen-inner{animation:crt-open 500ms var(--ease) both}
html:not([data-motion="off"]) .monitor.is-running .screen::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(255,255,255,.28),transparent 60%);transform:scale(0);animation:crt-bloom 600ms var(--ease) both;pointer-events:none}
@media (min-width:900px) and (min-height:700px){
  html.js:not([data-motion="off"]) .hud{display:block;position:fixed;left:0;right:0;bottom:0;height:26px;z-index:9;pointer-events:none;transition:transform 300ms var(--ease)}
  html.js:not(.is-past-hero) .hud,html.is-in-maze .hud{transform:translateY(100%)}
  html.js:not([data-motion="off"]){scroll-padding-bottom:40px}
}
.hud-track{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--track)}
.hud-fill{position:absolute;inset:0;background:var(--track-fill);transform-origin:left;transform:scaleX(0)}
.hud-runner{position:absolute;left:8px;bottom:2px;width:calc(100% - 56px);height:24px}
.hud .runner{position:absolute;left:0;bottom:0;width:24px;height:24px}
.hud .runner>.strip{width:48px;height:100%;background-image:var(--mascot-idle)}
.hud .hud-flag{--px-scale:1;position:absolute;right:8px;bottom:2px}
.hud .hud-flag>.strip{transform:translateX(0)}
@supports (animation-timeline:scroll()){
  @keyframes hud-move{from{transform:translateX(0)}to{transform:translateX(100%)}}
  @keyframes hud-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  html:not(.no-sda) .hud-runner{animation:hud-move linear both;animation-timeline:scroll(root)}
  html:not(.no-sda) .hud-fill{animation:hud-grow linear both;animation-timeline:scroll(root)}
}
html.no-sda .hud-runner{transform:translateX(calc(var(--progress,0)*100%))}
html.no-sda .hud-fill{transform:scaleX(var(--progress,0))}
@keyframes run-cycle{from{transform:translateX(0)}to{transform:translateX(calc(-100% + 100%/6))}}
html.is-scrolling .hud .runner>.strip{width:144px;background-image:var(--mascot-run);animation:run-cycle 600ms steps(6,jump-none) infinite}
html.is-up .hud .runner{transform:scaleX(-1)}
@keyframes hop{50%{translate:0 -16px}}
html.is-jumping .hud .runner{animation:hop 400ms var(--ease) 1}
html.is-jumping .hud .runner>.strip{width:24px;background-image:var(--mascot-jump);animation:none}
html.is-complete .hud .hud-flag>.strip{animation:flag-raise 480ms steps(4,jump-none) both}
@keyframes egg-fan{0%{translate:0 0;clip-path:inset(0)}45%{translate:var(--x) var(--y)}95%{clip-path:inset(0)}100%{translate:var(--x) 48px;clip-path:inset(100%)}}
html:not([data-motion="off"]) .egg-wrap.is-live i.egg-badge{clip-path:inset(0);animation:egg-fan 900ms var(--ease) calc(var(--i,0)*40ms) both}
html:not([data-motion="off"]) .egg-wrap.is-live i.egg-badge>.strip{animation:glint-frames 300ms steps(2,jump-none) calc(var(--i,0)*40ms + 300ms) 1}
.egg-badge{--a:calc(190deg + var(--i,0)*22.857deg);--x:calc(cos(var(--a))*96px);--y:calc(sin(var(--a))*96px)}
@keyframes maze-blink{50%{visibility:hidden}}
html:not([data-motion="off"]) .maze-board .power:not(.eaten){animation:maze-blink 1s step-end infinite}
@keyframes maze-pop{to{translate:0 -36px;clip-path:inset(0 0 100% 0)}}
html:not([data-motion="off"]) .maze-pop{animation:maze-pop .9s steps(9) forwards}
html:not([data-motion="off"]) .stop{transition:border-color 300ms var(--ease),box-shadow 300ms var(--ease)}