/* "The agent's draft, checked" (scripts/site/interactives/agent-check.ts). Custom properties only.
   Dye meanings: teal = passes, saffron = warning, madder = error, indigo = action or link. */
.ix-ac, .ix-ac-figure {
  --ix-ok: var(--teal-ink); --ix-wait: var(--saffron-ink); --ix-broken: var(--madder-ink); --ix-action: var(--indigo-ink);
  --ix-ink: var(--ink); --ix-ink-2: var(--ink-2); --ix-line: var(--line); --ix-surface: var(--surface); --ix-ground: var(--cotton);
  color: var(--ix-ink); background: var(--ix-surface); border: 1px solid var(--ix-line); padding: clamp(var(--space-6), 3vw, var(--space-8)); margin: var(--space-8) 0;
}
.ix-ac-label { display: inline-block; margin: 0 0 var(--space-5); font: var(--type-label); color: var(--ix-ink-2); border: 1px solid var(--ix-line); padding: var(--space-2) var(--space-4); }
.ix-ac-tabs { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-bottom: var(--space-6); }
.ix-ac-tabs button { min-height: 44px; padding: 0 var(--space-6); border: 2px solid var(--ix-line); background: transparent; color: var(--ix-ink); font: var(--type-small-strong); cursor: pointer; }
.ix-ac-tabs button[aria-selected="true"] { border-color: var(--ix-action); color: var(--ix-action); }
.ix-ac :focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.ix-ac-case { margin-bottom: var(--space-7); }
.ix-ac-case[hidden] { display: none; }
.ix-ac-case h3 { font: var(--type-strong); margin: 0 0 var(--space-2); }
.ix-ac-count { margin: 0 0 var(--space-5); color: var(--ix-ink-2); }
.ix-ac-grid { display: grid; gap: var(--space-6) var(--space-8); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1000px) { .ix-ac-grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); } }
.ix-ac-file { margin: 0 0 var(--space-3); font-size: var(--fs-small); color: var(--ix-ink-2); }
.ix-ac-file code { font: var(--type-label); }
.ix-ac .ix-ac-code { margin: 0; padding: var(--space-5) 0; overflow-x: auto; max-width: 100%; background: var(--ix-ground); border: 1px solid var(--ix-line); font: var(--type-label); }
.ix-ac .ix-ac-code code { color: var(--ix-ink); background: none; padding: 0; font: inherit; }
.ix-ac-line { display: block; padding: 0 var(--space-5) 0 0; white-space: pre; border-left: 4px solid transparent; }
.ix-ac-line.is-marked { border-left-color: var(--ix-wait); }
.ix-ac-line.is-active { border-left-color: var(--ix-broken); background: var(--surface-2); }
.ix-ac-line:focus { outline: none; }
.ix-ac-ln { display: inline-block; width: 3.2em; padding-right: var(--space-5); text-align: right; color: var(--ix-ink-2); user-select: none; }
.ix-ac-head { font-weight: 700; margin: 0 0 var(--space-3); }
.ix-ac-findings ol { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-4); }
.ix-ac-findings li { border-left: 4px solid var(--ix-tone, var(--ix-line)); padding-left: var(--space-5); }
.ix-ac-error { --ix-tone: var(--ix-broken); }
.ix-ac-warning { --ix-tone: var(--ix-wait); }
.ix-ac-info { --ix-tone: var(--ix-ok); }
.ix-ac-findings button { display: grid; gap: var(--space-1); width: 100%; min-height: 44px; text-align: start; background: none; border: 0; padding: var(--space-2) 0; color: var(--ix-ink); font: inherit; cursor: pointer; }
.ix-ac-findings button[aria-pressed="true"] .ix-ac-msg { text-decoration: underline; }
.ix-ac-sev { font: var(--type-label); color: var(--ix-tone); text-transform: none; }
.ix-ac-at { font: var(--type-label); color: var(--ix-ink-2); }
.ix-ac-msg { font-size: var(--fs-small); }
.ix-ac-fix { margin: var(--space-1) 0 0; font-size: var(--fs-small); color: var(--ix-ink-2); overflow-wrap: anywhere; }
.ix-ac-after { margin-top: var(--space-5); }
.ix-ac-after summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 700; color: var(--ix-ok); }
.ix-ac-caption, .ix-ac-figure figcaption { font-size: var(--fs-small); color: var(--ix-ink-2); margin: var(--space-4) 0 0; max-width: 90ch; }
.ix-ac-figure ul { list-style: none; margin: var(--space-4) 0; padding: 0; display: grid; gap: var(--space-3); }
.ix-ac-figure li { border-left: 4px solid var(--ix-tone); padding-left: var(--space-5); font-size: var(--fs-small); }
.ix-ac-fig-task { margin: 0; }
.ix-ac-fig-task code { font: var(--type-label); }
.ix-ac-fig-after { margin: var(--space-4) 0 0; font-weight: 700; color: var(--ix-ok); }
.ix-ac-figure a { color: var(--ix-action); }
