[data-error-summary][hidden], .cfg-progress[hidden], [data-lockout][hidden] { display: none; }
[data-error-summary] { flex-direction: column; gap: 0.25rem; }
[data-error-summary] ul { margin: 0.25rem 0 0; }

.cfg-mt { margin-top: 1.25rem; }
.cfg-break { overflow-wrap: anywhere; word-break: break-word; }
.cfg-grow { flex: 1 1 220px; min-width: 0; width: auto; }
.cfg-border-top { border-top: 1px solid var(--rule-soft); }
.cfg-flat { border: 0; border-radius: 0; }
.cfg-two { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 1100px) {
  .cfg-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cfg-two--wide { grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); }
}
.cfg-inline { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.cfg-inline .input { flex: 1 1 200px; width: auto; min-width: 0; }
.cfg-actions { border-top: 1px solid var(--rule-soft); border-bottom: 0; }
.cfg-tab--disabled { color: var(--muted); cursor: not-allowed; opacity: 0.6; }
.cfg-row-active { background: var(--accent-soft); }
.cfg-flags { display: inline-flex; flex-wrap: wrap; gap: 0.3rem; }
.cfg-yes { color: var(--good); }
.cfg-req { color: var(--danger); }
.cfg-checks { display: grid; gap: 0.45rem 1rem; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.cfg-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; list-style: none; padding: 0; margin: 0 0 0.5rem; }
.cfg-chips .chip { cursor: default; }
.cfg-chips .chip:hover { border-color: var(--rule); color: var(--ink-2); }
.cfg-chip-remove { display: inline-grid; place-items: center; width: 24px; height: 24px; margin: -0.2rem -0.35rem -0.2rem 0; border: 0; border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; }
.cfg-chip-remove:hover { background: var(--danger-soft); color: var(--danger); }
.cfg-facts { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: 0.45rem; }
.cfg-facts li { display: flex; gap: 0.5rem; align-items: flex-start; }
.cfg-facts .icon { margin-top: 0.2rem; color: var(--teal); }
.cfg-doc-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.35rem; }
.cfg-doc-list .icon { display: inline-block; color: var(--teal); }
.cfg-fieldlist { padding-left: 1.1rem; display: grid; gap: 0.25rem; margin: 0 0 1rem; }
.cfg-kpis { margin-bottom: 1rem; }
.cfg-legend { font-size: 0.85rem; color: var(--ink-2); margin: 0.75rem 0 1rem; }
.cfg-tall { min-height: 280px; }

.login { display: grid; gap: 1.5rem; width: min(100%, 940px); grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 860px) { .login { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } }
.login-card { background: var(--surface); border: 1px solid var(--rule); border-radius: 10px; padding: clamp(1.25rem, 4vw, 2rem); box-shadow: var(--shadow); }
.login-card h1 { margin: 1.25rem 0 0.4rem; font-size: 1.6rem; }
.login-row { margin-bottom: 1rem; }
.login-submit { width: 100%; }
.login-note { display: flex; gap: 0.4rem; align-items: flex-start; margin-top: 1rem; }
.login-demo { background: #fbf8f2; border: 1px dashed var(--rule); border-radius: 10px; padding: 1.25rem; }
.login-demo h2 { font-size: 1.1rem; margin-bottom: 0.25rem; }
.login-demo ul { list-style: none; padding: 0; margin: 0.75rem 0 0; display: grid; gap: 0.4rem; }
.login-demo__user { width: 100%; text-align: left; display: flex; flex-direction: column; gap: 0.1rem; padding: 0.55rem 0.75rem; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--surface); cursor: pointer; font: inherit; color: var(--ink); min-height: 44px; }
.login-demo__user:hover { border-color: var(--accent); }
.login-demo__name { font-weight: 600; }
.login-demo__roles { font-size: 0.8rem; color: var(--muted); }

