/* The Premises of Yang–Mills. The first figure holds its place before it starts, so a jump to #figure lands on it.
   The torus figure sets the stereographic view beside the chart; on phones they stack. The module figure carries
   five slot toggles above the grid of sectors. */
#figure { min-height: 640px; scroll-margin-top: 1.25rem; }
.torus-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.torus-grid > div { position: relative; min-width: 0; }
.torus-grid > .torus-chart { border-left: 1px solid var(--rule); }
.torus-grid .fig-hint { left: .75rem; right: auto; }
.slot-row { display: flex; flex-wrap: wrap; gap: .5rem; padding: .9rem 1.1rem .4rem; font-family: var(--font-ui); }
.slot { display: inline-flex; align-items: center; gap: .5rem; font: inherit; font-size: .95rem; font-weight: 500; color: var(--ink-2); background: var(--paper); border: 1px solid var(--rule); border-radius: 999px; padding: .42rem .85rem .42rem .55rem; cursor: pointer; }
.slot .slot-dot { width: .95rem; height: .95rem; border-radius: 50%; border: 2px solid currentColor; display: inline-block; }
.slot-seat { color: var(--matter); }
.slot-support { color: var(--space); }
.slot > span:last-child { color: var(--ink-2); }
.slot[aria-pressed="true"] .slot-dot { background: currentColor; }
.slot[aria-pressed="true"] > span:last-child { color: var(--ink); }
.slot:hover { border-color: var(--ink-3); }
.twelve td:first-child, .twelve th:first-child { white-space: nowrap; }
@media (max-width: 699px) {
  #figure { min-height: 760px; }
  .torus-grid { grid-template-columns: minmax(0, 1fr); }
  .torus-grid > .torus-chart { border-left: 0; border-top: 1px solid var(--rule); }
  .eq-block .lbl { display: block; margin: .35rem 0 0; }
}
