html,body{margin:0;height:100%;background:#f8fbff;font-family:Inter,Arial,sans-serif}
#app-splash{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;background:linear-gradient(180deg,#ffffff,#f6f9ff);overflow:hidden;z-index:999999;transition:opacity .45s}
.bg-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(37,99,235,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.04) 1px,transparent 1px);background-size:40px 40px}
.glow{position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,#2563EB33,transparent 70%);animation:float 5s ease-in-out infinite}
.card{position:relative;width:320px;padding:34px 28px;border-radius:24px;background:rgba(255,255,255,.72);backdrop-filter:blur(16px);box-shadow:0 15px 50px rgba(37,99,235,.12);display:flex;flex-direction:column;align-items:center}
.ring{position:absolute;width:128px;height:128px;border:3px solid rgba(37,99,235,.08);border-top-color:#2563EB;border-radius:50%;animation:spin 3s linear infinite}
.logo{width:82px;height:82px;z-index:2;animation:pulse 1.8s infinite}
h1{margin:22px 0 8px;color:#2563EB;font-size:30px}
p{margin:0;color:#666}
.loader{margin-top:28px;width:220px;height:5px;background:#e5e7eb;border-radius:50px;overflow:hidden}
.loader span{display:block;height:100%;width:35%;background:linear-gradient(90deg,#2563EB,#FE612A);animation:load 1.3s infinite}
.status{margin-top:16px;color:#666;font-size:13px}
@keyframes load{0%{transform:translateX(-100%)}100%{transform:translateX(360%)}}
@keyframes pulse{0%,100%{transform:scale(.96)}50%{transform:scale(1.05)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes float{50%{transform:translateY(-12px)}}