#home-search-page #home-grid.card-grid,
#advance-search-page #card-grid.card-grid,
#collection-page #grid-view.card-grid,
#wishlist-page #grid-view.card-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .72rem;
  margin-bottom: 0;
}

#home-search-page .mtg-card,
#advance-search-page .mtg-card,
#collection-page #grid-view .mtg-card,
#wishlist-page #grid-view .mtg-card {
  border-radius: 11px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--bg-card);
  transition: transform .18s, border-color .18s, box-shadow .18s;
}

#home-search-page .mtg-card-media,
#advance-search-page .mtg-card-media,
#collection-page #grid-view .mtg-card-media,
#wishlist-page #grid-view .mtg-card-media {
  position: relative;
}

#home-search-page .mtg-card-media-controls,
#advance-search-page .mtg-card-media-controls,
#collection-page #grid-view .mtg-card-media-controls,
#wishlist-page #grid-view .mtg-card-media-controls {
  position: absolute;
  left: .45rem;
  bottom: .45rem;
  display: flex;
  align-items: center;
  gap: .38rem;
  z-index: 3;
}

#home-search-page .mtg-card:hover,
#advance-search-page .mtg-card:hover,
#collection-page #grid-view .mtg-card:hover,
#wishlist-page #grid-view .mtg-card:hover {
  transform: translateY(-3px);
  border-color: rgba(201, 168, 76, .28);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .3);
}

#home-search-page .mtg-card img,
#advance-search-page .mtg-card img,
#collection-page #grid-view .mtg-card img,
#wishlist-page #grid-view .mtg-card img {
  aspect-ratio: 63 / 88;
  object-fit: cover;
  border-radius: 11px 11px 0 0;
}

#home-search-page .mtg-card-flip-btn,
#advance-search-page .mtg-card-flip-btn,
#collection-page #grid-view .mtg-card-flip-btn,
#wishlist-page #grid-view .mtg-card-flip-btn {
  position: static;
  width: 1.5rem;
  height: 1.5rem;
  min-width: 1.5rem;
  border-radius: 999px;
  border: 1px solid rgba(201, 168, 76, .55);
  background: linear-gradient(180deg, rgba(16, 22, 41, .95) 0%, rgba(10, 14, 28, .95) 100%);
  color: var(--gold);
  display: none;
  align-items: center;
  justify-content: center;
  font-size: .72rem;
  line-height: 1;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .06);
  cursor: pointer;
  z-index: 2;
  transition: transform .14s ease, border-color .14s ease, filter .14s ease, box-shadow .14s ease;
}

#home-search-page .mtg-card-flip-btn:hover,
#advance-search-page .mtg-card-flip-btn:hover,
#collection-page #grid-view .mtg-card-flip-btn:hover,
#wishlist-page #grid-view .mtg-card-flip-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(201, 168, 76, .9);
  filter: brightness(1.08);
  box-shadow: 0 6px 14px rgba(0, 0, 0, .42), 0 0 0 2px rgba(201, 168, 76, .16);
}

#home-search-page .mtg-card-flip-btn:focus-visible,
#advance-search-page .mtg-card-flip-btn:focus-visible,
#collection-page #grid-view .mtg-card-flip-btn:focus-visible,
#wishlist-page #grid-view .mtg-card-flip-btn:focus-visible {
  outline: 2px solid rgba(201, 168, 76, .85);
  outline-offset: 2px;
}

[data-theme="light"] #home-search-page .mtg-card-flip-btn,
[data-theme="light"] #advance-search-page .mtg-card-flip-btn,
[data-theme="light"] #collection-page #grid-view .mtg-card-flip-btn,
[data-theme="light"] #wishlist-page #grid-view .mtg-card-flip-btn {
  background: linear-gradient(180deg, rgba(241, 236, 224, .95) 0%, rgba(226, 219, 204, .95) 100%);
  color: #6d5319;
  border-color: rgba(128, 92, 29, .5);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .4);
}

#home-search-page .mtg-card-overlay,
#advance-search-page .mtg-card-overlay,
#collection-page #grid-view .mtg-card-overlay,
#wishlist-page #grid-view .mtg-card-overlay {
  background: var(--bg-card);
  padding: .42rem .52rem .5rem;
  border-radius: 0 0 11px 11px;
}

#home-search-page .mtg-card-name,
#advance-search-page .mtg-card-name,
#collection-page #grid-view .mtg-card-name,
#wishlist-page #grid-view .mtg-card-name {
  font-size: .65rem;
  color: var(--text);
  margin-bottom: 0;
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#home-search-page .mtg-card-title-row,
#advance-search-page .mtg-card-title-row,
#collection-page #grid-view .mtg-card-title-row,
#wishlist-page #grid-view .mtg-card-title-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .45rem;
  min-width: 0;
  margin-bottom: .15rem;
}

