/* Shared Ripstack card back: draw, unopened cards, catalog, and daily rewards.
   The hero artwork is deliberately outside this component. */
.ripstack-slab {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pack-wrapper > .ripstack-slab {
  position: absolute;
  inset: 0;
}

.unopened-card {
  border: 0;
  background: none;
  border-radius: 0;
  height: auto;
  aspect-ratio: 2 / 3;
  filter: drop-shadow(7px 12px 12px #0006);
}

.unopened-card::before {
  content: none;
}

.empty-collection .empty-icon {
  display: block;
  width: 56px;
  height: 84px;
  flex-shrink: 0;
  transform: rotate(-9deg);
}

.empty-stack-card {
  width: 96px;
  height: 144px;
  margin: 0 auto 20px;
  transform: rotate(-7deg);
}

.bot-wallet-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.bot-wallet-link span {
  color: var(--lime, #c7ff3e);
  font-variant-numeric: tabular-nums;
}

.social-x-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  color: #b9c9ad;
  border-radius: 50%;
  transition: color .2s ease, background-color .2s ease;
}
.social-x-link .icon { width: 16px; height: 16px; }
.social-x-link:hover { color: #c7ff3e; background: #c7ff3e0c; }
.social-x-link:focus-visible, .social-x-footer:focus-visible {
  outline: 2px solid #c7ff3e;
  outline-offset: 4px;
}
.social-x-footer { display: inline-flex; align-items: center; gap: 7px; }
.social-x-footer .icon { width: 12px; height: 12px; }
@media (max-width: 600px) {
  .header-actions .social-x-link { display: none; }
}

@media (max-width: 560px) {
  .empty-collection .empty-icon {
    width: 44px;
    height: 66px;
  }
}