body{
  margin: 0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  min-height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background: radial-gradient(1200px 600px at 10% 10%, rgba(124,58,237,0.35), transparent 55%),
              radial-gradient(1000px 600px at 90% 20%, rgba(34,197,94,0.25), transparent 55%),
              #0b1020;
  color: rgba(255,255,255,0.92);
}

.card{
  width: min(560px, calc(100% - 28px));
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.06);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 18px 60px rgba(0,0,0,0.55);
}

h1{ margin: 0 0 6px; font-size: 26px; }
p{ margin: 0 0 16px; color: rgba(255,255,255,0.65); }

.row{ display:flex; gap: 10px; }
input{
  flex:1;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(0,0,0,0.35);
  color: rgba(255,255,255,0.92);
  outline: none;
}
button{
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(124,58,237,0.35);
  background: rgba(124,58,237,0.18);
  color: rgba(255,255,255,0.92);
  font-weight: 700;
  cursor: pointer;
}
button:hover{ background: rgba(124,58,237,0.24); border-color: rgba(124,58,237,0.55); }
.small{ margin-top: 12px; font-size: 12px; color: rgba(255,255,255,0.6); }
code{
  background: rgba(0,0,0,0.35);
  padding: 2px 6px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.10);
}
