:root {
  --auth-sky: #2b9bcf;
  --auth-sky-dark: #087eac;
  --auth-yellow: #efb500;
  --auth-ink: #232323;
}

.auth-page {
  min-height: 100vh;
  margin: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  box-sizing: border-box;
  color: var(--auth-ink);
  background:
    linear-gradient(135deg, rgba(43,155,207,.14), transparent 45%),
    #f7fcff;
  font-family: "Readex Pro", Tahoma, Arial, sans-serif;
}

.auth-card {
  width: min(100%, 460px);
  padding: 36px;
  box-sizing: border-box;
  text-align: center;
  background: #fff;
  border: 1px solid #cce9f5;
  border-top: 6px solid var(--auth-sky);
  border-radius: 24px;
  box-shadow: 0 22px 70px rgba(18, 82, 110, .14);
}

.auth-card img { width: 118px; height: auto; object-fit: contain; }
.auth-kicker { margin: 14px 0 6px; color: var(--auth-sky-dark); font-weight: 700; }
.auth-card h1 { margin: 0; font-family: "Alexandria", sans-serif; font-size: clamp(28px, 6vw, 42px); line-height: 1.25; }
.auth-card > p:not(.auth-kicker):not(.auth-error) { color: #5d6266; line-height: 1.8; }
.auth-card form { display: grid; gap: 12px; margin-top: 24px; text-align: right; }
.auth-card label { font-weight: 700; }
.auth-card input { min-height: 54px; padding: 0 16px; border: 1px solid #a9cbd9; border-radius: 12px; font: inherit; font-size: 20px; text-align: center; letter-spacing: .18em; }
.auth-card input:focus { outline: 3px solid rgba(43,155,207,.22); border-color: var(--auth-sky-dark); }
.auth-card button { min-height: 54px; border: 0; border-radius: 12px; color: #fff; background: var(--auth-sky-dark); font: inherit; font-weight: 700; cursor: pointer; }
.auth-card button:hover { background: #066c94; }
.auth-card small { display: block; margin-top: 20px; color: #72777a; }
.auth-error { padding: 10px 12px; color: #8b270f; background: #fff0ea; border: 1px solid #f6b9aa; border-radius: 10px; font-weight: 700; }

.logout-link { color: #7b260e !important; background: #fff0ea !important; border-color: #f6b9aa !important; }

@media (max-width: 520px) {
  .auth-page { padding: 14px; }
  .auth-card { padding: 26px 20px; border-radius: 18px; }
}

@media print {
  .logout-link { display: none !important; }
}