.guide-layout,
.game-page {
  --reading-cyan: #52e7ff;
  --reading-lime: #b8ff39;
  --reading-purple: #9f8cff;
  --reading-pink: #ff7daf;
}

.guide-copy > .guide-section > .eyebrow,
.game-page-copy > section > .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.guide-copy > .guide-section > .eyebrow::after,
.game-page-copy > section > .eyebrow::after {
  content: "";
  width: 34px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--reading-cyan), var(--reading-purple));
  transform: rotate(-2deg);
}

.guide-fit-summary article,
.guide-quick-picks article,
.decision-checks article,
.guide-sidebar-card,
.game-page-sidebar > div {
  --reading-accent: var(--reading-cyan);
  border-left: 4px solid var(--reading-accent) !important;
  border-radius: 6px 16px 16px 6px !important;
}

.guide-fit-summary article:nth-child(2n),
.guide-quick-picks article:nth-child(2n),
.decision-checks article:nth-child(2n),
.guide-sidebar-card:nth-child(2n),
.game-page-sidebar > div:nth-child(2n) {
  --reading-accent: var(--reading-lime);
}

.guide-quick-picks article:nth-child(3n),
.decision-checks article:nth-child(3n),
.game-page-sidebar > div:nth-child(3n) {
  --reading-accent: var(--reading-purple);
}

.game-page-facts > span {
  --fact-accent: var(--reading-cyan);
  border: 1px solid color-mix(in srgb, var(--fact-accent) 34%, transparent) !important;
  border-radius: 13px 4px 13px 4px !important;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--fact-accent) 8%, transparent), transparent 52%),
    #151d2a !important;
  box-shadow: 0 4px 0 rgba(5, 9, 15, 0.55) !important;
  color: #e8eff8;
}

.game-page-facts > span:nth-child(2n) {
  --fact-accent: var(--reading-lime);
}

.game-page-facts > span:nth-child(3n) {
  --fact-accent: var(--reading-purple);
}

.game-page-facts strong {
  color: var(--fact-accent);
  font-family: var(--font-ui, "Nunito", sans-serif);
}

.fit-grid article,
.detail-tips li,
.related-game,
.creator-card,
.game-guide-paths a {
  border-radius: 15px 5px 15px 5px !important;
}

.fit-grid article:first-child {
  border-left: 4px solid var(--reading-cyan);
}

.fit-grid article:last-child {
  border-left: 4px solid var(--reading-pink);
}

.related-game:nth-child(2n) {
  border-radius: 5px 15px 5px 15px !important;
}

.game-page-icon,
.related-game-art,
.creator-card > span,
.creator-avatar {
  font-family: var(--font-display, "Fredoka", sans-serif) !important;
}

@media (max-width: 700px) {
  .guide-quick-picks,
  .game-page-facts,
  .game-page-sidebar {
    display: flex !important;
    gap: 9px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .guide-quick-picks::-webkit-scrollbar,
  .game-page-facts::-webkit-scrollbar,
  .game-page-sidebar::-webkit-scrollbar {
    display: none;
  }

  .guide-quick-picks article {
    flex: 0 0 min(82vw, 320px);
    min-height: 190px;
    scroll-snap-align: start;
  }

  .game-page-facts {
    margin-inline: -2px;
    padding: 2px 2px 7px;
  }

  .game-page-facts > span {
    flex: 0 0 146px;
    min-height: 82px;
    scroll-snap-align: start;
  }

  .game-page-sidebar {
    margin-top: 34px;
    padding-bottom: 7px;
  }

  .game-page-sidebar > div {
    flex: 0 0 min(78vw, 290px);
    min-height: 132px;
    scroll-snap-align: start;
  }

  .game-detail-hero {
    gap: 22px;
  }

  .game-page-icon {
    width: 122px !important;
  }

  .guide-copy > .guide-section > .eyebrow::after,
  .game-page-copy > section > .eyebrow::after {
    width: 24px;
  }
}

@media (hover: none), (pointer: coarse) {
  .related-game-art-link:hover .related-game-art,
  .related-game-art-link:focus-visible .related-game-art,
  .game-guide-paths a:hover,
  .game-guide-paths a:focus-visible {
    transform: none !important;
  }
}
