/* Animated mascot anchored to hero, not to viewport. */
.has-pixel-mascot { padding-bottom: 104px; }
.pixel-mascot { position: absolute; z-index: 2; right: max(24px, calc((100% - 1160px) / 2)); bottom: 16px; width: 82px; text-align: center; }
.pixel-entry {
  display: inline-flex; flex-direction: column; align-items: center; gap: 0; flex: 0 0 auto;
  border: 0; border-radius: 0;
  padding: 0; cursor: pointer;
  background: transparent; color: var(--color-primary-dark, #167c7c);
  font: inherit; font-weight: 600; text-align: left; text-decoration: none;
}
.pixel-entry img { width: 70px; height: 70px; object-fit: contain; image-rendering: pixelated; }
/* Der Pause-Schalter ist entfernt: die Animation laeuft ohnehin nur in
   langen Abstaenden und respektiert prefers-reduced-motion. */
.pixel-mascot__pause { display: none; }
.pixel-entry:hover { box-shadow: none; }
.pixel-entry span { text-decoration: underline; text-underline-offset: 4px; }
.pixel-entry:focus-visible { outline: 3px solid #239a9a; outline-offset: 5px; }
.hero__cta { align-items: center; }
.pixel-entry span { max-width: 150px; line-height: 1.4; }
.pixel-world-dialog {
  color: var(--color-text, #172b36); background: var(--color-surface, #fff);
  border: 2px solid #239a9a; border-radius: 24px; padding: 28px;
  width: min(480px, calc(100vw - 32px)); max-height: calc(100dvh - 32px);
  box-shadow: 0 24px 80px #0005; text-align: center;
}
.pixel-world-dialog::backdrop { background: #0b1a2bb8; backdrop-filter: blur(5px); }
.pixel-world-dialog img { width: 144px; height: 144px; margin-inline: auto; object-fit: contain; image-rendering: pixelated; }
.pixel-world-dialog h2 { font-size: 25px; line-height: 1.3; margin: 8px 0 14px; }
.pixel-world-dialog p { line-height: 1.6; }
.pixel-world-dialog__actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.pixel-world-dialog__actions .btn { min-height: 48px; }
.pixel-world-dialog__skip {
  display: inline-block; margin-top: 16px; border: 0; background: transparent;
  color: var(--color-muted, #666666); font: inherit; font-size: 13px;
  text-decoration: underline; text-underline-offset: 3px; cursor: pointer; padding: 4px 8px;
}
.pixel-world-dialog__skip:hover { color: var(--color-primary-dark, #167c7c); }
.pixel-world-dialog__skip:focus-visible { outline: 3px solid #239a9a; outline-offset: 3px; border-radius: 4px; }
/* Device policy is applied by JS; hidden must override component display. */
.pixel-entry[hidden], .pixel-mascot[hidden] { display: none; }
.hero.has-pixel-mascot.is-mascot-hidden { padding-bottom: 60px; }
.page-hero.has-pixel-mascot.is-mascot-hidden { padding-bottom: 40px; }
@media (max-width: 599px) {
  .pixel-entry, .pixel-mascot { display: none; }
  .hero.has-pixel-mascot { padding-bottom: 60px; }
  .page-hero.has-pixel-mascot { padding-bottom: 40px; }
}