{
  "html": "<footer class='footer'><div class='footer__inner'><p class='footer__copy'>© 2026 Алексей Смирнов</p><nav class='footer__nav'><a href='/policy' class='footer__link footer__link--ripple footer__link--delay'>Политика</a><a href='/rules' class='footer__link footer__link--ripple footer__link--reverse'>Правила</a></nav></div></footer>",
  "css": ".footer .footer__link { position: relative; overflow: hidden; padding: 4px 8px; border-radius: 6px; isolation: isolate; }\n\n.footer .footer__link::after {\n  content: '';\n  position: absolute;\n  left: 8px;\n  right: 8px;\n  bottom: 0;\n  height: 2px;\n  background: linear-gradient(90deg, transparent, #2563eb, #60a5fa, #3b82f6, #2563eb, transparent);\n  background-size: 200% 100%;\n  transform: scaleX(0);\n  transform-origin: left center;\n  transition: transform 0.3s ease;\n  border-radius: 2px;\n}\n\n.footer .footer__link:hover::after,\n.footer .footer__link:focus-visible::after {\n  transform: scaleX(1);\n  animation: footer-wave 2.4s linear infinite;\n}\n\n.footer .footer__link--delay::after {\n  animation-delay: 0.2s;\n}\n\n.footer .footer__link--reverse::after {\n  transform-origin: right center;\n  animation-direction: reverse;\n}\n\n@keyframes footer-wave {\n  0% { background-position: 0% 50%; }\n  100% { background-position: 200% 50%; }\n}\n\n.footer .footer__link--ripple::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  margin: auto;\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n  background: radial-gradient(circle, rgba(37, 99, 235, 0.35) 0%, rgba(96, 165, 250, 0.15) 60%, transparent 70%);\n  transform: scale(0);\n  opacity: 0;\n  z-index: -1;\n  pointer-events: none;\n}\n\n.footer .footer__link--ripple:hover::before,\n.footer .footer__link--ripple:focus-visible::before {\n  animation: footer-ripple 1.4s ease-out infinite;\n}\n\n@keyframes footer-ripple {\n  0% { transform: scale(0); opacity: 0.9; }\n  60% { opacity: 0.5; }\n  100% { transform: scale(14); opacity: 0; }\n}\n\n.footer .footer__copy {\n  position: relative;\n  padding-bottom: 6px;\n}\n\n.footer .footer__copy::after {\n  content: '';\n  position: absolute;\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  height: 2px;\n  background: linear-gradient(90deg, transparent, #2563eb, #60a5fa, #3b82f6, #2563eb, transparent);\n  background-size: 200% 100%;\n  border-radius: 2px;\n  animation: footer-wave 3s linear infinite;\n}\n\n.footer .footer__link {\n  transition: color 0.2s ease, transform 0.15s ease, box-shadow 0.15s ease;\n}\n\n.footer .footer__link:hover {\n  transform: translateY(-1px) translateZ(0);\n  box-shadow: 0 4px 0 -1px rgba(37, 99, 235, 0.35), 0 6px 12px -4px rgba(37, 99, 235, 0.25);\n}\n\n.footer .footer__link:active {\n  transform: translateY(1px) translateZ(0);\n  box-shadow: 0 1px 0 -1px rgba(37, 99, 235, 0.35), 0 2px 6px -2px rgba(37, 99, 235, 0.2);\n}"
}