#method .m-scrolly {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: start;
  position: relative;
}
#method .m-stage-col { position: relative; height: 100%; }
#method .m-stage {
  container-type: inline-size; container-name: mstage;
  position: sticky;
  top: calc(var(--nav-h) + 20px);
  margin: 0;
  display: flex; flex-direction: column;
}
#method .m-world-wrap { position: relative; display: flex; justify-content: center; }
#method .m-world {
  position: relative; width: 100%; aspect-ratio: 1000 / 740;
  container-type: inline-size;
  -webkit-user-select: none; user-select: none;
}
#method .m-world canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
#method .m-labels { position: absolute; inset: 0; pointer-events: none; }
#method .m-lab {
  position: absolute; left: 0; top: 0; white-space: nowrap; line-height: 1.1;
  color: var(--stage-ink); will-change: transform, opacity; opacity: 0;
  font-size: clamp(13px, 2.5cqw, 22px);
}
#method .m-lab .katex { font-size: 1em; }
#method .m-lab--big { font-size: clamp(16px, 3.6cqw, 32px); }
#method .m-lab--sm { font-size: clamp(12px, 1.9cqw, 17px); }
#method .m-lab--mono {
  font-family: var(--font-mono); font-size: clamp(12px, 1.4cqw, 13px); letter-spacing: 0.04em;
  color: var(--stage-muted);
}
#method .m-lab--tight { letter-spacing: 0; }
#method .m-lab--pre { white-space: pre; line-height: 1.35; }
#method .m-lab--mono.m-lab--ink { color: var(--stage-ink-2); }
#method .m-lab--tag {
  font-family: var(--font-mono); font-size: clamp(12px, 1.25cqw, 12.5px); letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--stage-muted);
}
#method .m-lab--val {
  font-family: var(--font-sans); font-variant-numeric: tabular-nums; font-weight: 500;
  font-size: clamp(18px, 3.4cqw, 30px); letter-spacing: -0.01em;
}
#method .m-lab--tag.is-lower { text-transform: none; letter-spacing: 0.03em; font-size: clamp(12px, 1.3cqw, 13px); color: var(--stage-ink-2); }
#method .m-lab--dim { color: var(--stage-muted); }
#method .m-lab--tick { font-family: var(--font-mono); font-size: clamp(12px, 1.25cqw, 12.5px); color: var(--stage-muted); font-variant-numeric: tabular-nums; }
#method .m-lab.c-t { color: var(--s-orange); }
#method .m-lab.c-e { color: var(--s-blue); }
#method .m-lab.c-g { color: var(--s-green); }
#method .m-lab.c-g2 { color: var(--s-green-2); }
#method .m-world.is-small .m-lab--detail { display: none !important; }
#method .m-world:not(.is-small) .m-lab--smallonly { display: none !important; }
#method .m-narrow-only { display: none; }
@media (max-width: 820px) {
  #method .m-narrow-only { display: block; }
  #method .m-tag-more { display: none; }
  #method .m-lab--tag.is-lower { text-transform: uppercase; letter-spacing: 0.1em; font-size: clamp(12px, 1.25cqw, 12.5px); color: var(--stage-muted); }
}
#method .m-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 10px 14px;
  min-height: 52px; padding: 7px 16px; border-top: 1px solid var(--stage-hair); 
  position: relative; z-index: 2; background: rgba(10, 13, 11, 0.6);
}
#method .m-bar-l { display: flex; align-items: center; gap: 14px; min-width: 0; }
#method .m-bar-r { position: relative; display: flex; align-items: center; justify-content: flex-end; min-height: 32px; flex: 0 1 auto; }
#method .m-dots { display: flex; gap: 2px; }
#method .m-dot {
  width: 20px; height: 24px; border: 0; padding: 0; background: transparent; cursor: pointer; position: relative;
  display: inline-flex; align-items: center; justify-content: center;
}
#method .m-dot::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--stage-hair);
  box-shadow: 0 0 0 1px rgba(237, 242, 234, 0.08);
  transition: background-color .3s var(--ease), transform .3s var(--ease);
}
#method .m-dot:hover::before { background: var(--stage-muted); }
#method .m-dot.is-done::before { background: rgba(118, 185, 0, 0.45); }
#method .m-dot[aria-current='step']::before { background: var(--s-green); transform: scale(1.35); }
#method .m-dot:focus-visible { outline: 2px solid var(--s-green); outline-offset: 0; }
#method .m-bar-title {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.04em; color: var(--stage-ink-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#method .m-ctl {
  display: flex; align-items: center; gap: 8px;
  transition: opacity .35s var(--ease), transform .35s var(--ease), visibility 0s linear .35s;
  opacity: 0; visibility: hidden; transform: translateY(4px);
  position: absolute; right: 0; top: 50%; translate: 0 -50%;
}
#method .m-ctl.is-on { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; position: relative; top: auto; translate: none; }
#method .m-ctl-lab { font-family: var(--font-math); font-style: italic; font-size: 17px; color: var(--s-orange); }
#method .m-tseg button {
  font-family: var(--font-mono); font-size: 12.5px; padding: 4px 9px; font-variant-numeric: tabular-nums;
}
#method .m-tseg button[aria-pressed='true'] { color: var(--s-orange); box-shadow: 0 0 0 1px rgba(208, 122, 46, 0.55); background: rgba(208, 122, 46, 0.12); }
#method .m-heun-txt { font-family: var(--font-mono); font-size: 12px; color: var(--stage-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
#method .m-heun-txt b { color: var(--s-orange); font-weight: 500; display: inline-block; min-width: 2ch; text-align: right; }
#method .m-heun-bar { width: 88px; height: 3px; border-radius: 3px; background: var(--stage-hair); overflow: hidden; }
#method .m-heun-bar i { display: block; height: 100%; width: 100%; background: var(--s-orange); transform-origin: 0 50%; transform: scaleX(0); }
@media (max-width: 820px), (pointer: coarse) {
  #method .m-dots { gap: 0; }
  #method .m-dot { width: 32px; height: 32px; }
  #method .m-tseg { gap: 0; }
  #method .m-tseg button { min-width: 32px; min-height: 32px; padding: 0 4px; font-size: 12px; }
}
@media (pointer: coarse) and (min-width: 821px) {
  #method .m-bar { min-height: 56px; }
}
@media (max-width: 560px) {
  #method .m-bar.has-t .m-dots { display: none; }
}
@container mstage (max-width: 740px) {
  #method .m-bar.has-t .m-bar-title { display: none; }
}
@container mstage (max-width: 600px) {
  #method .m-bar.has-heun .m-bar-title { display: none; }
}
#method .m-steps { list-style: none; margin: 0; padding: 4vh 0 30vh; }
#method .m-step { min-height: 76vh; display: flex; align-items: center; }
#method .m-step--sub { min-height: 52vh; }
#method .m-step--long { min-height: 118vh; }
#method .m-step-in {
  max-width: 470px; padding: 6px 0 6px 22px; border-left: 2px solid var(--hair);
  transition: opacity .5s var(--ease), border-color .5s var(--ease);
}
@media (min-width: 821px) {
  #method.is-scrolly .m-step { display: block; }
  #method.is-scrolly .m-step-in { position: sticky; top: max(calc(var(--nav-h) + 28px), 24vh); }
}
#method.is-scrolly .m-step:not(.is-active) .m-step-in { opacity: 0.34; }
#method .m-step.is-active .m-step-in { border-left-color: var(--nv-700); }
#method .m-step-num {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--nv-800);
  margin-bottom: 8px;
}
#method .m-step h3 { margin-bottom: 12px; }
#method .m-step p { color: var(--ink-2); font-size: 16.5px; line-height: 1.6; }
#method .m-step p + p { margin-top: 0.7em; }
#method .m-step p.m-note { font-size: 14.5px; color: var(--muted); line-height: 1.55; }
#method .m-step .src { margin-left: 4px; }
#method .nowrap { white-space: nowrap; }
#method .m-eq { margin: 14px 0 12px; font-size: 16px; overflow-x: auto; overflow-y: hidden; }
#method .m-eq .katex-display { margin: 0; padding: 6px 0; text-align: left; }
#method .m-eq .katex-display > .katex { text-align: left; }
#method .m-eq.is-pending { clip-path: inset(-10% 100% -10% 0); }
#method .m-eq.is-writing { clip-path: inset(-10% 0 -10% 0); transition: clip-path 1.1s var(--ease-smooth); }
#method .m-sum { margin-top: clamp(24px, 4vw, 48px); }
#method .m-sum-k { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
#method .m-sum-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: stretch; gap: 10px;
}
#method .m-sum-item {
  display: flex; align-items: center; gap: 14px; padding: 16px 18px;
  background: var(--card); border: 1px solid var(--hair); border-radius: var(--radius);
}
#method .m-sum-item p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--ink-3); }
#method .m-sum-item p > b { display: block; color: var(--ink); font-weight: 600; margin-bottom: 2px; }
#method .m-sum-item p > .m-sum-d { display: block; }
#method .m-sum-glyph {
  flex: none; width: 46px; height: 46px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--stage); font-size: 21px; color: var(--s-blue); border: 1px solid var(--stage-hair);
}
#method .m-sum-item--g .m-sum-glyph { color: var(--s-green); }
#method .m-sum-glyph--e { position: relative; border-color: rgba(79, 149, 214, 0.7); }
#method .m-sum-lock { position: absolute; top: 4px; right: 4px; width: 12px; height: 12px; color: var(--s-blue); }
#method .m-sum-glyph--grid { display: grid; grid-template-columns: repeat(3, 8px); gap: 3px; place-content: center; }
#method .m-sum-glyph--grid i { width: 8px; height: 8px; border-radius: 1.5px; background: var(--s-green); opacity: 0.9; }
#method .m-sum-glyph--grid i:nth-child(2n) { opacity: 0.55; }
#method .m-sum-glyph--grid i:nth-child(3n) { opacity: 0.3; }
#method .m-sum-op { align-self: center; font-family: var(--font-display); font-size: 26px; color: var(--faint); }
#method .m-sum-note { margin-top: 14px; font-size: 14.5px; color: var(--muted); line-height: 1.55; max-width: 80ch; }
#method.is-static .m-scrolly { display: block; }
#method.is-static .m-stage-col { display: none; }
#method.is-static .m-steps { padding: 0; }
#method.is-static .m-step {
  min-height: 0; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(24px, 3.5vw, 56px);
  align-items: center; padding: 18px 0;
}
#method.is-static .m-step + .m-step { border-top: 1px solid var(--hair); padding-top: 28px; }
#method.is-static .m-step--sub { display: block; padding-top: 0; border-top: 0 !important; margin-top: -8px; }
#method.is-static .m-step--sub .m-step-in { margin: 0 0 0 auto; width: calc(40% - 20px); }
#method.is-static .m-step-in { margin: 0; }
#method .m-snap { margin: 0; }
#method .m-snap .m-bar { justify-content: flex-end; flex-wrap: wrap; row-gap: 6px; }
#method .m-snap .stage-tag { font-size: 12px; }
@media (max-width: 820px) {
  #method .m-scrolly { display: block; }
  #method .m-stage-col {
    position: sticky; top: var(--nav-h); z-index: 5; height: auto;
    margin-inline: calc(-1 * var(--gutter));
  }
  #method .m-stage { position: relative; top: 0; border-radius: 0; box-shadow: 0 10px 24px -14px rgba(0, 0, 0, 0.5); }
  #method .m-bar { padding: 5px 10px; min-height: 52px; }
  #method .m-bar-title { display: none; }
  #method .m-dot::before { width: 6px; height: 6px; }
  #method .m-ctl-lab { font-size: 15px; }
  #method .m-heun-bar { width: 56px; }
  #method .m-steps { padding: 8vh 0 8vh; position: relative; z-index: 1; }
  #method .m-step { min-height: 66vh; align-items: flex-start; padding-top: 2vh; }
  #method .m-step--sub { min-height: 44vh; }
  #method .m-step--long { min-height: 100vh; }
  #method.is-scrolly .m-step .m-step-in { position: sticky; top: var(--m-sticky-top, 50vh); }
  #method .m-step-in { max-width: none; padding-left: 16px; }
  #method .m-step p { font-size: 16px; }
  #method .m-eq { font-size: 15px; }
  #method .m-sum-row { grid-template-columns: 1fr; }
  #method .m-sum-op { justify-self: center; line-height: 1; font-size: 22px; }
  #method.is-static .m-step { display: block; }
  #method.is-static .m-step .m-snap { margin: 0 calc(-1 * var(--gutter)) 16px; border-radius: 0; }
  #method.is-static .m-step--sub .m-step-in { width: auto; }
}
@media (max-width: 420px) {
  #method .m-bar-l { gap: 6px; }
  #method .m-heun-w, #method .m-heun-bar { display: none; }
  #method .m-eq { font-size: 14.5px; }
}