
.chapter-divider {
  scroll-margin-top: calc(var(--header-h) + 18px);
  display: grid;
  grid-template-columns: minmax(0,1.55fr) minmax(280px,.65fr);
  gap: clamp(36px,6vw,84px);
  align-items: end;
  margin-top: 84px;
  padding: 92px 0 68px;
  border-top: 1px solid var(--line);
}
.chapter-divider h2 {
  margin: 14px 0 22px;
  font-size: clamp(3rem,7vw,6.5rem);
  line-height: .9;
  letter-spacing: -.06em;
}
.chapter-divider h2 em { color:var(--accent-2); font-style:normal; font-weight:650; }
.chapter-divider p { max-width:820px; margin:0; color:var(--muted); font-size:clamp(1rem,1.5vw,1.15rem); }
.harmonic-index {
  background: linear-gradient(145deg, color-mix(in srgb,var(--accent-2) 8%,var(--panel)), var(--panel));
}
.harmonic-index::after { border-color: color-mix(in srgb,var(--accent-2) 28%,transparent); }

.derivation-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.derivation-card {
  min-width:0;
  padding:26px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--panel);
}
.derivation-card h3 { margin:16px 0 8px; font-size:1.18rem; }
.derivation-card p { margin:0; color:var(--muted); font-size:.9rem; }

.solution-layout {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);
  gap:12px;
}
.solution-primary,
.solution-secondary article {
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--panel);
}
.solution-primary { padding:30px; }
.solution-primary p,
.solution-secondary p { color:var(--muted); font-size:.9rem; }
.solution-secondary { display:grid; gap:12px; }
.solution-secondary article { padding:24px; }
.solution-equation {
  min-height:140px;
  justify-content:flex-start;
  overflow-x:auto;
  font-size:clamp(1.1rem,2vw,1.6rem);
}
.frac {
  display:inline-grid;
  grid-template-rows:auto auto;
  align-items:center;
  vertical-align:middle;
  line-height:1;
  margin-inline:.12em;
}
.frac > span:first-child { border-bottom:1px solid currentColor; padding:0 .16em .09em; }
.frac > span:last-child { padding:.09em .16em 0; }

.harmonic-lab-section {
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--accent-2) 4%,transparent),transparent 22%),
    linear-gradient(0deg,color-mix(in srgb,var(--accent) 3%,transparent),transparent 22%);
}
.harmonic-lab {
  display:grid;
  grid-template-columns:270px minmax(0,1fr);
  gap:12px;
  align-items:start;
}
.harmonic-controls {
  position:sticky;
  top:calc(var(--header-h) + 16px);
  display:grid;
  gap:22px;
  padding:22px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--panel-solid);
}
.harmonic-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.harmonic-main { min-width:0; display:grid; gap:12px; }
.harmonic-metrics {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  overflow:hidden;
  background:var(--panel);
}
.harmonic-metrics article {
  min-width:0;
  padding:15px 16px;
  border-right:1px solid var(--line);
}
.harmonic-metrics article:last-child { border-right:0; }
.harmonic-metrics span { display:block; color:var(--muted); font-size:.66rem; font-weight:740; }
.harmonic-metrics strong { display:inline-block; margin-top:5px; font-size:1.1rem; font-variant-numeric:tabular-nums; }
.harmonic-metrics small { margin-left:4px; color:var(--muted); font-size:.62rem; }

