/* ==========================================================================
   LANDING: motion
   Keyframes and registered custom properties. Durations and easings
   come from tokens.css; nothing here hardcodes a timing curve.
   ========================================================================== */

@property --n
{
syntax:'<integer>';
initial-value:0;
inherits:false;
}

@property --alt
{
syntax:'<integer>';
initial-value:0;
inherits:false;
}

@property --p
{
syntax:'<integer>';
initial-value:0;
inherits:false;
}

@keyframes ldup
{
from{opacity:0;transform:translateY(32px);filter:blur(8px)}
to{opacity:1;transform:none;filter:blur(0)}
}

@keyframes wordup
{
from{opacity:0;transform:translateY(60%) rotate(5deg);filter:blur(14px)}
to{opacity:1;transform:none;filter:blur(0)}
}

@keyframes landword
{
0%{opacity:0;transform:translateY(-160px);filter:blur(10px)}
55%{opacity:1;transform:translateY(0);filter:blur(0)}
70%{transform:translateY(-18px)}
82%{transform:translateY(0)}
91%{transform:translateY(-5px)}
100%{transform:translateY(0)}
}

@keyframes draw
{
from{transform:scaleX(0)}
to{transform:scaleX(1)}
}

@keyframes ping
{
0%{transform:scale(1);opacity:0.7}
100%{transform:scale(3.2);opacity:0}
}

@keyframes ping2
{
0%{transform:scale(1);opacity:0.8}
100%{transform:scale(2.2);opacity:0}
}

@keyframes glow
{
0%{box-shadow:0 0 0 0 rgba(255,196,79,0.55)}
70%{box-shadow:0 0 0 16px rgba(255,196,79,0)}
100%{box-shadow:0 0 0 0 rgba(255,196,79,0)}
}

@keyframes shimmer
{
0%{left:-80%}
35%{left:140%}
100%{left:140%}
}

@keyframes tilt
{
0%{transform:perspective(1400px) rotateY(-10deg) rotateX(5deg) translateY(0)}
50%{transform:perspective(1400px) rotateY(10deg) rotateX(-3deg) translateY(-14px)}
100%{transform:perspective(1400px) rotateY(-10deg) rotateX(5deg) translateY(0)}
}

@keyframes float
{
0%{transform:translateY(0)}
50%{transform:translateY(-10px)}
100%{transform:translateY(0)}
}

@keyframes spin
{
from{transform:rotate(0deg)}
to{transform:rotate(360deg)}
}

@keyframes twinkle
{
0%{opacity:0.15}
50%{opacity:1}
100%{opacity:0.15}
}

@keyframes drift1
{
to{background-position:-400px 300px}
}

@keyframes drift2
{
to{background-position:600px -450px}
}

@keyframes marq
{
from{transform:translateX(0)}
to{transform:translateX(-50%)}
}

@keyframes shoot
{
0%{transform:translate(0,0) rotate(35deg);opacity:0}
2%{opacity:1}
11%{transform:translate(380px,266px) rotate(35deg);opacity:0}
100%{transform:translate(380px,266px) rotate(35deg);opacity:0}
}

@keyframes cue
{
0%{transform:translateY(0);opacity:1}
100%{transform:translateY(14px);opacity:0}
}

@keyframes touchdown
{
0%{transform:translateY(-470px);opacity:0}
8%{opacity:1}
66%{transform:translateY(0);animation-timing-function:ease-out}
74%{transform:translateY(-16px);animation-timing-function:ease-in}
82%{transform:translateY(0);animation-timing-function:ease-out}
88%{transform:translateY(-4px);animation-timing-function:ease-in}
94%{transform:translateY(0)}
100%{transform:translateY(0)}
}

@keyframes flameout
{
0%{opacity:1}
62%{opacity:1}
72%{opacity:0}
100%{opacity:0}
}

@keyframes flick
{
from{transform:scaleY(0.75)}
to{transform:scaleY(1.25)}
}

@keyframes dustl
{
0%{opacity:0;transform:translateX(0) scaleX(0.3)}
15%{opacity:0.85}
100%{opacity:0;transform:translateX(-120px) scaleX(2.4)}
}

@keyframes dustr
{
0%{opacity:0;transform:translateX(0) scaleX(0.3)}
15%{opacity:0.85}
100%{opacity:0;transform:translateX(120px) scaleX(2.4)}
}

@keyframes blink
{
0%{opacity:1}
50%{opacity:0.15}
100%{opacity:1}
}

@keyframes visor
{
0%{opacity:0.05}
50%{opacity:0.5}
100%{opacity:0.05}
}

@keyframes fly
{
from{left:-14%}
to{left:104%}
}

@keyframes bob
{
0%{transform:translateY(0) rotate(4deg)}
50%{transform:translateY(-16px) rotate(-3deg)}
100%{transform:translateY(0) rotate(4deg)}
}

@keyframes shine
{
from{background-position:200% 0}
to{background-position:-100% 0}
}

