/* 5500RADAR — the audit screen's shared controls.
 *
 * Loaded by BOTH the home page (dark filing-chamber card, styled by
 * cinematic.css) and /do-i-need-an-audit/ (the dedicated instrument treatment
 * below). It
 * therefore styles only the elements those two stylesheets do not already own:
 * the plan-type fieldset, the waiver radio groups, the elective-result list and
 * the follow-on call to action.
 *
 * Shared controls derive from `currentColor`; the page-scoped instrument layer
 * then supplies the exact dark-surface tokens for the dedicated guide.
 *
 * Nothing here is set below 13px. The rest of the site has 57 declarations
 * under 11px and 64 strings that fail AA; this component does not add to them.
 */

/* Declared on .audit-cta as well as .audit-checker: the standalone page reuses
   the CTA block outside the form, where a token scoped to .audit-checker would
   be undefined — which silently dropped the button's background and left white
   text on white. */
.audit-checker,
.audit-cta {
  --audit-line: color-mix(in srgb, currentColor 22%, transparent);
  --audit-line-strong: color-mix(in srgb, currentColor 42%, transparent);
  --audit-quiet: color-mix(in srgb, currentColor 78%, transparent);
  --audit-accent: #0E7E9B;
  --audit-accent-ink: #0B6E83;
  --audit-error: #9B2C26;
}

/* Both live calculators are dark professional instruments. Keep the lighter
   error tone local to those surfaces; the base token remains AA-safe on paper. */
.audit-section .audit-checker,
.secondary-body.page-audit-guide .audit-checker {
  --audit-error: #F2A49D;
}

/* Dependent questions ship hidden and disabled, then audit.js progressively
   enables them after the current-year Title I filing scope is confirmed. Keep
   the hidden state authoritative over the page-specific grid declarations. */
.audit-checker [hidden] {
  display: none !important;
}

/* ---- Plan type -------------------------------------------------------- */

.audit-plan-type {
  margin: 0 0 18px;
  padding: 0;
  border: 0;
}

.audit-plan-type legend,
.audit-waiver-heading {
  padding: 0;
  margin-bottom: 10px;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.audit-plan-type div {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.audit-plan-type label {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid var(--audit-line);
  border-radius: 2px;
  cursor: pointer;
  font-size: 14px;
  line-height: 1.4;
}

.audit-plan-type label:hover {
  border-color: var(--audit-line-strong);
}

.audit-plan-type input:checked + span {
  font-weight: 650;
}

.audit-plan-type label:has(input:checked) {
  border-color: var(--audit-accent);
  box-shadow: inset 0 0 0 1px var(--audit-accent);
}

.audit-plan-stage > .audit-field-note {
  grid-column: 1 / -1;
  margin: 0;
}

/* ---- Waiver conditions ------------------------------------------------ */

.audit-waiver-set {
  margin: 0 0 18px;
  padding: 16px;
  border: 1px solid var(--audit-line);
  border-radius: 2px;
}

.audit-waiver-heading {
  margin-top: 0;
}

.audit-waiver-intro {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--audit-quiet);
}

.audit-waiver-question {
  min-width: 0;
  margin: 0;
  padding: 14px 0;
  border: 0;
  border-top: 1px solid var(--audit-line);
}

.audit-waiver-question[data-waiver-key="assets"] {
  border-top: 0;
  padding-top: 0;
}

.audit-waiver-question legend {
  width: 100%;
  margin: 0 0 10px;
  padding: 0;
  color: inherit;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.5;
  text-transform: none;
}

.audit-waiver-question legend b {
  display: block;
  font-size: 14px;
  font-weight: 700;
}

.audit-waiver-question legend span {
  display: block;
  margin-top: 3px;
  color: var(--audit-quiet);
  font-size: 13px;
}

.audit-answer-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.audit-answer-options label {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 9px 10px;
  cursor: pointer;
  font-size: 14px;
  line-height: 1.5;
  border: 1px solid var(--audit-line);
  border-radius: 2px;
}

.audit-answer-options label:hover {
  border-color: var(--audit-line-strong);
}

.audit-answer-options label:has(input:checked) {
  border-color: var(--audit-accent);
  box-shadow: inset 0 0 0 1px var(--audit-accent);
}

.audit-answer-options input,
.audit-plan-type input {
  flex: none;
  margin-top: 2px;
  width: 17px;
  height: 17px;
  accent-color: var(--audit-accent);
}

/* The homepage styles `.audit-checker label > span` as a compact uppercase
   field label. That is right for a one-word field caption and wrong for a
   two-line regulatory condition, so these spans opt out explicitly. Specificity
   (0,3,1) beats the homepage rule; the reset is stated rather than inherited so
   the same markup reads identically on the secondary shell, which has no such
   rule at all. */
.audit-checker .audit-answer-options label > span,
.audit-checker .audit-plan-type label > span {
  color: inherit;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  line-height: 1.5;
}

/* The focus ring the rest of the form suppresses. A 1px wash is not a focus
   indicator; these controls keep a real one. */
.audit-answer-options input:focus-visible,
.audit-plan-type input:focus-visible {
  outline: 3px solid var(--audit-accent);
  outline-offset: 3px;
}

.audit-answer-options label:has(input:focus-visible),
.audit-plan-type label:has(input:focus-visible) {
  border-radius: 2px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--audit-accent) 34%, transparent);
}

