.overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(10, 10, 15, 0.85); backdrop-filter: blur(8px); z-index: 100; display: flex; flex-direction: column; align-items: center; justify-content: center; animation: fadeIn 0.3s ease-out; } .spinner { width: 80px; height: 80px; margin-bottom: 2rem; } .pokeball { width: 100%; height: 100%; animation: spin 1.2s cubic-bezier(0.5, 0.1, 0.5, 0.9) infinite; filter: drop-shadow(0 0 15px rgba(255, 61, 61, 0.5)); } .text { font-size: 1.2rem; font-weight: 500; letter-spacing: 1px; color: var(--text-primary); animation: pulse 1.5s ease-in-out infinite; } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }