*{box-sizing:border-box}
html,body{height:100%;margin:0;padding:0}
body{
  font:16px/1.6 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  background:#FAFBFC;
  color:#1E293B;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.container{
  text-align:center;
  padding:48px 32px;
  max-width:400px;
  background:#fff;
  border-radius:16px;
  box-shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 12px rgba(0,0,0,0.06);
}
.logo{
  width:56px;
  height:56px;
  margin:0 auto 24px;
  background:#F5D565;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#1a1a1a;
  font-weight:700;
  font-size:22px;
  font-style:italic;
}
h1{
  font-size:22px;
  font-weight:600;
  margin:0 0 8px;
  color:#0F172A;
  letter-spacing:-0.02em;
}
p{
  color:#64748B;
  margin:0 0 32px;
  font-size:15px;
}
.status{
  margin:24px 0;
  font-weight:500;
  font-size:14px;
  color:#475569;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.spinner{
  width:18px;
  height:18px;
  border:2px solid #E2E8F0;
  border-top-color:#D4B84A;
  border-radius:50%;
  animation:spin 0.8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#F5D565;
  border:none;
  color:#1a1a1a;
  cursor:pointer;
  font:inherit;
  font-size:16px;
  font-weight:500;
  padding:14px 32px;
  border-radius:999px;
  transition:background 0.15s ease,transform 0.1s ease;
}
.btn:hover{background:#EBC94F}
.btn:active{transform:scale(0.98)}