.card-grid,
.two-up,
.lab-grid {
  display: grid;
  gap: 0.66rem;
}

.card-grid {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.two-up,
.lab-grid {
  grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
}

.stepper {
  margin-top: 0.66rem;
}

.stepper input[type="range"] {
  width: 100%;
}

.svg-shell {
  margin-top: 0.66rem;
  min-height: 240px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(242, 236, 226, 0.88));
  overflow: hidden;
}

.svg-shell.tall {
  min-height: 315px;
}

.svg-shell svg {
  width: 100%;
  height: 100%;
  display: block;
}

.table-panel h2 {
  margin-top: 0;
}

.hero {
  padding: clamp(0.78rem, 1.8vw, 1.1rem);
}

.card {
  padding: 0.7rem;
}

@media (max-width: 760px) {
  .page {
    width: min(96vw, 980px);
  }
}
