* { padding: 0; margin: 0; } body { height: 100vh; width: 100vw; } .loading-overlay { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.9); color: #333; font-size: 16px; gap: 12px; z-index: 9999; transition: opacity 0.2s ease; } .loading-overlay.hidden { opacity: 0; pointer-events: none; } .loading-spinner { width: 48px; height: 48px; border: 4px solid rgba(0, 0, 0, 0.2); border-top-color: #000; border-radius: 50%; animation: spin 0.9s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }