/* ── SELF-HOSTED TYPEFACES (S322, P4/H148) ── */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/inter-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/fonts/inter-latin-800-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/jetbrains-mono-latin-600-normal.woff2') format('woff2');}
/* ── end self-hosted typefaces ── */

:root {
  --bg: #0a0a0f;
  --surface: #12121a;
  --surface2: #1a1a28;
  --accent: #2979ff;
  --accent2: #0a1a3d;
  --green: #00c853;
  --blue: #2979ff;
  --yellow: #ffd600;
  --orange: #ff9100;
  --red: #e94560;
  --text: #e0e0e0;
  --text-dim: #9e9e9e;
  --text-bright: #fff;
  --logo-red: #e94560;
  --logo-white: #ffffff;
  --logo-blue: #2979ff;
  --mono: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --serif: 'Georgia', 'Times New Roman', serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  line-height: 1.7;
  min-height: 100vh;
}

a { color: var(--accent); }

.container { max-width: 1100px; margin: 0 auto; padding: 0 24px; }

/* ── Header ── */
header {
  border-bottom: 1px solid var(--surface2);
  padding: 18px 0;
  position: sticky; top: 0; z-index: 100;
  background: rgba(10,10,15,0.95); backdrop-filter: blur(8px);
}
header .container {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.logo {
  font-size: 1.4rem; font-weight: 700; color: var(--logo-red);
  text-decoration: none; letter-spacing: -0.5px;
}
.logo .secret { color: var(--logo-white); }
.logo .science { color: var(--logo-blue); }
nav { display: flex; flex-wrap: wrap; gap: 4px; }
nav a {
  color: var(--text-dim); text-decoration: none; padding: 4px 12px;
  font-size: 0.85rem; transition: color 0.2s; border-radius: 4px;
}
nav a:hover { color: var(--accent); background: var(--surface); }
nav a.active { color: var(--accent); }

/* ── Hero ── */
.hero {
  padding: 60px 0 40px;
  text-align: center;
}
.hero h1 {
  font-size: 2.4rem; color: var(--text-bright); margin-bottom: 12px;
  font-weight: 800; letter-spacing: -1px;
}
.hero .tagline {
  color: var(--text-dim); font-size: 1.05rem; max-width: 640px; margin: 0 auto 24px;
  line-height: 1.7;
}
.hero .badge {
  display: inline-block; background: var(--accent2); color: var(--accent);
  padding: 4px 14px; border-radius: 20px; font-size: 0.8rem; font-family: var(--mono);
}

/* ── Stats bar ── */
.stats {
  display: flex; justify-content: center; gap: 40px; padding: 20px 0;
  border-top: 1px solid var(--surface2); border-bottom: 1px solid var(--surface2);
  margin-bottom: 40px; flex-wrap: wrap;
}
.stat { text-align: center; }
.stat .num { font-size: 1.8rem; font-weight: 700; color: var(--accent); font-family: var(--mono); }
.stat .label { font-size: 0.7rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 1px; }

/* ── Cards grid ── */
.cards {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px; margin-top: 40px;
}
.card {
  text-decoration: none; display: block; background: var(--surface);
  border: 1px solid var(--surface2); border-radius: 12px; padding: 28px;
  transition: border-color 0.2s, transform 0.2s;
}
.card:hover { border-color: var(--accent); transform: translateY(-2px); }
.card h3 { font-size: 1.2rem; font-weight: 700; color: var(--accent); margin-bottom: 8px; }
.card p { color: var(--text-dim); font-size: 0.88rem; line-height: 1.6; }

/* ── Status badges ── */
.status-badge {
  display: inline-block; padding: 2px 10px; border-radius: 12px;
  font-size: 0.7rem; font-family: var(--mono); font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.badge-CLOSED { background: var(--green); color: #000; }
.badge-PROVED { background: #43a047; color: #000; }
.badge-NUMERICAL { background: var(--blue); color: #fff; }
.badge-PROPOSED { background: var(--yellow); color: #000; }
.badge-CONJECTURE { background: var(--orange); color: #000; }
.badge-OPEN { background: var(--red); color: #fff; }
.badge-PROMPT { background: #444; color: #aaa; }
.badge-DRAFT { background: #333; color: #666; }
.badge-DEPRECATED { background: #333; color: #666; text-decoration: line-through; }
.badge-RETRACTED { background: var(--red); color: #fff; opacity: 0.7; }

/* ── Workflow badges ── */
.wf-badge {
  display: inline-block; padding: 1px 8px; border-radius: 8px;
  font-size: 0.6rem; font-family: var(--mono); letter-spacing: 0.5px;
  border: 1px solid var(--surface2); color: var(--text-dim);
}

/* ── Verification layers (website borders) ── */
.layer-peer-reviewed { border-left: 3px solid gold; }
.layer-coalition-reviewed { border-left: 3px solid var(--green); }
.layer-under-review { border-left: 3px solid var(--blue); }
.layer-draft { border-left: 3px solid #555; }
.layer-prompt { border-left: 3px dashed #444; }
.layer-retracted { border-left: 3px solid var(--red); opacity: 0.6; }

/* ── Group sections ── */
.group { margin-bottom: 36px; }
.group h2 {
  font-size: 1.1rem; color: var(--accent); font-family: var(--mono);
  border-bottom: 1px solid var(--surface2); padding-bottom: 8px; margin-bottom: 16px;
}

/* ── Content sections ── */
.content-section {
  background: var(--surface); border: 1px solid var(--surface2);
  border-radius: 12px; padding: 28px; margin-bottom: 24px;
}
.content-section h2 {
  color: var(--accent); font-family: var(--mono); font-size: 1rem;
  margin-bottom: 16px;
}
.content-section p {
  color: var(--text-dim); font-size: 0.9rem; line-height: 1.8;
  margin-bottom: 12px;
}
.content-section p:last-child { margin-bottom: 0; }

/* ── Disclaimer ── */
.disclaimer {
  font-size: 0.7rem; color: #555; line-height: 1.6;
  border-top: 1px solid var(--surface2); padding-top: 20px; margin-top: 40px;
}

/* ── Entry page ── */
.entry-page { padding: 40px 0; }
.entry-page h1 { font-size: 1.8rem; color: var(--text-bright); margin-bottom: 8px; }
.entry-meta {
  color: var(--text-dim); font-size: 0.85rem; font-family: var(--mono);
  margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--surface2);
}
.entry-section { margin-bottom: 32px; }
.entry-section h2 {
  font-size: 1rem; color: var(--accent); font-family: var(--mono); margin-bottom: 12px;
}
.entry-content {
  background: var(--surface); padding: 20px; border-radius: 8px;
  font-family: var(--serif); font-size: 0.95rem; line-height: 1.8;
  white-space: pre-wrap; word-wrap: break-word;
}

/* ── Filter bar ── */
.filter-bar {
  display: flex; gap: 8px; flex-wrap: wrap; margin: 16px 0;
  padding: 12px 16px; background: var(--surface); border-radius: 8px;
}
.filter-btn {
  padding: 5px 12px; border-radius: 16px; border: 1px solid var(--surface2);
  background: transparent; color: var(--text-dim); cursor: pointer;
  font-size: 0.75rem; font-family: var(--mono); transition: all 0.2s;
}
.filter-btn:hover, .filter-btn.active {
  border-color: var(--accent); color: var(--accent); background: var(--accent2);
}

/* ── Scorecard ── */
.scorecard-row {
  display: grid; grid-template-columns: 80px 1fr 130px 80px 100px;
  gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--surface2);
  align-items: center; font-size: 0.85rem;
}
.scorecard-row:hover { background: var(--surface); }
.scorecard-header {
  display: grid; grid-template-columns: 80px 1fr 130px 80px 100px;
  gap: 12px; padding: 12px 16px; border-bottom: 2px solid var(--accent);
  font-family: var(--mono); font-size: 0.7rem; color: var(--text-dim);
  text-transform: uppercase; letter-spacing: 1px;
}
.gap-good { color: var(--green); }
.gap-ok { color: var(--yellow); }
.gap-bad { color: var(--red); }

/* ── Table ── */
.data-table {
  width: 100%; border-collapse: collapse; font-size: 0.85rem;
}
.data-table th {
  text-align: left; padding: 10px 12px; font-family: var(--mono);
  color: var(--text-dim); font-size: 0.75rem; text-transform: uppercase;
  border-bottom: 2px solid var(--accent); letter-spacing: 0.5px;
}
.data-table td {
  padding: 10px 12px; border-bottom: 1px solid var(--surface2);
}
.data-table tr:hover { background: var(--surface); }

/* ── Downloads / links ── */
.downloads {
  display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px;
}
.downloads a, .btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--surface2); color: var(--text); text-decoration: none;
  padding: 8px 16px; border-radius: 6px; font-size: 0.85rem;
  transition: background 0.2s;
}
.downloads a:hover, .btn:hover { background: var(--accent2); color: var(--accent); }

/* ── Search ── */
.search-box {
  width: 100%; padding: 12px 16px; background: var(--surface);
  border: 1px solid var(--surface2); border-radius: 8px;
  color: var(--text); font-size: 1rem; font-family: var(--sans);
  margin-bottom: 24px;
}
.search-box:focus { outline: none; border-color: var(--accent); }

/* ── Footer ── */
footer {
  border-top: 1px solid var(--surface2); padding: 32px 0; margin-top: 60px;
  text-align: center; color: var(--text-dim); font-size: 0.8rem;
}

/* ── Responsive ── */
@media (max-width: 700px) {
  .hero h1 { font-size: 1.6rem; }
  .stats { gap: 16px; }
  .stat .num { font-size: 1.3rem; }
  .scorecard-row, .scorecard-header { grid-template-columns: 60px 1fr 80px 70px; }
  .scorecard-row > *:nth-child(5), .scorecard-header > *:nth-child(5) { display: none; }
  nav a { padding: 4px 8px; font-size: 0.78rem; }
}

/* ★★ S316, H70 — CLASSES THAT WERE USED ON SERVED PAGES WITH NO RULE ANYWHERE.
   Found by scripts/class_resolution_gate.py (SITE_PENDING H23/H61/H65), which reported 111 class/page
   pairs rendering as undifferentiated body text with every other gate reporting PASS. 103 of them were
   the Textbook builder, now fixed at source with its own scoped .tb block. These eight could not be
   fixed at source: /pasture/march-library-index.html is the FROZEN March index (R23 — its bytes are a
   dated record and are not edited), and search.html / premise-graph carry hand-written markup. Styling
   them from the site stylesheet fixes the render WITHOUT touching a frozen page. */
.entry-list{list-style:none;padding:0;margin:12px 0}
.entry-list li{border-bottom:1px solid #2a2a35;padding:8px 4px}
.entry-title{display:block;font-size:.92rem;line-height:1.5}
.entry-id{color:var(--text-dim);font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.8rem;margin-right:8px}
.entry-status{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--text-dim)}
.status-pending{color:var(--orange)}
.result{border-bottom:1px solid #2a2a35;padding:10px 4px;font-size:.92rem;line-height:1.6}
.foot{color:var(--text-dim);font-size:.82rem;margin-top:18px;line-height:1.6}
.warn{background:var(--surface);border-left:4px solid var(--orange);padding:10px 14px;margin:12px 0;font-size:.88rem;line-height:1.6}


/* ★★ H93 (S317) — long unbroken code paths overflowed the viewport: /premises/ (301px, over 17) and
   /papers/track2-claims/ (314px, over 31). A path is one "word" to the line breaker. */
code, pre { overflow-wrap: break-word; word-break: break-word; }

/* ★★ H92 (S317) — the Registrar and Expositions indexes put multi-column tables straight into the
   body; at 327px the document scrolled to 572 and 501. This is the pattern the site ALREADY uses on
   /premise-graph/'s Figure 1: the table scrolls inside its own box, not the page.
   ★ VERIFIED RENDERED, not in source: registrar tables 409 and 548 wide and textbook's 477 are now
   real scroll containers (scrollWidth > clientWidth), the 2-column table is untouched at 279, and
   all nine declared HTML surfaces read clean at 327/375/768/1280. Screenshot checked: columns
   intact, content legible, page does not scroll. */
table { display: block; max-width: 100%; overflow-x: auto; }
   all nine declared HTML surfaces read clean at 327/375/768/1280. Screenshot checked: columns
   intact, content legible, page does not scroll. */
table { display: block; max-width: 100%; overflow-x: auto; }

/* ── S319 / H108 · H91 — TWO RULES, FOUR PAGES. Appended, nothing above is edited. ──
   ★ MEASURED CAUSE, not guessed. RENDERED at 327px over HTTP (root-absolute assets resolve):
   (1) LONG UNBREAKABLE TOKENS are 3 of the 4 overflows and are also H91:
         terms.html      <p> clientWidth 221 / scrollWidth 296  — an email address
         library-v1      <p> clientWidth 279 / scrollWidth 357  — a repo path
                         <h2> clientWidth 279 / scrollWidth 286 — a slashed compound
         telegram.html   <strong> 301px       — "OpenSecretScience" beside a t.me URL
       `overflow-wrap: break-word` breaks ONLY where a word cannot otherwise fit. It does not
       hyphenate, re-flow prose, or touch anything that already fits.
   (2) THE CARD GRID DEMANDS A 280px TRACK INSIDE A 221px COLUMN:
         .cards { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) }
       `min(280px, 100%)` keeps the 280px preference on every wider viewport and yields on narrow
       ones. This is the canonical fix for auto-fit/minmax, not a workaround.
   ★ NEITHER RULE CHANGES ANY LAYOUT THAT ALREADY FITS — verified by re-sweeping all 33 pages. */
body, p, li, td, th, h1, h2, h3, h4, dd, dt, figcaption, blockquote { overflow-wrap: break-word; }
.cards { grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); }

/* ── ITEM 2 (S322): WIDE TABLES BECOME CARDS ON A PHONE ── */
@media (max-width:700px){
  table.rt, table.rt tbody, table.rt tr, table.rt td { display:block; width:auto; }
  table.rt { border-collapse:collapse; }
  table.rt thead { position:absolute; left:-9999px; }
  /* ★ MOST OF THESE TABLES HAVE NO <thead> AT ALL — 3 of the 4 pages emit the header row as a bare
     first <tr>. Hiding `thead` therefore hid nothing on them, and the column names would have
     rendered as a stray first CARD reading "id / premise / kind / source / ...". The pass marks
     that row `.hdr` instead. Moved off-screen rather than `display:none` so it stays available to
     assistive technology, which is the whole reason the header row exists. */
  table.rt tr.hdr { position:absolute; left:-9999px; }
  table.rt tr { border:1px solid var(--surface2); border-radius:8px; padding:12px 14px;
                margin:0 0 12px; background:var(--surface); }
  table.rt td { border:none; padding:6px 0; font-size:15px; line-height:1.45; }
  table.rt td[data-label]::before {
    content:attr(data-label); display:block; font-family:var(--mono); font-size:13px;
    color:var(--text-dim); text-transform:uppercase; letter-spacing:0.3px; margin-bottom:2px; }
  table.rt td:empty { display:none; }
}
/* ── end ITEM 2 (S322) ── */