.auth-scene { position: fixed; left: 0; right: 0; bottom: 0; height: 124px; pointer-events: none; z-index: 0; overflow: hidden; }
.auth-scene.for-register { left: 33%; right: 33%; z-index: 0; }
@media (max-width: 880px) { .auth-scene.for-register { left: 0; right: 0; } }
.reg-center > *:not(.auth-scene) { position: relative; z-index: 1; }
.reg-center { padding-bottom: 140px !important; }
.auth-scene .as-svg { position: absolute; left: 50%; bottom: 18px; width: 400px; height: 100px; margin-left: -200px; overflow: visible; }
.auth-scene .as-road { position: absolute; left: 0; right: 0; bottom: 0; height: 24px; background: linear-gradient(180deg, #5d4d7c, #43355c); }
.auth-scene .as-road::before { content: ''; position: absolute; left: 0; right: 0; top: 10px; height: 4px;
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.9) 0 24px, transparent 24px 48px); animation: as-dash 1.2s linear infinite; }
@keyframes as-dash { to { background-position-x: -48px; } }
.as-svg * { transform-box: view-box; }
.as-spin { transform-box: fill-box; transform-origin: center; animation: as-spin .5s linear infinite; }
@keyframes as-spin { to { transform: rotate(360deg); } }
.as-bounce { animation: as-bounce .45s ease-in-out infinite alternate; }
@keyframes as-bounce { to { transform: translateY(-1.5px); } }
.as-drive { animation: as-drive 9s linear infinite; }
@keyframes as-drive { from { transform: translateX(-130px); } to { transform: translateX(430px); } }
.as-drive-slow { animation: as-drive 16s linear infinite; }
.as-arrive { animation: as-arrive 12s ease-in-out infinite; }
@keyframes as-arrive { 0% { transform: translateX(440px); } 38% { transform: translateX(215px); } 72% { transform: translateX(215px); } 100% { transform: translateX(-140px); } }
.as-scroll { animation: as-scroll 5s linear infinite; }
.as-scroll-slow { animation: as-scroll 11s linear infinite; }
@keyframes as-scroll { from { transform: translateX(440px); } to { transform: translateX(-80px); } }
.as-wave { transform-origin: 150px 70px; animation: as-wave .6s ease-in-out infinite alternate; }
@keyframes as-wave { from { transform: rotate(-22deg); } to { transform: rotate(18deg); } }
.as-pin { animation: as-pin 1s ease-in-out infinite alternate; }
@keyframes as-pin { to { transform: translateY(-7px); } }
.as-win { animation: as-win 3s steps(1) infinite; }
@keyframes as-win { 0%, 100% { fill: #ffe9a3; } 50% { fill: #cdb9ea; } }
.as-ring { transform-box: fill-box; transform-origin: center; animation: as-ring 1.8s ease-out infinite; opacity: 0; }
@keyframes as-ring { 0% { transform: scale(.4); opacity: .9; } 100% { transform: scale(1.8); opacity: 0; } }
.as-float { animation: as-float 3.2s ease-in infinite; opacity: 0; }
@keyframes as-float { 0% { transform: translateY(8px); opacity: 0; } 20% { opacity: 1; } 100% { transform: translateY(-26px); opacity: 0; } }
.as-blink { animation: as-blink 1.4s steps(1) infinite; }
@keyframes as-blink { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .auth-scene *, .auth-scene .as-road::before { animation: none !important; } }
.as-still { animation: none !important; }
.as-float2 { animation: as-bob 2.4s ease-in-out infinite alternate; }
@keyframes as-bob { to { transform: translateY(-8px); } }
.as-pop { animation: as-pop 2.4s ease-in-out infinite; }
@keyframes as-pop { 0%, 30% { transform: scale(0); } 45% { transform: scale(1.25); } 55%, 90% { transform: scale(1); } 100% { transform: scale(0); } }
.as-draw { stroke-dasharray: 24; animation: as-draw 2.4s ease-in-out infinite; }
@keyframes as-draw { 0%, 40% { stroke-dashoffset: 24; } 60%, 100% { stroke-dashoffset: 0; } }
.as-routedash { animation: as-routedash 1s linear infinite; }
@keyframes as-routedash { to { stroke-dashoffset: -14; } }
.as-pin2 { animation: as-pin2 1.6s cubic-bezier(.3,0,.5,1) infinite; }
@keyframes as-pin2 { 0% { transform: translateY(-50px); opacity: 0; } 35% { transform: translateY(32px); opacity: 1; } 45% { transform: translateY(22px); } 55%, 100% { transform: translateY(32px); opacity: 1; } }
.as-swing { animation: as-swing 1.8s ease-in-out infinite alternate; }
@keyframes as-swing { from { transform: rotate(-9deg); } to { transform: rotate(9deg); } }
.as-flag { transform-box: fill-box; transform-origin: left center; animation: as-flag .7s ease-in-out infinite alternate; }
@keyframes as-flag { from { transform: skewY(-6deg) scaleX(1); } to { transform: skewY(6deg) scaleX(.85); } }
.as-twinkle { transform-box: fill-box; transform-origin: center; animation: as-twinkle 1.6s ease-in-out infinite; }
@keyframes as-twinkle { 0%, 100% { transform: scale(.3) rotate(0); opacity: .2; } 50% { transform: scale(1.1) rotate(45deg); opacity: 1; } }
.as-ribbon { animation: as-blink 1.4s steps(1) infinite; }
.as-tick { stroke-dasharray: 18; animation: as-tick 3.6s ease-in-out infinite; }
@keyframes as-tick { 0%, 15% { stroke-dashoffset: 18; } 30%, 90% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 18; } }
@media (max-height: 760px) { .auth-scene .as-svg { display: none; } .auth-scene { height: 24px; } }