/* Sign in, ask for access, and People: one card on the page. */
body.account .card { max-width: 30rem; margin: 32px auto; padding: 26px 24px; background: var(--card);
  border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); }
body.account.wide .card { max-width: 72rem; }
body.account h1 { margin: 0 0 8px; font-size: 1.4rem; color: var(--ink); }
body.account .lead { margin: 0 0 20px; color: var(--muted); }
body.account label { display: block; margin: 14px 0 6px; font-weight: 600; font-size: .92rem; }
body.account label small { font-weight: 400; color: var(--muted); }
body.account form .btn { margin-top: 18px; }
body.account .btn + .btn { margin-left: 8px; }
body.account .field.code { font: 600 1.6rem var(--mono); letter-spacing: .3em; max-width: 12rem; font-variant-numeric: tabular-nums; }
body.account .alt { margin: 18px 0 0; color: var(--muted); font-size: .92rem; }
@media (max-width: 480px) { body.account .card { margin: 0; border-radius: 0; border-left: 0; border-right: 0; } }

.people-wrap { overflow-x: auto; }
table.people { width: 100%; border-collapse: collapse; margin-top: 10px; min-width: 44rem; }
table.people th { text-align: left; font: 700 11px var(--body); letter-spacing: .07em; text-transform: uppercase; color: var(--muted);
  padding: 8px 6px; border-bottom: 1px solid var(--line); }
table.people td { padding: 10px 6px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
table.people tr.pending td { background: var(--amber-soft); }
table.people tr.disabled td { color: var(--muted); }
table.people .actions { text-align: right; white-space: nowrap; }
table.people .actions > * { margin-left: 6px; }