glider-model-slider { display: block; min-width: 0; align-self: start; position: relative; }
.model-slider-stage { position: relative; aspect-ratio: 4 / 3; touch-action: pan-y pinch-zoom; }
.model-slider-stage .gh-slide { display: block; width: 100%; height: 100%; object-fit: contain; }
glider-model-slider .model-slider-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 1;
  display: grid; place-items: center; width: 44px; height: 44px; padding: 0;
  border: 1px solid #ffffff75; border-radius: 3px; background: #0d182433; color: #fff;
  text-shadow: 0 1px 3px #000; font-size: 1.3rem; cursor: pointer;
}
.model-slider-prev { inset-inline-start: .5rem; }
.model-slider-next { inset-inline-end: .5rem; }
glider-model-slider:focus-visible, .model-slider-arrow:focus-visible { outline: 2px solid #173e34; outline-offset: 2px; }
glider-model-slider .model-slider-arrow:hover { background: #0d182466; }

glider-model-slider .model-slider-dots {
  position: absolute; inset-inline: 0; bottom: .2rem; z-index: 1;
  display: flex; justify-content: center; pointer-events: none;
}
glider-model-slider .model-slider-dots button {
  display: grid; place-items: center; width: 34px; height: 40px; padding: 0;
  border: 0; background: transparent; pointer-events: auto; cursor: pointer;
}
.model-slider-dots button::before {
  content: ''; width: 10px; height: 10px; border-radius: 50%;
  border: 1px solid #fff9; background: #ffffff66; box-shadow: 0 0 3px #000c;
}
.model-slider-dots button[aria-pressed="true"]::before { background: #fffe; }
.model-slider-dots button:focus-visible { outline: 2px solid #fff; outline-offset: -5px; border-radius: 4px; }