/* Sign-in screen. Same tokens as the dashboard so the first thing anyone sees is
   already the product, not a stock login form. */
.loginPage{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:var(--bg);padding:24px}
.loginCard{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:36px 34px 32px}
.loginBrand{display:flex;align-items:center;gap:11px;margin-bottom:4px}
.loginBrand h1{font-size:18px;font-weight:640;letter-spacing:-.01em}
.loginBrand .dot{width:30px;height:30px;border-radius:var(--r-full);flex:none;
  background:var(--ink);display:block}
.loginSub{margin:0 0 26px;font-size:13px;color:var(--ink3)}
.loginField{display:block;margin-bottom:15px}
.loginField span{display:block;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:10px;
  letter-spacing:.5px;text-transform:uppercase;color:var(--ink3);margin-bottom:7px}
.loginField input{width:100%;background:var(--canvas);border:1px solid var(--line);
  border-radius:var(--r-md);padding:11px 13px;font:inherit;font-size:14px;color:var(--ink)}
.loginField input:focus{outline:2px solid var(--accent);outline-offset:-1px}
.loginBtn{width:100%;justify-content:center;margin-top:8px;padding:11px 18px;font-size:14px}
.loginError{margin:0 0 12px;font-size:13px;color:var(--bad);line-height:1.45}
.loginHelp{margin:-4px 0 14px;font-size:12px;line-height:1.5;color:var(--ink3)}
.loginAlt{margin:14px 0 0;text-align:center}
.linkBtn{border:0;background:none;padding:0;cursor:pointer;font:inherit;font-size:13px;
  color:var(--ink3);text-decoration:underline;text-underline-offset:3px}
.linkBtn:hover{color:var(--ink)}
.loginNote{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--ink2);text-align:center}
/* Google's brand guidance: its own mark, on white, never restyled to match us. */
.googleBtn{width:100%;justify-content:center;gap:10px;padding:11px 18px;font-size:14px;
  background:var(--canvas);color:var(--ink);border:1px solid var(--line);text-decoration:none}
.googleBtn:hover{border-color:var(--ink3)}
.loginOr{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--ink3);font-size:12px}
.loginOr::before,.loginOr::after{content:"";flex:1;height:1px;background:var(--line)}