.auth-tela {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--espaco-md);
  background: linear-gradient(135deg, #0F4C5C 0%, #0A2F3A 60%, #07212A 100%);
  position: relative;
  overflow: hidden;
}

.auth-tela::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 15% 25%, rgba(255,255,255,.06) 0, transparent 35%),
    radial-gradient(circle at 85% 75%, rgba(233,150,58,.10) 0, transparent 40%);
  pointer-events: none;
}

.auth-card {
  position: relative;
  z-index: 1;
  background: var(--cor-superficie);
  border-radius: var(--raio-lg);
  box-shadow: var(--sombra-lg);
  padding: var(--espaco-2xl) var(--espaco-xl);
  width: 100%;
  max-width: 400px;
}

.auth-logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--espaco-sm);
  margin-bottom: var(--espaco-xl);
  text-align: center;
}

.auth-logo svg { width: 48px; height: 48px; color: var(--cor-primaria); }

.auth-logo h1 {
  font-size: var(--t-xl);
  color: var(--cor-primaria);
}

.auth-logo p {
  font-size: var(--t-sm);
  color: var(--cor-texto-terciario);
}

.auth-link {
  display: block;
  text-align: center;
  margin-top: var(--espaco-md);
  font-size: var(--t-sm);
  color: var(--cor-primaria);
}
.auth-link:hover { text-decoration: underline; }

.auth-flash {
  margin-bottom: var(--espaco-md);
  padding: 10px 14px;
  border-radius: var(--raio-md);
  font-size: var(--t-sm);
}

.auth-flash-erro {
  background: var(--cor-perigo-light);
  color: var(--cor-perigo);
}

.auth-flash-sucesso {
  background: var(--cor-sucesso-light);
  color: var(--cor-sucesso);
}

@media (max-width: 480px) {
  .auth-card { padding: var(--espaco-xl) var(--espaco-md); }
}