/* Shared by the initial HTML and React; no font, animation library or script required. */
.seepets-startup {
  position: fixed; inset: 0; z-index: 9999; box-sizing: border-box;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 100vh; min-height: 100dvh; overflow-x: hidden; overflow-y: auto;
  padding: max(28px, env(safe-area-inset-top)) 24px max(24px, env(safe-area-inset-bottom));
  background: radial-gradient(ellipse at 90% 8%, #ffecd9 0, transparent 48%),
    radial-gradient(ellipse at 0 95%, #fff0df 0, transparent 42%), #fffcf8;
  color: #292524; font-family: 'Outfit', system-ui, sans-serif; text-align: center;
}
.seepets-startup-brand { width: 100%; max-width: 360px; margin: auto 0; padding: 30px 0; }
.seepets-startup-logo { display: block; width: min(78vw, 280px); height: auto; max-height: 180px; object-fit: contain; margin: 0 auto 24px; }
.seepets-startup-tagline { margin: 0; font-size: clamp(20px, 5.5vw, 25px); line-height: 1.35; font-weight: 700; letter-spacing: -.4px; }
.seepets-startup-progress { width: 64px; height: 4px; margin: 28px auto 12px; overflow: hidden; border-radius: 8px; background: #ffdfc3; }
.seepets-startup-progress span { display: block; width: 28px; height: 100%; border-radius: inherit; background: #f65a00; animation: seepets-startup-loading 1.2s ease-in-out infinite alternate; }
.seepets-startup-message { margin: 0; color: #78716c; font: 400 12px/1.5 system-ui, sans-serif; }
.seepets-startup-button { margin: 16px auto 0; border: 1px solid #fed7aa; border-radius: 999px; padding: 10px 22px; color: #b74300; background: #fff8f0; cursor: pointer; font: 600 12px/1.3 system-ui, sans-serif; }
.seepets-startup-button:focus-visible { outline: 3px solid #f97316; outline-offset: 3px; }
.seepets-startup-button[hidden] { display: none; }
.seepets-startup-footer { flex-shrink: 0; margin: 12px 0 0; color: #a16236; font: 500 12px/1.5 system-ui, sans-serif; letter-spacing: .3px; }
@keyframes seepets-startup-loading { from { transform: translateX(0); } to { transform: translateX(36px); } }
@media (prefers-reduced-motion: reduce) { .seepets-startup-progress span { animation: none; width: 100%; } }
@media (max-height: 440px) { .seepets-startup-brand { padding: 8px 0; } .seepets-startup-logo { width: 160px; max-height: 80px; margin-bottom: 10px; } .seepets-startup-progress { margin-top: 14px; } }
/* Decorative movement uses only opacity/transform; it never controls startup duration. */
.seepets-startup::before, .seepets-startup::after {
  content: ''; position: absolute; pointer-events: none; width: 180px; height: 180px;
  opacity: .065; background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='%23f97316'%3E%3Cellipse cx='20' cy='38' rx='11' ry='15' transform='rotate(-25 20 38)'/%3E%3Cellipse cx='40' cy='21' rx='10' ry='14'/%3E%3Cellipse cx='65' cy='23' rx='10' ry='14' transform='rotate(15 65 23)'/%3E%3Cellipse cx='83' cy='43' rx='10' ry='14' transform='rotate(30 83 43)'/%3E%3Cpath d='M25 75C22 61 35 57 41 45C46 36 55 36 61 47C68 58 81 64 76 77C72 88 61 79 51 79C40 79 29 88 25 75Z'/%3E%3C/svg%3E");
}
.seepets-startup::before { left: -48px; bottom: 17%; transform: rotate(-20deg); animation: seepets-startup-paw-left 7s ease-in-out infinite alternate; }
.seepets-startup::after { right: -45px; top: 10%; width: 140px; height: 140px; transform: rotate(20deg); animation: seepets-startup-paw-right 9s ease-in-out infinite alternate; }
.seepets-startup-brand, .seepets-startup-footer { position: relative; z-index: 1; }
.seepets-startup-logo { animation: seepets-startup-logo-float 3.6s ease-in-out infinite; }
@keyframes seepets-startup-logo-float { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-5px) scale(1.015); } }
@keyframes seepets-startup-paw-left { from { transform: translateY(0) rotate(-20deg); } to { transform: translateY(-28px) rotate(-10deg); } }
@keyframes seepets-startup-paw-right { from { transform: translateY(0) rotate(20deg); } to { transform: translateY(25px) rotate(8deg); } }
@media (prefers-reduced-motion: reduce) {
  .seepets-startup-logo, .seepets-startup::before, .seepets-startup::after { animation: none; }
}
