@charset "utf-8";
/* ==========================================================================
   KingOfAEO.net — QA layer.
   Loaded last. Contains only guarantees, not decoration:
   inherited-colour guards, table overflow safety, focus visibility,
   long-string containment and small-screen corrections.
   ========================================================================== */

/* ------------------------------------------- 1. Inherited-colour guards */

/* The light ground is declared once and never inherited from an unset root. */
html { color: var(--ink-2); background: var(--paper); }
body { color: var(--ink-2); background: var(--paper); }
main, article, section, aside { background-color: transparent; }

/* Inverted regions restate every foreground they own, so no nested element can
   fall back to the light-ground ink ramp and disappear. */
.pubhero :is(h1, h2, h3, p, li, span, strong, em, b, time, code) { color: inherit; }
.pubhero :is(h1, h2, h3) { color: #fff; }
.statstrip :is(p, span, strong) { color: inherit; }
.sitefoot :is(p, li, span, time, b) { color: inherit; }
.studio-footer :is(p, span, div) { color: inherit; }
.statusbar :is(span, time) { color: inherit; }
.studio-topline :is(span, time) { color: inherit; }
.sitefoot :is(h1, h2, h3), .studio-footer :is(h1, h2, h3) { color: #F0A9CB; }
.sitefoot strong, .studio-footer strong { color: #fff; }
.sitefoot .hl { color: #FFB8D8; }

/* Chips keep their own foreground inside inverted regions. */
.sitefoot .chip, .pubhero .chip { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.34); color: #fff; }

/* ---------------------------------------------------- 2. Table safety net */

.qc-table-scroll, .tablewrap, .table-wrap {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
.qc-table-scroll > table { margin: 0; }
.qc-table-scroll th, .qc-table-scroll td { word-break: normal; overflow-wrap: break-word; hyphens: none; }
.qc-table-scroll th:first-child, .qc-table-scroll td:first-child { padding-left: var(--s-6); }
.qc-table-scroll th:last-child, .qc-table-scroll td:last-child { padding-right: var(--s-6); }
.panel__bd--flush .qc-table-scroll th:first-child,
.panel__bd--flush .qc-table-scroll td:first-child { padding-left: var(--s-6); }
@media (max-width: 560px) {
  .qc-table-scroll th:first-child, .qc-table-scroll td:first-child { padding-left: var(--s-4); }
  .qc-table-scroll th:last-child, .qc-table-scroll td:last-child { padding-right: var(--s-4); }
}
/* a scrollable table announces itself */
.qc-table-scroll { scrollbar-color: var(--rule-3) var(--paper-2); scrollbar-width: thin; }
.qc-table-scroll::-webkit-scrollbar { height: 9px; }
.qc-table-scroll::-webkit-scrollbar-track { background: var(--paper-2); }
.qc-table-scroll::-webkit-scrollbar-thumb { background: var(--rule-3); border-radius: 9px; }

/* ------------------------------------------------------ 3. Focus + links */

:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }
.pubhero :focus-visible, .statstrip :focus-visible,
.sitefoot :focus-visible, .studio-footer :focus-visible,
.statusbar :focus-visible, .studio-topline :focus-visible {
  outline-color: #fff;
}
a[href^="http"]:not([href*="kingofaeo.net"]) { overflow-wrap: anywhere; }

/* ------------------------------------------- 4. Long-string containment */

code, samp, kbd, .mono, .stage2-code, .studio-tool__result,
.schema__k, .entity-equation, .file__d, .sitemaplist .u, .netlist a, .aeo-network-links a {
  overflow-wrap: anywhere;
  word-break: break-word;
}
h1, h2, h3, .rrow__t, .pubhero h1 { overflow-wrap: break-word; }

/* Inside a table, `anywhere` collapses the column to a single character and
   snaps identifiers in half. Tables scroll instead; identifiers stay whole. */
td code, th code, td .mono, th .mono, td samp {
  overflow-wrap: break-word;
  word-break: normal;
}
th:has(> code), td:has(> code) { white-space: nowrap; }
@supports not selector(:has(*)) {
  td code, th code { white-space: nowrap; }
}

/* ------------------------------------------------- 5. Form field contrast */

input, textarea, select, button {
  font-family: inherit;
  font-size: var(--fs-sm);
  color: var(--ink);
  background: var(--paper);
}
input::placeholder, textarea::placeholder { color: var(--ink-4); opacity: 1; }
label { color: var(--ink-3); }
button { cursor: pointer; }

/* -------------------------------------------------- 6. Small-screen fixes */

@media (max-width: 430px) {
  :root { --s-6: 22px; --s-7: 32px; --s-8: 46px; --s-9: 62px; }
  .pubhero h1 { font-size: clamp(2rem, 10vw, 2.8rem); }
  .answerplate__a { font-size: clamp(1.7rem, 9vw, 2.2rem); }
  .statstrip__v { font-size: 1.5rem; }
  .gauge__val { font-size: 52px; }
  .commentset { grid-template-columns: 1fr; }
}
@media (max-width: 360px) {
  .statstrip__in { grid-template-columns: 1fr; }
  .statstrip__cell,
  .statstrip__cell:nth-child(3n+1),
  .statstrip__cell:nth-child(2n+1) { border-left: 0; padding-left: 0; }
  .statstrip__cell:nth-child(n+2) { border-top: 1px solid rgba(255,255,255,.22); }
  .btnrow .btn { width: 100%; justify-content: center; }
}

/* ------------------------------------------------------------- 7. Motion */

@media (prefers-reduced-motion: reduce) {
  .studio-progress { display: none; }
}

/* ------------------------------------------------- 8. Non-decorative rule */

/* Empty containers must not reserve space or mask content. */
.panel__bd:empty, .panel__ft:empty, .card:empty, .rrow:empty { display: none; }
