/* ============================================================================================
   llos-sitecheck.css — [2026-09-21] the page-family fixes from the 200-page site check
   (admin/viewer, iPhone 14 + Full HD). Injected by the shell AFTER llos-mobile.css on every
   page it dresses (bootstrap.php for PHP, shell-inject.js / shell.js for static .html), so it
   is the last sheet in the cascade and reaches every sibling of every page the check sampled,
   not just the 200. Each block is fenced by body:has(<a class only that family has>) so a rule
   for kinetica's `dt` cannot reach a glossary somewhere else; the generic names are inside
   those fences on purpose. Each rule answers a measured finding; the page it was measured on
   is named. Deleting the injection line in bootstrap.php / shell-inject.js / shell.js is the
   full revert.

   THE THREE PATTERNS, seen on 186 / 184 / 185 of 200 pages:
   1. #ea7a27 as ink. The brand orange reads 2.87:1 on white, 2.8:1 on --bg, 2.55:1 on --mist.
      --llos-orange-ink is the deep orange that clears 4.5:1 on every light ground the site
      uses (white 5.4, cream 5.0, mist 4.8). Bright orange stays for fills, rules, dots, shapes.
   2. White text on #ea7a27 (2.87:1) — the primary buttons. Same deep orange as the ground.
   3. Labels at 9–11px. 12px is the floor this review uses. A fixed 12px is only ever applied
      to a class the probe measured UNDER 12px, never as a blanket.
   ============================================================================================ */