@keyframes sweep
{
from{left:-30%}
to{left:100%}
}

@keyframes dashflow
{
to{stroke-dashoffset:-16}
}

@keyframes tile
{
0%{background:var(--surface-6);border-color:var(--line);transform:scale(1)}
6%{background:var(--ac);border-color:var(--ac);transform:scale(1.18)}
22%{background:var(--surface-6);border-color:var(--line);transform:scale(1)}
100%{background:var(--surface-6);border-color:var(--line);transform:scale(1)}
}

@keyframes gridmove
{
to{background-position:0 90px}
}

@keyframes aur1
{
from{transform:translate(0,0) scale(1)}
to{transform:translate(-140px,90px) scale(1.25)}
}

@keyframes aur2
{
from{transform:translate(0,0) scale(1.1)}
to{transform:translate(160px,-70px) scale(0.9)}
}

@keyframes grain
{
0%{transform:translate(0,0)}
20%{transform:translate(-30px,20px)}
40%{transform:translate(25px,-35px)}
60%{transform:translate(-20px,-15px)}
80%{transform:translate(35px,25px)}
100%{transform:translate(0,0)}
}

@keyframes introout
{
0%{transform:translateY(0);visibility:visible}
99%{transform:translateY(-100%);visibility:visible}
100%{transform:translateY(-100%);visibility:hidden}
}

@keyframes pctup
{
from{--p:0}
to{--p:100}
}

@keyframes barfill
{
from{transform:scaleX(0)}
to{transform:scaleX(1)}
}

@keyframes introin
{
from{opacity:0;transform:translateY(16px)}
to{opacity:1;transform:none}
}

@keyframes up
{
from{opacity:0;transform:translateY(60px)}
to{opacity:1;transform:none}
}

@keyframes zoomin
{
from{opacity:0;transform:translateY(46px) scale(0.92)}
to{opacity:1;transform:none}
}

@keyframes inleft
{
from{opacity:0;transform:translateX(-90px)}
to{opacity:1;transform:none}
}

@keyframes inright
{
from{opacity:0;transform:translateX(90px)}
to{opacity:1;transform:none}
}

@keyframes maskup
{
from{clip-path:inset(0 0 100% 0);transform:translateY(60px)}
to{clip-path:inset(0 0 -25% 0);transform:none}
}

@keyframes drawpath
{
from{stroke-dashoffset:100}
to{stroke-dashoffset:0}
}

@keyframes lockclose
{
from{transform:translateY(-9px)}
to{transform:translateY(0)}
}

@keyframes segdraw
{
from{stroke-dasharray:0 565.49}
to{stroke-dasharray:var(--l) 565.49}
}

@keyframes count404
{
from{--n:0}
to{--n:404}
}

@keyframes count6
{
from{--n:0}
to{--n:6}
}

@keyframes count50
{
from{--n:0}
to{--n:50}
}

@keyframes wipe
{
from{background-position:0 100%}
to{background-position:0 0}
}

@keyframes bandl
{
from{transform:translateX(8%)}
to{transform:translateX(-38%)}
}

@keyframes bandr
{
from{transform:translateX(-38%)}
to{transform:translateX(8%)}
}

@keyframes descend
{
from{transform:translateY(-320px)}
to{transform:translateY(0)}
}

@keyframes flamefade
{
from{opacity:1}
to{opacity:0}
}

@keyframes blobmove
{
from{transform:translateY(-150px)}
to{transform:translateY(150px)}
}

@keyframes fillText
{
from{background-position:100% 0}
to{background-position:0 0}
}

@keyframes prog
{
from{transform:scaleX(0)}
to{transform:scaleX(1)}
}

@keyframes par1
{
to{transform:translateY(-70px)}
}

@keyframes par2
{
to{transform:translateY(-190px)}
}

@keyframes par3
{
to{transform:translateY(-320px)}
}

@keyframes heroout
{
to{transform:translateY(80px) scale(0.96);opacity:0.2}
}

@keyframes sstars
{
from{transform:translateY(0)}
to{transform:translateY(-480px)}
}

@keyframes sground
{
from{transform:translateY(540px)}
to{transform:translateY(0)}
}

@keyframes sruler
{
from{transform:translateY(0)}
to{transform:translateY(-440px)}
}

@keyframes sflame
{
0%{opacity:1}
80%{opacity:1}
92%{opacity:0}
100%{opacity:0}
}

@keyframes sdust
{
0%{opacity:0;transform:scaleX(0.3)}
88%{opacity:0;transform:scaleX(0.3)}
95%{opacity:0.9}
100%{opacity:0;transform:scaleX(2.2)}
}

@keyframes salt
{
from{--alt:12000}
to{--alt:0}
}

@keyframes railfill
{
from{transform:scaleY(0)}
to{transform:scaleY(1)}
}

@keyframes ph1
{
0%{opacity:1;transform:none}
22%{opacity:1;transform:none}
32%{opacity:0;transform:translateY(-40px)}
100%{opacity:0;transform:translateY(-40px)}
}

