/* ============================================================
   ARGOS MONALDI WORK STATION — LOGIN
   Feedback explícito del dueño: nada de partículas animadas,
   brillos pulsantes ni barridos de luz. Fondo de pizarra real,
   quieto. La placa/tarjeta central es la protagonista: sobria,
   con autoridad, como una plaqueta de latón atornillada sobre
   pizarra. Sin estética "gamer".
   ============================================================ */

.login-body{
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  padding: 32px;
  background-color: var(--ink);
  background-image:
    linear-gradient(rgba(6,7,10,.74), rgba(6,7,10,.74)),
    url("../img/pizarra.png");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}
@supports (-webkit-touch-callout: none){ .login-body{ background-attachment: scroll; } }

.login-stage{
  width: 100%; max-width: 420px;
  display: flex; flex-direction: column; align-items: center;
}

.login-logo{
  width: 260px; max-width: 78%; height: auto;
  margin-bottom: 30px;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.6));
}

/* La placa: tarjeta con borde de latón sólido, esquinas remachadas.
   Sin animación de ningún tipo — es un objeto físico quieto. */
.login-plaque{
  width: 100%;
  position: relative;
  background: linear-gradient(180deg, #1c1712, #120e0a 70%);
  border: 1px solid rgba(196,148,88,.4);
  border-radius: var(--radius-md);
  box-shadow:
    0 24px 60px rgba(0,0,0,.6),
    0 0 0 1px rgba(0,0,0,.4),
    inset 0 1px 0 rgba(255,255,255,.04);
  padding: 40px 36px 34px;
}

/* Filete de latón superior — referencia directa a bronze-title-line.png */
.login-plaque::before{
  content: "";
  position: absolute; top: 0; left: 10%; right: 10%; height: 2px;
  background: linear-gradient(90deg, transparent, var(--brass-light), transparent);
  opacity: .8;
}

/* Remaches — esquinas, quietos, sin brillo pulsante */
.rivet{
  position: absolute; width: 7px; height: 7px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, var(--brass-light), var(--brass-dark) 70%, #4a2f16);
  box-shadow: 0 1px 2px rgba(0,0,0,.6);
}
.rivet.tl{ top: 14px; left: 14px; }
.rivet.tr{ top: 14px; right: 14px; }
.rivet.bl{ bottom: 14px; left: 14px; }
.rivet.br{ bottom: 14px; right: 14px; }

.login-plaque h1{
  font-size: 12px; text-align: center;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--brass-light);
  margin-bottom: 4px;
}
.login-plaque .login-tagline{
  text-align: center; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--cream-faint); margin-bottom: 28px;
}

.login-plaque .field{ margin-bottom: 18px; }
.login-plaque .field label{ font-size: 10px; }

.login-submit{ margin-top: 8px; }

.login-error{
  margin-top: 16px;
  padding: 11px 14px;
  border: 1px solid rgba(180,93,82,.4);
  background: rgba(180,93,82,.12);
  color: #dba49c;
  border-radius: var(--radius-sm);
  font-size: 12px;
  text-align: center;
}

.login-foot{
  margin-top: 26px;
  text-align: center;
  font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--cream-faint);
  opacity: .7;
}
