:root {
  --brand: #0fe960;
  --brand-ink: #17b451;
  --bg: #0b0f14;
  --panel: #111827;
  --border: #1f2a37;
  --text: #e5e7eb;
  --muted: #9aa4b2;
}

/* Reset */
*{ box-sizing:border-box }
html,body{ height:100%; margin:0 }
body{
  font-family:'Montserrat', system-ui, sans-serif;
  background:var(--bg); color:var(--text);
  display:flex; flex-direction:column;
}

/* Wrapper */
main.auth{
  flex:1; display:flex; align-items:center; justify-content:center; padding:20px;
}

/* Card */
.auth-card{
  background:var(--panel); border:1px solid var(--border);
  border-radius:14px; padding:28px 26px; width:100%; max-width:420px;
  box-shadow:0 12px 32px rgba(0,0,0,.45); text-align:center;
  animation:fadeIn .6s ease;
}
@keyframes fadeIn{ from{ opacity:0; transform:translateY(10px)} to{ opacity:1; transform:translateY(0)} }

/* Logo */
.auth-logo{ display:flex; justify-content:center }
.auth-logo img{ height:48px; margin-bottom:16px }

/* Títulos */
.auth-title{ font-size:1.6rem; font-weight:700; margin:0 }
.auth-subtitle{ font-size:.95rem; color:var(--muted); margin:4px 0 20px }

/* Form */
.form{ text-align:left; display:grid; gap:14px }
.form label{ font-size:.9rem; font-weight:600; display:grid; gap:6px }
.form input{
  padding:10px 12px; border-radius:10px; border:1px solid var(--border);
  background:#0e1520; color:var(--text); font-size:.95rem;
}
.form input:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 2px rgba(183,255,57,.15) }

/* Botões */
.actions{ margin-top:12px }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 16px; border-radius:999px; font-weight:700; cursor:pointer; border:none; font-size:.95rem }
.btn-primary{ width:100%; background:var(--brand); color:#0b0f14 }
.btn-primary:hover{ background:var(--brand-ink) }

/* Alerts */
.alert{ padding:10px 12px; border-radius:10px; font-weight:600; margin-bottom:14px }
.alert.ok{ background:#17321f; color:#B7FF39 }
.alert.err{ background:#3b0f13; color:#f87171 }

/* Switch link */
.auth-switch{ margin-top:18px; font-size:.9rem }
.auth-switch a{ color:var(--brand); text-decoration:none; font-weight:700 }
.auth-switch a:hover{ text-decoration:underline }