:root {
  --cc-ink: #202124;
  --cc-muted: #5f6368;
  --cc-line: #d9dee3;
  --cc-panel: #f8fafc;
  --cc-proof: #0b6b45;
  --cc-plan: #755700;
  --cc-blocked: #9b1c1c;
  --cc-deferred: #56606a;
  --cc-link: #1357a6;
}

body {
  color: var(--cc-ink);
}

.theorem-card,
.dictionary-card,
.widget-panel,
.warning-box,
.python-example-box {
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  margin: 1rem 0;
  padding: 1rem;
  background: #fff;
}

.theorem-card header,
.dictionary-card header,
.widget-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.theorem-meta,
.dictionary-meta {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0.25rem 0.75rem;
  color: var(--cc-muted);
  font-size: 0.9rem;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--cc-line);
  border-radius: 999px;
  padding: 0.15rem 0.55rem;
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
}

.status-proved,
.status-active {
  color: var(--cc-proof);
  border-color: #9fd4bd;
  background: #ecf8f2;
}

.status-planned,
.status-draft,
.status-scaffold {
  color: var(--cc-plan);
  border-color: #e7d58e;
  background: #fff8d7;
}

.status-blocked {
  color: var(--cc-blocked);
  border-color: #efb2b2;
  background: #fff0f0;
}

.status-deferred,
.status-future,
.status-exploratory {
  color: var(--cc-deferred);
  border-color: #cbd5df;
  background: #f1f4f7;
}

.claim-boundary-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  margin: 0.75rem 0 1rem;
}

.claim-boundary-label {
  color: var(--cc-muted);
  font-size: 0.85rem;
  font-weight: 700;
}

.claim-boundary-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--cc-line);
  border-radius: 999px;
  padding: 0.15rem 0.55rem;
  font-size: 0.8rem;
  font-weight: 700;
  white-space: nowrap;
}

.claim-boundary-proved {
  color: var(--cc-proof);
  border-color: #9fd4bd;
  background: #ecf8f2;
}

.claim-boundary-executable {
  color: #0b4f6c;
  border-color: #9ccfe0;
  background: #ebf7fb;
}

.claim-boundary-experimental {
  color: var(--cc-plan);
  border-color: #e7d58e;
  background: #fff8d7;
}

.claim-boundary-speculative {
  color: var(--cc-deferred);
  border-color: #cbd5df;
  background: #f1f4f7;
}

.warning-box {
  border-color: #efc36d;
  background: #fff8e6;
}

.audit-detail {
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  margin: 1rem 0;
  padding: 0.75rem 1rem;
  background: var(--cc-panel);
}

.audit-detail summary {
  cursor: pointer;
  font-weight: 700;
}

.audit-detail[open] summary {
  margin-bottom: 0.75rem;
}

.dimension-banner {
  border-left: 4px solid var(--cc-link);
  margin: 1rem 0;
  padding: 0.75rem 1rem;
  background: var(--cc-panel);
  font-weight: 700;
}

.book-preface,
.learning-unit,
.lesson-card,
.checkpoint-box,
.proof-shelf,
.source-trail,
.lesson-goal,
.definition-box,
.worked-example,
.common-mistake,
.next-lesson,
.book-navigation,
.concept-map,
.teacher-note {
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  margin: 1rem 0;
  padding: 1rem;
  background: #fff;
}

.book-preface,
.learning-unit,
.lesson-goal {
  background: var(--cc-panel);
}

.lesson-goal {
  border-left: 4px solid var(--cc-link);
}

.lesson-goal ul,
.worked-example ul,
.common-mistake ul,
.checkpoint-box ul {
  margin-bottom: 0;
}

.definition-box {
  border-left: 4px solid #0b6b45;
  background: #f7fcfa;
}

.definition-box .formula-line {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 1rem;
  margin: 0.5rem 0 0;
}

.worked-example {
  background: #fbfdff;
}

.common-mistake {
  border-color: #efc36d;
  background: #fffaf0;
}

.next-lesson,
.book-navigation {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: space-between;
}

.next-lesson a,
.book-navigation a {
  font-weight: 700;
}

.concept-map {
  background: #fcfcfd;
}

.concept-flow {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  margin: 1rem 0;
}

.concept-flow span {
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  padding: 0.65rem 0.75rem;
  background: #fff;
  text-align: center;
}

.concept-flow span strong {
  display: block;
}

.chapter-opening {
  border-bottom: 1px solid var(--cc-line);
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
}

.source-trail h2,
.source-trail h3 {
  margin-top: 0;
}

.lesson-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  margin: 1rem 0;
}

.lesson-card h3,
.learning-unit h3 {
  margin-top: 0;
}

.learning-ladder {
  display: grid;
  gap: 0.75rem;
  margin: 1rem 0;
}

.learning-step {
  border-left: 4px solid var(--cc-link);
  padding: 0.25rem 0 0.25rem 0.85rem;
}

