/* Spy Games sky, taken from the forum (resources/views/forum/partials/styles.blade.php + forum-assets/sky-battle.css). Regenerate from there, do not edit by hand. */
@keyframes sgTwinkle { from { opacity: .35; } to { opacity: .9; } }
@keyframes sgMeteor {
        0%, 86% { opacity: 0; transform: translate(0, 0) rotate(-18deg); }
        88% { opacity: 1; }
        96% { opacity: 0; transform: translate(130vw, 42vh) rotate(-18deg); }
        100% { opacity: 0; }
    }
@keyframes sgLogoGlow {
        0%, 100% { filter: drop-shadow(0 0 4px rgba(143, 214, 255, .15)); }
        50% { filter: drop-shadow(0 0 10px rgba(143, 214, 255, .55)); }
    }
@keyframes sgFooterOrbit { to { transform: translateX(calc(70vw - 9px)); } }
.sgSky { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.sgSky i, .sgSky b { position: absolute; display: block; }
.sgNeb { width: 70vmax; height: 70vmax; border-radius: 50%; }
.sgNeb1 { left: -28vmax; top: -24vmax; background: radial-gradient(circle, rgba(190, 80, 220, .34), transparent 62%); animation: sgDrift1 70s ease-in-out infinite alternate; }
.sgNeb2 { right: -32vmax; top: 6vh; background: radial-gradient(circle, rgba(40, 210, 195, .26), transparent 62%); animation: sgDrift2 85s ease-in-out infinite alternate; }
.sgNeb3 { left: 18vw; bottom: -44vmax; background: radial-gradient(circle, rgba(255, 130, 60, .24), transparent 62%); animation: sgDrift3 100s ease-in-out infinite alternate; }
@keyframes sgDrift1 { to { transform: translate(14vw, 10vh) scale(1.15); } }
@keyframes sgDrift2 { to { transform: translate(-12vw, 14vh) scale(.9); } }
@keyframes sgDrift3 { to { transform: translate(-10vw, -8vh) scale(1.2); } }
.sgStarsDrift {
        top: 0; left: 0; width: calc(100% + 400px); height: calc(100% + 400px);
        background-image:
            radial-gradient(1.5px 1.5px at 10% 20%, #ffb3d9, transparent),
            radial-gradient(1px 1px at 35% 65%, #9ff5ff, transparent),
            radial-gradient(1.5px 1.5px at 62% 12%, #fff1a8, transparent),
            radial-gradient(1px 1px at 80% 78%, #c9b3ff, transparent),
            radial-gradient(2px 2px at 48% 44%, #ffffff, transparent);
        background-size: 400px 400px;
        opacity: .7;
        animation: sgStarFlight 140s linear infinite;
    }
@keyframes sgStarFlight { to { transform: translate(-400px, -400px); } }
.sgSystem { right: 30px; top: 30px; width: 0; height: 0; }
.sgSystem b { position: absolute; display: block; }
.sgSun { left: -95px; top: -95px; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient(circle, #fffef6 0%, #fff4cc 17%, #ffd27a 29%, rgba(255, 168, 70, .5) 44%, rgba(255, 140, 50, .14) 60%, transparent 71%); animation: sgSunPulse 9s ease-in-out infinite alternate; }
.sgSun::after { content: ''; position: absolute; left: -170px; top: -170px; right: -170px; bottom: -170px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 205, 130, .16), transparent 65%); }
@keyframes sgSunPulse { to { transform: scale(1.05); } }
.sgOrbitRing { left: calc(-1 * var(--r)); top: calc(-1 * var(--r)); width: calc(2 * var(--r)); height: calc(2 * var(--r)); border-radius: 50%; border: 1px solid rgba(170, 205, 255, .11); }
.sgOrbitRing.sgBelt { border: 5px dotted rgba(200, 185, 160, .16); }
.sgArm { left: 0; top: 0; width: 0; height: 0; transform: rotate(var(--a)); animation: sgSwing var(--t) ease-in-out infinite alternate; }
.sgBody { left: calc(var(--s) / -2); top: calc(var(--r) - var(--s) / 2); width: var(--s); height: var(--s); background: center / contain no-repeat; transform: rotate(calc(-1 * var(--a))) scaleX(-1); animation: sgCounter var(--t) ease-in-out infinite alternate; }
@keyframes sgSwing { from { transform: rotate(calc(var(--a) - 3deg)); } to { transform: rotate(calc(var(--a) + 3deg)); } }
@keyframes sgCounter { from { transform: rotate(calc(3deg - var(--a))) scaleX(-1); } to { transform: rotate(calc(-3deg - var(--a))) scaleX(-1); } }
.sgSun::before { content: ''; position: absolute; left: -60px; top: -60px; right: -60px; bottom: -60px; border-radius: 50%; background: repeating-conic-gradient(from 0deg, rgba(255, 228, 165, .16) 0deg 3deg, transparent 3deg 14deg); -webkit-mask-image: radial-gradient(circle, #000 18%, transparent 68%); mask-image: radial-gradient(circle, #000 18%, transparent 68%); animation: sgSpin 160s linear infinite; }
@keyframes sgSpin { to { transform: rotate(360deg); } }
.sgBody.sgHasMoon { background-image: none !important; }
.sgBody.sgHasMoon::before { content: ''; position: absolute; inset: 0; z-index: 0; background: var(--img) center / contain no-repeat; }
.sgMoonlet { left: 50%; top: 50%; width: 9px; height: 9px; margin: -4.5px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #f4f6f8, #a5aeb6 55%, #3a4148); animation: sgMoonPath 22s linear infinite; }
@keyframes sgMoonPath {
        0.0% { transform: translate(46.0px, 0.0px); z-index: 1; }
        12.5% { transform: translate(32.5px, 9.2px); z-index: 1; }
        25.0% { transform: translate(0.0px, 13.0px); z-index: 1; }
        37.5% { transform: translate(-32.5px, 9.2px); z-index: 1; }
        50.0% { transform: translate(-46.0px, 0.0px); z-index: 1; }
        62.5% { transform: translate(-32.5px, -9.2px); z-index: -1; }
        75.0% { transform: translate(-0.0px, -13.0px); z-index: -1; }
        87.5% { transform: translate(32.5px, -9.2px); z-index: -1; }
        100.0% { transform: translate(46.0px, -0.0px); z-index: 1; }
    }
.sgComet { right: 18vw; top: 62vh; width: 6px; height: 6px; border-radius: 50%; background: #f2fbff; box-shadow: 0 0 8px 3px rgba(190, 235, 255, .8); opacity: 0; animation: sgCometFly 120s linear 30s infinite; }
.sgComet::after { content: ''; position: absolute; left: 3px; top: 2px; width: 150px; height: 2px; transform-origin: left center; transform: rotate(135deg); background: linear-gradient(90deg, rgba(200, 240, 255, .75), rgba(150, 210, 255, .2) 40%, transparent); }
@keyframes sgCometFly {
        0% { opacity: 0; transform: translate(0, 0); }
        2% { opacity: 1; }
        22% { opacity: 1; }
        26% { opacity: 0; transform: translate(14vw, -40vh); }
        100% { opacity: 0; transform: translate(14vw, -40vh); }
    }
.sgGalaxy { left: 6px; top: 33vh; width: 170px; height: 170px; transform: rotate(-24deg) scaleY(.42); opacity: .9; }
.sgGalaxy b { position: absolute; display: block; inset: 0; background: url('{{ asset('forum-assets/galaxy.svg') }}') center / contain no-repeat; animation: sgSpin 300s linear infinite; }
@media (max-width: 1250px) {
  .sgGalaxy { width: 130px; height: 130px; left: 10px; }
}
.sgWarp { left: 0; top: calc(58% + 8px); width: 90px; height: 18px; opacity: 0; animation: sgWarpIn 41s linear 20s infinite; }
.sgWarp::before { content: ''; position: absolute; left: 0; top: 8px; width: 90px; height: 2px; background: linear-gradient(90deg, transparent, rgba(200, 240, 255, .95) 70%, #fff); }
.sgWarp::after { content: ''; position: absolute; left: 66px; top: -6px; width: 30px; height: 30px; border-radius: 50%; background: radial-gradient(circle, #fff, rgba(170, 225, 255, .7) 30%, transparent 70%); }
@keyframes sgWarpIn { 0% { opacity: 0; transform: scaleX(.1); } .4% { opacity: 1; transform: scaleX(1); } 1.6% { opacity: 0; transform: scaleX(1.1); } 100% { opacity: 0; } }
.sgSystem { transform: translateY(max(-140px, calc(var(--sy, 0) * -.04px))); }
.sgBattle { translate: 0 max(-60px, calc(var(--sy, 0) * -.02px)); }
.sgGalaxy { translate: 0 max(-90px, calc(var(--sy, 0) * -.03px)); }
.sgFreighter { width: 28px; height: 14px; background: url('{{ asset('forum-assets/ship_large_cargo.webp') }}?v={{ filemtime(public_path('forum-assets/ship_large_cargo.webp')) }}') center / contain no-repeat; opacity: 0; }
.sgFreighter.sgF1 { right: 112px; top: 300px; transform: rotate(-80deg); animation: sgFreight1 70s linear 5s infinite; }
.sgFreighter.sgF2 { right: 90px; top: 640px; transform: rotate(100deg); animation: sgFreight2 90s linear 40s infinite; }
@keyframes sgFreight1 { 0% { opacity: 0; translate: 0 0; } 3%, 55% { opacity: 1; } 60%, 100% { opacity: 0; translate: -10px 260px; } }
@keyframes sgFreight2 { 0% { opacity: 0; translate: 0 0; } 3%, 50% { opacity: 1; } 55%, 100% { opacity: 0; translate: 20px -300px; } }
.sgColony { left: -330px; top: 150px; width: 40px; height: 17px; background: url('{{ asset('forum-assets/ship_colony.webp') }}?v={{ filemtime(public_path('forum-assets/ship_colony.webp')) }}') center / contain no-repeat; opacity: 0; animation: sgColony 95s linear 12s infinite; }
@keyframes sgColony { 0% { opacity: 0; transform: translate(0, 0) scale(1); } 1.5% { opacity: 1; } 14% { opacity: 1; transform: translate(212px, 144px) scale(.55); } 17% { opacity: .2; transform: translate(234px, 161px) scale(.12); } 17.5%, 100% { opacity: 0; transform: translate(234px, 161px) scale(.1); } }
.sgColonyFlash { left: -76px; top: 320px; width: 22px; height: 22px; margin: -11px; border-radius: 50%; background: radial-gradient(circle, rgba(200, 255, 220, .9), rgba(120, 230, 170, .3) 45%, transparent 70%); opacity: 0; animation: sgColonyFlash 95s linear 12s infinite; }
@keyframes sgColonyFlash { 0%, 16.6% { opacity: 0; transform: scale(.3); } 17.4% { opacity: 1; transform: scale(1); } 20%, 100% { opacity: 0; transform: scale(1.6); } }
.sgNebula { left: -40px; top: -20px; width: 330px; height: 250px; background: url('{{ asset('forum-assets/nebula.svg') }}') center / contain no-repeat; opacity: .85; animation: sgNebulaBreath 26s ease-in-out infinite alternate; }
@keyframes sgNebulaBreath { from { transform: scale(1); opacity: .75; } to { transform: scale(1.05); opacity: .95; } }
.sgYoungStars { left: 120px; top: 70px; width: 2px; height: 2px; border-radius: 50%; background: #fff; box-shadow: 0 0 4px 1px #fff, 18px 14px 0 0 #ffe4f0, 18px 14px 4px 1px rgba(255, 220, 240, .8), -22px 26px 0 0 #fff, -22px 26px 5px 1px rgba(255, 255, 255, .7), 34px -10px 0 0 #dff0ff, 34px -10px 4px 1px rgba(210, 235, 255, .8); animation: sgTwinkle 3.4s ease-in-out infinite alternate; }
.sgMeteor2, .sgMeteor3 { width: 190px; height: 2px; opacity: 0; }
.sgMeteor2 { top: 30%; right: -20%; background: linear-gradient(270deg, transparent, rgba(120, 240, 255, .95)); animation: sgMeteor2 19s linear 4s infinite; }
.sgMeteor3 { top: 6%; left: 30%; width: 130px; background: linear-gradient(90deg, transparent, rgba(255, 150, 210, .95)); animation: sgMeteor3 23s linear 11s infinite; }
@keyframes sgMeteor2 {
        0%, 80% { opacity: 0; transform: translate(0, 0) rotate(14deg); }
        82% { opacity: 1; }
        92% { opacity: 0; transform: translate(-120vw, 30vh) rotate(14deg); }
        100% { opacity: 0; }
    }
@keyframes sgMeteor3 {
        0%, 84% { opacity: 0; transform: translate(0, 0) rotate(38deg); }
        86% { opacity: 1; }
        95% { opacity: 0; transform: translate(45vw, 60vh) rotate(38deg); }
        100% { opacity: 0; }
    }
.sgFighters { top: 58%; left: 0; width: 80px; height: 34px; background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2080%2034%27%3E%0A%3Cdefs%3E%3ClinearGradient%20id%3D%27f%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%270%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%27%20stop-color%3D%27%23d8e0e6%27%2F%3E%3Cstop%20offset%3D%271%27%20stop-color%3D%27%2356626d%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%3Cg%3E%3Cpath%20d%3D%27M44%209%20L66%2011%20L72%2012%20L66%2013%20L44%2015%20L48%2012%20Z%27%20fill%3D%27url%28%23f%29%27%2F%3E%3Cpath%20d%3D%27M50%2011%20L56%204%20L60%204%20L58%2011%20Z%20M50%2013%20L56%2020%20L60%2020%20L58%2013%20Z%27%20fill%3D%27%237a8792%27%2F%3E%3Ccircle%20cx%3D%2742%27%20cy%3D%2712%27%20r%3D%272.2%27%20fill%3D%27%23bfe9ff%27%2F%3E%3C%2Fg%3E%0A%3Cg%3E%3Cpath%20d%3D%27M8%2021%20L30%2023%20L36%2024%20L30%2025%20L8%2027%20L12%2024%20Z%27%20fill%3D%27url%28%23f%29%27%2F%3E%3Cpath%20d%3D%27M14%2023%20L20%2016%20L24%2016%20L22%2023%20Z%20M14%2025%20L20%2032%20L24%2032%20L22%2025%20Z%27%20fill%3D%27%237a8792%27%2F%3E%3Ccircle%20cx%3D%276%27%20cy%3D%2724%27%20r%3D%272.2%27%20fill%3D%27%23bfe9ff%27%2F%3E%3C%2Fg%3E%0A%3C%2Fsvg%3E") no-repeat center / contain; transform: translateX(-120px); opacity: 0; animation: sgFightersFly 41s linear 20s infinite; }
.sgFighters::before, .sgFighters::after { content: ''; position: absolute; width: 18px; height: 6px; border-radius: 50%; background: radial-gradient(ellipse at right center, rgba(190, 235, 255, .9), transparent 75%); animation: sgEngine .25s ease-in-out infinite alternate; }
.sgFighters::before { left: 22px; top: 6px; }
.sgFighters::after { left: -14px; top: 18px; }
@keyframes sgFightersFly {
        0%, .9% { transform: translate(40px, 0); opacity: 0; }
        1.2% { transform: translate(40px, 0); opacity: 1; }
        28% { transform: translate(110vw, -9vh); opacity: 1; }
        28.01%, 100% { transform: translate(110vw, -9vh); opacity: 0; }
    }
@keyframes sgEngine { from { opacity: .55; } to { opacity: 1; } }
@keyframes sgActivePulse { 50% { box-shadow: 0 0 16px rgba(255, 255, 255, .55); } }
@keyframes sgHeadShift { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
@keyframes sgShine { 0%, 70% { transform: translateX(-120%); } 100% { transform: translateX(320%); } }
@keyframes sgSpin { to { transform: rotate(360deg); } }
@keyframes sgFadeUp { from { opacity: 0; transform: translateY(8px); } }
@media (prefers-reduced-motion: reduce) {
  .sgMeteor2, .sgMeteor3, .sgFighters, .sgComet, .sgWarp, .sgFreighter, .sgColony, .sgColonyFlash { display: none !important; }
}
html.sgHold .breadCrumbs::after, html.sgHold footer.site_footer::after, html.sgHold #header .logo img { animation-play-state: paused !important; }
html.sgLite .sgSky > :not(.sgStarsDrift) { display: none !important; }
html.sgLite .sgStarsDrift, html.sgLite body::before { animation: none !important; }
html.sgLite body::after { display: none !important; }
html.sgLite footer.site_footer::after, html.sgLite main > *, html.sgLite #boardlist > li.category { animation: none !important; }
@media (max-width: 1100px), (pointer: coarse) {
  .sgSky { bottom: auto; height: 100vh; height: 100lvh; background: #000 url('{{ asset('img/bg/background-large.jpg') }}') no-repeat center top; background-size: cover; }
  .sgSky > :not(.sgStarsDrift) { display: none !important; }
  .sgStarsDrift { animation: none !important; }
}
/* Spy Games forum - the far battle in the lower left (owner, 18.10.2026: "the enemies on the sides,
   more action, more story"). One 40-second story, every element on the same clock:
   our three destroyers hold the left; an enemy flagship and two escorts drop out of hyperspace on
   the right; lasers, missiles with smoke trails, shield flares; our fighter flight makes a pass;
   an escort blows up and its debris pulls together into a moon; the flagship charges a heavy beam that our shield holds; a counter-volley
   sets the flagship burning and the enemy jumps away; a lull, and it starts again.
   Coordinates are in a 400x160 scene that is scaled to the free margin. Generated by a script -
   edit the generator, not by hand. */
.sgBattle { position: absolute; left: 0; bottom: 5vh; width: 400px; height: 160px; transform: scale(var(--bs, .4)); transform-origin: left bottom; pointer-events: none; }
.sgSky { --bs: .4; }
@media (min-width: 1450px) { .sgSky { --bs: .6; } }
@media (min-width: 1700px) { .sgSky { --bs: .8; } }
@media (min-width: 1950px) { .sgSky { --bs: 1; } }
.sgBattle b { position: absolute; display: block; }
.sgShip { background: center / contain no-repeat; }
.sgOurs { background-image: url('/sky/ship_battleship.webp'); filter: drop-shadow(0 0 3px rgba(90, 220, 210, .2)); }
.sgOurs.sgBig { background-image: url('/sky/ship_bomber.webp'); }
.sgTheirs { filter: drop-shadow(0 0 3px rgba(255, 120, 70, .2)); }
.sgTheirs.sgEscort { background-image: url('/sky/ship_cruiser.webp'); }
.sgTheirs.sgFlag { background-image: url('/sky/ship_destroyer.webp'); }
.sgTheirs.sgFlag::after { content: ''; position: absolute; right: -24px; top: 20%; width: 34px; height: 20px; border-radius: 50%; background: radial-gradient(ellipse at left center, rgba(210, 245, 255, .95), rgba(80, 170, 255, .45) 45%, transparent 75%); opacity: 0; animation: sgFlagEngine 152.67s linear infinite; }
@keyframes sgFlagEngine { 0%, 32.907% { opacity: 0; } 33.431%, 57.221% { opacity: 1; } 57.43%, 100% { opacity: 0; } }
.sgFar { filter: brightness(.72) saturate(.8) blur(.2px); }

.sgIdle0 { animation: sgIdle0 5s ease-in-out infinite alternate; }
@keyframes sgIdle0 { to { translate: 1px 2px; } }
.sgIdle1 { animation: sgIdle1 7s ease-in-out infinite alternate; }
@keyframes sgIdle1 { to { translate: -1px -2px; } }
.sgIdle2 { animation: sgIdle2 9s ease-in-out infinite alternate; }
@keyframes sgIdle2 { to { translate: 2px 1px; } }
.sgIdle3 { animation: sgIdle3 11s ease-in-out infinite alternate; }
@keyframes sgIdle3 { to { translate: 1px -1px; } }
@keyframes sgArrF { 0%, 3.144% { opacity: 0; translate: 50px 0; scale: 1 1; } 3.354% { opacity: 1; translate: 24px 0; scale: 1 1; } 4.716% { opacity: 1; translate: 0 0; scale: 1 1; } 32.488% { opacity: 1; translate: 0 0; scale: 1 1; } 33.326% { opacity: 1; translate: 8px -3px; scale: -1 1; } 33.85% { opacity: 1; translate: 34px -8px; scale: -1 1; } 34.112%, 100% { opacity: 0; translate: 34px -8px; scale: -1 1; } }
@keyframes sgArrB1 { 0%, 3.144% { opacity: 0; translate: 50px 0; scale: 1 1; } 3.354% { opacity: 1; translate: 24px 0; scale: 1 1; } 4.716% { opacity: 1; translate: 0 0; } 23.056% { opacity: 1; translate: 0 0; } 23.213%, 100% { opacity: 0; translate: 0 0; } }
@keyframes sgArrB2 { 0%, 3.144% { opacity: 0; translate: 50px 0; scale: 1 1; } 3.354% { opacity: 1; translate: 24px 0; scale: 1 1; } 4.716% { opacity: 1; translate: 0 0; } 32.802% { opacity: 1; translate: 0 0; scale: 1 1; } 33.326% { opacity: 1; translate: 6px -2px; scale: -1 1; } 33.85% { opacity: 1; translate: 30px -6px; scale: -1 1; } 34.112%, 100% { opacity: 0; translate: 30px -6px; scale: -1 1; } }
@keyframes sgArrB4 { 0%, 3.144% { opacity: 0; translate: 50px 0; scale: 1 1; } 3.354% { opacity: 1; translate: 24px 0; scale: 1 1; } 4.716% { opacity: 1; translate: 0 0; } 32.802% { opacity: 1; translate: 0 0; scale: 1 1; } 33.326% { opacity: 1; translate: 6px -2px; scale: -1 1; } 33.85% { opacity: 1; translate: 30px -6px; scale: -1 1; } 34.112%, 100% { opacity: 0; translate: 30px -6px; scale: -1 1; } }
.sgWarpFx { width: 60px; height: 14px; margin: -7px 0 0 -10px; opacity: 0; background: radial-gradient(ellipse at 20% 50%, #fff, rgba(190, 230, 255, .8) 20%, rgba(120, 190, 255, .25) 45%, transparent 70%); animation: none 152.67s linear infinite; }
@keyframes sgWf1 { 0% { opacity: 0; } 3.196% { opacity: 0; transform: scaleX(.2); } 3.301% { opacity: 1; transform: scaleX(1); } 4.035% { opacity: 0; transform: scaleX(1.4); } 100% { opacity: 0; } }
@keyframes sgWf2 { 0% { opacity: 0; } 3.196% { opacity: 0; transform: scaleX(.2); } 3.301% { opacity: 1; transform: scaleX(1); } 4.035% { opacity: 0; transform: scaleX(1.4); } 100% { opacity: 0; } }
@keyframes sgWf3 { 0% { opacity: 0; } 3.196% { opacity: 0; transform: scaleX(.2); } 3.301% { opacity: 1; transform: scaleX(1); } 4.035% { opacity: 0; transform: scaleX(1.4); } 100% { opacity: 0; } }
@keyframes sgWf4 { 0% { opacity: 0; } 3.196% { opacity: 0; transform: scaleX(.2); } 3.301% { opacity: 1; transform: scaleX(1); } 4.035% { opacity: 0; transform: scaleX(1.4); } 100% { opacity: 0; } }
.sgBolt2 { width: 14px; height: 1.6px; margin-top: -.8px; transform-origin: left center; opacity: 0; background: linear-gradient(90deg, transparent, var(--c)); box-shadow: 0 0 4px var(--c); animation: none 152.67s linear infinite; }
.sgHit { width: 14px; height: 14px; margin: -7px; border-radius: 50%; opacity: 0; background: radial-gradient(circle, #fff, #ffd27a 35%, rgba(255, 120, 40, .55) 60%, transparent 72%); animation: none 152.67s linear infinite; }
.sgShieldHit { width: 26px; height: 26px; margin: -13px; border-radius: 50%; opacity: 0; border: 1px solid rgba(140, 220, 255, .85); background: radial-gradient(circle, transparent 50%, rgba(120, 210, 255, .35) 75%, transparent 76%); box-shadow: 0 0 8px rgba(120, 210, 255, .6); animation: none 152.67s linear infinite; }
@keyframes sgB5 { 0% { opacity: 0; } 5.759% { opacity: 0; translate: 0 0; } 5.764% { opacity: 1; translate: 0 0; } 6.602% { opacity: 1; translate: 313px -10px; } 6.608% { opacity: 0; translate: 313px -10px; } 8.903% { opacity: 0; translate: 0 0; } 8.908% { opacity: 1; translate: 0 0; } 9.746% { opacity: 1; translate: 313px -10px; } 9.752% { opacity: 0; translate: 313px -10px; } 12.047% { opacity: 0; translate: 0 0; } 12.052% { opacity: 1; translate: 0 0; } 12.89% { opacity: 1; translate: 313px -10px; } 12.896% { opacity: 0; translate: 313px -10px; } 15.715% { opacity: 0; translate: 0 0; } 15.72% { opacity: 1; translate: 0 0; } 16.558% { opacity: 1; translate: 313px -10px; } 16.564% { opacity: 0; translate: 313px -10px; } 19.383% { opacity: 0; translate: 0 0; } 19.388% { opacity: 1; translate: 0 0; } 20.226% { opacity: 1; translate: 313px -10px; } 20.232% { opacity: 0; translate: 313px -10px; } 22.212% { opacity: 0; translate: 0 0; } 22.218% { opacity: 1; translate: 0 0; } 23.056% { opacity: 1; translate: 313px -10px; } 23.061% { opacity: 0; translate: 313px -10px; } 100% { opacity: 0; } }
@keyframes sgH6 { 0% { opacity: 0; } 6.576% { opacity: 0; transform: scale(.3); } 6.681% { opacity: 1; transform: scale(1); } 7.441% { opacity: 0; transform: scale(1.6); } 9.72% { opacity: 0; transform: scale(.3); } 9.825% { opacity: 1; transform: scale(1); } 10.585% { opacity: 0; transform: scale(1.6); } 12.864% { opacity: 0; transform: scale(.3); } 12.969% { opacity: 1; transform: scale(1); } 13.729% { opacity: 0; transform: scale(1.6); } 16.532% { opacity: 0; transform: scale(.3); } 16.637% { opacity: 1; transform: scale(1); } 17.397% { opacity: 0; transform: scale(1.6); } 20.2% { opacity: 0; transform: scale(.3); } 20.305% { opacity: 1; transform: scale(1); } 21.065% { opacity: 0; transform: scale(1.6); } 23.03% { opacity: 0; transform: scale(.3); } 23.135% { opacity: 1; transform: scale(1); } 23.894% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
@keyframes sgB7 { 0% { opacity: 0; } 6.545% { opacity: 0; translate: 0 0; } 6.55% { opacity: 1; translate: 0 0; } 7.388% { opacity: 1; translate: 231px -1px; } 7.394% { opacity: 0; translate: 231px -1px; } 10.999% { opacity: 0; translate: 0 0; } 11.004% { opacity: 1; translate: 0 0; } 11.842% { opacity: 1; translate: 231px -1px; } 11.848% { opacity: 0; translate: 231px -1px; } 14.667% { opacity: 0; translate: 0 0; } 14.672% { opacity: 1; translate: 0 0; } 15.51% { opacity: 1; translate: 231px -1px; } 15.516% { opacity: 0; translate: 231px -1px; } 18.335% { opacity: 0; translate: 0 0; } 18.34% { opacity: 1; translate: 0 0; } 19.178% { opacity: 1; translate: 231px -1px; } 19.184% { opacity: 0; translate: 231px -1px; } 24.623% { opacity: 0; translate: 0 0; } 24.628% { opacity: 1; translate: 0 0; } 25.466% { opacity: 1; translate: 231px -1px; } 25.472% { opacity: 0; translate: 231px -1px; } 28.815% { opacity: 0; translate: 0 0; } 28.82% { opacity: 1; translate: 0 0; } 29.658% { opacity: 1; translate: 231px -1px; } 29.664% { opacity: 0; translate: 231px -1px; } 29.863% { opacity: 0; translate: 0 0; } 29.868% { opacity: 1; translate: 0 0; } 30.706% { opacity: 1; translate: 231px -1px; } 30.712% { opacity: 0; translate: 231px -1px; } 31.016% { opacity: 0; translate: 0 0; } 31.021% { opacity: 1; translate: 0 0; } 31.859% { opacity: 1; translate: 231px -1px; } 31.864% { opacity: 0; translate: 231px -1px; } 100% { opacity: 0; } }
@keyframes sgH8 { 0% { opacity: 0; } 7.362% { opacity: 0; transform: scale(.3); } 7.467% { opacity: 1; transform: scale(1); } 8.227% { opacity: 0; transform: scale(1.6); } 11.816% { opacity: 0; transform: scale(.3); } 11.921% { opacity: 1; transform: scale(1); } 12.681% { opacity: 0; transform: scale(1.6); } 15.484% { opacity: 0; transform: scale(.3); } 15.589% { opacity: 1; transform: scale(1); } 16.349% { opacity: 0; transform: scale(1.6); } 19.152% { opacity: 0; transform: scale(.3); } 19.257% { opacity: 1; transform: scale(1); } 20.017% { opacity: 0; transform: scale(1.6); } 25.44% { opacity: 0; transform: scale(.3); } 25.545% { opacity: 1; transform: scale(1); } 26.305% { opacity: 0; transform: scale(1.6); } 29.632% { opacity: 0; transform: scale(.3); } 29.737% { opacity: 1; transform: scale(1); } 30.497% { opacity: 0; transform: scale(1.6); } 30.68% { opacity: 0; transform: scale(.3); } 30.785% { opacity: 1; transform: scale(1); } 31.545% { opacity: 0; transform: scale(1.6); } 31.833% { opacity: 0; transform: scale(.3); } 31.938% { opacity: 1; transform: scale(1); } 32.698% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
@keyframes sgB9 { 0% { opacity: 0; } 8.379% { opacity: 0; translate: 0 0; } 8.384% { opacity: 1; translate: 0 0; } 9.222% { opacity: 1; translate: 284px 78px; } 9.228% { opacity: 0; translate: 284px 78px; } 13.619% { opacity: 0; translate: 0 0; } 13.624% { opacity: 1; translate: 0 0; } 14.462% { opacity: 1; translate: 284px 78px; } 14.468% { opacity: 0; translate: 284px 78px; } 19.907% { opacity: 0; translate: 0 0; } 19.912% { opacity: 1; translate: 0 0; } 20.75% { opacity: 1; translate: 284px 78px; } 20.756% { opacity: 0; translate: 284px 78px; } 25.671% { opacity: 0; translate: 0 0; } 25.676% { opacity: 1; translate: 0 0; } 26.514% { opacity: 1; translate: 284px 78px; } 26.52% { opacity: 0; translate: 284px 78px; } 31.959% { opacity: 0; translate: 0 0; } 31.964% { opacity: 1; translate: 0 0; } 32.802% { opacity: 1; translate: 284px 78px; } 32.808% { opacity: 0; translate: 284px 78px; } 100% { opacity: 0; } }
@keyframes sgH10 { 0% { opacity: 0; } 9.196% { opacity: 0; transform: scale(.3); } 9.301% { opacity: 1; transform: scale(1); } 10.061% { opacity: 0; transform: scale(1.6); } 14.436% { opacity: 0; transform: scale(.3); } 14.541% { opacity: 1; transform: scale(1); } 15.301% { opacity: 0; transform: scale(1.6); } 20.724% { opacity: 0; transform: scale(.3); } 20.829% { opacity: 1; transform: scale(1); } 21.589% { opacity: 0; transform: scale(1.6); } 26.488% { opacity: 0; transform: scale(.3); } 26.593% { opacity: 1; transform: scale(1); } 27.353% { opacity: 0; transform: scale(1.6); } 32.776% { opacity: 0; transform: scale(.3); } 32.881% { opacity: 1; transform: scale(1); } 33.641% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
@keyframes sgB11 { 0% { opacity: 0; } 9.427% { opacity: 0; translate: 0 0; } 9.432% { opacity: 1; translate: 0 0; } 10.27% { opacity: 1; translate: -283px -84px; } 10.276% { opacity: 0; translate: -283px -84px; } 15.191% { opacity: 0; translate: 0 0; } 15.196% { opacity: 1; translate: 0 0; } 16.034% { opacity: 1; translate: -283px -84px; } 16.04% { opacity: 0; translate: -283px -84px; } 21.479% { opacity: 0; translate: 0 0; } 21.484% { opacity: 1; translate: 0 0; } 22.322% { opacity: 1; translate: -283px -84px; } 22.328% { opacity: 0; translate: -283px -84px; } 27.767% { opacity: 0; translate: 0 0; } 27.772% { opacity: 1; translate: 0 0; } 28.61% { opacity: 1; translate: -283px -84px; } 28.616% { opacity: 0; translate: -283px -84px; } 100% { opacity: 0; } }
@keyframes sgH12 { 0% { opacity: 0; } 10.244% { opacity: 0; transform: scale(.3); } 10.349% { opacity: 1; transform: scale(1); } 11.109% { opacity: 0; transform: scale(1.6); } 16.008% { opacity: 0; transform: scale(.3); } 16.113% { opacity: 1; transform: scale(1); } 16.873% { opacity: 0; transform: scale(1.6); } 22.296% { opacity: 0; transform: scale(.3); } 22.401% { opacity: 1; transform: scale(1); } 23.161% { opacity: 0; transform: scale(1.6); } 28.584% { opacity: 0; transform: scale(.3); } 28.689% { opacity: 1; transform: scale(1); } 29.449% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
@keyframes sgB13 { 0% { opacity: 0; } 7.331% { opacity: 0; translate: 0 0; } 7.336% { opacity: 1; translate: 0 0; } 8.174% { opacity: 1; translate: 289px 3px; } 8.18% { opacity: 0; translate: 289px 3px; } 12.833% { opacity: 0; translate: 0 0; } 12.838% { opacity: 1; translate: 0 0; } 13.676% { opacity: 1; translate: 289px 3px; } 13.682% { opacity: 0; translate: 289px 3px; } 17.287% { opacity: 0; translate: 0 0; } 17.292% { opacity: 1; translate: 0 0; } 18.13% { opacity: 1; translate: 289px 3px; } 18.136% { opacity: 0; translate: 289px 3px; } 20.955% { opacity: 0; translate: 0 0; } 20.96% { opacity: 1; translate: 0 0; } 21.798% { opacity: 1; translate: 289px 3px; } 21.804% { opacity: 0; translate: 289px 3px; } 27.243% { opacity: 0; translate: 0 0; } 27.248% { opacity: 1; translate: 0 0; } 28.086% { opacity: 1; translate: 289px 3px; } 28.092% { opacity: 0; translate: 289px 3px; } 30.492% { opacity: 0; translate: 0 0; } 30.497% { opacity: 1; translate: 0 0; } 31.335% { opacity: 1; translate: 289px 3px; } 31.34% { opacity: 0; translate: 289px 3px; } 100% { opacity: 0; } }
@keyframes sgH14 { 0% { opacity: 0; } 8.148% { opacity: 0; transform: scale(.3); } 8.253% { opacity: 1; transform: scale(1); } 9.013% { opacity: 0; transform: scale(1.6); } 13.65% { opacity: 0; transform: scale(.3); } 13.755% { opacity: 1; transform: scale(1); } 14.515% { opacity: 0; transform: scale(1.6); } 18.104% { opacity: 0; transform: scale(.3); } 18.209% { opacity: 1; transform: scale(1); } 18.969% { opacity: 0; transform: scale(1.6); } 21.772% { opacity: 0; transform: scale(.3); } 21.877% { opacity: 1; transform: scale(1); } 22.637% { opacity: 0; transform: scale(1.6); } 28.06% { opacity: 0; transform: scale(.3); } 28.165% { opacity: 1; transform: scale(1); } 28.925% { opacity: 0; transform: scale(1.6); } 31.309% { opacity: 0; transform: scale(.3); } 31.414% { opacity: 1; transform: scale(1); } 32.174% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
@keyframes sgB15 { 0% { opacity: 0; } 6.283% { opacity: 0; translate: 0 0; } 6.288% { opacity: 1; translate: 0 0; } 7.126% { opacity: 1; translate: -307px 2px; } 7.132% { opacity: 0; translate: -307px 2px; } 10.213% { opacity: 0; translate: 0 0; } 10.218% { opacity: 1; translate: 0 0; } 11.056% { opacity: 1; translate: -307px 2px; } 11.062% { opacity: 0; translate: -307px 2px; } 14.143% { opacity: 0; translate: 0 0; } 14.148% { opacity: 1; translate: 0 0; } 14.986% { opacity: 1; translate: -307px 2px; } 14.992% { opacity: 0; translate: -307px 2px; } 19.121% { opacity: 0; translate: 0 0; } 19.126% { opacity: 1; translate: 0 0; } 19.964% { opacity: 1; translate: -307px 2px; } 19.97% { opacity: 0; translate: -307px 2px; } 100% { opacity: 0; } }
@keyframes sgH16 { 0% { opacity: 0; } 7.1% { opacity: 0; transform: scale(.3); } 7.205% { opacity: 1; transform: scale(1); } 7.965% { opacity: 0; transform: scale(1.6); } 11.03% { opacity: 0; transform: scale(.3); } 11.135% { opacity: 1; transform: scale(1); } 11.895% { opacity: 0; transform: scale(1.6); } 14.96% { opacity: 0; transform: scale(.3); } 15.065% { opacity: 1; transform: scale(1); } 15.825% { opacity: 0; transform: scale(1.6); } 19.938% { opacity: 0; transform: scale(.3); } 20.043% { opacity: 1; transform: scale(1); } 20.803% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
@keyframes sgB17 { 0% { opacity: 0; } 7.069% { opacity: 0; translate: 0 0; } 7.074% { opacity: 1; translate: 0 0; } 7.912% { opacity: 1; translate: -218px 1px; } 7.918% { opacity: 0; translate: -218px 1px; } 13.357% { opacity: 0; translate: 0 0; } 13.362% { opacity: 1; translate: 0 0; } 14.2% { opacity: 1; translate: -218px 1px; } 14.206% { opacity: 0; translate: -218px 1px; } 16.501% { opacity: 0; translate: 0 0; } 16.506% { opacity: 1; translate: 0 0; } 17.344% { opacity: 1; translate: -218px 1px; } 17.35% { opacity: 0; translate: -218px 1px; } 20.693% { opacity: 0; translate: 0 0; } 20.698% { opacity: 1; translate: 0 0; } 21.536% { opacity: 1; translate: -218px 1px; } 21.542% { opacity: 0; translate: -218px 1px; } 100% { opacity: 0; } }
@keyframes sgH18 { 0% { opacity: 0; } 7.886% { opacity: 0; transform: scale(.3); } 7.991% { opacity: 1; transform: scale(1); } 8.751% { opacity: 0; transform: scale(1.6); } 14.174% { opacity: 0; transform: scale(.3); } 14.279% { opacity: 1; transform: scale(1); } 15.039% { opacity: 0; transform: scale(1.6); } 17.318% { opacity: 0; transform: scale(.3); } 17.423% { opacity: 1; transform: scale(1); } 18.183% { opacity: 0; transform: scale(1.6); } 21.51% { opacity: 0; transform: scale(.3); } 21.615% { opacity: 1; transform: scale(1); } 22.375% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
@keyframes sgB19 { 0% { opacity: 0; } 8.117% { opacity: 0; translate: 0 0; } 8.122% { opacity: 1; translate: 0 0; } 8.96% { opacity: 1; translate: -284px -13px; } 8.966% { opacity: 0; translate: -284px -13px; } 12.309% { opacity: 0; translate: 0 0; } 12.314% { opacity: 1; translate: 0 0; } 13.152% { opacity: 1; translate: -284px -13px; } 13.158% { opacity: 0; translate: -284px -13px; } 18.073% { opacity: 0; translate: 0 0; } 18.078% { opacity: 1; translate: 0 0; } 18.916% { opacity: 1; translate: -284px -13px; } 18.922% { opacity: 0; translate: -284px -13px; } 23.837% { opacity: 0; translate: 0 0; } 23.842% { opacity: 1; translate: 0 0; } 24.68% { opacity: 1; translate: -284px -13px; } 24.686% { opacity: 0; translate: -284px -13px; } 29.339% { opacity: 0; translate: 0 0; } 29.344% { opacity: 1; translate: 0 0; } 30.182% { opacity: 1; translate: -284px -13px; } 30.188% { opacity: 0; translate: -284px -13px; } 100% { opacity: 0; } }
@keyframes sgH20 { 0% { opacity: 0; } 8.934% { opacity: 0; transform: scale(.3); } 9.039% { opacity: 1; transform: scale(1); } 9.799% { opacity: 0; transform: scale(1.6); } 13.126% { opacity: 0; transform: scale(.3); } 13.231% { opacity: 1; transform: scale(1); } 13.991% { opacity: 0; transform: scale(1.6); } 18.89% { opacity: 0; transform: scale(.3); } 18.995% { opacity: 1; transform: scale(1); } 19.755% { opacity: 0; transform: scale(1.6); } 24.654% { opacity: 0; transform: scale(.3); } 24.759% { opacity: 1; transform: scale(1); } 25.519% { opacity: 0; transform: scale(1.6); } 30.156% { opacity: 0; transform: scale(.3); } 30.261% { opacity: 1; transform: scale(1); } 31.021% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
.sgMissile { width: 5px; height: 2px; margin-top: -1px; border-radius: 1px; background: #fff; box-shadow: 0 0 3px #ffd27a; opacity: 0; animation: none 152.67s linear infinite; }
.sgMissile::after { content: ''; position: absolute; right: 4px; top: -1px; width: 34px; height: 4px; border-radius: 2px; background: linear-gradient(270deg, rgba(255, 210, 140, .9), rgba(200, 200, 210, .45) 25%, rgba(160, 160, 170, .12) 70%, transparent); }
.sgBigHit { width: 26px; height: 26px; margin: -13px; border-radius: 50%; opacity: 0; background: radial-gradient(circle, #fff, #ffe3a0 22%, rgba(255, 130, 40, .7) 48%, rgba(120, 60, 40, .25) 64%, transparent 72%); animation: none 152.67s linear infinite; }
@keyframes sgM21 { 0% { opacity: 0; } 9.93% { opacity: 0; } 9.956% { opacity: 1; transform: translate(0.0px, 0.0px) rotate(-5.2deg); } 10.349% { opacity: 1; transform: translate(35.6px, -2.0px) rotate(-0.8deg); } 10.742% { opacity: 1; transform: translate(71.2px, -1.2px) rotate(3.6deg); } 11.135% { opacity: 1; transform: translate(106.9px, 2.2px) rotate(8.0deg); } 11.528% { opacity: 1; transform: translate(142.5px, 8.5px) rotate(12.3deg); } 11.921% { opacity: 1; transform: translate(178.1px, 17.5px) rotate(16.4deg); } 12.314% { opacity: 1; transform: translate(213.8px, 29.2px) rotate(20.4deg); } 12.707% { opacity: 1; transform: translate(249.4px, 43.8px) rotate(24.2deg); } 13.1% { opacity: 1; transform: translate(285.0px, 61.0px) rotate(27.7deg); } 13.126% { opacity: 0; } 100% { opacity: 0; } }
@keyframes sgMH22 { 0%, 13.074% { opacity: 0; transform: scale(.3); } 13.205% { opacity: 1; transform: scale(1); } 14.253%, 100% { opacity: 0; transform: scale(1.8); } }
@keyframes sgM23 { 0% { opacity: 0; } 19.886% { opacity: 0; } 19.912% { opacity: 1; transform: translate(0.0px, 0.0px) rotate(-1.0deg); } 20.274% { opacity: 1; transform: translate(39.0px, 0.1px) rotate(1.6deg); } 20.635% { opacity: 1; transform: translate(78.0px, 2.0px) rotate(4.1deg); } 20.991% { opacity: 1; transform: translate(117.0px, 5.6px) rotate(6.7deg); } 21.353% { opacity: 1; transform: translate(156.0px, 11.0px) rotate(9.2deg); } 21.715% { opacity: 1; transform: translate(195.0px, 18.1px) rotate(11.7deg); } 22.071% { opacity: 1; transform: translate(234.0px, 27.0px) rotate(14.1deg); } 22.432% { opacity: 1; transform: translate(273.0px, 37.6px) rotate(16.5deg); } 22.794% { opacity: 1; transform: translate(312.0px, 50.0px) rotate(18.9deg); } 22.82% { opacity: 0; } 100% { opacity: 0; } }
@keyframes sgMH24 { 0%, 22.768% { opacity: 0; transform: scale(.3); } 22.899% { opacity: 1; transform: scale(1); } 23.947%, 100% { opacity: 0; transform: scale(1.8); } }
@keyframes sgM25 { 0% { opacity: 0; } 27.746% { opacity: 0; } 27.772% { opacity: 1; transform: translate(0.0px, 0.0px) rotate(4.2deg); } 28.097% { opacity: 1; transform: translate(36.5px, 2.0px) rotate(1.9deg); } 28.427% { opacity: 1; transform: translate(73.0px, 2.5px) rotate(-0.5deg); } 28.757% { opacity: 1; transform: translate(109.5px, 1.5px) rotate(-2.8deg); } 29.082% { opacity: 1; transform: translate(146.0px, -1.0px) rotate(-5.2deg); } 29.407% { opacity: 1; transform: translate(182.5px, -5.0px) rotate(-7.5deg); } 29.737% { opacity: 1; transform: translate(219.0px, -10.5px) rotate(-9.8deg); } 30.067% { opacity: 1; transform: translate(255.5px, -17.5px) rotate(-12.1deg); } 30.392% { opacity: 1; transform: translate(292.0px, -26.0px) rotate(-14.3deg); } 30.418% { opacity: 0; } 100% { opacity: 0; } }
@keyframes sgMH26 { 0%, 30.366% { opacity: 0; transform: scale(.3); } 30.497% { opacity: 1; transform: scale(1); } 31.545%, 100% { opacity: 0; transform: scale(1.8); } }
.sgFighterJ { width: 16px; height: 8px; margin: -4px 0 0 -8px; background: url('/sky/fighter.svg') center / contain no-repeat; opacity: 0; animation: none 152.67s linear infinite; }
.sgFighterJ::after { content: ''; position: absolute; right: 14px; top: 2px; width: 12px; height: 4px; border-radius: 50%; background: radial-gradient(ellipse at right center, rgba(190, 235, 255, .9), transparent 75%); }
@keyframes sgFt27 { 0% { opacity: 0; } 15.144% { opacity: 0; transform: translate(0px, 0px) rotate(10deg); } 15.196% { opacity: 1; transform: translate(0px, 0px) rotate(9deg); } 16.433% { opacity: 1; transform: translate(52px, 8px) rotate(8deg); } 17.674% { opacity: 1; transform: translate(122px, 18px) rotate(7deg); } 18.911% { opacity: 1; transform: translate(190px, 26px) rotate(8deg); } 20.148% { opacity: 1; transform: translate(250px, 34px) rotate(-13deg); } 21.39% { opacity: 1; transform: translate(286px, 26px) rotate(-107deg); } 22.626% { opacity: 1; transform: translate(280px, 6px) rotate(-160deg); } 23.868% { opacity: 1; transform: translate(242px, -8px) rotate(-175deg); } 25.105% { opacity: 1; transform: translate(176px, -14px) rotate(180deg); } 26.341% { opacity: 1; transform: translate(104px, -14px) rotate(174deg); } 27.583% { opacity: 1; transform: translate(46px, -8px) rotate(170deg); } 28.82% { opacity: 0; transform: translate(12px, -2px) rotate(180deg); } 100% { opacity: 0; } }
@keyframes sgFt28 { 0% { opacity: 0; } 15.144% { opacity: 0; transform: translate(0px, 0px) rotate(10deg); } 15.196% { opacity: 1; transform: translate(0px, 0px) rotate(9deg); } 16.433% { opacity: 1; transform: translate(52px, 8px) rotate(8deg); } 17.674% { opacity: 1; transform: translate(122px, 18px) rotate(7deg); } 18.911% { opacity: 1; transform: translate(190px, 26px) rotate(8deg); } 20.148% { opacity: 1; transform: translate(250px, 34px) rotate(-13deg); } 21.39% { opacity: 1; transform: translate(286px, 26px) rotate(-107deg); } 22.626% { opacity: 1; transform: translate(280px, 6px) rotate(-160deg); } 23.868% { opacity: 1; transform: translate(242px, -8px) rotate(-175deg); } 25.105% { opacity: 1; transform: translate(176px, -14px) rotate(180deg); } 26.341% { opacity: 1; transform: translate(104px, -14px) rotate(174deg); } 27.583% { opacity: 1; transform: translate(46px, -8px) rotate(170deg); } 28.82% { opacity: 0; transform: translate(12px, -2px) rotate(180deg); } 100% { opacity: 0; } }
@keyframes sgFt29 { 0% { opacity: 0; } 15.144% { opacity: 0; transform: translate(0px, 0px) rotate(10deg); } 15.196% { opacity: 1; transform: translate(0px, 0px) rotate(9deg); } 16.433% { opacity: 1; transform: translate(52px, 8px) rotate(8deg); } 17.674% { opacity: 1; transform: translate(122px, 18px) rotate(7deg); } 18.911% { opacity: 1; transform: translate(190px, 26px) rotate(8deg); } 20.148% { opacity: 1; transform: translate(250px, 34px) rotate(-13deg); } 21.39% { opacity: 1; transform: translate(286px, 26px) rotate(-107deg); } 22.626% { opacity: 1; transform: translate(280px, 6px) rotate(-160deg); } 23.868% { opacity: 1; transform: translate(242px, -8px) rotate(-175deg); } 25.105% { opacity: 1; transform: translate(176px, -14px) rotate(180deg); } 26.341% { opacity: 1; transform: translate(104px, -14px) rotate(174deg); } 27.583% { opacity: 1; transform: translate(46px, -8px) rotate(170deg); } 28.82% { opacity: 0; transform: translate(12px, -2px) rotate(180deg); } 100% { opacity: 0; } }
.sgExplode { width: 0; height: 0; }
.sgExFlash { left: -30px; top: -30px; width: 60px; height: 60px; border-radius: 50%; opacity: 0; background: radial-gradient(circle, #fff, #fff2c0 18%, #ffb050 38%, rgba(255, 90, 30, .5) 55%, transparent 72%); animation: sgExFlash 152.67s linear infinite; }
@keyframes sgExFlash { 0%, 23.004% { opacity: 0; transform: scale(.2); } 23.213% { opacity: 1; transform: scale(1); } 24.104% { opacity: .7; transform: scale(1.2); } 25.676%, 100% { opacity: 0; transform: scale(1.5); } }
.sgExRing { left: -14px; top: -14px; width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid rgba(200, 230, 255, .9); opacity: 0; animation: sgExRing 152.67s linear infinite; }
@keyframes sgExRing { 0%, 23.056% { opacity: 0; transform: scale(.3); } 23.266% { opacity: 1; } 25.152%, 100% { opacity: 0; transform: scale(4); } }
.sgExSmoke { left: -22px; top: -22px; width: 44px; height: 44px; border-radius: 50%; opacity: 0; background: radial-gradient(circle, rgba(120, 110, 110, .45), rgba(80, 75, 80, .25) 45%, transparent 70%); animation: sgExSmoke 152.67s linear infinite; }
@keyframes sgExSmoke { 0%, 23.318% { opacity: 0; transform: scale(.5); } 24.628% { opacity: 1; } 47.998%, 100% { opacity: 0; transform: scale(2.2); } }
.sgDebris { left: -3px; top: -1.5px; width: 6px; height: 3px; background: linear-gradient(90deg, #9aa5af, #4d5660); opacity: 0; animation: sgDebris 152.67s ease-out infinite; }
@keyframes sgDebris { 0%, 23.161% { opacity: 0; transform: translate(0, 0) rotate(0); } 23.37% { opacity: 1; } 28.296% { opacity: 1; transform: translate(var(--dx), var(--dy)) rotate(var(--r)); } 33.012% { opacity: .9; transform: translate(calc(var(--dx) * .12), calc(var(--dy) * .12)) rotate(calc(var(--r) * 1.7)); } 36.208%, 100% { opacity: 0; transform: translate(0, 0) rotate(calc(var(--r) * 1.9)); } }
.sgDustRing { left: -1px; top: -1px; width: 2px; height: 2px; border-radius: 50%; opacity: 0; box-shadow: 1.0px 10.7px 0 0.8px rgba(230, 220, 200, .6), -6.7px -5.4px 0 0.8px rgba(205, 195, 175, .85), -0.6px 8.7px 0 0.8px rgba(150, 145, 140, .6), -12.7px 7.7px 0 0.0px rgba(170, 160, 150, .7), 8.9px -7.8px 0 0.0px rgba(205, 195, 175, .85), 9.0px 11.2px 0 0.4px rgba(205, 195, 175, .85), 2.9px -12.2px 0 0.8px rgba(230, 220, 200, .6), -13.5px -7.3px 0 0.8px rgba(150, 145, 140, .6), -12.2px 7.6px 0 0.0px rgba(150, 145, 140, .6), 7.1px -5.4px 0 0.8px rgba(170, 160, 150, .7), 3.4px 13.1px 0 0.4px rgba(150, 145, 140, .6), -13.8px 6.0px 0 0.8px rgba(230, 220, 200, .6), -14.0px -6.6px 0 0.4px rgba(205, 195, 175, .85), 14.3px -0.7px 0 0.4px rgba(170, 160, 150, .7), 15.8px -2.9px 0 0.0px rgba(205, 195, 175, .85), -11.3px -10.0px 0 0.4px rgba(230, 220, 200, .6), 9.1px 7.2px 0 0.0px rgba(150, 145, 140, .6), -5.3px 6.3px 0 0.0px rgba(170, 160, 150, .7), -4.1px 11.7px 0 0.0px rgba(205, 195, 175, .85), -11.9px -7.4px 0 0.4px rgba(150, 145, 140, .6), -15.5px -4.1px 0 0.0px rgba(230, 220, 200, .6), 11.5px -0.1px 0 0.0px rgba(205, 195, 175, .85); animation: sgDustRing 152.67s linear infinite; }
@keyframes sgDustRing { 0%, 28.82% { opacity: 0; transform: rotate(0) scale(1.6); } 30.916% { opacity: .9; } 37.518% { opacity: .7; transform: rotate(300deg) scale(.7); } 47.998%, 100% { opacity: 0; transform: rotate(420deg) scale(.6); } }
.sgMoonGlow { left: -20px; top: -20px; width: 40px; height: 40px; border-radius: 50%; opacity: 0; background: radial-gradient(circle, rgba(255, 250, 235, .95), rgba(200, 215, 240, .45) 35%, transparent 70%); animation: sgMoonGlow 152.67s linear infinite; }
@keyframes sgMoonGlow { 0%, 33.012% { opacity: 0; transform: scale(.3); } 36.208% { opacity: 1; transform: scale(1); } 47.998%, 100% { opacity: 0; transform: scale(1.4); } }
.sgNewMoon { left: -10px; top: -10px; width: 20px; height: 20px; border-radius: 50%; background: url('/sky/moon_1.gif') center / cover; transform: rotate(180deg); box-shadow: 0 0 6px rgba(220, 230, 255, .35); opacity: 0; animation: sgNewMoon 152.67s ease-out infinite; }
@keyframes sgNewMoon { 0%, 33.536% { opacity: 0; transform: rotate(180deg) scale(.15); } 38.828% { opacity: 1; transform: rotate(180deg) scale(.55); } 55.858% { opacity: 1; transform: rotate(180deg) scale(1); } 92.999% { opacity: 1; transform: rotate(180deg) scale(1); } 98.659%, 100% { opacity: 0; transform: rotate(180deg) scale(1); } }
.sgSparks2 { left: -1px; top: -1px; width: 2px; height: 2px; border-radius: 50%; background: #ffd27a; opacity: 0; box-shadow: 8px -6px #ffd27a, -7px 7px #ffb060, 10px 8px #fff0c0, -10px -4px #ffd27a, 2px 11px #ffb060, -3px -11px #fff0c0, 12px 1px #ffb060, -12px 2px #ffe0a0; animation: sgSparks2 152.67s ease-out infinite; }
@keyframes sgSparks2 { 0%, 23.108% { opacity: 0; transform: scale(.3); } 23.318% { opacity: 1; } 25.676%, 100% { opacity: 0; transform: scale(3.2); } }
.sgCharge { width: 16px; height: 16px; margin: -8px; border-radius: 50%; opacity: 0; background: radial-gradient(circle, #fff, #ff9a9a 30%, rgba(255, 60, 60, .5) 55%, transparent 72%); animation: sgCharge 152.67s linear infinite; }
@keyframes sgCharge { 0%, 24.366% { opacity: 0; transform: scale(.2); } 26.095% { opacity: 1; transform: scale(1.3); } 27.51% { opacity: .9; transform: scale(1); } 28.034%, 100% { opacity: 0; transform: scale(.4); } }
.sgBeam { height: 3px; margin-top: -1.5px; transform-origin: left center; opacity: 0; background: linear-gradient(90deg, #fff, #ff8080 30%, #ff3030); box-shadow: 0 0 6px 1px rgba(255, 70, 70, .8); }
.sgBeam { animation: sgBeam 152.67s linear infinite; }
@keyframes sgBeam { 0%, 26.148% { opacity: 0; scale: 0 1; } 26.514% { opacity: 1; scale: 1 1; } 27.562% { opacity: 1; scale: 1 1.4; } 27.982%, 100% { opacity: 0; scale: 1 .2; } }
.sgBigShield { width: 82px; height: 66px; margin: -33px -41px; border-radius: 50%; opacity: 0; border: 1px solid rgba(150, 225, 255, .9); background: radial-gradient(ellipse, transparent 55%, rgba(110, 200, 255, .3) 78%, transparent 80%); box-shadow: 0 0 14px rgba(110, 200, 255, .55), inset 0 0 12px rgba(110, 200, 255, .4); animation: sgBigShield 152.67s linear infinite; }
@keyframes sgBigShield { 0%, 26.41% { opacity: 0; transform: scale(.9); } 26.724% { opacity: 1; transform: scale(1); } 27.772% { opacity: .9; } 28.82%, 100% { opacity: 0; transform: scale(1.05); } }
.sgFire { width: 5px; height: 5px; margin: -2.5px; border-radius: 50%; background: radial-gradient(circle, #fff3c0, #ff9a30 45%, transparent 72%); opacity: 0; animation: sgFlicker .3s steps(2) infinite, sgFireLife 152.67s linear infinite; }
@keyframes sgFlicker { 26.2% { transform: scale(1.4); } }
@keyframes sgFireLife { 0%, 29.082% { opacity: 0; } 29.344% { opacity: 1; } 32.75% { opacity: 1; } 33.274%, 100% { opacity: 0; } }
.sgProbe { width: 13px; height: 13px; background: url('/sky/ship_probe.webp') center / contain no-repeat; opacity: 0; animation: sgProbe 152.67s linear infinite; }
@keyframes sgProbe { 0%, .2.096% { opacity: 0; translate: 0 0; } 0.524% { opacity: 1; translate: 6px 0; } 2.41% { opacity: 1; translate: 121px 9px; } 4.611% { opacity: 1; translate: 124px 7px; } 4.716%, 100% { opacity: 0; translate: 124px 7px; } }
.sgScan { width: 30px; height: 30px; margin: -15px; border-radius: 50%; border: 1px solid rgba(140, 230, 255, .9); opacity: 0; animation: sgScan 152.67s linear infinite; }
@keyframes sgScan { 0%, 2.515% { opacity: 0; transform: scale(.2); } 2.62% { opacity: 1; } 3.458% { opacity: 0; transform: scale(3.2); } 3.511% { opacity: 0; transform: scale(.2); } 3.616% { opacity: 1; } 4.402%, 100% { opacity: 0; transform: scale(3.2); } }
@keyframes sgB30 { 0% { opacity: 0; } 4.292% { opacity: 0; translate: 0 0; } 4.297% { opacity: 1; translate: 0 0; } 4.611% { opacity: 1; translate: -114px -43px; } 4.616% { opacity: 0; translate: -114px -43px; } 100% { opacity: 0; } }
@keyframes sgH31 { 0% { opacity: 0; } 4.585% { opacity: 0; transform: scale(.3); } 4.69% { opacity: 1; transform: scale(1); } 5.45% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
.sgField { width: 2px; height: 2px; border-radius: 50%; opacity: 0; box-shadow: -13px -6px 0 0.0px rgba(160, 165, 175, .8), -17px -7px 0 0.0px rgba(255, 225, 170, .8), 20px 6px 0 0.0px rgba(200, 205, 215, .9), 1px -2px 0 0.0px rgba(200, 205, 215, .9), -11px 8px 0 0.0px rgba(255, 225, 170, .8), 15px 6px 0 0.0px rgba(200, 205, 215, .9), -9px 3px 0 0.4px rgba(160, 165, 175, .8), -20px 2px 0 0.4px rgba(160, 165, 175, .8), 0px -5px 0 0.0px rgba(160, 165, 175, .8), -20px 8px 0 0.4px rgba(160, 165, 175, .8), -24px -3px 0 0.4px rgba(160, 165, 175, .8), 17px 1px 0 0.0px rgba(160, 165, 175, .8), 5px -1px 0 0.0px rgba(200, 205, 215, .9), -9px 6px 0 0.0px rgba(200, 205, 215, .9), -22px 3px 0 0.0px rgba(255, 225, 170, .8), 2px 0px 0 0.0px rgba(200, 205, 215, .9), 24px -5px 0 0.0px rgba(200, 205, 215, .9), 6px -1px 0 0.0px rgba(160, 165, 175, .8), -3px 2px 0 0.4px rgba(255, 225, 170, .8), -14px -2px 0 0.0px rgba(255, 225, 170, .8), -13px 5px 0 0.4px rgba(200, 205, 215, .9), -18px 8px 0 0.0px rgba(160, 165, 175, .8), -23px -2px 0 0.0px rgba(160, 165, 175, .8), 11px 8px 0 0.0px rgba(160, 165, 175, .8), -10px 8px 0 0.4px rgba(160, 165, 175, .8), 17px 7px 0 0.4px rgba(200, 205, 215, .9), -10px -5px 0 0.0px rgba(160, 165, 175, .8), -17px -2px 0 0.0px rgba(160, 165, 175, .8), 4px -2px 0 0.0px rgba(200, 205, 215, .9), -6px 6px 0 0.0px rgba(255, 225, 170, .8), -19px 9px 0 0.0px rgba(200, 205, 215, .9), -19px -7px 0 0.4px rgba(200, 205, 215, .9), 5px 9px 0 0.4px rgba(200, 205, 215, .9), 2px 2px 0 0.0px rgba(200, 205, 215, .9); animation: sgField 152.67s linear infinite, sgTwinkleF 1.7s ease-in-out infinite alternate; }
@keyframes sgField { 0%, 24.104% { opacity: 0; } 26.2% { opacity: 1; } 66.59% { opacity: 1; scale: 1; } 79.795%, 100% { opacity: 0; scale: .3; } }
@keyframes sgTwinkleF { from { filter: brightness(.7); } to { filter: brightness(1.3); } }
.sgRecycler { width: 40px; height: 24px; background: url('/sky/ship_recycler.webp') center / contain no-repeat; opacity: 0; animation: sgRecycler 152.67s linear infinite; }
.sgTractor { width: 40px; height: 14px; transform-origin: left center; opacity: 0; background: linear-gradient(90deg, rgba(150, 240, 220, .55), rgba(150, 240, 220, .05)); clip-path: polygon(0 40%, 100% 0, 100% 100%, 0 60%); animation: sgTractor 152.67s linear infinite; }
@keyframes sgTractor { 0%, 63.76% { opacity: 0; } 65.647% { opacity: 1; } 70.363% { opacity: .6; } 74.135% { opacity: 1; } 76.965%, 100% { opacity: 0; } }
@keyframes sgGateOutFlash { 0% { opacity: 0; } 56.382% { opacity: 0; transform: scale(.4); } 57.326% { opacity: 1; transform: scale(1.1); } 58.374% { opacity: 0; transform: scale(1.5); } 100% { opacity: 0; } }
.sgGateOut .sgGateFlash { animation: sgGateOutFlash 152.67s linear infinite; }
@keyframes sgGateInFlash { 0% { opacity: 0; } 58.478% { opacity: 0; transform: scale(.4); } 59.002% { opacity: 1; transform: scale(1.1); } 61.685% { opacity: 0; transform: scale(1.5); } 97.715% { opacity: 0; transform: scale(.4); } 99.602% { opacity: 1; transform: scale(1.1); } 99.948% { opacity: 0; transform: scale(1.5); } 100% { opacity: 0; } }
.sgGateIn .sgGateFlash { animation: sgGateInFlash 152.67s linear infinite; }
.sgGate { width: 0; height: 0; }
.sgGate::before { content: ''; position: absolute; left: -30px; top: -26px; width: 60px; height: 51px; background: url('/sky/jump_gate.webp') center / contain no-repeat; transform: rotate(var(--tilt)); animation: sgGateHum 3s ease-in-out infinite alternate; }
@keyframes sgGateHum { from { filter: brightness(.85); } to { filter: brightness(1.25) drop-shadow(0 0 6px rgba(150, 220, 255, .6)); } }
@keyframes sgGateSwirl { to { transform: rotate(360deg); } }
.sgGateFlash { left: -46px; top: -46px; width: 92px; height: 92px; border-radius: 50%; opacity: 0; background: radial-gradient(circle, #fff, rgba(190, 240, 255, .85) 25%, rgba(120, 200, 255, .35) 50%, transparent 70%); }
.sgVoyage { width: 84px; height: 52px; opacity: 0; animation: sgVoyage 152.67s linear infinite; }
@keyframes sgVoyage { 0%, 33.798% { opacity: 0; translate: 30px -6px; scale: -1 1; } 33.85% { opacity: 1; translate: 30px -6px; scale: -1 1; } 56.906% { opacity: 1; translate: calc(calc((100vw - 64px) / var(--bs)) - 338px) calc(calc((100vh - 64px - 95vh) / var(--bs) + 160px) - 88px); scale: -1 1; } 57.535% { opacity: 1; translate: calc(calc((100vw - 64px) / var(--bs)) - 338px) calc(calc((100vh - 64px - 95vh) / var(--bs) + 160px) - 88px); scale: -.04 .04; } 57.588%, 58.583% { opacity: 0; translate: calc(calc((100vw - 176px) / var(--bs)) - 338px) calc(calc((56px - 95vh) / var(--bs) + 160px) - 88px); scale: .04 .04; } 58.688% { opacity: 1; translate: calc(calc((100vw - 176px) / var(--bs)) - 338px) calc(calc((56px - 95vh) / var(--bs) + 160px) - 88px); scale: .04 .04; } 59.422% { opacity: 1; translate: calc(calc((100vw - 176px) / var(--bs)) - 338px) calc(calc((56px - 95vh) / var(--bs) + 160px) - 88px); scale: 1 1; } 80.549% { opacity: 1; translate: calc(calc(calc(calc((100vw - 176px) / var(--bs)) * 0.26 + 301.92px) + 58px) - 338px) calc(calc(calc(calc((56px - 95vh) / var(--bs) + 160px) * 0.26 + -1.48px) + -42px) - 88px); scale: 1 1; } 84.699% { opacity: 1; translate: calc(calc(calc(calc((100vw - 176px) / var(--bs)) * 0.26 + 301.92px) + 58px) - 338px) calc(calc(calc(calc((56px - 95vh) / var(--bs) + 160px) * 0.26 + -1.48px) + -42px) - 88px); scale: 1 1; } 86.208% { opacity: 1; translate: calc(calc(calc(calc((100vw - 176px) / var(--bs)) * 0.26 + 301.92px) + 58px) - 338px) calc(calc(calc(calc((56px - 95vh) / var(--bs) + 160px) * 0.26 + -1.48px) + -42px) - 88px); scale: -1 1; } 97.527% { opacity: 1; translate: calc(calc((100vw - 176px) / var(--bs)) - 338px) calc(calc((56px - 95vh) / var(--bs) + 160px) - 88px); scale: -1 1; } 99.036% { opacity: 1; translate: calc(calc((100vw - 176px) / var(--bs)) - 338px) calc(calc((56px - 95vh) / var(--bs) + 160px) - 88px); scale: -.04 .04; } 99.224%, 100% { opacity: 0; translate: calc(calc((100vw - 176px) / var(--bs)) - 338px) calc(calc((56px - 95vh) / var(--bs) + 160px) - 88px); scale: .04 .04; } }
@keyframes sgCatch0 { 0%, 80.908% { opacity: 0; translate: 52px -40px; } 80.926% { opacity: 1; translate: 52px -40px; } 81.87% { opacity: 1; translate: 0 0; } 81.888%, 100% { opacity: 0; translate: 0 0; } }
@keyframes sgCatch1 { 0%, 82.039% { opacity: 0; translate: 52px -40px; } 82.058% { opacity: 1; translate: 52px -40px; } 83.001% { opacity: 1; translate: 0 0; } 83.02%, 100% { opacity: 0; translate: 0 0; } }
@keyframes sgCatch2 { 0%, 82.983% { opacity: 0; translate: 52px -40px; } 83.001% { opacity: 1; translate: 52px -40px; } 83.945% { opacity: 1; translate: 0 0; } 83.964%, 100% { opacity: 0; translate: 0 0; } }
@keyframes sgRecycler { 0%, 53.238% { opacity: 0; transform: translate(-352px, 6px) scaleX(-1); } 55.858% { opacity: 1; transform: translate(-342px, 6px) scaleX(-1); } 62.817% { opacity: 1; transform: translate(-30px, 0) scaleX(-1); } 77.908% { opacity: 1; transform: translate(-26px, 0) scaleX(-1); } 84.133% { opacity: 1; transform: translate(calc(calc(calc((100vw - 176px) / var(--bs)) * 0.26 + 301.92px) - 360px), calc(calc(calc((56px - 95vh) / var(--bs) + 160px) * 0.26 + -1.48px) - 52px)) scaleX(-1); } 84.322%, 100% { opacity: 0; transform: translate(calc(calc(calc((100vw - 176px) / var(--bs)) * 0.26 + 301.92px) - 360px), calc(calc(calc((56px - 95vh) / var(--bs) + 160px) * 0.26 + -1.48px) - 52px)) scaleX(-1); } }
.sgCatchBolt { width: 14px; height: 1.6px; margin-top: -.8px; transform-origin: left center; transform: rotate(142deg); opacity: 0; background: linear-gradient(90deg, transparent, #ff5a4a); box-shadow: 0 0 4px #ff5a4a; animation: none 152.67s linear infinite; }
.sgCatchBoom { width: 30px; height: 30px; margin: -15px; border-radius: 50%; opacity: 0; background: radial-gradient(circle, #fff, #ffe3a0 22%, rgba(255, 130, 40, .7) 48%, rgba(120, 60, 40, .25) 64%, transparent 72%); animation: sgCatchBoom 152.67s linear infinite; }
@keyframes sgCatchBoom { 0%, 83.756% { opacity: 0; transform: scale(.3); } 84.322% { opacity: 1; transform: scale(1.1); } 89.227%, 100% { opacity: 0; transform: scale(1.8); } }
.sgCatchSparks { animation: sgCatchSparks 152.67s ease-out infinite; }
@keyframes sgCatchSparks { 0%, 83.945% { opacity: 0; transform: scale(.3); } 84.511% { opacity: 1; } 91.113%, 100% { opacity: 0; transform: scale(3.2); } }
.sgVoyage .sgReinf { opacity: 0; animation: sgReinf 152.67s linear infinite; }
@keyframes sgReinf { 0%, 58.636% { opacity: 0; } 59.317%, 100% { opacity: 1; } }
@media (max-width: 1250px) { .sgGate { display: none; } }
.sgBattle { display: none !important; }
@media (prefers-reduced-motion: reduce) { .sgBattle { display: none; } }