/* The Plumbline: reader account page ([plumbline_account]). Loaded on that page only. */
.pl-acct { max-width: 920px; margin: 8px auto 48px; font-family: var(--pl-body); }
.pl-acct h2 { font-size: 24px; margin: 0 0 12px; }
.pl-acct-intro { max-width: 620px; }
.pl-acct-intro p:last-child { font-size: 19px; }
.pl-acct-note { font-family: var(--pl-ui); font-weight: 600; font-size: 15px; padding: 12px 16px; border-left: 4px solid var(--pl-ink); background: var(--pl-soft); margin: 0 0 20px; }
.pl-acct-note.is-err { border-left-color: var(--pl-act); background: var(--pl-act-soft); }
.pl-acct-tabs { display: flex; gap: 24px; border-bottom: 1px solid var(--pl-line); margin: 20px 0 24px; font-family: var(--pl-ui); }
.pl-acct-tabs a { padding: 10px 0 8px; font-weight: 700; font-size: 15px; color: var(--pl-muted); text-decoration: none; border-bottom: 3px solid transparent; }
.pl-acct-tabs a[aria-current] { color: var(--pl-ink); border-bottom-color: var(--pl-ink); }
.pl-acct-door { max-width: 460px; }
.pl-acct-field { margin: 0 0 14px; }
.pl-acct-field label { display: block; font-family: var(--pl-ui); font-weight: 700; font-size: 13.5px; margin-bottom: 5px; }
body .pl-acct-field input { width: 100%; box-sizing: border-box; padding: 11px 12px; font: inherit; font-size: 17px; border: 1.5px solid #b9b4bd; border-radius: 3px; background: #fff; color: var(--pl-ink); }
body .pl-acct-field input:focus { border-color: var(--pl-ink); outline: 2px solid var(--pl-ink); outline-offset: 1px; }
.pl-acct .pl-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; line-height: 1.45; margin: 0 0 12px; }
.pl-acct .pl-consent input { margin-top: 4px; flex: none; width: 18px; height: 18px; accent-color: var(--pl-ink); }
.pl-btn-ghost { background: #fff; color: var(--pl-ink); border: 1.5px solid var(--pl-ink); }
.pl-btn-ghost:hover { background: var(--pl-ink); color: #fff; }
.pl-acct-forgot { margin-left: 14px; font-family: var(--pl-ui); font-size: 14px; color: var(--pl-ink); }
.pl-acct-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; flex-wrap: wrap; border-bottom: 2px solid var(--pl-ink); padding-bottom: 14px; margin-bottom: 8px; }
.pl-acct-head .pl-eyebrow { margin-bottom: 4px; }
body .pl-acct-hello { font-size: clamp(30px, 5vw, 42px); margin: 0; }
.pl-acct-form.is-inline { display: inline-block; margin: 0 8px 8px 0; }
.pl-acct-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.pl-acct-panel { border-top: 1px solid var(--pl-line); padding: 22px 0 14px; min-width: 0; }
.pl-acct-panel.pl-acct-you, .pl-acct-panel.pl-acct-games { grid-column: 1 / -1; }
.pl-acct-you .pl-acct-form:not(.is-inline) { max-width: 460px; }
.pl-acct-warn { border-left: 4px solid var(--pl-act); background: var(--pl-act-soft); padding: 10px 14px 4px; margin: 0 0 16px; font-size: 16px; }
.pl-acct-warn p { margin: 0 0 8px; }
.pl-acct-stats { width: 100%; border-collapse: collapse; font-family: var(--pl-ui); font-size: 14px; margin-bottom: 12px; }
.pl-acct-stats th { text-align: left; font-weight: 800; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; border-bottom: 2px solid var(--pl-ink); padding: 6px 8px 6px 0; }
.pl-acct-stats td { border-bottom: 1px solid var(--pl-line); padding: 8px 8px 8px 0; }
.pl-acct-stats td + td, .pl-acct-stats th + th { text-align: right; width: 4.5em; }
.pl-acct-buttons .pl-btn { margin: 0 8px 8px 0; }
.pl-acct-delete { margin-top: 12px; }
.pl-acct-delete summary { cursor: pointer; font-family: var(--pl-ui); font-weight: 700; font-size: 14px; color: var(--pl-act); }
.pl-acct-delete[open] summary { margin-bottom: 10px; }
@media (max-width: 720px) {
	.pl-acct { margin-inline: 0; }
	.pl-acct-grid { grid-template-columns: minmax(0, 1fr); }
	.pl-acct-stats { font-size: 13px; }
	.pl-acct-stats td + td, .pl-acct-stats th + th { width: 3.4em; }
	.pl-acct-forgot { display: inline-block; margin: 10px 0 0; }
}
.pl-handle { color: var(--pl-muted); font-weight: 500; }
.pl-acct-hello .pl-handle { font-family: var(--pl-ui); font-size: 17px; letter-spacing: 0; white-space: nowrap; }
.pl-acct-at { display: flex; align-items: stretch; }
.pl-acct-at > span { display: flex; align-items: center; padding: 0 10px; font-family: var(--pl-ui); font-weight: 700; font-size: 17px; border: 1.5px solid #b9b4bd; border-right: 0; border-radius: 3px 0 0 3px; background: var(--pl-soft); }
body .pl-acct-at input { border-radius: 0 3px 3px 0; }