.eye-frames { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.eye-frame, .mouth-image { position: absolute; max-width: none; pointer-events: none; }
.eye-link .eye-mobile { display: none; width: 100%; height: 100%; }
#track-link { color: inherit; text-decoration: none; }
#track-link[href]:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }
.mouth-trigger { position: absolute; left: 49.5%; top: 41.6%; width: 15%; height: 5.4%; transform: translate(-50%, -50%); z-index: 2; background: none; border: 0; padding: 0; cursor: pointer; }
.mouth-trigger::after { content: ''; position: absolute; inset: 50% auto auto 50%; width: max(100%, 44px); height: max(100%, 44px); transform: translate(-50%, -50%); }
.mouth-trigger:focus-visible { outline: 1px solid #ddd; outline-offset: 4px; border-radius: 50%; }
.mouth-trigger { appearance: none; -webkit-appearance: none; touch-action: manipulation; -webkit-tap-highlight-color: transparent; overflow: visible; }
.mouth-cutout { position: absolute; inset: 0; overflow: hidden; opacity: 0; pointer-events: none; }
.glitch-eyes { position: absolute; inset: 0; overflow: hidden; z-index: 4; pointer-events: none; }
.glitch-eye { position: absolute; overflow: hidden; transform: translate(-50%, -50%) rotate(var(--tilt)); }
main.mouth-active .mouth-cutout { opacity: 1; transform: scale(1.8); animation: mouth-twitch .31s steps(2, end) infinite; }
main.mouth-active { animation: mouth-background .37s steps(2, end) infinite; }
main.mouth-active .glitch-eyes { filter: contrast(1.4); }
@keyframes mouth-twitch { 0%, 100% { transform: scale(1.8) translateX(-1%); } 50% { transform: scale(2.1, 1.6) translateX(2%); } }
@keyframes mouth-background { 0%, 100% { background-position: center; } 50% { background-position: calc(50% + 3px) center; } }
@media (max-width: 768px), (hover: none), (pointer: coarse) {
  .mouth-trigger::after { width: max(100%, 64px); height: max(100%, 64px); }
  .eye-frames { display: none; }
  .eye-link .eye-mobile { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  main.mouth-active, main.mouth-active .mouth-cutout { animation: none; }
}
