/* login.css — the sign-in page's own layer, extracted verbatim from the pre-cutover
   app.css at the 2026-07-12 promotion (ui/styles/app.css is now the app-shell
   stylesheet). Loads AFTER tokens.css + noteport.css; tokens only — a hex literal
   in this file is a defect (brand rule 3). */

/* ============ utilities ============ */
.np-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ============ login (spec §3.7) ============ */
.np-login {
  min-height: 100dvh; display: grid; place-items: center;
  padding: var(--np-s6) var(--np-s4); background: var(--np-canvas);
}
.np-login-col { width: min(440px, 100%); text-align: center; }
.np-login-panel { padding: var(--np-s7) var(--np-s6) var(--np-s6); }
.np-login-panel .np-lockup { justify-content: center; margin-bottom: var(--np-s5); }
/* W25: the lockup mark is a shared <img> asset now; noteport.css (untouchable) sizes
   only `.np-lockup svg`, so the img mirrors those exact declarations here. */
.np-lockup img { width: 30px; height: 30px; margin-right: 10px; flex: 0 0 auto; }
.np-login-line { font: 400 15px/1.7 var(--np-font-body); color: var(--np-text-strong); margin: 0 0 var(--np-s5); }
.np-login-panel .np-cta { display: block; }
.np-login-trust { margin-top: var(--np-s6); gap: var(--np-s3) var(--np-s5); }
.np-login-foot { margin-top: var(--np-s5); display: flex; gap: var(--np-s5); justify-content: center; font: var(--np-small); }

/* signed-out confirmation heading (A2) */
.np-login-title { font: 700 22px/1.3 var(--np-font-display); color: var(--np-ink); margin: 0 0 var(--np-s3); }
/* secondary action: "sign in with a different account" (A2) — a quiet text link under the CTA */
.np-login-alt { display: inline-block; margin-top: var(--np-s4); font: var(--np-small); color: var(--np-teal-deep); text-decoration: none; }
.np-login-alt:hover { text-decoration: underline; }