.audit-waiver-question[aria-invalid="true"] {
  outline: 2px solid var(--audit-error);
  outline-offset: 4px;
}

.audit-plan-scope[aria-invalid="true"] {
  outline: 2px solid var(--audit-error);
  outline-offset: 4px;
}

/* The label and control stack are siblings. The inline error is a sibling of
   its input/select inside the stack, never a descendant of the label; the
   status region separately retains the complete error summary. */
.audit-checker .audit-field > .audit-control-stack {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: inherit;
  font: inherit;
  letter-spacing: normal;
  text-transform: none;
}

.audit-checker .audit-control-stack > .audit-inline-error,
.audit-checker .audit-plan-scope > .audit-inline-error,
.audit-checker .audit-waiver-question > .audit-inline-error {
  display: block;
  margin: 4px 0 0;
  color: var(--audit-error);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: normal;
  line-height: 1.45;
  text-transform: none;
}

.audit-checker .audit-field input[aria-invalid="true"],
.audit-checker .audit-field select[aria-invalid="true"] {
  border-color: var(--audit-error);
  outline: 2px solid var(--audit-error);
  outline-offset: 1px;
}

.audit-checker.is-error .audit-status {
  color: var(--audit-error);
}

.audit-checker .audit-submit:disabled {
  cursor: not-allowed;
  opacity: .52;
}

/* home.css originally styled a wrapping label's child span. The accessible
   field markup now uses an explicit label sibling without changing its visual
   hierarchy or the paired subgrid alignment. */
.audit-section .audit-field > label {
  align-self: end;
  color: var(--ink);
  font-size: 14px;
  font-weight: 620;
  line-height: 1.4;
}

/* ---- Elective result -------------------------------------------------- */

.audit-result-detail {
  margin: 14px 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--audit-line);
  display: grid;
  gap: 4px;
}

.audit-result-detail[hidden] {
  display: none;
}

.audit-result-detail dt {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.audit-result-detail dd {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--audit-quiet);
}

.audit-result-detail dd:last-child {
  margin-bottom: 0;
}

/* ---- What to do next -------------------------------------------------- */

/* The screen used to end here. A visitor who has just been told an audit is
   required is the highest-intent reader the site gets; the result now offers
   them somewhere to go. */
.audit-cta {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid var(--audit-line-strong);
  border-radius: 2px;
  display: grid;
  gap: 12px;
}

.audit-cta[hidden] {
  display: none;
}

.audit-cta p {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
}

.audit-cta .audit-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.audit-cta a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 650;
  text-decoration: none;
  border: 1px solid transparent;
}

.audit-cta a.is-primary {
  background: var(--audit-accent);
  color: #fff;
}

.audit-cta a.is-primary:hover {
  background: var(--audit-accent-ink);
}

.audit-cta a.is-secondary {
  border-color: var(--audit-line-strong);
  color: inherit;
}

.audit-cta a.is-secondary:hover {
  border-color: currentColor;
}

.audit-cta a:focus-visible {
  outline: 3px solid var(--audit-accent);
  outline-offset: 3px;
}

/* ---- Out-of-scope state ----------------------------------------------- */

/* When the visitor says the plan is not defined contribution, the remaining
   questions stop being meaningful. Remove them from the interaction and
   accessibility trees so the scope result is the only next step offered. */
.audit-checker.is-out-of-scope .audit-plan-stage,
.audit-checker.is-out-of-scope .audit-inputs,
.audit-checker.is-out-of-scope .audit-field,
.audit-checker.is-out-of-scope .audit-fields,
.audit-checker.is-out-of-scope .audit-waiver-set,
.audit-checker.is-out-of-scope .audit-field-note {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .audit-cta,
  .audit-result-detail {
    transition: none;
  }
}