@keyframes ph2
{
0%{opacity:0;transform:translateY(40px)}
30%{opacity:0;transform:translateY(40px)}
40%{opacity:1;transform:none}
60%{opacity:1;transform:none}
70%{opacity:0;transform:translateY(-40px)}
100%{opacity:0;transform:translateY(-40px)}
}

@keyframes ph3
{
0%{opacity:0;transform:translateY(40px)}
66%{opacity:0;transform:translateY(40px)}
76%{opacity:1;transform:none}
100%{opacity:1;transform:none}
}

@keyframes pingd{0%{box-shadow:0 0 0 0 rgba(255,196,79,0.65)}70%,100%{box-shadow:0 0 0 9px rgba(255,196,79,0)}}

@keyframes scanx{from{background-position:-40% 0}to{background-position:140% 0}}

@keyframes ribm{to{transform:translateX(-50%)}}

@keyframes fcDrop{from{transform:translateY(-170px) rotate(-18deg);opacity:0}to{transform:none;opacity:1}}

@keyframes lpDrop{0%{transform:translateY(-22px);opacity:0}12%{opacity:1}52%{transform:translateY(0)}56%{transform:translateY(-2px)}60%,100%{transform:translateY(0)}}

@keyframes lpRing{0%,51%{transform:scale(.3);opacity:0}53%{opacity:.95}100%{transform:scale(1.7);opacity:0}}

@keyframes fbob
{
0%{transform:translateY(0)}
50%{transform:translateY(-12px)}
100%{transform:translateY(0)}
}

@keyframes sway
{
from{transform:skewX(-1.3deg)}
to{transform:skewX(1.3deg)}
}

@keyframes pa0
{
to{transform:translateY(-30px)}
}

@keyframes pa1
{
to{transform:translateY(-80px)}
}

@keyframes pa2
{
to{transform:translateY(-150px)}
}

@keyframes pa3
{
to{transform:translateY(-260px)}
}

@keyframes pac
{
to{transform:translateY(-120px)}
}

@keyframes tilef
{
0%{fill:var(--surface-8)}
6%{fill:var(--ac)}
22%{fill:var(--surface-8)}
100%{fill:var(--surface-8)}
}

@keyframes bobsm
{
from{transform:translateY(0)}
to{transform:translateY(-4px)}
}

@keyframes drive
{
from{transform:translate(-240px,214px)}
to{transform:translate(1840px,214px)}
}

@property --q
{
syntax:'<integer>';
initial-value:0;
inherits:false;
}

@keyframes nsflow
{
to{background-position:0 18px}
}

@keyframes nodeon
{
from{background:var(--ground);border-color:var(--text-faint);transform:scale(1)}
to{background:var(--ac);border-color:var(--ac);transform:scale(1.35)}
}

@keyframes lbl
{
from{color:var(--text-muted)}
to{color:var(--text)}
}

@keyframes r2fill
{
from{transform:scaleY(0)}
to{transform:scaleY(1)}
}

@keyframes r2move
{
from{top:0}
to{top:100%}
}

@keyframes pctscroll
{
from{--q:0}
to{--q:100}
}

@keyframes rw
{
0%{opacity:0;transform:translateY(100%)}
4%{opacity:1;transform:none}
22%{opacity:1;transform:none}
26%{opacity:0;transform:translateY(-100%)}
100%{opacity:0;transform:translateY(-100%)}
}

@keyframes sweepbeam
{
from{transform:rotate(-24deg)}
to{transform:rotate(26deg)}
}

@keyframes fxin
{
0%{opacity:0;transform:translateY(14px)}
60%{opacity:0;transform:translateY(14px)}
100%{opacity:1;transform:none}
}

@keyframes burst
{
0%{opacity:0;transform:translate(0,0) scale(0.2)}
62%{opacity:0;transform:translate(0,0) scale(0.2)}
78%{opacity:1}
100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.3)}
}

@keyframes shock
{
0%{opacity:0;transform:scale(0.3)}
62%{opacity:0;transform:scale(0.3)}
74%{opacity:0.9}
100%{opacity:0;transform:scale(3)}
}

@keyframes countto
{
from{--n:0}
to{--n:var(--t)}
}

@keyframes barin
{
from{transform:scaleX(0)}
to{transform:scaleX(1)}
}

@property --ang
{
syntax:'<angle>';
initial-value:0deg;
inherits:false;
}

@keyframes bspin
{
to{--ang:360deg}
}

/* Every keyframe above is applied from another sheet, so the off switch
   for all of them lives here, beside the motion it switches off, rather
   than in whichever sheet happens to use it. It is universal and
   !important on purpose: a visitor who has asked for reduced motion gets
   none, including from rules added later that never thought to ask. The
   animations that matter end in their finished state, so switching them
   off leaves the page complete rather than half-arrived. SVG animation
   elements answer to none of this; ui.js freezes those separately. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
}
