/* CC2: retain the approved Home geometry while fitting all nine mobile regions. */
@media (max-width: 760px) {
  #homeExperience .experience-mobile .experience-generation-track {
    --generation-item-height: 57px;
    --generation-circle-size: clamp(34px, calc((100vw - 46px) / 9), 36px);
    display: grid;
    grid-template-columns: repeat(9, minmax(0, 1fr));
    gap: 0;
    padding: 3px 0;
    /* Preserve v47's reserved row height so the hero's 1fr row cannot grow. */
    height: calc(var(--generation-item-height) + 6px);
    overflow: visible;
    touch-action: pan-y;
    overscroll-behavior-x: auto;
  }

  #homeExperience .experience-mobile .experience-generation-track button {
    min-width: 0;
    width: 100%;
    height: var(--generation-item-height);
    padding: 0;
    gap: 3px;
  }

  #homeExperience .experience-mobile .experience-generation-track .experience-ring {
    width: var(--generation-circle-size);
    height: var(--generation-circle-size);
  }

  #homeExperience .experience-mobile .experience-generation-track .experience-ring::before {
    inset: 2.5px;
  }

  #homeExperience .experience-mobile .experience-generation-track strong {
    white-space: nowrap;
  }
}

@media (max-width: 760px) and (max-height: 840px) {
  #homeExperience .experience-mobile .experience-generation-track {
    --generation-item-height: 53px;
  }
}