/* ---- The standalone screener shell ------------------------------------ */
/*
 * The header of this file says it styles "only the elements those two
 * stylesheets do not already own". That was true of the home page, where
 * cinematic.css dresses the card, field rows, submit button and result
 * block. It was never true of the interior shell: secondary.css has no
 * .audit-field, .audit-fields, .audit-submit, .audit-status, .audit-result,
 * .audit-plan-stage or .audit-authority rule anywhere in it.
 *
 * So on /do-i-need-an-audit/ -- the page built to rank for the question -- the
 * form originally fell back to browser defaults. The base standalone rules
 * below keep every control complete even before the page-specific chamber layer
 * at the end of this file is applied.
 *
 * Everything below is scoped to .secondary-body, which only the interior shells
 * carry, so the home page cannot be reached by any of it.
 */

.secondary-body .audit-checker {
  display: grid;
  gap: 18px;
  max-width: 720px;
  padding: clamp(22px, 3.4vw, 34px);
  border: 1px solid var(--line, #e4e4e6);
  border-radius: 3px;
  background: var(--canvas-raised, #fff);
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(11, 13, 20, .05));
}

.secondary-body .audit-checker-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 20px;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--audit-line);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.secondary-body .audit-checker-head small {
  color: var(--ink-3, #686c7a);
  font-size: inherit;
  letter-spacing: inherit;
}

/* Plan filing history: the same radio treatment as .audit-plan-type above,
   which this fieldset never received on either page. */
.secondary-body .audit-plan-stage {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.secondary-body .audit-plan-stage legend {
  margin-bottom: 10px;
  padding: 0;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.secondary-body .audit-plan-stage label {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid var(--audit-line);
  border-radius: 2px;
  cursor: pointer;
  font-size: 14px;
  line-height: 1.4;
}

.secondary-body .audit-plan-stage label:hover {
  border-color: var(--audit-line-strong);
}

.secondary-body .audit-plan-stage label:has(input:checked) {
  border-color: var(--audit-accent);
  box-shadow: inset 0 0 0 1px var(--audit-accent);
}

.secondary-body .audit-plan-stage input {
  flex: none;
  margin-top: 2px;
  width: 17px;
  height: 17px;
  accent-color: var(--audit-accent);
}

.secondary-body .audit-plan-stage input:focus-visible {
  outline: 3px solid var(--audit-accent);
  outline-offset: 3px;
}

/* Text fields */
.secondary-body .audit-field {
  display: grid;
  gap: 8px;
  margin: 0;
}

.secondary-body .audit-fields {
  display: grid;
  gap: 18px;
}

.secondary-body .audit-fields[hidden],
.secondary-body .audit-waiver-set[hidden] {
  display: none;
}

.secondary-body .audit-field > label {
  color: var(--accent-ink, #0b6d87);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.06em;
  line-height: 1.35;
  text-transform: uppercase;
}

.secondary-body .audit-field input,
.secondary-body .audit-field select {
  width: 100%;
  min-height: 50px;
  padding: 0 14px;
  /* Not --line-strong: it resolves to #b8cbd3 on this shell, a 1.68:1 edge.
     WCAG 1.4.11 wants 3:1 for the visible boundary of a control. */
  border: 1px solid #7d9192;
  border-radius: 2px;
  background: var(--canvas-raised, #fff);
  color: var(--ink-1, #17191c);
  font: inherit;
  /* 16px is the floor below which iOS Safari zooms the viewport on focus. */
  font-size: 16px;
  transition: border-color .18s, box-shadow .18s;
}

.secondary-body .audit-field select {
  padding-right: 10px;
}

.secondary-body .audit-field input:hover,
.secondary-body .audit-field select:hover {
  border-color: var(--ink-4, #9ca1ae);
}

.secondary-body .audit-field input:focus-visible,
.secondary-body .audit-field select:focus-visible {
  border-color: var(--audit-accent);
  outline: 2px solid transparent;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px var(--brand-ring, rgba(14, 126, 155, .18));
}

.secondary-body .audit-field input[aria-invalid="true"],
.secondary-body .audit-field select[aria-invalid="true"] {
  border-color: #b3261e;
}

.secondary-body .audit-field-note {
  margin: -6px 0 0;
  color: var(--ink-3, #686c7a);
  font-size: 13px;
  line-height: 1.5;
}

/* Submit */
.secondary-body .audit-submit {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 50px;
  padding: 13px 18px;
  border: 1px solid var(--audit-accent);
  border-radius: 2px;
  background: var(--audit-accent);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 15px;
  font-weight: 650;
}

.secondary-body .audit-submit:hover {
  border-color: var(--audit-accent-ink);
  background: var(--audit-accent-ink);
}

.secondary-body .audit-submit:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px var(--brand-ring, rgba(14, 126, 155, .18)), 0 0 0 1px var(--audit-accent);
}

/* Status, result and the standing authority note */
.secondary-body .audit-status {
  margin: 0;
  color: var(--ink-3, #686c7a);
  font-size: 13px;
  line-height: 1.5;
}

.secondary-body .audit-result {
  display: grid;
  gap: 7px;
  padding: 17px 18px;
  border: 1px solid var(--audit-line);
  border-left: 1px solid var(--audit-accent);
  border-radius: 2px;
  background: var(--canvas-sunken, #f7f5f0);
}

/* display:grid above would otherwise defeat the hidden attribute the script
   toggles, and the result block would render empty on first paint. */
.secondary-body .audit-result[hidden] {
  display: none;
}

.secondary-body .audit-result-label {
  color: var(--accent-ink, #0b6d87);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.secondary-body .audit-result strong {
  font-size: 19px;
  font-weight: 650;
  line-height: 1.3;
}

.secondary-body .audit-result p {
  margin: 0;
  color: var(--ink-2, #33363d);
  font-size: 15px;
  line-height: 1.55;
}

.secondary-body .audit-authority,
.secondary-body .audit-noscript {
  margin: 0;
  color: var(--ink-3, #686c7a);
  font-size: 13px;
  line-height: 1.6;
}

.secondary-body .audit-authority summary {
  width: fit-content;
  color: var(--accent-ink, #0b6d87);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.secondary-body .audit-authority > p {
  max-width: 78ch;
  margin: 12px 0 0;
}

@media (max-width: 560px) {
  .secondary-body .audit-checker {
    padding: 20px 16px;
  }

  .secondary-body .audit-submit {
    font-size: 14px;
  }
}

/* ---- Filing Chamber treatment for the dedicated audit guide ------------
   The long-form page is a reading surface; the calculator is the one dark
   professional instrument within it. The two-column core keeps filing history
   beside the count on wide screens without changing DOM or keyboard order. */

.secondary-body.page-audit-guide .audit-checker {
  --audit-line: rgb(244 242 234 / .2);
  --audit-line-strong: rgb(244 242 234 / .44);
  --audit-quiet: rgb(244 242 234 / .72);
  --audit-accent: #32B5D8;
  --audit-accent-ink: #70D7ED;
  width: min(920px, 100%);
  max-width: none;
  margin-inline: auto;
  padding: clamp(28px, 4.5vw, 54px);
  gap: 26px;
  border-color: rgb(13 20 23 / .72);
  border-top-color: #32b5d8;
  border-radius: 2px;
  background: #080d0f;
  color: #f4f2ea;
  color-scheme: dark;
  box-shadow: 0 30px 80px rgb(13 20 23 / .18);
}

.secondary-body.page-audit-guide .audit-checker-head {
  padding-bottom: 18px;
  color: rgb(244 242 234 / .68);
}

.secondary-body.page-audit-guide .audit-checker-head small,
.secondary-body.page-audit-guide .audit-field-note,
.secondary-body.page-audit-guide .audit-status,
.secondary-body.page-audit-guide .audit-authority,
.secondary-body.page-audit-guide .audit-noscript {
  color: rgb(244 242 234 / .66);
}

.secondary-body.page-audit-guide .audit-checker > h2 {
  max-width: 16ch;
  color: #f4f2ea;
  font-size: clamp(34px, 4vw, 50px);
}

.secondary-body.page-audit-guide .audit-intro {
  color: rgb(244 242 234 / .72);
}

.secondary-body.page-audit-guide .audit-core-grid {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 22px;
  align-items: start;
}

.secondary-body.page-audit-guide .audit-count-stack {
  display: grid;
  gap: 12px;
}

.secondary-body.page-audit-guide .audit-plan-type label,
.secondary-body.page-audit-guide .audit-plan-stage label {
  min-height: 56px;
  border-radius: 2px;
  background: rgb(244 242 234 / .025);
}

.secondary-body.page-audit-guide .audit-plan-type label:hover,
.secondary-body.page-audit-guide .audit-plan-stage label:hover {
  background: rgb(244 242 234 / .055);
}

.secondary-body.page-audit-guide .audit-plan-type label:has(input:checked),
.secondary-body.page-audit-guide .audit-plan-stage label:has(input:checked) {
  background: rgb(50 181 216 / .09);
}

.secondary-body.page-audit-guide .audit-plan-type legend,
.secondary-body.page-audit-guide .audit-plan-stage legend,
.secondary-body.page-audit-guide .audit-waiver-heading,
.secondary-body.page-audit-guide .audit-waiver-set legend,
.secondary-body.page-audit-guide .audit-field > label {
  color: rgb(244 242 234 / .72);
}

.secondary-body.page-audit-guide .audit-waiver-heading {
  max-width: none;
  margin: 0 0 8px;
  color: #f4f2ea;
  font-size: 16px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
}

.secondary-body.page-audit-guide .audit-waiver-question legend b {
  color: #f4f2ea;
}

.secondary-body.page-audit-guide .audit-field input,
.secondary-body.page-audit-guide .audit-field select {
  min-height: 54px;
  border-color: rgb(244 242 234 / .38);
  border-radius: 2px;
  background: #11191c;
  color: #f4f2ea;
}

.secondary-body.page-audit-guide .audit-field input::placeholder {
  color: rgb(244 242 234 / .5);
}

.secondary-body.page-audit-guide .audit-field input:hover,
.secondary-body.page-audit-guide .audit-field select:hover {
  border-color: rgb(244 242 234 / .7);
}

.secondary-body.page-audit-guide .audit-field select option {
  background: #11191c;
  color: #f4f2ea;
}

.secondary-body.page-audit-guide .audit-waiver-set {
  padding: 22px;
  border-radius: 2px;
  background: rgb(244 242 234 / .025);
}

.secondary-body.page-audit-guide .audit-answer-options label {
  background: rgb(244 242 234 / .025);
}

.secondary-body.page-audit-guide .audit-answer-options label:hover {
  background: rgb(244 242 234 / .055);
}

.secondary-body.page-audit-guide .audit-answer-options label:has(input:checked) {
  background: rgb(50 181 216 / .09);
}

.secondary-body.page-audit-guide .audit-submit {
  min-height: 54px;
  border-color: #116c88;
  border-radius: 2px;
  background: #116c88;
}

.secondary-body.page-audit-guide .audit-submit:hover {
  border-color: #0f6883;
  background: #0f6883;
}

.secondary-body.page-audit-guide .audit-result {
  padding: 20px;
  border-color: var(--audit-line-strong);
  border-left-color: #32b5d8;
  border-radius: 2px;
  background: #11191c;
}

.secondary-body.page-audit-guide .audit-result-label,
.secondary-body.page-audit-guide .audit-authority a,
.secondary-body.page-audit-guide .audit-noscript a {
  color: #70d7ed;
}

.secondary-body.page-audit-guide .audit-result p,
.secondary-body.page-audit-guide .audit-result-detail dd {
  color: rgb(244 242 234 / .72);
}

.secondary-body.page-audit-guide .audit-result strong,
.secondary-body.page-audit-guide .audit-result-detail dt {
  color: #f4f2ea;
}

/* Once the visible result exists, keep the live-region announcement available
   to assistive technology without repeating the same paragraph on screen. */
.secondary-body.page-audit-guide .audit-checker:has(.audit-result:not([hidden])) .audit-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.secondary-body.page-audit-guide .audit-cta {
  border-radius: 2px;
  background: rgb(244 242 234 / .025);
}

.secondary-body.page-audit-guide .audit-cta a {
  min-height: 44px;
  justify-content: center;
  border-radius: 2px;
}

.secondary-body.page-audit-guide .audit-cta a.is-primary {
  background: #116c88;
}

.secondary-body.page-audit-guide .audit-cta a.is-primary:hover {
  background: #0f6883;
}

/* The chamber's later label and status rules are intentionally specific. Keep
   validation color semantic after those surface rules have resolved. */
.secondary-body.page-audit-guide .audit-checker .audit-inline-error,
.secondary-body.page-audit-guide .audit-checker.is-error .audit-status {
  color: var(--audit-error);
}

.secondary-body.page-audit-guide .audit-checker .audit-field input[aria-invalid="true"],
.secondary-body.page-audit-guide .audit-checker .audit-field select[aria-invalid="true"] {
  border-color: var(--audit-error);
}

@media (max-width: 760px) {
  .secondary-body.page-audit-guide .audit-core-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .secondary-body.page-audit-guide .audit-checker {
    padding: 24px 18px;
  }

  .secondary-body.page-audit-guide .audit-waiver-set {
    padding: 16px;
  }
}