:root{
  --bg:#050816;
  --text: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.65);
  --stroke: rgba(255,255,255,.16);
  --glassA: rgba(255,255,255,.14);
  --glassB: rgba(255,255,255,.06);
  --purple: rgba(123,92,255,.85);
}

body{
  background: var(--bg);
  color: var(--text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial;
}

/* text helpers */
.small-muted{ color: var(--muted); }

/* glass card (principal) */
.glass-card{
  background: linear-gradient(180deg, var(--glassA), var(--glassB));
  border: 1px solid var(--stroke);
  border-radius: 26px;
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
  box-shadow:
    0 28px 85px rgba(0,0,0,.72),
    0 0 30px rgba(123,92,255,.12);
}

/* glass card inside glass card */
.glass-card .glass-card{
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.045));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow:
    0 18px 55px rgba(0,0,0,.55);
}

/* divider */
.hr-soft{
  border:0;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
}

/* labels */
.form-label{ font-weight: 600; }

/* inputs */
.glass-input{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: var(--text) !important;
  border-radius: 16px !important;
}
.glass-input::placeholder{ color: rgba(255,255,255,.52); }
.glass-input:focus{
  box-shadow:
    0 0 0 1px rgba(123,92,255,.55),
    0 0 18px rgba(123,92,255,.28) !important;
}

/* selects */
.glass-select{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: var(--text) !important;
  border-radius: 16px !important;
}
.glass-select:focus{
  box-shadow:
    0 0 0 1px rgba(123,92,255,.55),
    0 0 18px rgba(123,92,255,.28) !important;
}
select option{
  background:#0b1020 !important;
  color:#fff !important;
}

/* buttons */
.btn-glass{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
  color: #fff;
  box-shadow: 0 16px 40px rgba(0,0,0,.50);
  transition: .18s ease;
}
.btn-glass:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.11);
  box-shadow: 0 18px 46px rgba(0,0,0,.62);
}

/* badge */
.badge-soft{
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  color: var(--muted);
  padding: .35rem .7rem;
  border-radius: 999px;
  font-size: .85rem;
}

/* checkbox */
.form-check-input{
  background-color: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
}
.form-check-input:checked{
  background-color: rgb(123,92,255);
  border-color: rgb(123,92,255);
}

/* mobile */
@media (max-width:576px){
  .glass-card{ border-radius: 20px; }
  .btn-glass{ width: 100%; }
}
