/* What c is. The first figure holds its place before it starts, so a jump to #figure lands on it.
   The strand figure sets a 3D view of the moving pattern beside the unrolled cylinder; on phones they stack. */
#figure { min-height: 560px; scroll-margin-top: 1.25rem; }
.strand-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.strand-grid > div { position: relative; min-width: 0; }
.strand-grid > .strand-2d { border-left: 1px solid var(--rule); }
.strand-grid .fig-hint { left: .75rem; right: auto; }
@media (max-width: 699px) {
  #figure { min-height: 820px; }
  .strand-grid { grid-template-columns: minmax(0, 1fr); }
  .strand-grid > .strand-2d { border-left: 0; border-top: 1px solid var(--rule); }
}
/* phones: an equation's label drops below it, and long equations run as rows */
@media (max-width: 699px) { .eq-block .lbl { display: block; margin: .35rem 0 0; } }