.harmonic-visual-grid {
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(270px,.55fr);
  gap:12px;
}
.analytic-panel { margin:0; }
.analytic-panel figcaption {
  display:block;
  padding:18px 20px;
  border-bottom:1px solid var(--line);
}
.analytic-panel figcaption span {
  display:block;
  color:var(--muted);
  font-size:.68rem;
  font-weight:750;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.analytic-panel figcaption strong { display:block; margin-top:3px; font-size:.92rem; }
.harmonic-plot { width:100%; min-height:300px; }
.harmonic-trace {
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.trace-analytic { stroke:var(--accent); stroke-width:3.4; }
.trace-rk4 { stroke:var(--accent-2); stroke-width:1.7; stroke-dasharray:6 5; opacity:.9; }
.time-marker-line { stroke:var(--line-strong); stroke-width:1; stroke-dasharray:3 5; }
.solution-marker { fill:var(--text); stroke:var(--bg); stroke-width:2; }
.harmonic-legend {
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  padding:0 20px 18px;
  color:var(--muted);
  font-size:.7rem;
}
.harmonic-legend span { display:flex; align-items:center; gap:7px; }
.harmonic-legend i { width:20px; height:2px; display:inline-block; }
.legend-analytic { background:var(--accent); }
.legend-rk4-ref {
  background:repeating-linear-gradient(90deg,var(--accent-2) 0 6px,transparent 6px 10px);
}

.solution-state { min-width:0; }
.state-readout {
  display:grid;
  grid-template-columns:1fr 1fr;
  border-bottom:1px solid var(--line);
}
.state-readout > div {
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:6px;
  align-items:baseline;
  min-width:0;
  padding:14px 15px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.state-readout > div:nth-child(2n) { border-right:0; }
.state-readout > div:nth-last-child(-n+2) { border-bottom:0; }
.state-readout span { color:var(--accent-2); font-size:.69rem; font-weight:850; }
.state-readout strong { justify-self:end; min-width:0; font-size:.88rem; font-variant-numeric:tabular-nums; }
.state-readout small { color:var(--muted); font-size:.58rem; }
.parameter-map { display:grid; gap:16px; padding:20px; }
.parameter-row {
  display:grid;
  grid-template-columns:22px 1fr;
  gap:8px 10px;
  align-items:center;
}
.parameter-row > span { color:var(--accent); font-weight:850; }
.parameter-row small { grid-column:2; color:var(--muted); font-size:.68rem; }
.parameter-track {
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:color-mix(in srgb,var(--line-strong) 65%,transparent);
}
.parameter-track i {
  display:block;
  width:50%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--accent-2),var(--accent));
}
.solution-note { margin:0; padding:0 20px 20px; color:var(--muted); font-size:.75rem; }

.relation-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.relation-grid article {
  padding:25px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--panel);
}
.relation-symbol {
  display:block;
  color:var(--accent-2);
  font-family:"Cambria Math","STIX Two Math",Georgia,serif;
  font-size:1.8rem;
}
.relation-grid strong { display:block; margin:14px 0 8px; }
.relation-grid p { margin:0; min-height:78px; color:var(--muted); font-size:.88rem; }
.relation-grid .equation { min-height:64px; margin-top:18px; }

.boundary-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.boundary-grid article {
  padding:22px;
  border-top:1px solid var(--line-strong);
}
.boundary-grid span { color:var(--accent); font-size:.76rem; font-weight:850; letter-spacing:.04em; }
.boundary-grid p { margin:10px 0 0; color:var(--muted); font-size:.82rem; }

@media (max-width: 1080px) {
  .harmonic-visual-grid { grid-template-columns:1fr; }
  .solution-state { display:grid; grid-template-columns:1fr 1fr; }
  .solution-state .panel-head { grid-column:1/-1; }
  .solution-note { align-self:center; }
}
@media (max-width: 980px) {
  .chapter-divider { grid-template-columns:1fr; gap:28px; }
  .harmonic-index { max-width:620px; }
  .derivation-grid { grid-template-columns:1fr 1fr; }
  .derivation-grid > :last-child { grid-column:1/-1; }
  .solution-layout { grid-template-columns:1fr; }
  .solution-secondary { grid-template-columns:1fr 1fr; }
  .harmonic-lab { grid-template-columns:1fr; }
  .harmonic-controls { position:static; grid-template-columns:1fr 1fr; }
  .harmonic-actions { align-self:end; }
  .boundary-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 720px) {
  .chapter-divider { margin-top:56px; padding:66px 0 48px; }
  .chapter-divider h2 { font-size:clamp(2.65rem,14vw,4.8rem); }
  .derivation-grid,
  .solution-secondary,
  .relation-grid,
  .boundary-grid { grid-template-columns:1fr; }
  .derivation-grid > :last-child { grid-column:auto; }
  .harmonic-controls { grid-template-columns:1fr; }
  .harmonic-metrics { grid-template-columns:1fr 1fr; }
  .harmonic-metrics article:nth-child(2) { border-right:0; }
  .harmonic-metrics article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .solution-state { display:block; }
  .harmonic-plot { min-height:245px; }
  .solution-equation { min-height:112px; }
  .relation-grid p { min-height:0; }
}
