/* v57: direct horizontal procedure scrolling; events and welcome bonus remain vertical. */
.gg-article [data-step-rail][tabindex],
.gg-article[data-article-id="download"] #gg-panel-iphone > [data-step-rail],
.gg-article[data-article-id="download"] #registration > [data-step-rail] {
  --step-card-width: min(600px, calc(100% - 32px));
  position: static;
  left: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  grid-template-columns: none;
  align-items: flex-start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  gap: 14px;
  margin: 10px 0 22px;
  padding: 3px 0 12px;
  list-style: none;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x proximity;
  scroll-padding-inline: 0;
  scroll-behavior: auto;
  scrollbar-width: thin;
  scrollbar-color: #8ab9d6 #edf5fa;
  transform: none;
  -webkit-overflow-scrolling: touch;
}

.gg-article [data-step-rail][data-step-variant="text"] {
  --step-card-width: min(360px, calc(100% - 32px));
}

.gg-article [data-step-rail][tabindex]::after {
  display: none;
  content: none;
}

.gg-article [data-step-rail][tabindex] > [data-step-card],
.gg-article[data-article-id="download"] #gg-panel-iphone > [data-step-rail] > [data-step-card],
.gg-article[data-article-id="download"] #registration > [data-step-rail] > [data-step-card] {
  position: relative;
  display: block;
  flex: 0 0 var(--step-card-width);
  width: auto;
  min-width: 0;
  max-width: 100%;
  min-height: 0;
  margin: 0;
  padding: 14px 16px 16px;
  border: 1px solid #dbe8f1;
  border-top: 3px solid #087dcc;
  border-radius: 6px;
  background: #fff;
  box-shadow: none;
  line-height: 1.7;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
  overflow-wrap: anywhere;
}

/* Ordered text stays in one normal text flow, including inline highlights. */
.gg-article [data-step-rail][tabindex] > li[data-step-card]::before {
  position: static;
  display: block;
  width: auto;
  height: auto;
  margin: 0 0 6px;
  padding: 0;
  border: 0;
  background: none;
  color: #087dcc;
  content: "STEP " attr(data-step-number);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .04em;
  text-align: left;
}

.gg-article [data-step-rail][tabindex] > li[data-step-card] {
  font-size: 15px;
}

.gg-article [data-step-card] > h3.procedure-step-heading {
  margin: 0 0 10px;
  padding-top: 0;
}

.gg-article [data-step-card] > p,
.gg-article [data-step-card] > div > p {
  margin-block: 8px 0;
}

.gg-article [data-step-card] > .article-screenshot {
  margin-block: 10px;
}

.gg-article [data-step-rail]:focus-visible {
  outline: 3px solid #78bdec;
  outline-offset: -2px;
}

.gg-article .step-rail-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 12px 0 4px;
  color: #526773;
  font-size: 12px;
  line-height: 1.5;
}

.gg-article .step-rail-hint { margin-right: auto; }
.gg-article .step-rail-position { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* The native scrollbar stays visible where the operating system permits it. */
.gg-article [data-step-rail]::-webkit-scrollbar { height: 6px; }
.gg-article [data-step-rail]::-webkit-scrollbar-track { background: #edf5fa; border-radius: 3px; }
.gg-article [data-step-rail]::-webkit-scrollbar-thumb { background: #8ab9d6; border-radius: 3px; }
.gg-article [data-step-rail][data-step-dragging="true"],
.gg-article[data-article-id="download"] #gg-panel-iphone > [data-step-rail][data-step-dragging="true"],
.gg-article[data-article-id="download"] #registration > [data-step-rail][data-step-dragging="true"] {
  scroll-snap-type: none;
  scroll-behavior: auto;
  user-select: none;
  -webkit-user-select: none;
}

@media (hover: hover) and (pointer: fine) {
  .gg-article [data-step-rail][data-step-scrollable="true"] { cursor: grab; }
  .gg-article [data-step-rail][data-step-scrollable="true"] :is(p, h1, h2, h3, h4, h5, h6, figcaption) { cursor: text; }
  .gg-article [data-step-rail][data-step-dragging="true"],
  .gg-article [data-step-rail][data-step-dragging="true"] * { cursor: grabbing; }
}

@media (max-width: 560px) {
  .gg-article [data-step-rail][tabindex],
  .gg-article[data-article-id="download"] #gg-panel-iphone > [data-step-rail],
  .gg-article[data-article-id="download"] #registration > [data-step-rail] {
    --step-card-width: calc(100% - 24px);
    gap: 12px;
    margin-bottom: 18px;
  }

  .gg-article [data-step-rail][tabindex] > [data-step-card],
  .gg-article[data-article-id="download"] #gg-panel-iphone > [data-step-rail] > [data-step-card],
  .gg-article[data-article-id="download"] #registration > [data-step-rail] > [data-step-card] {
    padding: 12px 14px 14px;
  }

  .gg-article .step-rail-controls { gap: 6px; font-size: 11px; }
}
