/* LumensOS Tester on the website: the third plan card and the WCAG coverage page. Loaded after site.css; no inline styles (CSP style-src 'self'). */
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* pricing: Free · Pro · Tester */
.plans.three { max-width: 1100px; grid-template-columns: repeat(3, 1fr); }
.plan-tester { border: 1.5px solid color-mix(in srgb, #86bdff 55%, var(--line)); background: linear-gradient(155deg, var(--surface), color-mix(in srgb, #86bdff 9%, var(--surface))); }
.plan-tester .plan-overline { color: #a9d0ff; }
.plan-tester .price-note { color: var(--ink-soft); }
.plan-tester li::before { background: #1f3350; color: #a9d0ff; }
.plan-tester .more { margin: 0 0 18px; font-size: 12px; }
@media (max-width: 960px) { .plans.three { grid-template-columns: 1fr; max-width: 430px; } }

/* the WCAG coverage page */
.wcag { padding-block: 40px 56px; }
.wcag h1 { max-width: 18ch; margin: 10px 0 14px; font-size: clamp(34px, 5vw, 54px); letter-spacing: -.04em; line-height: 1.05; }
.wcag .lead { max-width: 68ch; color: var(--ink-soft); font-size: 17px; }
.wcag-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 30px 0 22px; }
.wcag-facts .fact { display: flex; flex-direction: column; gap: 6px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.wcag-facts b { font-size: 30px; line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.wcag-facts span { color: var(--ink-soft); font-size: 13px; line-height: 1.45; }
.wcag-honest { max-width: 74ch; margin: 0 0 26px; padding: 18px 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-soft); }
.wcag-honest h2 { margin: 0 0 8px; font-size: 18px; }
.wcag-honest ul { margin: 0; padding-left: 20px; display: grid; gap: 7px; color: var(--ink-soft); font-size: 14px; }
.wcag-honest b { color: var(--ink); }
.wcag-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin: 0 0 22px; }
.wcag-filter .chips { display: flex; flex-wrap: wrap; gap: 6px; }
.wcag-filter .chip { min-height: 36px; padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--ink-soft); font: 650 13px var(--font); cursor: pointer; }
.wcag-filter .chip:hover { color: var(--ink); border-color: #51594d; }
.wcag-filter .chip[aria-pressed="true"] { background: var(--brand-wash); border-color: var(--brand); color: var(--brand-strong); }
.wcag-filter .count { margin: 0; color: var(--ink-faint); font-size: 13px; }
.wcag-group { margin: 0 0 34px; }
.wcag-group h2 { margin: 0 0 12px; font-size: 24px; letter-spacing: -.02em; }
.wcag-group table { width: 100%; border-collapse: collapse; font-size: 14px; }
.wcag-group th, .wcag-group td { padding: 12px 12px 12px 0; border-top: 1px solid var(--line); text-align: left; vertical-align: top; }
.wcag-group thead th { padding-block: 8px; border-top: 0; color: var(--ink-faint); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.wcag-group tbody th { width: 30%; font-weight: 600; }
.wcag-group tbody th a { color: var(--ink); text-decoration-color: var(--ink-faint); }
.wcag-group tbody th a:hover { color: var(--brand-strong); }
.wcag-group .sc { margin-right: 6px; font: 650 13px ui-monospace, "SF Mono", Menlo, monospace; color: var(--ink-soft); }
.wcag-group .lvl { display: inline-block; padding: 1px 8px; border: 1px solid var(--line); border-radius: 6px; color: var(--ink-soft); font-size: 12px; font-weight: 700; }
.wcag-group .new { display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: 6px; background: var(--brand-wash); color: var(--brand-strong); font-size: 11px; font-weight: 700; }
.wcag-group .support small { display: block; margin-top: 3px; color: var(--ink-faint); font-size: 12px; line-height: 1.45; }
.wcag-group .support .sup { font-weight: 650; }
.wcag-group .support.auto .sup { color: var(--brand-strong); }
.wcag-group .support.narrow .sup { color: var(--warning); }
.wcag-group .support.manual .sup { color: var(--ink-soft); }
.wcag-group .support i { font-style: normal; margin-right: 4px; }
.wcag-group .support code { padding: 0 4px; border-radius: 4px; background: var(--surface-soft); font-size: 11.5px; }
.wcag-group .how { color: var(--ink-soft); max-width: 52ch; }
.wcag-group tr[hidden] { display: none; }
.wcag-cta { max-width: 74ch; margin-top: 12px; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.wcag-cta h2 { margin: 0 0 8px; font-size: 22px; }
.wcag-cta p { color: var(--ink-soft); }
.wcag-cta .fine { margin: 14px 0 0; color: var(--ink-faint); font-size: 12px; }
@media (max-width: 900px) {
  .wcag-facts { grid-template-columns: 1fr 1fr; }
  .wcag-group thead { display: none; }
  .wcag-group table, .wcag-group tbody, .wcag-group tr, .wcag-group th, .wcag-group td { display: block; width: 100% !important; }
  .wcag-group tr { padding: 14px 0; border-top: 1px solid var(--line); }
  .wcag-group th, .wcag-group td { padding: 2px 0; border: 0; }
}
@media (forced-colors: active) { .wcag-filter .chip[aria-pressed="true"] { outline: 2px solid Highlight; } }