.auth-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: radial-gradient(circle at 25% 10%, #f2e9f6 0, transparent 32%), var(--canvas);
}
body:not(.auth-ready) .skip-link { display: none; }
.auth-card { width: min(410px, 100%); padding: 28px; background: #fff; border: 1px solid var(--line); border-radius: 15px; box-shadow: 0 22px 55px rgba(35,28,40,.12); }
.auth-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 26px; }
.auth-brand > span:last-child strong, .auth-brand > span:last-child small { display: block; }
.auth-brand > span:last-child strong { color: var(--ink); font-size: 1rem; letter-spacing: .045em; }
.auth-brand > span:last-child small { margin-top: 3px; color: var(--red); font-size: .58rem; font-weight: 850; letter-spacing: .22em; }
.auth-card h1 { margin: 5px 0 7px; font-size: 1.45rem; }
.auth-card p { color: var(--muted); font-size: .76rem; }
.auth-card form { display: grid; gap: 8px; margin-top: 20px; }
.auth-card label { font-size: .65rem; color: var(--muted); font-weight: 760; }
.auth-card input { height: 42px; margin-bottom: 5px; }
.auth-card .button.primary { margin-top: 7px; }
.auth-error { margin: 0 !important; padding: 9px 10px; color: var(--red-dark) !important; background: var(--red-soft); border-radius: 7px; }
.auth-actions { display: flex; gap: 8px; margin-top: 18px; }
.auth-spinner { display: block; width: 24px; height: 24px; margin: 12px auto; border: 3px solid #e5dfeb; border-top-color: var(--purple); border-radius: 50%; animation: auth-spin .8s linear infinite; }
#authPending { text-align: center; padding: 22px 0; }
.rail .module-links { flex: 0 0 auto; min-height: auto; overflow: visible; padding: 9px 17px; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: min-content; align-content: start; column-gap: 10px; row-gap: 4px; }
.module-links > span { grid-column: 1/-1; color: #aaa69f; text-transform: uppercase; letter-spacing: .12em; font-size: .54rem; font-weight: 750; }
.module-links a { color: #6a646c; text-decoration: none; font-size: .65rem; line-height: 1.3; }
.module-links a:hover, .module-links a[aria-current="page"] { color: var(--red-dark); }
.rail-foot { display: flex; align-items: center; }
.rail-foot button { margin-left: auto; border: 0; background: transparent; color: var(--purple); padding: 0; cursor: pointer; font-size: .67rem; }
.role-notice { margin-bottom: 14px; }
.rail.collapsed .module-links { display: none; }
@keyframes auth-spin { to { transform: rotate(360deg); } }
@media (max-width: 700px) { .auth-screen { padding: 14px; } .auth-card { padding: 22px; } }
