/* ================================================================================================
   PLATAFORMA EN VIVO (ROADMAP #24 · X-02) — PANTALLA DE ACCESO
   Sólo tokens del shell premium (styles/tokens.css): ningún color, fuente ni medida de marca propia.
   ================================================================================================ */
.pl-login {
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: var(--ps-space-6) var(--ps-space-4);
  background: var(--ps-bg-canvas);
  color: var(--ps-fg);
}
.pl-login:focus { outline: none; }
.pl-login-card {
  display: flex;
  flex-direction: column;
  gap: var(--ps-space-4);
  width: 100%;
  max-width: 400px;
  padding: var(--ps-space-7) var(--ps-space-6);
  border: 1px solid var(--ps-line);
  border-radius: var(--ps-radius-lg);
  background: var(--ps-bg-surface);
  box-shadow: var(--ps-shadow-sm);
}
.pl-login-brand {
  display: flex;
  align-items: center;
  gap: var(--ps-space-2);
  color: var(--ps-fg);
  font-weight: var(--ps-weight-semibold);
  letter-spacing: var(--ps-tracking-mark);
}
.pl-login-mark { background: var(--ps-primary-bg); color: var(--ps-primary-fg); }
.pl-login-product { font-size: var(--ps-text-md); }
.pl-login-env {
  margin-left: auto;
  padding: 2px var(--ps-space-2);
  border: 1px solid var(--ps-line);
  border-radius: var(--ps-radius-pill);
  color: var(--ps-fg-muted);
  font-size: var(--ps-text-xs);
  font-weight: var(--ps-weight-medium);
  letter-spacing: 0;
}
.pl-login-title { font-size: var(--ps-text-xl); font-weight: var(--ps-weight-semibold); letter-spacing: var(--ps-tracking-tight); }
.pl-login-title:focus { outline: none; }
.pl-login-notice:empty { display: none; }
.pl-login-notice {
  padding: var(--ps-space-2) var(--ps-space-3);
  border: 1px solid var(--ps-info-line);
  border-radius: var(--ps-radius-md);
  background: var(--ps-bg-subtle);
  color: var(--ps-fg-2);
  font-size: var(--ps-text-sm);
}
.pl-login-form { display: flex; flex-direction: column; gap: var(--ps-space-4); }
.pl-login-error {
  padding: var(--ps-space-2) var(--ps-space-3);
  border: 1px solid var(--ps-danger-line);
  border-radius: var(--ps-radius-md);
  background: var(--ps-danger-bg);
  color: var(--ps-danger-fg);
  font-size: var(--ps-text-sm);
}
.pl-login-error[hidden] { display: none; }
.pl-login-submit { width: 100%; justify-content: center; }
.pl-login-help { text-align: center; }
@media (max-width: 639px) {
  .pl-login { align-items: start; padding-top: var(--ps-space-10); }
  .pl-login-card { padding: var(--ps-space-6) var(--ps-space-4); }
}