.cfg-swatches { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.cfg-swatch { display: flex; flex-direction: column; align-items: center; gap: 0.3rem; font-size: 0.78rem; cursor: pointer; padding: 0.35rem; border-radius: var(--radius); border: 2px solid transparent; }
.cfg-swatch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cfg-swatch:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.cfg-swatch:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.cfg-swatch__img { --hue: 20; width: 48px; height: 64px; border-radius: 3px; background: linear-gradient(160deg, hsl(var(--hue) 32% 38%), hsl(var(--hue) 38% 22%)); box-shadow: inset 4px 0 0 rgb(0 0 0 / 0.18); }
.cfg-preview { margin: 0.5rem 0 0; padding: 0.6rem 0.75rem; border-left: 3px solid var(--gold); background: #fbf8f2; font-family: var(--font-sans); overflow-wrap: anywhere; }
.cfg-results { list-style: none; padding: 0; margin: 0.75rem 0 0; display: grid; gap: 0.35rem; }
.cfg-results li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.5rem; padding: 0.45rem 0.6rem; border: 1px solid var(--rule-soft); border-radius: var(--radius); }
.cfg-order { display: inline-flex; align-items: center; gap: 0.25rem; font-variant-numeric: tabular-nums; }
.cfg-drag { color: var(--muted); cursor: grab; }
.cfg-items tr[draggable='true'] { cursor: grab; }
.cfg-items .input--sm { min-width: 140px; }
.cfg-views { display: grid; gap: 0.6rem; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
.cfg-view { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; padding: 0.85rem 0.5rem; border: 1px solid var(--rule); border-radius: var(--radius); cursor: pointer; background: var(--surface); }
.cfg-view input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cfg-view:has(input:checked) { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); color: var(--accent); }
.cfg-view:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.cfg-counter { font-size: 0.85rem; color: var(--ink-2); margin: 0 0 0.6rem; font-variant-numeric: tabular-nums; }

.cfg-fields td, .cfg-fields th { white-space: nowrap; }
.cfg-fields td:nth-child(2) { white-space: normal; min-width: 150px; }
.cfg-flag-grid, .cfg-role-list { display: grid; gap: 0.6rem; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.cfg-flag { display: flex; gap: 0.55rem; align-items: flex-start; padding: 0.6rem 0.7rem; border: 1px solid var(--rule-soft); border-radius: var(--radius); cursor: pointer; }
.cfg-flag input { margin-top: 0.2rem; width: 17px; height: 17px; accent-color: var(--accent); flex: none; }
.cfg-flag:has(input:checked) { border-color: var(--teal); background: var(--teal-soft); }
.cfg-preview-panel { position: relative; }
@media (min-width: 1100px) { .cfg-preview-panel { position: sticky; top: 4.5rem; } }
.cfg-result { margin: 0.75rem 0 0; font-weight: 500; }

.cfg-vocab { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 1000px) { .cfg-vocab { grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.3fr); } }
.cfg-term-list { list-style: none; margin: 0; padding: 0.35rem 0; max-height: 560px; overflow-y: auto; }
.cfg-term-list li { --depth: 0; display: flex; align-items: center; gap: 0.5rem; padding: 0 0.75rem 0 calc(0.75rem + var(--depth) * 1.1rem); }
.cfg-term-list a { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 0.4rem 0.5rem; border-radius: 4px; text-decoration: none; color: var(--ink); }
.cfg-term-list a:hover { background: var(--sunk); }
.cfg-term-list a[aria-current='true'] { background: var(--accent-soft); color: var(--accent); }
.cfg-term-list__label { font-weight: 500; }
.cfg-merged ul { padding-left: 1rem; margin: 0.3rem 0 0; font-size: 0.88rem; }
.cfg-candidates { margin: 0.3rem 0 0; padding-left: 1.1rem; }
.cfg-details > summary { cursor: pointer; list-style: none; }
.cfg-details > summary::-webkit-details-marker { display: none; }
.cfg-details > summary h2::before { content: '▸ '; color: var(--muted); }
.cfg-details[open] > summary h2::before { content: '▾ '; }

.cfg-tester { display: flex; flex-direction: column; gap: 0.35rem; margin-top: 0.75rem; padding: 0.75rem; border-radius: var(--radius); background: #fbf8f2; border: 1px solid var(--rule-soft); }
.cfg-tester p { margin: 0; }

.cfg-page-preview { font-family: var(--font-sans); font-size: 1.02rem; }
.cfg-preview-title { font-size: 1.4rem; }

.cfg-matrix th[scope='row'] { min-width: 220px; white-space: normal; font-weight: 500; color: var(--ink); text-transform: none; letter-spacing: 0; font-size: 0.88rem; background: none; }
.cfg-matrix td { text-align: center; font-weight: 600; white-space: nowrap; }
.cfg-matrix__yes { color: var(--good); background: var(--good-soft); }
.cfg-matrix__scope { color: var(--teal); background: var(--teal-soft); }
.cfg-matrix__scope abbr { text-decoration: none; cursor: help; }
.cfg-matrix__no { color: var(--muted); }

.cfg-progress { display: flex; align-items: center; gap: 0.6rem; margin-top: 0.75rem; }
.cfg-progress .progress { flex: 1; }
.cfg-option-grid { display: grid; gap: 0.75rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 800px) { .cfg-option-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cfg-options { border: 0; padding: 0; margin: 0; }
.cfg-options legend { margin-bottom: 0.6rem; padding: 0; }
.cfg-option { position: relative; display: flex; flex-direction: column; gap: 0.4rem; padding: 1rem; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--surface); cursor: pointer; }
.cfg-option input { position: absolute; top: 1rem; right: 1rem; width: 18px; height: 18px; accent-color: var(--accent); }
.cfg-option:has(input:checked) { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.cfg-option:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.cfg-option__title { font-family: var(--font-sans); font-weight: 600; font-size: 1.05rem; padding-right: 1.75rem; }
.cfg-option__text { font-size: 0.88rem; color: var(--ink-2); }
.cfg-option .badge { align-self: flex-start; }
.cfg-compare td, .cfg-compare th { min-width: 160px; }
.cfg-alerts { list-style: none; margin: 0; padding: 0; }
.cfg-alerts li { display: flex; flex-wrap: wrap; gap: 0.5rem 0.75rem; align-items: center; padding: 0.7rem 1rem; border-bottom: 1px solid var(--rule-soft); }
.cfg-alerts li:last-child { border-bottom: 0; }
.cfg-alerts li span:not(.badge) { flex: 1 1 240px; }

.cfg-filter-grid { display: grid; gap: 0 1rem; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.cfg-diff { min-width: 200px; overflow-wrap: anywhere; }
.cfg-diff del { background: var(--danger-soft); color: #7a1f1f; text-decoration: line-through; padding: 0 0.2rem; border-radius: 3px; }
.cfg-diff ins { background: var(--good-soft); color: #1f4d29; text-decoration: none; padding: 0 0.2rem; border-radius: 3px; }

.cfg-later { display: flex; gap: 0.85rem; align-items: flex-start; padding: 1rem 1.15rem; margin-bottom: 1.25rem; border-radius: var(--radius); background: repeating-linear-gradient(135deg, var(--warn-soft), var(--warn-soft) 14px, #f3e4c0 14px, #f3e4c0 28px); border: 1px solid #e3cd96; color: #5f3e00; }
.cfg-later p { margin: 0; }
.cfg-later p.cfg-later__title { font-weight: 700; font-size: 1.05rem; margin-bottom: 0.25rem; }
.cfg-media-table .input--sm, .cfg-media-table .select--sm { min-width: 130px; }
.cfg-steps { min-width: 220px; gap: 0.25rem; }
.cfg-steps li { font-size: 0.8rem; }
.cfg-steps .step-dot { width: 14px; height: 14px; }