/* Shearwater Swoop only; the shared page chrome is in ../common.css */
.sw-game { background: linear-gradient(#2d1460 0%, #55288f 22%, #a54bb4 40%, #ec7fc4 50%, #ffad8f 56%, #ffd27c 60%, #5b48b2 60%, #5b48b2 100%); cursor: pointer; }
.sw-game .ff-scene canvas { position: absolute; inset: 0; width: 100%; height: 100%; }

/* No score box: the numbers are written on the clouds (scene.js), so the HUD is just Best and the buttons. */
.sw-game .ff-hud { grid-template-columns: 1fr 1fr; }
.sw-game .ff-points { white-space: nowrap; }

/* "Tap to flap" while the bird waits for the first flap */
.sw-hint { position: absolute; z-index: 2; left: 50%; bottom: 14%; translate: -50% 0; width: max-content; max-width: calc(100% - 32px); margin: 0; padding: .4em 1.1em .5em; border: 3px solid #2b1747; border-radius: 999px; background: white; color: #2b1747; font-size: clamp(16px, 3.4cqmin, 26px); font-weight: 1000; text-align: center; box-shadow: 0 4px 0 #2b1747; pointer-events: none; animation: sw-bob 1.2s ease-in-out infinite; }
.sw-hint[hidden] { display: none; }
@keyframes sw-bob { 50% { translate: -50% -6px; } }

/* End screen score */
.sw-final { display: grid; justify-items: center; }
.sw-final-manx { color: var(--purple); font-size: 44px; font-weight: 1000; line-height: 1.1; }
.sw-final-manx:empty { display: none; }
.sw-final-digits { font-size: 22px; font-weight: 1000; }
.sw-final-manx:empty + .sw-final-digits { font-size: 44px; color: var(--purple); }
.sw-best b { color: var(--purple); }

@media (prefers-reduced-motion: reduce) {
  .sw-hint { animation: none; }
}