/*
 * Add-on block "account" (neutral default, loaded before every catalog style): the account line
 * in the masthead (.acc-bar), the account and admin pages (.acc-page …), the comment filter
 * (.acc-cfilter) and comment votes (.acc-votes, .comment__auth). It inherits the style's colours
 * (currentColor, transparent fills), so it reads in every style; a style may ship its own
 * <style>_account.css instead (agent/rules/catalog-style.md, "Add-on blocks").
 */
.acc-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 10px; font-size: 14px; }
.acc-bar__link, .acc-bar__me { color: inherit; text-decoration: none; opacity: 0.85; background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.acc-bar__link:hover, .acc-bar__me:hover { opacity: 1; text-decoration: underline; text-underline-offset: 3px; }
.acc-bar__link--primary { padding: 3px 12px; border: 1px solid currentColor; border-radius: 999px; opacity: 1; }
.acc-bar__link--primary:hover { text-decoration: none; }
.acc-bar__out { display: inline; margin: 0; }
.acc-bar__badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: #d4472c; color: #fff; font-size: 11px; font-weight: 700; }

.acc-role { display: inline-block; padding: 1px 7px; border: 1px solid currentColor; border-radius: 999px; font-size: 0.72em; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; opacity: 0.8; vertical-align: 0.1em; }
.acc-role--superadmin, .acc-role--admin { color: #c0392b; }
.acc-role--creator { color: #2f8a4a; }
.acc-role--viewer { color: #2c6fb0; }
.acc-state { font-size: 0.85em; opacity: 0.75; }
.acc-state--banned, .acc-state--rejected { color: #c0392b; opacity: 1; font-weight: 700; }
.acc-state--accepted { color: #2f8a4a; opacity: 1; font-weight: 700; }
.acc-state--pending { color: #b7791f; opacity: 1; font-weight: 700; }

.acc-body { display: grid; gap: 22px; margin-top: 18px; }
.acc-card { padding: 18px 20px; border: 1px solid color-mix(in srgb, currentColor 18%, transparent); border-radius: 12px; }
.acc-h { margin: 0 0 12px; font-size: 1.15em; }
.acc-h3 { margin: 18px 0 8px; font-size: 1em; }
.acc-form { display: grid; gap: 10px; margin: 0; }
.acc-form--narrow { max-width: 420px; }
.acc-form--inline { display: inline-flex; gap: 8px; align-items: center; }
.acc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px 16px; }
.acc-field { margin: 0; }
.acc-field__label { display: grid; gap: 4px; font-size: 0.9em; }
.acc-field__hint { display: block; margin-top: 3px; font-size: 0.8em; opacity: 0.7; }
.acc-input { width: 100%; min-width: 0; padding: 7px 10px; border: 1px solid color-mix(in srgb, currentColor 30%, transparent); border-radius: 8px; background: transparent; color: inherit; font: inherit; }
select.acc-input { width: auto; max-width: 100%; }
.acc-input:focus-visible { outline: 2px solid color-mix(in srgb, currentColor 60%, transparent); outline-offset: 1px; }
.acc-check { margin: 0; font-size: 0.92em; }
.acc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 6px 0 0; }
.acc-link { color: inherit; font-size: 0.9em; }
.acc-note { font-size: 0.85em; opacity: 0.72; }
.acc-kv { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 8px; }
.acc-secret { padding: 2px 6px; border-radius: 6px; background: color-mix(in srgb, currentColor 9%, transparent); font-size: 0.85em; word-break: break-all; }
.acc-code { overflow-x: auto; margin: 6px 0; padding: 10px 12px; border-radius: 8px; background: color-mix(in srgb, currentColor 8%, transparent); font-size: 0.8em; white-space: pre-wrap; word-break: break-all; }
.acc-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.acc-tabs__link, .acc-chip { padding: 5px 13px; border: 1px solid color-mix(in srgb, currentColor 25%, transparent); border-radius: 999px; color: inherit; font-size: 0.9em; text-decoration: none; }
.acc-tabs__link.is-active, .acc-chip.is-active { border-color: currentColor; font-weight: 700; }
.acc-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 14px; }
.acc-filter .acc-input { width: auto; }
.acc-tablewrap { overflow-x: auto; }
.acc-table { width: 100%; border-collapse: collapse; font-size: 0.88em; }
.acc-table th, .acc-table td { padding: 8px 10px; border-bottom: 1px solid color-mix(in srgb, currentColor 12%, transparent); text-align: left; vertical-align: top; }
.acc-table th { font-size: 0.8em; letter-spacing: 0.04em; text-transform: uppercase; opacity: 0.7; }
.acc-table a { color: inherit; }
.acc-table tr.is-banned, .acc-table tr.is-hidden { opacity: 0.55; }
.acc-table--comments .acc-text { min-width: 260px; max-width: 520px; }
.acc-acts { white-space: nowrap; }
.acc-acts .acc-form--inline { margin: 2px 0; }
.btn.acc-btn--small { padding: 3px 10px; font-size: 0.8em; }
.btn.acc-danger { border-color: #c0392b; color: #c0392b; }
.acc-guest { font-size: 0.8em; opacity: 0.6; }
.acc-dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px; margin: 12px 0 0; font-size: 0.9em; }
.acc-dl dt { opacity: 0.65; }
.acc-dl dd { margin: 0; }
.acc-list { margin: 0; padding-left: 18px; font-size: 0.9em; }
.acc-list li { margin: 4px 0; }
.acc-list--bad { color: #c0392b; }
.acc-doc { max-height: 420px; overflow: auto; padding: 10px 14px; border: 1px dashed color-mix(in srgb, currentColor 20%, transparent); border-radius: 8px; }
.acc-flash { margin: 12px 0 0; }

/* a post's comments: who / order, the "signed in" mark, +/- votes */
.acc-cfilter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0 14px; font-size: 0.85em; }
.acc-cfilter__label { margin-left: 6px; opacity: 0.65; }
.acc-cfilter__label:first-child { margin-left: 0; }
.acc-cfilter .acc-chip { padding: 2px 10px; }
.comment__auth { display: inline-block; padding: 0 7px; border: 1px solid currentColor; border-radius: 999px; font-size: 0.72em; letter-spacing: 0.03em; opacity: 0.7; vertical-align: 0.1em; }
.acc-votes { display: inline-flex; align-items: center; gap: 4px; margin: 6px 0 0; }
.acc-vote { display: grid; place-items: center; width: 26px; height: 24px; padding: 0; border: 1px solid color-mix(in srgb, currentColor 25%, transparent); border-radius: 6px; background: none; color: inherit; font-size: 11px; cursor: pointer; opacity: 0.7; }
.acc-vote:hover { opacity: 1; }
.acc-vote.is-mine { border-color: currentColor; opacity: 1; font-weight: 700; }
.acc-vote--up.is-mine { color: #2f8a4a; }
.acc-vote--down.is-mine { color: #c0392b; }
.acc-votes__score { min-width: 2.2em; font-size: 0.85em; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; }