.phone {
  position: relative;
  width: 419.35px;
  height: 858.87px;
  overflow: hidden;
}

.phone__body {
  position: absolute;
  left: -587.26px;
  top: -169.51px;
  width: 1596.17px;
  height: 1197.13px;
  max-width: none;
  object-fit: cover;
  pointer-events: none;
  user-select: none;
}

.phone__screen {
  position: absolute;
  left: 18.41px;
  top: 16.16px;
  width: 382.87px;
  height: 826.54px;
  overflow: hidden;
  border-radius: 56px;
  background: var(--color-dark);
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.phone__screen.is-dragging { cursor: grabbing; }

.phone__slide {
  position: absolute;
  inset: 0;
  visibility: hidden;
  will-change: transform;
  transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.phone__screen.is-dragging .phone__slide { transition: none; }

.phone__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  pointer-events: none;
  user-select: none;
}

.phone__island {
  position: absolute;
  left: 148.17px;
  top: 28px;
  width: 123px;
  height: 35px;
  border-radius: 100px;
  background: var(--color-dark);
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .phone__slide { transition: none; }
}