*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#1e293b;background:radial-gradient(800px 500px at 50% 20%,#38bdf840,transparent 60%),radial-gradient(700px 400px at 20% 30%,#7dd3fc40,transparent 60%),linear-gradient(180deg,#e0f2fe,#f0f9ff);display:flex;flex-direction:column;height:100dvh;overflow:hidden}
.wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:12px}
.card{width:min(720px,100%);padding:28px 20px;border-radius:14px;background:#fffc;border:1px solid #bae6fdcc;box-shadow:0 10px 40px #0ea5e926;backdrop-filter:blur(6px);text-align:center}
.title{margin:0;font-size:28px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:10px;color:#0f172a}
.wave{display:inline-block;transform-origin:70% 70%;animation:wave 1.8s infinite}
@keyframes wave {
0%{transform:rotate(0deg)}
10%{transform:rotate(14deg)}
20%{transform:rotate(-8deg)}
30%{transform:rotate(14deg)}
40%{transform:rotate(-4deg)}
50%{transform:rotate(10deg)}
60%{transform:rotate(0deg)}
100%{transform:rotate(0deg)}
}
.subtitle{margin:14px auto 0;font-size:16px;line-height:1.6;color:#334155;max-width:520px}
.caret{display:inline-block;width:2px;height:1.2em;background:#0ea5e9;margin-left:6px;animation:blink 1s steps(1,end) infinite}
@keyframes blink {
0%{opacity:1}
50%{opacity:0}
100%{opacity:1}
}
.footer{height:50px;display:flex;align-items:center;justify-content:center;font-size:12px;color:#475569}