/* Shared wordmark for the site and the standalone games. */
.mm-logo {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #f6f7ff;
  font: 850 22px/1 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: -1px;
  text-decoration: none;
  white-space: nowrap;
}
.mm-logo:focus-visible { outline: 3px solid #61e6c6; outline-offset: 4px; border-radius: 8px; }
.mm-logo-mark {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: linear-gradient(135deg, #a58cff, #61e6c6);
  color: #0b1020;
  font-size: 25px;
  line-height: 1;
  transform: rotate(-7deg);
  box-shadow: 0 4px 18px #a58cff33;
}
.mm-logo-word b { color: #61e6c6; }
.mm-logo-word small { color: #a5afc6; font-size: .58em; font-weight: 750; letter-spacing: 0; }
.game-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  padding: 7px 16px;
  background: #090d19ed;
  border-bottom: 1px solid #283044;
  backdrop-filter: blur(16px);
}
.game-header .mm-logo { font-size: 19px; }
.game-header .mm-logo-mark { width: 30px; height: 30px; flex-basis: 30px; font-size: 22px; border-radius: 9px; }
@media (max-width: 600px) {
  .game-header { padding: 4px 12px; }
  .mm-logo { font-size: 19px; gap: 7px; }
  .mm-logo-mark { width: 30px; height: 30px; flex-basis: 30px; font-size: 22px; border-radius: 9px; }
}
@media (max-width: 430px) {
  .site-header .nav { gap: 8px; }
  .site-header .mobile-nav { gap: 9px; }
}

/* Shared footer details across the catalog and standalone games. */
.game-footer {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px;
  border-top: 1px solid #283044; margin-top: 24px; padding: 18px 12px;
  color: #8f9bb4; font: 12px/1.5 Inter, ui-sans-serif, system-ui, sans-serif;
  text-align: center;
}
.game-footer a, .footer-bottom a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.game-footer a:hover, .footer-bottom a:hover { color: #61e6c6; }
.game-footer a:focus-visible, .footer-bottom a:focus-visible { outline: 3px solid #61e6c6; outline-offset: 3px; }