:root {
  --audit-blue: #0f62fe;
  --audit-ink: #161616;
  --audit-muted: #525252;
  --audit-line: #d6d6d6;
  --audit-soft: #f4f4f4;
  --audit-green: #198038;
  --audit-red: #da1e28;
  --audit-yellow: #f1c21b;
}

body { overflow-wrap: anywhere; }
.navbar { border-bottom: 3px solid var(--audit-blue); }
.navbar-brand { font-weight: 650; letter-spacing: -0.015em; }

.hero-audit {
  background: var(--audit-ink);
  color: white;
  padding: clamp(2rem, 6vw, 5rem);
  margin: 0 0 2.5rem;
  border-left: 8px solid var(--audit-blue);
}
.hero-audit h1, .hero-audit h2 { color: white; font-weight: 350; }
.hero-audit p { color: #c6c6c6; max-width: 70rem; font-size: 1.08rem; }
.hero-audit code { color: white; }

.status-row, .source-grid, .stage-grid, .teacher-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--audit-line);
  border: 1px solid var(--audit-line);
  margin: 1.4rem 0 2rem;
}
.status-row > *, .source-grid > *, .stage-grid > *, .teacher-grid > * {
  background: white;
  padding: 1.25rem;
  margin: 0;
}
.stage-grid > *:last-child:nth-child(odd) { grid-column: 1 / -1; }
.source-card { border-top: 5px solid var(--audit-blue); }
.source-card h3 { margin-top: .55rem; }
.source-card .source-role { color: var(--audit-muted); font-size: .9rem; }

.audit-tag {
  display: inline-flex;
  padding: .2rem .55rem;
  border-radius: 999px;
  font-family: var(--bs-font-monospace);
  font-size: .75rem;
  font-weight: 700;
}
.tag-evidence { background: #edf5ff; color: #0043ce; }
.tag-provisional { background: #fcf4d6; color: #684e00; }
.tag-history { background: #e8daff; color: #6929c4; }
.tag-stop { background: #fff1f1; color: #a2191f; }
.tag-pass { background: #defbe6; color: #0e6027; }

.provenance-note {
  border-left: 4px solid var(--audit-yellow);
  background: #fff8e1;
  padding: 1rem 1.2rem;
  margin: 1.4rem 0;
}
.audit-question {
  border-left: 4px solid var(--audit-blue);
  background: #edf5ff;
  padding: 1.1rem 1.3rem;
  margin: 1.4rem 0;
}
.audit-question::before {
  content: "请你教 Hermes";
  display: block;
  color: #0043ce;
  font-weight: 700;
  letter-spacing: .04em;
  margin-bottom: .35rem;
}

.table-wrap, .table-scroll { overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
.table-scroll table { margin-bottom: 0; }
table { min-width: 760px; }
pre { max-width: 100%; overflow: auto; }
code { overflow-wrap: anywhere; }
:not(pre) > code { white-space: normal; word-break: break-word; }

.interactive-shell {
  border: 1px solid var(--audit-line);
  background: white;
  margin: 1.5rem 0 2.5rem;
}
.interactive-header {
  background: var(--audit-ink);
  color: white;
  padding: 1.25rem 1.4rem;
}
.interactive-header h2, .interactive-header h3 { color: white; margin: 0 0 .35rem; }
.interactive-header p { color: #c6c6c6; margin: 0; }
.interactive-body { padding: 1.4rem; }
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.2rem;
}
.form-grid .span-2 { grid-column: 1 / -1; }
.interactive-shell label, .interactive-shell legend {
  display: block;
  font-weight: 650;
  margin-bottom: .35rem;
}
.interactive-shell small { color: var(--audit-muted); display: block; margin-top: .25rem; }
.interactive-shell input[type="text"],
.interactive-shell input[type="number"],
.interactive-shell select,
.interactive-shell textarea {
  width: 100%;
  border: 1px solid #8d8d8d;
  border-radius: 0;
  min-height: 44px;
  padding: .65rem .75rem;
  background: white;
  color: var(--audit-ink);
}
.interactive-shell textarea { min-height: 8rem; }
.check-row { display: flex; flex-wrap: wrap; gap: .65rem 1rem; }
.check-row label { font-weight: 500; display: inline-flex; align-items: center; gap: .35rem; }
.builder-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.25rem 0; }
.audit-button {
  border: 1px solid var(--audit-blue);
  background: white;
  color: var(--audit-blue);
  border-radius: 0;
  min-height: 46px;
  padding: .65rem 1rem;
  font-weight: 650;
}
.audit-button.primary { background: var(--audit-blue); color: white; }
.audit-button.danger { border-color: var(--audit-red); color: var(--audit-red); }
.audit-button:hover { filter: brightness(.94); }
.preview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.preview-panel { min-width: 0; }
.preview-panel pre { min-height: 14rem; background: var(--audit-ink); color: white; padding: 1rem; }
.derived-paths { display: grid; grid-template-columns: 9rem 1fr; gap: .45rem .8rem; }
.derived-paths dt { font-weight: 650; }
.derived-paths dd { margin: 0; font-family: var(--bs-font-monospace); }
.warning-list { color: #684e00; }
.local-only {
  border-top: 4px solid var(--audit-green);
  background: #defbe6;
  padding: 1rem 1.2rem;
  margin: 1rem 0;
}
.teacher-option {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .7rem;
  align-items: start;
  padding: .8rem;
  border-bottom: 1px solid var(--audit-line);
}
.teacher-option label { margin: 0; }
.form-status { min-height: 1.5rem; color: var(--audit-green); font-weight: 650; }

@media (max-width: 900px) {
  .status-row, .source-grid, .stage-grid, .teacher-grid,
  .form-grid, .preview-grid { grid-template-columns: 1fr; }
  .form-grid .span-2 { grid-column: auto; }
  .derived-paths { grid-template-columns: 1fr; }
  .table-scroll table { min-width: 680px; }
}

@media (max-width: 576px) {
  .hero-audit { margin-left: -1rem; margin-right: -1rem; padding: 2rem 1.2rem; }
  .interactive-body { padding: 1rem; }
  .builder-actions .audit-button { width: 100%; }
  .table-scroll table { min-width: 620px; }
}

@media print {
  .navbar, .quarto-sidebar, .quarto-page-breadcrumbs, .builder-actions { display: none !important; }
  .page-columns { display: block !important; }
  .interactive-shell { break-inside: avoid; }
}
