/* Pulsetext splash overlay. * * Paints during HTML parse (linked from in index.html, before * any JS evaluates) so the user sees the brand instantly rather than * a blank page during the React mount window. The inline boot script * at the end of dispatches `pulse:react-ready` after first * render — that flips `body.pulse-ready` and the overlay fades. * * Inside Zoho the existing embed bootstrap already renders its own * spinner; index.html short-circuits the splash by adding the * `pulse-zoho` body class at parse time so this overlay never paints. */ #pulse-splash { position: fixed; inset: 0; z-index: 2147483646; /* sit above every framework overlay */ display: flex; align-items: center; justify-content: center; background: radial-gradient(120% 100% at 50% 0%, rgba(79, 70, 229, 0.18) 0%, transparent 60%), linear-gradient(160deg, #1b1431 0%, #0c0a09 55%, #050505 100%); color: #ffffff; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; opacity: 1; pointer-events: auto; transition: opacity 220ms ease; } #pulse-splash .pulse-splash-inner { display: flex; flex-direction: column; align-items: center; gap: 22px; padding: 24px; text-align: center; } #pulse-splash .pulse-splash-icon { width: clamp(96px, 28vw, 144px); height: clamp(96px, 28vw, 144px); border-radius: 28%; background: linear-gradient(135deg, #4f46e5 0%, #8b5cf6 50%, #ec4899 100%); display: grid; place-items: center; box-shadow: 0 24px 60px -16px rgba(79, 70, 229, 0.55), 0 8px 24px -8px rgba(236, 72, 153, 0.35); animation: pulse-splash-pop 720ms cubic-bezier(0.2, 0.85, 0.3, 1.1) both; } #pulse-splash .pulse-splash-icon svg { width: 58%; height: 58%; color: #ffffff; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.18)); } #pulse-splash .pulse-splash-title { font-size: clamp(20px, 5.2vw, 28px); font-weight: 600; letter-spacing: -0.01em; background: linear-gradient(90deg, #ffffff 0%, #cbd5f5 100%); -webkit-background-clip: text; background-clip: text; color: transparent; } #pulse-splash .pulse-splash-sub { font-size: 13px; color: rgba(255, 255, 255, 0.55); letter-spacing: 0.02em; } #pulse-splash .pulse-splash-spinner { width: 38px; height: 38px; border-radius: 999px; border: 3px solid rgba(255, 255, 255, 0.12); border-top-color: #ffffff; animation: pulse-splash-spin 900ms linear infinite; margin-top: 8px; } @keyframes pulse-splash-spin { to { transform: rotate(360deg); } } @keyframes pulse-splash-pop { from { transform: scale(0.86); opacity: 0; } to { transform: scale(1); opacity: 1; } } body.pulse-ready #pulse-splash { opacity: 0; pointer-events: none; } body.pulse-faded #pulse-splash { display: none; } /* Zoho-context: hide the splash before paint. The inline boot script * in stamps `` when running inside * *.zappsusercontent.com or any cross-origin iframe. */ html[data-pulse-zoho] #pulse-splash { display: none !important; } @media (prefers-reduced-motion: reduce) { #pulse-splash .pulse-splash-icon { animation: none; } #pulse-splash .pulse-splash-spinner { animation-duration: 2200ms; } #pulse-splash { transition: opacity 60ms linear; } }