/* Mobile remediation 2026-10-25
   Fixes verified by a full-site scan (210 pages x 320-430px):
   1) home: .kv-fit created two implicit grid columns after the 980px collapse
   2) quiz: the third self-check row alone rendered as 3 columns
   3) method: 2-column process cards squeezed to 155px on phones
   4) article brief labels wrapped because the label column was 72px
   5) auxiliary labels below the 12px readability floor
   6) single-character last lines in headings
   Selectors are boosted because the existing stylesheets carry many
   !important declarations and later-loaded theme files. */

@media (max-width: 980px) {
  /* 1. preview-v3.css still pins the two footnotes to grid columns 1 and 2
     after kevin-ui-v1 collapses .kv-fit to one column. */
  html body.kv-home-bplus .kv-fit {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html body.kv-home-bplus .kv-fit > * {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 760px) {
  /* Applied-proof marker for the acceptance scan; no page uses this name. */
  :root { --halo-mobile-patch: 20261025; }

  /* 2. kevin-ui-v1's `> div:last-child` rule outranks the 2-column rule only
     for the last self-check row, producing 28px 84px 1fr there. */
  html body .quiz-self-check > div,
  html body .quiz-self-check > div[class]:last-child {
    grid-template-columns: 44px minmax(0, 1fr) !important;
    column-gap: 14px !important;
  }
  html body .quiz-self-check .kv-data[class] {
    font-size: 13px !important;
  }

  /* 3. Two 155px cards with 22px headings are unreadable on phones. */
  html body.kv-tool-page .kt-process-grid[class] {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
  }

  /* 4. The label column was 72px, so longer labels wrapped to two lines. */
  html body.kv-article.kv-editorial-v1 .kv-editorial-reading .article-brief .article-brief-grid > p {
    grid-template-columns: max-content minmax(0, 1fr) !important;
  }

  /* 5a. Auxiliary labels at 11-11.5px. Font size only (their line-height is
     already comfortable). */
  html body.dev-page .dev-kicker[class],
  html body[data-reading-template="diagnosis"] .hero .eyebrow,
  html body[data-reading-template="diagnosis"] .hero-copy .eyebrow {
    font-size: 13px !important;
  }

  /* 5b. Same labels where line-height:1 also clipped descenders. */
  html body.kv-articles .learn-kicker[class],
  html body.kv-tool-page .kt-eyebrow[class],
  html body.kv-report .hero .eyebrow,
  html body.kv-quiz #intro .eyebrow,
  html body:is(.kv-question-v1, .kv-question-index-v1) .hero .eyebrow {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }
  html body.kv-question-index-v1 .kv-question-group__head > span,
  html body.kv-question-index-v1 .kv-ai-faq__head > span {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }

  /* 6. Avoid a single character stranded on the last line. */
  html body h1,
  html body h2,
  html body h3 {
    text-wrap: pretty !important;
  }

  /* 7. The internal admin page still had 9-10px labels. */
  html body.kv-fuye-admin .brand {
    font-size: 12px !important;
  }
  html body.kv-fuye-admin [data-kevin-icp] a {
    font-size: 12px !important;
  }
}