/* Account pages: /account/sign-in/, /account/create/, /account/ (decisions D19-D21).
   Builds on pages.css form styles; only what those pages need beyond them. */
.acct{max-width:560px}
/* .field-group and .form set display, which beats the [hidden] attribute; the steps rely on it. */
.acct [hidden]{display:none!important}
.acct-step[hidden]{display:none}
.acct-alt{display:flex;flex-direction:column;gap:10px;margin-top:var(--space-6)}
.acct-alt[hidden]{display:none}
.acct-alt__or{font:var(--type-meta);color:var(--text-muted);margin:0}
.acct-oauth{display:flex;align-items:center;justify-content:center;gap:10px;width:100%}
.acct-oauth svg{flex:none}
.acct-code{letter-spacing:.4em;font-size:1.5rem;font-variant-numeric:tabular-nums;max-width:12ch}
.acct-link{background:none;border:0;padding:0;font:inherit;color:var(--orange-600);font-weight:700;cursor:pointer;text-decoration:underline}
.acct-link:focus-visible{outline:var(--focus-width) solid var(--focus-outline);outline-offset:2px}
.acct-note{font:var(--type-meta);color:var(--text-muted);margin:0}
.acct-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}
@media (max-width:599px){.acct-row{grid-template-columns:1fr}}
.acct-card{border:1px solid var(--border-default);border-radius:var(--radius-md);padding:var(--space-6);background:var(--surface-card);margin-bottom:var(--space-6)}
.acct-card h2{margin:0 0 var(--space-3);font-size:var(--text-lg)}
.acct-dl{display:grid;grid-template-columns:max-content 1fr;gap:6px 18px;margin:0}
.acct-dl dt{font-weight:700;color:var(--ink)}
.acct-dl dd{margin:0;color:var(--text-body)}
@media (max-width:599px){.acct-dl{grid-template-columns:1fr}.acct-dl dd{margin-bottom:8px}}
.acct-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--space-5)}
/* Billing on /account/: the subscription, card and invoices, drawn from Stripe in our own design. */
.bill-h{font-size:var(--text-base);font-weight:800;color:var(--ink);margin:var(--space-6) 0 var(--space-2);padding-top:var(--space-5);border-top:1px solid var(--border-subtle)}
.bill-plan__name{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;color:var(--ink);margin:0}
.bill-plan__price{margin:2px 0 6px;color:var(--text-body)}
.bill-tag{display:inline-flex;align-items:center;min-height:22px;padding:0 10px;margin-left:6px;vertical-align:middle;border-radius:var(--radius-pill);font:var(--fw-bold) var(--text-xs)/1 var(--font-brand);text-transform:uppercase;letter-spacing:.06em;background:var(--orange-100);color:var(--ink);border:1px solid var(--orange-300)}
.bill-confirm{margin-top:var(--space-4);padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);background:var(--surface-sunken);border:1px solid var(--border-subtle)}
.bill-confirm p{margin:0}
.bill-pay{margin-top:var(--space-4)}
.bill-inv{width:100%;border-collapse:collapse;font-size:var(--text-small)}
.bill-inv th{text-align:left;font-weight:800;color:var(--ink);border-bottom:2px solid var(--border-default);padding:8px 10px 8px 0}
.bill-inv td:first-child{white-space:nowrap}
.bill-inv td{border-bottom:1px solid var(--border-subtle);padding:10px 10px 10px 0;vertical-align:top;color:var(--text-body)}
.bill-inv td:last-child{text-align:right;padding-right:0;white-space:nowrap}
.bill-inv a{color:var(--orange-600);font-weight:700}
.bill-inv .bill-status{display:block;font:var(--type-meta);color:var(--text-muted)}
@media (max-width:599px){.bill-inv thead{display:none}.bill-inv tr{display:grid;grid-template-columns:1fr auto;border-bottom:1px solid var(--border-subtle);padding:8px 0}.bill-inv td{border:0;padding:2px 0}.bill-inv td:nth-child(2){grid-column:1/-1;order:3}}