/* Staff authentication only. Auth transport, fields and redirects stay native. */
@media screen {
  body.pa-auth {
    margin: 0;
    min-height: 100vh;
    background: radial-gradient(ellipse at 50% 0, #262b30 0, var(--pa-bg) 64%);
    color: var(--pa-text);
    font: 14px/1.5 var(--pa-font);
    color-scheme: dark;
  }
  .pa-auth .auth-shell { min-height: 100dvh; display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
  .pa-auth .auth-card { width: min(460px, 100%); padding: 32px; background: linear-gradient(145deg, var(--pa-surface-raised), var(--pa-surface) 45%); border: 1px solid var(--pa-border); border-radius: 14px; box-shadow: 0 24px 72px #0007, inset 0 1px 0 #ffffff05; }
  .pa-auth .auth-brand { padding-bottom: 25px; margin-bottom: 25px; border-bottom: 1px solid var(--pa-border); }
  .pa-auth .auth-brand img { display: block; width: 230px; max-width: 100%; height: 50px; object-fit: contain; object-position: left center; }
  .pa-auth .auth-kicker { color: var(--pa-muted); font-size: 10px; font-weight: 600; letter-spacing: .16em; margin-bottom: 8px; }
  .pa-auth h1 { font-size: 25px; line-height: 1.2; font-weight: 600; letter-spacing: -.035em; margin: 0 0 10px; color: var(--pa-text); }
  .pa-auth .auth-note { color: var(--pa-muted); font-size: 13px; line-height: 1.6; margin: 0 0 24px; }
  .pa-auth form { display: grid; gap: 17px; }
  .pa-auth label { display: grid; gap: 7px; font-size: 12px; font-weight: 500; color: var(--pa-text); }
  .pa-auth .hint { color: var(--pa-muted); font-size: 11px; font-weight: 400; }
  .pa-auth input { box-sizing: border-box; width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--pa-border); border-radius: 7px; background: var(--pa-input); color: var(--pa-text); font: 14px var(--pa-font); box-shadow: inset 0 1px 3px #0003; }
  .pa-auth input:hover { border-color: #606971; }
  .pa-auth input::placeholder { color: var(--pa-muted); }
  .pa-auth button { min-height: 44px; border: 1px solid #c6a261; border-radius: 7px; padding: 11px 16px; background: var(--pa-gold); color: #17130b; font: 600 13px var(--pa-font); cursor: pointer; box-shadow: 0 2px 5px #0003; }
  .pa-auth button:hover:not(:disabled) { background: #c8a463; }
  .pa-auth button:disabled { opacity: .55; cursor: wait; }
  .pa-auth :is(input, button, a):focus-visible { outline: 2px solid var(--pa-gold-text); outline-offset: 3px; }
  .pa-auth .auth-alt { color: var(--pa-muted); font-size: 12px; text-align: center; margin: 16px 0 0; }
  .pa-auth .auth-alt a { color: var(--pa-text); text-decoration: underline; text-underline-offset: 3px; font-weight: 500; }
  .pa-auth .auth-alt a:hover { color: var(--pa-gold-text); }
  .pa-auth .auth-error { color: var(--pa-danger) !important; font-size: 13px; line-height: 1.5; margin: 0; overflow-wrap: anywhere; }
  .pa-auth .auth-error:not(:empty) { background: #3b2428; border: 1px solid #72464d; padding: 10px 12px; border-radius: 7px; }
  /* Existing script sets feedback color; reflect that state without changing it. */
  .pa-auth .auth-error[style*="rgb(53, 107, 69)"] { color: var(--pa-success) !important; border-color: #375c48; background: #20372b; }
  .pa-auth .auth-server-error { margin-bottom: 18px; }
}
@media screen and (max-width: 480px) {
  .pa-auth .auth-shell { padding: 20px 12px; }
  .pa-auth .auth-card { padding: 24px 20px; }
  .pa-auth input { font-size: 16px; }
}
@media screen and (prefers-reduced-motion: reduce) {
  .pa-auth *, .pa-auth *::before, .pa-auth *::after { transition: none !important; animation: none !important; }
}