:root { --llos-orange-ink: #a8520f; --llos-orange-ink-hover: #8f4409; }

/* ── shared: buttons the check named as white-on-orange, on any page ──────────────────────── */
.btn-primary, a.btn-primary, .cta-btn, .cta-primary, .btn.btn-go, a.btn-go, .qbtn.primary, .step-btn,
.wq-btn.check, .wq-lvl.active, .qz-next, a.cta, .quizbtn, .try-chip.solid, .btn-speech, .swm-btn,
.story-btn, .chapter-nav-home, .explore-btn, .modal-btn.primary, .chapter-home-cta, .playfab, .intro-next,
.age-orbit-btn, .disc-login, .mobile-expand, #aiPassBtn, #qzStart, #pledge-btn,
/* [2026-09-22] `.copy` was here bare. It was meant for the copy-to-clipboard BUTTON, but
   `.copy` is also the name every hero on the site gives its text column (design/index.php,
   the theory_vs_practice set, writer.*), so this rule painted whole hero columns solid
   #a8520f with white text -- see /design/, where the h1's gold span went orange-on-orange.
   Only the element kinds that are actually a copy button are matched now. */
button.copy, a.copy, .copy-btn {
  background-color: var(--llos-orange-ink) !important;
  border-color: var(--llos-orange-ink) !important;
  color: #fff !important;
}
.btn-primary:hover, .cta-btn:hover, .cta-primary:hover, .btn-go:hover, .story-btn:hover, .chapter-nav-home:hover, .playfab:hover {
  background-color: var(--llos-orange-ink-hover) !important;
}
/* light "outline" buttons and text links that typed their label in orange */
.try-chip:not(.solid), .voice-btn, .asset-link, .fw-go, .calc-link, .tap, .tap-say, .lw-lesson, .bucket-cta {
  color: var(--llos-orange-ink) !important;
}
.try-chip:not(.solid), .voice-btn { border-color: var(--llos-orange-ink) !important; }
/* eyebrows / kickers / badges set in orange: names that are unambiguous site-wide */
.eyebrow-chip, .panel-eyebrow, .fw-eyebrow, .sf-eyebrow, .wp-eye, .intro-kicker, .card-label, .slide-tag,
.quote-title, .quote-author, .why-matters, #pledge-counter, .stage-age, .hero-badge, .roadmap-step,
.calc-pill.output, .nav-item-label, .practice-board-tag.cbse, .age-range, .wq-tag, .wq-chip, .pop-k, .cc-k,
.lw-kick, .h2h-badge, .feat6-cap, .tv-sec-btn, .ht-lab, .mini-chip, .entry-chapter-kicker, .chapter-home-cta-sub {
  color: var(--llos-orange-ink);
}
/* the 12px floor: only classes the probe measured under 12px, all family-specific names */
.stage-age, .benefit-label, .benefit-desc, .tap-hint, .tap-fact, .asset-badge, .intent-label, .wq-prog-num,
.wq-tag, .wq-chip, .wp-eye, .pop-k, .cc-k, .qz-prog, .feat6-cap, .rate-word, .lw-kick, .ct-b, .h2h-badge,
.hero-badge, .input-section-title, .result-hero-label, .result-row-label, .optional-tag, .mobile-label,
.card-label, .nav-item-label, .practice-board-tag, .intro-feature-text, .number-word, .number-hindi,
.demo-cap, .pmeta, .qtypebadge, .intro-kicker, .mode-hint, .ih-sub, .ht-lab, .mini-chip,
.entry-chapter-kicker, .chapter-home-cta-sub, .band-ages, .band-journey-cta-sub, .faq-brand-line,
.toc-brand-line, .settings-section-label, .settings-row-hint, .category-badge, .card-number,
.slide-tag, .quote-title, .quote-author, .why-matters, .hero-meta-item, .sidebar-logo, .nav-group-title,
.tts-btn, .tap-say {
  font-size: 12px !important;
}
/* greys typed as running text (student/writer hubs, grammar academy, physics articles) */
.tap-hint, .band-ages, .faq-sub, .wq-howto, .settings-row-hint, .step-label { color: #6b6560 !important; }
.status.live, .cat-live.live, .calc-badge.badge-eligibility, .quiz-score { color: #15803d !important; }
/* tap targets under 24px: padding grows the hit box, the negative margin gives the space back */
.asset-link, .lw-lesson, .guide-link, .ribbon-link, .bucket-cta, .fw-go, .calc-link {
  display: inline-block; padding-block: 6px; margin-block: -6px;
}

/* ── kinetica (games/design/physics): learn pages carry .playfab, labs carry .intro-kicker ── */
body:has(.playfab) dt, body:has(.playfab) .mh, body:has(.playfab) .ml, body:has(.playfab) .badge,
body:has(.playfab) .chip, body:has(.playfab) .copyr, body:has(.playfab) .qtypebadge,
body:has(.intro-kicker) .kicker, body:has(.intro-kicker) .howto, body:has(.intro-kicker) .hint,
body:has(.intro-kicker) .k, body:has(.intro-kicker) .legend, body:has(.intro-kicker) .mode-hint,
body:has(.intro-kicker) .ih-sub { font-size: 12px !important; }
body:has(.intro-kicker) .kicker, body:has(.intro-kicker) .v.amber, body:has(.intro-kicker) b.amber,
body:has(.playfab) .kicker { color: var(--llos-orange-ink) !important; }
body:has(.intro-kicker) input[type=range] { min-height: 24px; }

/* ── career/prompt_studio (Work Atlas): careers carry .quizbtn, tool pages carry .try-chip ── */
body:has(.quizbtn) .hero small, body:has(.quizbtn) .hero span, body:has(.quizbtn) .stat span, body:has(.quizbtn) .tool b, body:has(.quizbtn) .chip, body:has(.quizbtn) .dk, body:has(.quizbtn) .copyr, body:has(.quizbtn) .copyr a,
body:has(.try-chip) .lb, body:has(.try-chip) .copyr, body:has(.try-chip) h4.help-h { font-size: 12px !important; }
body:has(.quizbtn) .dk, body:has(.try-chip) .lb, body:has(.try-chip) .eyebrow,
body:has(.try-chip) b, body:has(.try-chip) label, body:has(.try-chip) .help a { color: var(--llos-orange-ink) !important; }
body:has(.quizbtn) .crumb a, body:has(.quizbtn) header nav a, body:has(.quizbtn) .topline a, body:has(.quizbtn) .copyr a, body:has(.try-chip) .help a, body:has(.quizbtn) nav.crumb a, body:has(.try-chip) nav.crumb a,
body:has(.quizbtn) .crumb a, body:has(.try-chip) .crumb a { display: inline-block; padding-block: 6px; margin-block: -6px; }

/* ── subjects/physics: chapter pages carry .btn-speech, articles carry .swm-btn ───────────── */
body:has(.btn-speech) h4, body:has(.btn-speech) h5, body:has(.btn-speech) .formula, body:has(.btn-speech) .tooltip,
body:has(.btn-speech) .board-tag a, body:has(.btn-speech) a.board { color: var(--llos-orange-ink); }
body:has(.btn-speech) .nav-btn:disabled, body:has(.btn-speech) .nav-btn.disabled { color: #6b6560 !important; background: #ece8e1 !important; }
#mainNextBtn, #advNextBtn, #mainPrevBtn:not(:disabled), #advPrevBtn:not(:disabled), body:has(.btn-speech) .footer-search button { background: var(--llos-orange-ink) !important; border-color: var(--llos-orange-ink) !important; color: #fff !important; }
body:has(.btn-speech) .footer-copy { color: #b5aea6 !important; }
body:has(.btn-speech) .footer-links a, body:has(.btn-speech) footer a { display: inline-block; padding-block: 6px; margin-block: -6px; }
body:has(.btn-speech) .breadcrumbs a { color: var(--llos-orange-ink) !important; }
body:has(.btn-speech) .footer-search button { background: var(--llos-orange-ink) !important; color: #fff !important; }
body:has(.btn-speech) input[type=radio], body:has(.btn-speech) input[type=checkbox] { min-width: 24px; min-height: 24px; }
body:has(.swm-btn) .stat, body:has(.swm-btn) .dlegend, body:has(.swm-btn) .mline, body:has(.swm-btn) .swm-think,
body:has(.swm-btn) label, body:has(.swm-btn) td, body:has(.swm-btn) li, body:has(.swm-btn) p { color: #6b6560; }
body:has(.swm-btn) .k, body:has(.swm-btn) .v { background: var(--llos-orange-ink) !important; }
body:has(.swm-btn) .tts-btn, body:has(.swm-btn) .copyr, body:has(.swm-btn) .copyr b { font-size: 12px !important; }
body:has(.swm-btn) .playfab-x { min-width: 44px; }

/* ── junior_maths class-1 (.chapter-nav-home) ─────────────────────────────────────────────── */
body:has(.chapter-nav-home) .btn.btn-primary, body:has(.chapter-nav-home) button.btn-primary { background: var(--llos-orange-ink) !important; }
body:has(.chapter-nav-home) .board-tab, body:has(.chapter-nav-home) .curriculum-badge { font-weight: 700; }
body:has(.chapter-nav-home) .board-tab.cbse, body:has(.chapter-nav-home) .practice-board-tag.cbse { color: #1d4ed8 !important; }
body:has(.chapter-nav-home) .board-tab.cambridge { color: #047857 !important; }
body:has(.chapter-nav-home) .board-tab.icse { color: #6d28d9 !important; }
body:has(.chapter-nav-home) .curriculum-badge.cbse { background: #1d4ed8 !important; }
/* inline styles on the page: the blue "Next Problem" button (#3B82F6, 3.7:1) and the page's own --primary-dark / --light inks */
body:has(.chapter-nav-home) button[onclick="newPracticeProblem()"] { background: #1d4ed8 !important; }
html:root:has(.chapter-nav-home) { --primary-dark: #9a4a0c; --light: #a8520f; }
body:has(.chapter-nav-home) .crumb a, body:has(.chapter-nav-home) .breadcrumb a, body:has(.chapter-nav-home) nav[aria-label="Breadcrumb"] a { display: inline-block; padding-block: 6px; margin-block: -6px; font-size: 12px; }

/* ── the hand-drawn .llos-crumb trail (junior_maths chapters and their relatives): .72rem, 13px-tall links */
.llos-crumb { font-size: 12px !important; }
.llos-crumb a { display: inline-block; padding-block: 8px; margin-block: -8px; }

/* ── thinking-lab cards (.card-number) ────────────────────────────────────────────────────── */
body:has(.card-number) .card-number { color: #6b6560 !important; }
body:has(.card-number) .category-badge { color: #6d28d9 !important; }
body:has(.card-number) .prompt-label.tts-inline, body:has(.card-number) .learn-more a, body:has(.card-number) a.learn-more, body:has(.card-number) .card-footer a, body:has(.card-number) .lab-link a, body:has(.card-number) a[href*="thinking-lab"]:not(.btn) { color: #6d28d9 !important; }

/* ── grammar academy chapters (.entry-chapter-kicker) ────────────────────────────────────── */
body:has(.entry-chapter-kicker) .guide-link { display: inline-flex; align-items: center; min-height: 44px; }
body:has(.entry-chapter-kicker) .step-of, body:has(.entry-chapter-kicker) .band-step { color: #6b6560 !important; font-size: 12px !important; }
body:has(.entry-chapter-kicker) .chapter-home-cta-sub { color: #fff !important; }

/* ── designer hub (.lw-dot) ───────────────────────────────────────────────────────────────── */
body:has(.lw-dot) .lw-dot { min-width: 24px; min-height: 24px; }
body:has(.lw-dot) .sotd .k, body:has(.lw-dot) #sotdK, body:has(.lw-dot) .cnt, body:has(.lw-dot) .pn, body:has(.lw-dot) figcaption { font-size: 12px !important; }
body:has(.lw-dot) .status.live { color: #15803d !important; }

/* ── student / writer hubs: every accent keys on the page's own --ch (#ea7a27) — the hero em,
   "Pick your stage.", the selected stage's age, the tap-say buttons. html:root outranks the page's :root. */
html:root:has(.stage-age) { --ch: var(--llos-orange-ink); }
body:has(.stage-age) .stage-age { font-size: 12px !important; }
body:has(.fw-eyebrow) .qz-prog, body:has(.qz-prog) .qz-prog { color: #6b6560 !important; }

/* ── teacher / professional hubs (.pn kicker) ─────────────────────────────────────────────── */
body:has(.status.live) .pn { font-size: 12px !important; }

/* ── home (.fw-eyebrow) ───────────────────────────────────────────────────────────────────── */
/* only the slate greys that sit on WHITE — the dark portal cards use text-slate-400 on #0f172a, where it is right */
body:has(.fw-eyebrow) .font-bold.text-slate-400, body:has(.fw-eyebrow) .font-bold.text-xs:not(.text-white), body:has(.fw-eyebrow) p.text-sm.text-slate-500 { color: #6b6560 !important; }
body:has(.fw-eyebrow) .audience-pill { color: #475569 !important; }
body:has(.fw-eyebrow) .fw-ipa { color: #6b6560 !important; }

/* ── the Words hub (/words/): every accent keys on its own --w-primary; 15 elements per view failed ── */
html:root:has(.w-hour-cta) { --w-primary: var(--llos-orange-ink); }
body:has(.w-hour-cta) summary { display: block; padding-block: 8px; }

/* ── grammar academy: the "STEP 1 OF 2" kicker is #a3a3a3 at 11px ── */
body:has(.entry-chapter-kicker) .band-step, body:has(.entry-chapter-kicker) .step-kicker, body:has(.entry-chapter-kicker) [class*="step-of"] { color: #6b6560 !important; font-size: 12px !important; }
