*{box-sizing:border-box}

body{
  margin:0;
  color:#fff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial;

  /* Base background */
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(212,175,55,0.10), transparent 60%),
    radial-gradient(900px 500px at 15% 20%, rgba(212,175,55,0.06), transparent 55%),
    radial-gradient(900px 500px at 85% 70%, rgba(212,175,55,0.05), transparent 55%),
    linear-gradient(180deg, #000, #050505 40%, #000);

  padding:60px 20px;
  position:relative;
  overflow-x:hidden;
}

/* Faint texture overlay */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:0.14;
  /* lightweight grain using gradients (no image needed) */
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,0.03) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(255,255,255,0.02) 0 1px, transparent 1px 4px);
  mix-blend-mode:overlay;
}

.container{
  max-width:720px;
  margin:0 auto;
}

.title{
  text-align:center;
  font-size:28px;
  letter-spacing:4px;
  font-weight:800;
  margin-bottom:40px;
  color:#d4af37;
}

.card{
  background:#111;
  border:1px solid #1f1f1f;
  padding:40px;
  border-radius:28px;
  box-shadow:0 0 80px rgba(212,175,55,0.05);
}

.link{
  display:block;
  width:100%;
  max-width:520px;
  margin:18px auto;
  padding:18px 20px;
  border-radius:22px;
  text-decoration:none;
  font-weight:800;
  letter-spacing:1px;
  text-align:center;
  background:linear-gradient(135deg,#d4af37,#a67c00);
  color:#000;
  transition:.25s ease;
  box-shadow:0 10px 35px rgba(212,175,55,0.18);
}

.link:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 40px rgba(212,175,55,0.35);
}

label{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:1px;
  opacity:.6;
}

input{
  width:100%;
  padding:15px 18px;
  margin-top:6px;
  margin-bottom:20px;
  border-radius:14px;
  border:1px solid #2a2a2a;
  background:#000;
  color:#fff;
  font-size:14px;
}

input:focus{
  outline:none;
  border-color:#d4af37;
  box-shadow:0 0 0 2px rgba(212,175,55,0.12);
}

button{
  width:100%;
  padding:16px;
  border:none;
  border-radius:20px;
  font-weight:800;
  letter-spacing:1px;
  font-size:14px;
  cursor:pointer;
  background:linear-gradient(135deg,#d4af37,#a67c00);
  color:#000;
  transition:.25s ease;
}

button:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 35px rgba(212,175,55,0.35);
}
/* subtle floating particles */
body::after{
  content:"";
  position:fixed;
  inset:-40%;
  pointer-events:none;
  z-index:-1;
  opacity:0.18;
  background:
    radial-gradient(circle at 10% 20%, rgba(212,175,55,0.20) 0 2px, transparent 3px),
    radial-gradient(circle at 30% 70%, rgba(212,175,55,0.18) 0 2px, transparent 3px),
    radial-gradient(circle at 55% 30%, rgba(212,175,55,0.16) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 60%, rgba(212,175,55,0.14) 0 2px, transparent 3px),
    radial-gradient(circle at 90% 10%, rgba(212,175,55,0.12) 0 2px, transparent 3px);
  filter: blur(0.2px);
  animation: drift 28s linear infinite;
}

@keyframes drift{
  0%   { transform: translate3d(0,0,0); }
  100% { transform: translate3d(-8%, 10%, 0); }
}