.horizontal-scroll {
  display: flex;
  overflow-x: auto;
  gap: 0.7rem;
  padding: 1rem 0rem 3rem;
  scroll-snap-type: x mandatory;
}

.horizontal-scroll::-webkit-scrollbar {
  display: none;
}

.story-ring {
  flex: 0 0 auto;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  scroll-snap-align: start;
}

.story-gradient {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: linear-gradient(to bottom, #800080 5%, #B000B0 35%, #FF7070 65%, #FF0000 95%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.story-inner {
  background: white;
  border-radius: 50%;
  width: 84px; /* Eskiden 78px idi */
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.story-inner img {
  width: 74px; /* Eskiden 68px idi */
  height: 74px;
  border-radius: 50%;
  object-fit: cover;
}