/* K2: year step buttons, side-by-side short tables. Capacity tab reuses existing table / chart styles. */
.yr-step { display: flex; align-items: center; gap: 6px; }
.yr-btn { flex: none; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: var(--cisd-black, #000); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color .15s; }
.yr-btn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.yr-btn:hover:not(:disabled) { background: #333; }
.yr-btn:focus-visible { outline: 2px solid var(--red, #cc0033); outline-offset: 2px; }
.yr-btn:disabled { background: #e3e3e3; color: #8f8f8f; cursor: default; }
@media (max-width: 640px) {
  .yr-btn { width: 44px; height: 44px; }
  .yr-btn svg { width: 16px; height: 16px; }
  .yr-step select { flex: 1 1 auto; min-width: 0; }
}
/* two short, related tables side by side on wide screens, natural widths, top-aligned */
@media (min-width: 1100px) {
  .fc-pair { display: flex; gap: 24px; align-items: flex-start; flex-wrap: wrap; }
  .fc-pair > div { flex: 0 1 auto; min-width: 0; max-width: 100%; }
  .fc-pair table.fc-t th:first-child, .fc-pair table.fc-t td:first-child { max-width: 190px; white-space: normal; }
  .fc-pair > div > .note { width: 0; min-width: 100%; }
  .fc-pair > div > h3:first-child { margin-top: 24px; }
}
@media (max-width: 1099px) { .fc-pair > div { min-width: 0; } }
