/* Share card — plain CSS, no @apply. */
.share-card {
  background: #000;
  color: #fff;
  font-family: "DM Sans", sans-serif;
  border-radius: 16px;
  overflow: hidden;
  position: relative;
}
.share-card.classic {
  width: 1080px;
  height: 1350px;
  background: linear-gradient(180deg, #0A0A0A 0%, #1a2b22 100%);
}
.share-card.story {
  width: 1080px;
  height: 1920px;
  background: linear-gradient(180deg, #0A0A0A 0%, #1a2b22 100%);
}
.share-card.minimal {
  width: 1080px;
  height: 1080px;
  background: #111;
}
.share-card .route-canvas { position: absolute; inset: 0; }
.share-card .stats-bar {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.share-card .stat-item { text-align: center; }
.share-card .stat-value {
  font-size: 2.5rem;
  font-weight: 700;
  font-family: "DM Sans", sans-serif;
  color: #fff;
}
.share-card .stat-label {
  font-size: 0.875rem;
  color: #4ade80;
  font-weight: 600;
  margin-top: 4px;
}
.share-card .user-info {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}
.share-card .user-name {
  font-size: 1.25rem;
  font-weight: 700;
  color: #fff;
}
.share-card .user-date { color: #4ade80; margin-top: 4px; }
.share-card .brand {
  position: absolute;
  bottom: 24px;
  left: 24px;
  color: #4ade80;
  font-weight: 700;
  font-size: 1rem;
  display: flex;
  align-items: center;
  gap: 8px;
}
.share-card .swipe-hint {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  color: #a3a3a3;
  font-size: 0.875rem;
}