.ha-repair-page .anki-grid {
  background:
    linear-gradient(90deg, rgba(16, 20, 18, 0.98) 0%, rgba(16, 20, 18, 0.87) 47%, rgba(16, 20, 18, 0.44) 100%),
    linear-gradient(rgba(70, 181, 255, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(70, 181, 255, 0.08) 1px, transparent 1px);
  background-size: auto, 42px 42px, 42px 42px;
}

.ha-repair-page .anki-hero::after {
  border-color: rgba(70, 181, 255, 0.28);
}

.ha-repair-page .anki-hero h1 {
  max-width: 11ch;
  font-size: clamp(3.6rem, 6.4vw, 6.8rem);
}

.ha-repair-page .anki-hero {
  min-height: 84svh;
  padding-top: 108px;
  padding-bottom: 38px;
}

.ha-repair-page .deck-card--back {
  background: #52c7a5;
}

.ha-repair-page .deck-card--middle {
  background: #2364aa;
}

.ha-repair-page .deck-progress span {
  background: #46b5ff;
}

.ha-repair-page .anki-conversion {
  background: #52c7a5;
}

@media (max-width: 640px) {
  .ha-repair-page .anki-hero {
    min-height: 810px;
    gap: 6px;
    padding-top: 80px;
    padding-bottom: 10px;
  }

  .ha-repair-page .anki-hero h1 {
    margin-bottom: 10px;
    font-size: 2.65rem;
  }

  .ha-repair-page .anki-hero__copy {
    margin-bottom: 12px;
    font-size: 0.94rem;
  }

  .ha-repair-page .anki-hero .hero__note {
    margin-top: 8px;
    font-size: 0.76rem;
  }

  .ha-repair-page .purchase-boundary {
    margin-top: 5px;
    font-size: 0.75rem;
    line-height: 1.32;
  }

  .ha-repair-page .deck-scene {
    min-height: 116px;
  }

  .ha-repair-page .deck-card {
    min-height: 92px;
  }

  .ha-repair-page .deck-card--middle {
    top: 14px;
  }

  .ha-repair-page .deck-card--front {
    top: 28px;
  }
}
