/* generated by build/tools/game_fx.py from the game's Flash effects, do not edit by hand */
.gfx { position: fixed; pointer-events: none; z-index: 1000; }
.gfx > i { position: absolute; left: 0; top: 0; background-size: 100% 100%; opacity: 0; animation-timing-function: step-end; animation-fill-mode: forwards; }
.gfx-tap { margin: -110px 0 0 -110px; transform: scale(.6); }
.gfx-tap { --n: 15; width: 220px; height: 220px; }
.gfx-tap > i { animation-duration: 0.5s; }
.gfx-tap > i:nth-child(1) { width: 64px; height: 64px; background-image: url(../puni/img/fx/all_ef_light04.png); transform-origin: 32.05px 32.05px; animation-name: gfx-tap-1; }
@keyframes gfx-tap-1 {
  0% { opacity: 0.227; transform: translate(77.95px, 77.95px) scale(0.193); }
  6.667% { opacity: 0.188; transform: translate(78px, 78px) scale(0.29); }
  13.333% { opacity: 0.149; transform: translate(77.95px, 77.95px) scale(0.387); }
  20% { opacity: 0.11; transform: translate(77.95px, 77.95px) scale(0.541); }
  26.667% { opacity: 0.067; transform: translate(77.95px, 77.95px) scale(0.694); }
  33.333% { opacity: 0.078; transform: translate(77.95px, 77.95px) scale(0.732); }
  40% { opacity: 0.078; transform: translate(77.9px, 77.9px) scale(0.769); }
  46.667% { opacity: 0.086; transform: translate(77.9px, 77.9px) scale(0.806); }
  53.333% { opacity: 0.067; transform: translate(77.9px, 77.95px) scale(0.86); }
  60% { opacity: 0.039; transform: translate(77.95px, 77.95px) scale(0.913); }
  66.667% { opacity: 0.02; transform: translate(77.95px, 78px) scale(0.967); }
  80% { opacity: 0.008; transform: translate(77.95px, 78px) scale(0.968); }
  86.667% { opacity: 0.008; transform: translate(77.95px, 77.95px) scale(0.968); }
  93.333% { opacity: 0; transform: translate(77.95px, 77.95px) scale(0.968); }
  100% { opacity: 0; transform: translate(77.95px, 77.95px) scale(0.969); }
}
.gfx-tap > i:nth-child(2) { width: 64px; height: 64px; background-image: url(../puni/img/fx/all_ef_light04.png); transform-origin: 32.05px 32.05px; animation-name: gfx-tap-2; }
@keyframes gfx-tap-2 {
  0% { opacity: 1; transform: translate(77.95px, 77.95px) scale(0.193); }
  6.667% { opacity: 1; transform: translate(77.95px, 77.95px) scale(0.407); }
  13.333% { opacity: 1; transform: translate(77.9px, 77.9px) scale(0.62); }
  20% { opacity: 0.929; transform: translate(77.9px, 77.9px) scale(0.657); }
  26.667% { opacity: 0.859; transform: translate(77.9px, 77.9px) scale(0.694); }
  33.333% { opacity: 0.788; transform: translate(77.9px, 77.9px) scale(0.732); }
  40% { opacity: 0.71; transform: translate(77.9px, 77.9px) scale(0.769); }
  46.667% { opacity: 0.639; transform: translate(77.9px, 77.9px) scale(0.806); }
  53.333% { opacity: 0.569; transform: translate(77.9px, 77.95px) scale(0.86); }
  60% { opacity: 0.498; transform: translate(77.95px, 77.95px) scale(0.913); }
  66.667% { opacity: 0.42; transform: translate(77.95px, 78px) scale(0.967); }
  73.333% { opacity: 0.337; transform: translate(77.95px, 78px) scale(0.967); }
  80% { opacity: 0.247; transform: translate(77.95px, 78px) scale(0.968); }
  86.667% { opacity: 0.169; transform: translate(77.95px, 77.95px) scale(0.968); }
  93.333% { opacity: 0.086; transform: translate(77.95px, 77.95px) scale(0.968); }
  100% { opacity: 0; transform: translate(77.95px, 77.95px) scale(0.969); }
}
.gfx-tap > i:nth-child(3) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 23.95px 23.95px; animation-name: gfx-tap-3; }
@keyframes gfx-tap-3 {
  0% { opacity: 0; }
  13.333% { opacity: 0; transform: translate(65.15px, 73.9px) rotate(-60deg) scale(0.7); }
  20% { opacity: 0.039; transform: translate(57.5px, 69.5px) rotate(-60deg) scale(0.799); }
  26.667% { opacity: 0.086; transform: translate(49.85px, 65.15px) rotate(-60deg) scale(0.899); }
  33.333% { opacity: 0.129; transform: translate(42.2px, 60.7px) rotate(-60deg) scale(1); }
  40% { opacity: 0.149; transform: translate(38.85px, 58.7px) rotate(-60.1deg) scale(0.87); }
  46.667% { opacity: 0.169; transform: translate(35.4px, 56.75px) rotate(-60.1deg) scale(0.742); }
  53.333% { opacity: 0.188; transform: translate(32px, 54.8px) rotate(-60deg) scale(0.614); }
  60% { opacity: 0.129; transform: translate(31.15px, 54.3px) rotate(-60deg) scale(0.473); }
  66.667% { opacity: 0.059; transform: translate(30.25px, 53.9px) rotate(-60deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(29.4px, 53.35px) rotate(-60deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(4) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 23.95px 24.05px; animation-name: gfx-tap-4; }
@keyframes gfx-tap-4 {
  0% { opacity: 0; }
  13.333% { opacity: 0; transform: translate(106.75px, 98.05px) rotate(120deg) scale(0.7); }
  20% { opacity: 0.039; transform: translate(114.4px, 102.55px) rotate(119.9deg) scale(0.799); }
  26.667% { opacity: 0.086; transform: translate(122.1px, 106.9px) rotate(119.9deg) scale(0.899); }
  33.333% { opacity: 0.129; transform: translate(129.7px, 111.35px) rotate(120deg) scale(1); }
  40% { opacity: 0.149; transform: translate(133.1px, 113.25px) rotate(119.9deg) scale(0.87); }
  46.667% { opacity: 0.169; transform: translate(136.6px, 115.25px) rotate(119.9deg) scale(0.742); }
  53.333% { opacity: 0.188; transform: translate(139.95px, 117.2px) rotate(120deg) scale(0.614); }
  60% { opacity: 0.129; transform: translate(140.85px, 117.65px) rotate(119.9deg) scale(0.473); }
  66.667% { opacity: 0.059; transform: translate(141.6px, 118.25px) rotate(119.9deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(142.45px, 118.7px) rotate(120deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(5) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 24px 23.95px; animation-name: gfx-tap-5; }
@keyframes gfx-tap-5 {
  0% { opacity: 0; }
  13.333% { opacity: 0; transform: translate(65px, 98px) rotate(-120deg) scale(0.7); }
  20% { opacity: 0.039; transform: translate(57.35px, 102.5px) rotate(-119.9deg) scale(0.799); }
  26.667% { opacity: 0.086; transform: translate(49.65px, 106.9px) rotate(-119.9deg) scale(0.899); }
  33.333% { opacity: 0.129; transform: translate(42.05px, 111.3px) rotate(-120deg) scale(1); }
  40% { opacity: 0.149; transform: translate(38.65px, 113.3px) rotate(-119.9deg) scale(0.87); }
  46.667% { opacity: 0.169; transform: translate(35.25px, 115.2px) rotate(-119.9deg) scale(0.742); }
  53.333% { opacity: 0.188; transform: translate(31.85px, 117.15px) rotate(-120deg) scale(0.614); }
  60% { opacity: 0.129; transform: translate(31px, 117.65px) rotate(-119.9deg) scale(0.473); }
  66.667% { opacity: 0.059; transform: translate(30.15px, 118.15px) rotate(-119.9deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(29.3px, 118.65px) rotate(-120deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(6) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 24.05px 24.05px; animation-name: gfx-tap-6; }
@keyframes gfx-tap-6 {
  0% { opacity: 0; }
  13.333% { opacity: 0; transform: translate(106.75px, 74px) rotate(60deg) scale(0.7); }
  20% { opacity: 0.039; transform: translate(114.4px, 69.6px) rotate(60deg) scale(0.799); }
  26.667% { opacity: 0.086; transform: translate(122.15px, 65.15px) rotate(60deg) scale(0.899); }
  33.333% { opacity: 0.129; transform: translate(129.7px, 60.75px) rotate(60deg) scale(1); }
  40% { opacity: 0.149; transform: translate(133.05px, 58.85px) rotate(60.1deg) scale(0.87); }
  46.667% { opacity: 0.169; transform: translate(136.55px, 56.8px) rotate(60.1deg) scale(0.742); }
  53.333% { opacity: 0.188; transform: translate(139.9px, 54.85px) rotate(60deg) scale(0.614); }
  60% { opacity: 0.129; transform: translate(140.75px, 54.35px) rotate(60deg) scale(0.473); }
  66.667% { opacity: 0.059; transform: translate(141.6px, 53.95px) rotate(60deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(142.45px, 53.4px) rotate(60deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(7) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 23.95px 24px; animation-name: gfx-tap-7; }
@keyframes gfx-tap-7 {
  0% { opacity: 0; }
  13.333% { opacity: 0; transform: translate(85.95px, 110.05px) rotate(180deg) scale(0.7); }
  20% { opacity: 0.039; transform: translate(85.95px, 118.9px) rotate(180deg) scale(0.8); }
  26.667% { opacity: 0.086; transform: translate(85.95px, 127.75px) rotate(180deg) scale(0.9); }
  33.333% { opacity: 0.129; transform: translate(85.95px, 136.6px) rotate(180deg) scale(1); }
  40% { opacity: 0.149; transform: translate(85.95px, 140.5px) rotate(180deg) scale(0.871); }
  46.667% { opacity: 0.169; transform: translate(85.95px, 144.45px) rotate(180deg) scale(0.743); }
  53.333% { opacity: 0.188; transform: translate(85.95px, 148.35px) rotate(180deg) scale(0.614); }
  60% { opacity: 0.129; transform: translate(85.95px, 149.35px) rotate(180deg) scale(0.473); }
  66.667% { opacity: 0.059; transform: translate(85.95px, 150.3px) rotate(180deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(85.95px, 151.3px) rotate(180deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(8) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 24px 24px; animation-name: gfx-tap-8; }
@keyframes gfx-tap-8 {
  0% { opacity: 0; }
  13.333% { opacity: 0; transform: translate(86.05px, 61.9px) scale(0.7); }
  20% { opacity: 0.039; transform: translate(86.05px, 53.05px) scale(0.8); }
  26.667% { opacity: 0.086; transform: translate(86.05px, 44.25px) scale(0.9); }
  33.333% { opacity: 0.129; transform: translate(86.05px, 35.4px) scale(1); }
  40% { opacity: 0.149; transform: translate(86.05px, 31.5px) scale(0.871); }
  46.667% { opacity: 0.169; transform: translate(86.05px, 27.55px) scale(0.743); }
  53.333% { opacity: 0.188; transform: translate(86.05px, 23.65px) scale(0.614); }
  60% { opacity: 0.129; transform: translate(86.05px, 22.65px) scale(0.473); }
  66.667% { opacity: 0.059; transform: translate(86.05px, 21.7px) scale(0.332); }
  73.333% { opacity: 0; transform: translate(86.05px, 20.7px) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(9) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 23.95px 23.95px; animation-name: gfx-tap-9; }
@keyframes gfx-tap-9 {
  0% { opacity: 0; }
  13.333% { opacity: 0.149; transform: translate(65.15px, 73.9px) rotate(-60deg) scale(0.7); }
  20% { opacity: 0.337; transform: translate(57.5px, 69.5px) rotate(-60deg) scale(0.799); }
  26.667% { opacity: 0.529; transform: translate(49.85px, 65.15px) rotate(-60deg) scale(0.899); }
  33.333% { opacity: 0.718; transform: translate(42.2px, 60.7px) rotate(-60deg) scale(1); }
  40% { opacity: 0.569; transform: translate(38.85px, 58.7px) rotate(-60.1deg) scale(0.87); }
  46.667% { opacity: 0.408; transform: translate(35.4px, 56.75px) rotate(-60.1deg) scale(0.742); }
  53.333% { opacity: 0.259; transform: translate(32px, 54.8px) rotate(-60deg) scale(0.614); }
  60% { opacity: 0.176; transform: translate(31.15px, 54.3px) rotate(-60deg) scale(0.473); }
  66.667% { opacity: 0.086; transform: translate(30.25px, 53.9px) rotate(-60deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(29.4px, 53.35px) rotate(-60deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(10) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 23.95px 24.05px; animation-name: gfx-tap-10; }
@keyframes gfx-tap-10 {
  0% { opacity: 0; }
  13.333% { opacity: 0.149; transform: translate(106.75px, 98.05px) rotate(120deg) scale(0.7); }
  20% { opacity: 0.337; transform: translate(114.4px, 102.55px) rotate(119.9deg) scale(0.799); }
  26.667% { opacity: 0.529; transform: translate(122.1px, 106.9px) rotate(119.9deg) scale(0.899); }
  33.333% { opacity: 0.718; transform: translate(129.7px, 111.35px) rotate(120deg) scale(1); }
  40% { opacity: 0.569; transform: translate(133.1px, 113.25px) rotate(119.9deg) scale(0.87); }
  46.667% { opacity: 0.408; transform: translate(136.6px, 115.25px) rotate(119.9deg) scale(0.742); }
  53.333% { opacity: 0.259; transform: translate(139.95px, 117.2px) rotate(120deg) scale(0.614); }
  60% { opacity: 0.176; transform: translate(140.85px, 117.65px) rotate(119.9deg) scale(0.473); }
  66.667% { opacity: 0.086; transform: translate(141.6px, 118.25px) rotate(119.9deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(142.45px, 118.7px) rotate(120deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(11) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 24px 23.95px; animation-name: gfx-tap-11; }
@keyframes gfx-tap-11 {
  0% { opacity: 0; }
  13.333% { opacity: 0.149; transform: translate(65px, 98px) rotate(-120deg) scale(0.7); }
  20% { opacity: 0.337; transform: translate(57.35px, 102.5px) rotate(-119.9deg) scale(0.799); }
  26.667% { opacity: 0.529; transform: translate(49.65px, 106.9px) rotate(-119.9deg) scale(0.899); }
  33.333% { opacity: 0.718; transform: translate(42.05px, 111.3px) rotate(-120deg) scale(1); }
  40% { opacity: 0.569; transform: translate(38.65px, 113.3px) rotate(-119.9deg) scale(0.87); }
  46.667% { opacity: 0.408; transform: translate(35.25px, 115.2px) rotate(-119.9deg) scale(0.742); }
  53.333% { opacity: 0.259; transform: translate(31.85px, 117.15px) rotate(-120deg) scale(0.614); }
  60% { opacity: 0.176; transform: translate(31px, 117.65px) rotate(-119.9deg) scale(0.473); }
  66.667% { opacity: 0.086; transform: translate(30.15px, 118.15px) rotate(-119.9deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(29.3px, 118.65px) rotate(-120deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(12) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 24.05px 24.05px; animation-name: gfx-tap-12; }
@keyframes gfx-tap-12 {
  0% { opacity: 0; }
  13.333% { opacity: 0.149; transform: translate(106.75px, 74px) rotate(60deg) scale(0.7); }
  20% { opacity: 0.337; transform: translate(114.4px, 69.6px) rotate(60deg) scale(0.799); }
  26.667% { opacity: 0.529; transform: translate(122.15px, 65.15px) rotate(60deg) scale(0.899); }
  33.333% { opacity: 0.718; transform: translate(129.7px, 60.75px) rotate(60deg) scale(1); }
  40% { opacity: 0.569; transform: translate(133.05px, 58.85px) rotate(60.1deg) scale(0.87); }
  46.667% { opacity: 0.408; transform: translate(136.55px, 56.8px) rotate(60.1deg) scale(0.742); }
  53.333% { opacity: 0.259; transform: translate(139.9px, 54.85px) rotate(60deg) scale(0.614); }
  60% { opacity: 0.176; transform: translate(140.75px, 54.35px) rotate(60deg) scale(0.473); }
  66.667% { opacity: 0.086; transform: translate(141.6px, 53.95px) rotate(60deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(142.45px, 53.4px) rotate(60deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(13) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 23.95px 24px; animation-name: gfx-tap-13; }
@keyframes gfx-tap-13 {
  0% { opacity: 0; }
  13.333% { opacity: 0.149; transform: translate(86.1px, 110.05px) rotate(180deg) scale(0.7); }
  20% { opacity: 0.337; transform: translate(86.05px, 118.9px) rotate(180deg) scale(0.8); }
  26.667% { opacity: 0.529; transform: translate(85.95px, 127.75px) rotate(180deg) scale(0.9); }
  33.333% { opacity: 0.718; transform: translate(85.9px, 136.6px) rotate(180deg) scale(1); }
  40% { opacity: 0.569; transform: translate(85.9px, 140.5px) rotate(180deg) scale(0.871); }
  46.667% { opacity: 0.408; transform: translate(85.95px, 144.45px) rotate(180deg) scale(0.743); }
  53.333% { opacity: 0.259; transform: translate(85.95px, 148.35px) rotate(180deg) scale(0.614); }
  60% { opacity: 0.176; transform: translate(86px, 149.35px) rotate(180deg) scale(0.473); }
  66.667% { opacity: 0.086; transform: translate(86.05px, 150.3px) rotate(180deg) scale(0.332); }
  73.333% { opacity: 0; transform: translate(86.1px, 151.3px) rotate(180deg) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(14) { width: 48px; height: 48px; background-image: url(../puni/img/fx/all_ef_star02.png); transform-origin: 24px 24px; animation-name: gfx-tap-14; }
@keyframes gfx-tap-14 {
  0% { opacity: 0; }
  13.333% { opacity: 0.149; transform: translate(86px, 61.9px) scale(0.7); }
  20% { opacity: 0.337; transform: translate(86.05px, 53.05px) scale(0.8); }
  26.667% { opacity: 0.529; transform: translate(86.1px, 44.25px) scale(0.9); }
  33.333% { opacity: 0.718; transform: translate(86.15px, 35.4px) scale(1); }
  40% { opacity: 0.569; transform: translate(86.15px, 31.5px) scale(0.871); }
  46.667% { opacity: 0.408; transform: translate(86.1px, 27.55px) scale(0.743); }
  53.333% { opacity: 0.259; transform: translate(86.1px, 23.65px) scale(0.614); }
  60% { opacity: 0.176; transform: translate(86.05px, 22.65px) scale(0.473); }
  66.667% { opacity: 0.086; transform: translate(86px, 21.7px) scale(0.332); }
  73.333% { opacity: 0; transform: translate(85.95px, 20.7px) scale(0.191); }
  80% { opacity: 0; }
}
.gfx-tap > i:nth-child(15) { width: 128px; height: 128px; background-image: url(../puni/img/fx/all_ef_circle07.png); transform-origin: 63.95px 63.95px; animation-name: gfx-tap-15; }
@keyframes gfx-tap-15 {
  0% { opacity: 0; }
  13.333% { opacity: 0.698; transform: translate(46.05px, 46.05px) scale(0.604); }
  20% { opacity: 0.608; transform: translate(46.05px, 46.05px) scale(0.787); }
  26.667% { opacity: 0.51; transform: translate(46.05px, 46.05px) scale(0.971); }
  33.333% { opacity: 0.42; transform: translate(46.1px, 46.05px) scale(1.155); }
  40% { opacity: 0.318; transform: translate(46.1px, 46.05px) scale(1.339); }
  46.667% { opacity: 0.227; transform: translate(46.1px, 46.05px) scale(1.522); }
  53.333% { opacity: 0.176; transform: translate(46.05px, 46.05px) scale(1.562); }
  60% { opacity: 0.137; transform: translate(46.05px, 46.05px) scale(1.602); }
  66.667% { opacity: 0.086; transform: translate(46px, 46.05px) scale(1.641); }
  73.333% { opacity: 0.047; transform: translate(46.05px, 46.1px) scale(1.681); }
  80% { opacity: 0; transform: translate(46.05px, 46.05px) scale(1.72); }
  86.667% { opacity: 0; }
}
@keyframes gfx-sink {
  0% { transform: scale(1); }
  25% { transform: scale(1.008); }
  50% { transform: scale(1.015); }
  75% { transform: scale(1.023); }
  100% { transform: scale(1.03); }
}
@keyframes gfx-push {
  0% { transform: scale(1.053); }
  14.286% { transform: scale(1.077); }
  28.571% { transform: scale(1.1); }
  42.857% { transform: scale(0.95); }
  57.143% { transform: scale(0.8); }
  71.429% { transform: scale(0.867); }
  85.714% { transform: scale(0.933); }
  100% { transform: scale(1); }
}
@keyframes gfx-pop {
  0% { opacity: 0; transform: scale(0.824); }
  11.111% { opacity: 0.247; transform: scale(0.875); }
  22.222% { opacity: 0.498; transform: scale(0.927); }
  33.333% { opacity: 0.749; transform: scale(0.979); }
  44.444% { opacity: 1; transform: scale(1.03); }
  55.556% { opacity: 1; transform: scale(1.013); }
  66.667% { opacity: 1; transform: scale(0.997); }
  77.778% { opacity: 1; transform: scale(0.98); }
  88.889% { opacity: 1; transform: scale(0.99); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes gfx-out {
  0% { opacity: 1; transform: scale(1); }
  16.667% { opacity: 1; transform: scale(1.01); }
  33.333% { opacity: 1; transform: scale(1.02); }
  50% { opacity: 1; transform: scale(1.03); }
  66.667% { opacity: 0.667; transform: scale(0.961); }
  83.333% { opacity: 0.329; transform: scale(0.893); }
  100% { opacity: 0; transform: scale(0.824); }
}
button:not(:disabled):active { animation: gfx-sink 0.1333s step-end forwards; }
button.gfx-push { animation: gfx-push 0.2333s step-end; }
.gfx-pop { animation: gfx-pop 0.3s step-end; transform-origin: 50% 50%; }
.gfx-out { animation: gfx-out 0.2s step-end forwards; transform-origin: 50% 50%; }
@media (prefers-reduced-motion: reduce) { .gfx { display: none; } button, .gfx-pop, .gfx-out { animation: none !important; } }