@font-face {
  font-family: "TAY Birdie";
  src: url("/assets/tay-birdie.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
:root { color-scheme: light; background: #fffcf3; color: #91c532; }
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; min-height: 100%; }
main { position: relative; min-height: 100svh; height: 100dvh; overflow: hidden; isolation: isolate; background: #fffcf3; }
.paper { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; pointer-events: none; user-select: none; }
.scene { position: absolute; left: 50%; top: 50%; width: 300px; height: 300px; transform: translate(-50%, -50%) scale(var(--scene-scale, 1)); }
.flag, .flag img { position: absolute; inset: 0; }
.flag img { display: block; }
.flag img[hidden] { display: none; }
h1 { position: absolute; top: 262px; left: 95px; margin: 0; font: 400 12px/normal "TAY Birdie", sans-serif; white-space: nowrap; }
.waiting h1 { opacity: 0; }
.enter h1 { animation: text-enter 1100ms cubic-bezier(.22, 1, .36, 1) both; }
@keyframes text-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .enter h1 { animation: none; } }