/* Preview sign-in screen. Colors from https://corelexes.app tokens; Core Lexes typography. */
*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body.clxp-login {
  font-family: "Times New Roman", Times, serif;
  font-size: 12pt;
  color: #e9edf7;
  background:
    radial-gradient(900px 520px at 50% -10%, rgba(211, 165, 74, 0.18), transparent 60%),
    radial-gradient(700px 500px at 100% 100%, rgba(22, 41, 90, 0.6), transparent 60%),
    #030817;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}
.clxp-login-card {
  width: 100%;
  max-width: 380px;
  padding: 1.75rem 1.75rem 1.5rem;
  border: 1px solid rgba(211, 165, 74, 0.26);
  border-radius: 14px;
  background: linear-gradient(160deg, rgba(22, 41, 90, 0.55), rgba(8, 17, 41, 0.85));
  box-shadow: 0 0 0 1px rgba(229, 189, 98, 0.18), 0 10px 30px -12px rgba(211, 165, 74, 0.35);
  text-align: center;
}
.clxp-login-logo { display: block; width: 200px; height: auto; margin: 0 auto 0.5rem; }
.clxp-login-card h1 {
  margin: 0 0 0.25rem;
  font-size: 12pt;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #f4d784;
}
.clxp-login-sub { margin: 0 0 1rem; color: #94a0bd; }
.clxp-login-err {
  margin: 0 0 0.75rem;
  padding: 0.4rem 0.6rem;
  border: 1px solid rgba(248, 113, 113, 0.45);
  border-radius: 8px;
  background: rgba(248, 113, 113, 0.14);
  color: #fca5a5;
}
.clxp-login-card form { display: flex; flex-direction: column; gap: 0.5rem; text-align: left; }
.clxp-login-card label { color: #c4cde2; }
.clxp-login-card input[type="password"] {
  font: inherit;
  padding: 0.5rem 0.65rem;
  border: 1px solid rgba(140, 170, 255, 0.22);
  border-radius: 8px;
  background: rgba(3, 8, 23, 0.7);
  color: #e9edf7;
}
.clxp-login-card input[type="password"]:focus {
  outline: none;
  border-color: rgba(229, 189, 98, 0.55);
  box-shadow: 0 0 0 3px rgba(229, 189, 98, 0.18);
}
.clxp-login-card button {
  font: inherit;
  font-weight: 700;
  margin-top: 0.35rem;
  padding: 0.5rem;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(180deg, #fbe7a1 0%, #e0b65a 48%, #b4842f 100%);
  color: #081129;
  cursor: pointer;
  box-shadow: 0 8px 22px -10px rgba(211, 165, 74, 0.7);
}
.clxp-login-card button:hover { filter: brightness(1.06); }
.clxp-login-card button:focus-visible { outline: 2px solid #f4d784; outline-offset: 2px; }
.clxp-login-foot { margin-top: 1.25rem; color: #94a0bd; text-align: center; }