/* Sign-in, sign-up, billing — tokens from the ExitSight redesign handoff. */
:root {
  --ink: #14171a; --muted: #5b6169; --line: #e3e5e8; --line-strong: #cdd1d6;
  --surface: #fff; --ground: #f6f7f8; --accent: #2a67c8; --accent-soft-bg: #f2f6fd;
  --accent-soft-border: #d4e2f7; --accent-soft-ink: #25508f; --positive: #1f7a4d;
}
.auth-body { margin: 0; background: var(--ground); color: var(--ink);
  font: 14px/1.5 "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif; }
.auth-main { max-width: 440px; margin: 56px auto; padding: 0 20px; }
.auth-main.wide { max-width: 760px; }
.auth-brand { display: inline-block; font-weight: 600; font-size: 17px; color: var(--ink); text-decoration: none; margin-bottom: 22px; }
.auth-brand sup { font-size: 9px; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 22px 24px; }
h1 { font-size: 19px; font-weight: 600; margin: 0 0 6px; }
.lead { color: var(--muted); margin: 0 0 18px; font-size: 13px; }
label { display: block; font-size: 11.5px; color: var(--muted); margin: 12px 0 4px; }
input[type=email], input[type=password], input[type=text] { width: 100%; box-sizing: border-box; font: inherit;
  padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: 6px; background: #fff; }
input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(42,103,200,.14); }
.btn { display: inline-block; font: inherit; font-weight: 500; padding: 8px 14px; border-radius: 6px; cursor: pointer;
  border: 1px solid var(--line-strong); background: #fff; color: var(--ink); text-decoration: none; }
.btn:hover { border-color: #9aa1a9; }
.btn-primary { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn-primary:hover { background: #2b3036; }
.btn-block { width: 100%; margin-top: 16px; text-align: center; }
.links { margin-top: 14px; font-size: 12.5px; color: var(--muted); }
.links a { color: var(--accent); }
.flash { padding: 9px 12px; border-radius: 6px; font-size: 13px; margin: 0 0 14px; }
.flash-alert { background: #fdf2f2; border: 1px solid #f1c9c9; color: #8a2b2b; }
.flash-notice { background: var(--accent-soft-bg); border: 1px solid var(--accent-soft-border); color: var(--accent-soft-ink); }
.errors { color: #8a2b2b; font-size: 12.5px; margin: 0 0 8px; padding-left: 18px; }
.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-top: 16px; }
.plan { border: 1px solid var(--line); border-radius: 8px; padding: 18px 20px; background: #fff; display: flex; flex-direction: column; }
.plan.is-featured { border-color: var(--accent); }
.plan-name { font-size: 10.5px; text-transform: uppercase; letter-spacing: .09em; color: var(--muted); font-weight: 600; }
.plan-price { font: 600 27px/1.1 "IBM Plex Mono", ui-monospace, Menlo, monospace; letter-spacing: -.015em; margin: 8px 0 2px; }
.plan-per { color: var(--muted); font-size: 12.5px; }
.plan ul { padding-left: 18px; margin: 12px 0 16px; font-size: 13px; color: var(--muted); }
.plan form { margin-top: auto; }
.status { border: 1px solid var(--accent-soft-border); background: var(--accent-soft-bg); color: var(--accent-soft-ink);
  border-radius: 6px; padding: 10px 12px; font-size: 13px; margin-bottom: 14px; }
.mono { font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace; }
.fine { font-size: 12px; color: var(--muted); margin-top: 16px; }