/* Squadra Design Kit · движение, тема «Десант». Реакции короткие (0,12–0,6 с), только CSS.
   Постоянно движется лишь то, что сообщает о живом состоянии, и фон; всё постоянное анимирует transform или opacity,
   чтобы открытая надолго вкладка не перерисовывала экран. prefers-reduced-motion отключает всё. */
@keyframes rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes slide-in { from { opacity: 0; transform: translateX(-14px); } to { opacity: 1; transform: none; } }
@keyframes nudge { 0% { opacity: 0; transform: translateX(-8px); } 50% { opacity: 1; transform: translateX(4px); } 100% { opacity: 1; transform: none; } }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes boot { from { opacity: 0; transform: scale(.92); } to { opacity: 1; transform: none; } }
@keyframes wipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes deploy { 0% { clip-path: inset(0 100% 0 0); background-color: var(--signal); } 55% { clip-path: inset(0 0 0 0); background-color: var(--signal); } 100% { clip-path: inset(0 0 0 0); background-color: var(--panel); } }
@keyframes beam { from { transform: translateX(-100%); } to { transform: translateX(320%); } }
@keyframes level { 0%, 100% { transform: scaleY(.25); } 50% { transform: scaleY(1); } }
@keyframes halo { from { box-shadow: 0 0 0 0 rgba(255, 106, 43, .55); } to { box-shadow: 0 0 0 9px rgba(255, 106, 43, 0); } }
@keyframes live { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
@keyframes bump { 0%, 100% { transform: scale(1); } 40% { transform: scale(1.5); } }
@keyframes flash { from { background-color: rgba(255, 106, 43, .3); } to { background-color: transparent; } }
@keyframes msg-flash { from { background-color: rgba(255, 106, 43, .2); } to { background-color: transparent; } }
@keyframes stripes { to { background-position: 56px 0; } }
@keyframes ring-out { 0% { transform: scale(1); opacity: .75; } 100% { transform: scale(var(--ring-scale, 1.5)); opacity: 0; } }
@keyframes toast-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes toast-out { to { opacity: 0; transform: translateX(16px); } }
@keyframes grid-drift { to { transform: translate(48px, 48px); } }
@keyframes scan { from { transform: translateY(-140px); } to { transform: translateY(100vh); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes spin-back { to { transform: rotate(-360deg); } }
@keyframes blip { 0%, 100% { opacity: .2; transform: translate(-50%, -50%) scale(.7); } 12% { opacity: 1; transform: translate(-50%, -50%) scale(1.2); } 40% { opacity: .5; transform: translate(-50%, -50%) scale(1); } }
@keyframes ping { 0% { transform: translate(-50%, -50%) scale(.05); opacity: .7; } 100% { transform: translate(-50%, -50%) scale(1); opacity: 0; } }
@keyframes lock { 0%, 100% { transform: none; } 50% { transform: translate(var(--lx, 0), var(--ly, 0)); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* Плавающая полоска под наведённым или сфокусированным элементом (glide.js). */
#glide { position: fixed; left: 0; top: 0; z-index: var(--z-toast); height: 2px; width: 0; background: var(--signal); box-shadow: 0 0 8px rgba(255, 106, 43, .55); pointer-events: none; opacity: 0; transition: transform .24s var(--ease), width .24s var(--ease), opacity .15s; }
#glide.on { opacity: 1; }
#glide.jump { transition: opacity .15s; }