#home-search-page .mtg-card-set-code,
#advance-search-page .mtg-card-set-code,
#collection-page #grid-view .mtg-card-set-code,
#wishlist-page #grid-view .mtg-card-set-code {
  flex: 0 0 auto;
  font-family: var(--font-display);
  font-size: .52rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-dim);
  white-space: nowrap;
}

#home-search-page .mtg-card-price,
#advance-search-page .mtg-card-price,
#collection-page #grid-view .mtg-card-price,
#wishlist-page #grid-view .mtg-card-price {
  font-size: .72rem;
  color: var(--gold);
  font-weight: 600;
}

#home-search-page .mtg-card-badge,
#advance-search-page .mtg-card-badge,
#collection-page #grid-view .mtg-card-badge,
#wishlist-page #grid-view .mtg-card-badge {
  font-size: .58rem;
  padding: .16rem .4rem;
}

#home-search-page .mtg-card-actions,
#advance-search-page .mtg-card-actions,
#wishlist-page .wishlist-card-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: .42rem;
  margin-top: .55rem;
}

#home-search-page .mtg-card-have-btn,
#advance-search-page .mtg-card-have-btn,
#home-search-page .mtg-card-wish-btn,
#advance-search-page .mtg-card-wish-btn,
#wishlist-page .wishlist-grid-move-btn,
#wishlist-page .wishlist-grid-remove-btn {
  width: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 30px;
  padding: .38rem .5rem;
  border-radius: 12px;
  font-size: .55rem;
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.15;
  white-space: nowrap;
  padding-inline: .38rem;
}

#home-search-page .mtg-card-wish-btn.is-added,
#advance-search-page .mtg-card-wish-btn.is-added,
#home-search-page .mtg-card-wish-btn:disabled,
#advance-search-page .mtg-card-wish-btn:disabled {
  background: linear-gradient(180deg, #847b6c 0%, #71695d 100%);
  border-color: rgba(191, 179, 154, .38);
  color: #f4ede3;
  cursor: not-allowed;
  opacity: 1;
  box-shadow: none;
}

[data-theme="light"] #home-search-page .mtg-card-wish-btn.is-added,
[data-theme="light"] #advance-search-page .mtg-card-wish-btn.is-added,
[data-theme="light"] #home-search-page .mtg-card-wish-btn:disabled,
[data-theme="light"] #advance-search-page .mtg-card-wish-btn:disabled {
  background: linear-gradient(180deg, #ddd2c1 0%, #d2c5b1 100%);
  border-color: #d2c5b1;
  color: #685d4d;
}

@media (min-width: 681px) {
  #home-search-page #home-grid.card-grid,
  #advance-search-page #card-grid.card-grid,
  #collection-page #grid-view.card-grid,
  #wishlist-page #grid-view.card-grid {
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 1rem;
  }

  #home-search-page .mtg-card,
  #advance-search-page .mtg-card,
  #collection-page #grid-view .mtg-card,
  #wishlist-page #grid-view .mtg-card {
    border-radius: 14px;
  }

  #home-search-page .mtg-card img,
  #advance-search-page .mtg-card img,
  #collection-page #grid-view .mtg-card img,
  #wishlist-page #grid-view .mtg-card img {
    border-radius: 0;
  }

  #home-search-page .mtg-card-overlay,
  #advance-search-page .mtg-card-overlay,
  #collection-page #grid-view .mtg-card-overlay,
  #wishlist-page #grid-view .mtg-card-overlay {
    padding: .52rem .62rem .6rem;
    border-radius: 0;
  }

  #home-search-page .mtg-card-name,
  #advance-search-page .mtg-card-name,
  #collection-page #grid-view .mtg-card-name,
  #wishlist-page #grid-view .mtg-card-name {
    font-size: .62rem;
  }

  #home-search-page .mtg-card-price,
  #advance-search-page .mtg-card-price,
  #collection-page #grid-view .mtg-card-price,
  #wishlist-page #grid-view .mtg-card-price {
    font-size: .74rem;
  }

  #home-search-page .mtg-card-have-btn,
  #advance-search-page .mtg-card-have-btn,
  #home-search-page .mtg-card-wish-btn,
  #advance-search-page .mtg-card-wish-btn,
  #wishlist-page .wishlist-grid-move-btn,
  #wishlist-page .wishlist-grid-remove-btn {
    min-height: 34px;
    font-size: .6rem;
    padding-inline: revert;
  }
}
