.codex { hyphens: auto; }
.codex code, .codex pre { hyphens: manual; }
.codex p, .codex li, .codex dd { max-inline-size: var(--measure); line-height: 1.6; color: var(--text-muted); overflow-wrap: anywhere; }
.codex p + p, .codex .records + p, .codex pre + p, .codex ul + p { margin-top: var(--space-2); }

.codex .category { display: inline-block; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 1px; color: var(--accent-text); background: var(--accent-soft); padding: 0.2rem 0.6rem; border-radius: var(--radius-small); margin-bottom: var(--space-4); }

.codex .contents ol { columns: 2; column-gap: var(--space-6); padding-left: 1.25rem; margin: 0; }
.codex .contents li { margin: 0.15rem 0; }
.codex .contents a, .codex dd a { color: var(--accent-text); }

.codex section > h2 { font-size: 1.35rem; margin: var(--space-12) 0 var(--space-4); padding-bottom: var(--space-2); border-bottom: 1px solid var(--border); }
.codex h3 { font-size: 1.1rem; line-height: 1.3; margin: var(--space-8) 0 var(--space-2); overflow-wrap: anywhere; }
.codex article { margin: var(--space-6) 0; padding: var(--space-6); background: var(--surface-raised); border: 1px solid var(--border); border-radius: var(--radius); }
.codex article > h3 { margin-top: 0; }
.codex .claim { color: var(--text); }

.codex [data-grade] .badge, .codex [data-status] .badge { font-size: 0.7rem; letter-spacing: 0.5px; text-transform: uppercase; }
.codex [data-grade="established"] .badge, .codex [data-status="crossed"] .badge { background: var(--accent-soft); color: var(--accent-text); }
.codex [data-grade="measured"] .badge { background: color-mix(in srgb, var(--info) 10%, transparent); color: var(--info); }
.codex [data-grade="cross-reference"] .badge { background: rgba(161, 161, 170, 0.12); color: var(--text-muted); }
.codex [data-status="open"] .badge { background: rgba(161, 161, 170, 0.12); color: var(--text-muted); }

.codex dl { margin: var(--space-4) 0 0; }
.codex dt, .codex caption { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 1px; color: var(--text-subtle); }
.codex dt { margin-top: var(--space-4); }
.codex caption { caption-side: top; text-align: start; padding-bottom: var(--space-2); }
.codex dd { margin: 0.25rem 0 0; }
.codex dd ul, .codex .body ul { padding-left: 1.25rem; margin: 0; }

.codex .links { display: flex; flex-wrap: wrap; gap: var(--space-6); margin: var(--space-6) 0; }
.codex .links a { color: var(--accent-text); }

.codex pre { margin: var(--space-2) 0; padding: var(--space-4); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-small); }
.codex .records { container-type: inline-size; overflow-x: auto; margin: var(--space-2) 0; }
.codex table { font-size: 0.82rem; }
.codex th, .codex td { padding: 0.45rem 0.6rem; vertical-align: top; }
.codex td { color: var(--text-muted); line-height: 1.5; overflow-wrap: break-word; }
.codex td:first-child { color: var(--text); }
.codex .records:has(th:nth-child(7), tbody > tr:only-child) { --records: stacked; }
@container (width < 46rem) or style(--records: stacked) {
  .codex thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .codex table, .codex caption, .codex tbody, .codex tr { display: block; }
  .codex tr { padding-block: var(--space-2); border-bottom: 1px solid var(--border); }
  .codex td { display: grid; grid-template-columns: min(30%, 11rem) minmax(0, var(--measure)); gap: var(--space-4); padding: 0.2rem 0; border: 0; overflow-wrap: anywhere; }
  .codex td::before { content: attr(data-label); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-subtle); }
}
@container (width < 30rem) { .codex td { grid-template-columns: minmax(0, 1fr); gap: 0; } }
.codex code { font-family: var(--font-mono); color: var(--text); }

.codex details { margin: 0.25rem 0; }
.codex summary { cursor: pointer; color: var(--text-subtle); font-size: 0.8rem; }
.codex details[open] > summary { color: var(--accent-text); }
.codex details > p { margin-top: var(--space-2); font-size: 0.85rem; }

.codex .facts { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-6); font-size: 0.85rem; margin: var(--space-2) 0; }
.codex .facts span { color: var(--text-subtle); }
.codex .generated { margin-top: var(--space-12); padding-top: var(--space-4); border-top: 1px solid var(--border); font-size: 0.8rem; color: var(--text-subtle); }
@media (max-width: 640px) { .codex .contents ol { columns: 1; } .codex article { padding: var(--space-4); } }
@media (pointer: coarse) {
  .codex .contents a { display: block; padding-block: 0.7rem; }
  .codex summary { padding-block: 0.8rem; }
}