.checkpoint-box {
  border-color: #9fd4bd;
  background: #ecf8f2;
}

.source-trail {
  background: #fbfdff;
}

.proof-shelf {
  background: #fcfcfd;
}

.proof-shelf summary {
  cursor: pointer;
  font-weight: 700;
}

.proof-shelf[open] summary {
  margin-bottom: 1rem;
}

.widget-panel label {
  display: inline-flex;
  flex-direction: column;
  gap: 0.25rem;
  margin: 0.25rem 0.75rem 0.5rem 0;
  font-size: 0.9rem;
}

.widget-panel input,
.widget-panel select {
  border: 1px solid var(--cc-line);
  border-radius: 6px;
  font: inherit;
  padding: 0.25rem 0.4rem;
  width: 6rem;
  max-width: 100%;
}

.widget-panel select {
  width: auto;
  min-width: min(100%, 14rem);
}

.widget-panel input:focus-visible,
.widget-panel select:focus-visible {
  outline: 3px solid #9cc7ff;
  outline-offset: 2px;
}

.widget-output {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.widget-svg {
  width: min(100%, 520px);
  height: auto;
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  background: #fbfdff;
}

.widget-data {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9rem;
  white-space: pre-wrap;
}

.seed-rule-record {
  display: grid;
  gap: 0.75rem;
}

.seed-rule-record h3 {
  margin: 0;
}

.generator-badge-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.record-pill {
  border: 1px solid var(--cc-line);
  border-radius: 999px;
  color: var(--cc-link);
  display: inline-flex;
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.15rem 0.55rem;
  text-decoration: none;
}

.filterable-index {
  margin: 1rem 0;
}

.index-tools {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  margin-bottom: 0.75rem;
}

.index-tools label {
  color: var(--cc-muted);
  display: grid;
  font-size: 0.9rem;
  gap: 0.25rem;
  min-width: min(100%, 24rem);
}

.index-tools input {
  border: 1px solid var(--cc-line);
  border-radius: 6px;
  color: var(--cc-ink);
  font: inherit;
  padding: 0.45rem 0.6rem;
}

.index-count {
  color: var(--cc-muted);
  font-size: 0.9rem;
}

.index-table-wrap {
  border: 1px solid var(--cc-line);
  border-radius: 8px;
  overflow-x: auto;
}

.generated-index-table,
.dictionary-index-table,
.theorem-index-table,
.paper-index-table,
.target-index-table,
.glyph-index-table,
.capability-matrix-table,
.capability-audit-table {
  margin: 0;
  min-width: 760px;
  width: 100%;
}

.generated-index-table td,
.dictionary-index-table td,
.theorem-index-table td,
.paper-index-table td,
.target-index-table td,
.glyph-index-table td,
.capability-matrix-table td,
.capability-audit-table td {
  vertical-align: top;
}

.capability-title-cell {
  min-width: 12rem;
}

.capability-count {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 700;
}

.capability-contract {
  display: grid;
  gap: 0.35rem;
  min-width: 10rem;
}

.capability-contract-detail {
  color: var(--cc-muted);
  font-size: 0.85rem;
  margin: 0;
}

.capability-contract-failures {
  margin: 0;
  padding-left: 1.1rem;
}

.capability-recipe {
  display: grid;
  gap: 0.25rem 0.5rem;
  grid-template-columns: max-content minmax(12rem, 1fr);
  margin: 0;
}

.capability-recipe dt {
  color: var(--cc-muted);
  font-size: 0.85rem;
  font-weight: 700;
}

.capability-recipe dd {
  margin: 0;
}

.capability-recipe code,
.capability-audit-list code {
  overflow-wrap: anywhere;
  white-space: normal;
}

.capability-audit-list {
  margin: 0;
  padding-left: 1.1rem;
}

.capability-audit-list li + li {
  margin-top: 0.3rem;
}

.capability-audit-list a {
  overflow-wrap: anywhere;
}

.node-label {
  font-size: 11px;
  text-anchor: middle;
  dominant-baseline: middle;
}

.node-circle {
  fill: #fff;
  stroke: #1f2937;
  stroke-width: 1.5;
}

.node-circle.visited {
  fill: #dbeafe;
  stroke: #1357a6;
}

.node-circle.selected {
  fill: #dcfce7;
  stroke: #0b6b45;
  stroke-width: 2.5;
}

@media (max-width: 640px) {
  .theorem-card header,
  .dictionary-card header,
  .widget-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .theorem-meta,
  .dictionary-meta {
    grid-template-columns: 1fr;
  }

  .generated-index-table,
  .dictionary-index-table,
  .theorem-index-table,
  .paper-index-table,
  .target-index-table,
  .glyph-index-table,
  .capability-matrix-table,
  .capability-audit-table {
    min-width: 640px;
  }

  .next-lesson,
  .book-navigation {
    align-items: stretch;
    flex-direction: column;
  }
}
