.shot {
  background: #080807;
}

.shot::before {
  background:
    linear-gradient(180deg, rgba(4, 4, 3, 0.08) 0%, rgba(4, 4, 3, 0.22) 48%, rgba(4, 4, 3, 0.76) 100%),
    var(--shot-image, radial-gradient(80% 60% at 50% 35%, var(--shot-hi, #2a2a28) 0%, var(--shot-mid, #161513) 55%, var(--shot-lo, #0a0908) 100%));
  background-size: cover;
  background-position: center;
}

.shot::after {
  opacity: var(--shot-glow-opacity, 0.18);
}

.shot.light::before {
  background:
    linear-gradient(180deg, rgba(244, 241, 234, 0.05) 0%, rgba(244, 241, 234, 0.22) 60%, rgba(244, 241, 234, 0.72) 100%),
    var(--shot-image, radial-gradient(80% 60% at 50% 35%, #faf7f0 0%, #ece6d6 55%, #d9d1bd 100%));
  background-size: cover;
  background-position: center;
}

.shot .tag {
  position: relative;
  z-index: 2;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.24);
}

.feed-item:has(> .shot) {
  grid-template-columns: 56px minmax(0, 1fr) auto;
  gap: 14px;
}

.feed-item:has(> .shot) > .shot {
  min-width: 56px;
}

.feed-item:has(> .shot) > div {
  min-width: 0;
}

.drop-rolex-batman {
  --shot-image: url("./rolexgmt.png");
}

.drop-psa10-charizard {
  --shot-image: url("./tradingcard.png");
}

.drop-ap-royal-oak {
  --shot-image: url("./audemar.png");
}

.drop-porsche-911 {
  --shot-image: url("./porsche.png");
}

.drop-patek-nautilus {
  --shot-image: url("./patek.png");
}

.drop-jordan-1-chicago {
  --shot-image: url("./sneakers.png");
}

.drop-birkin-25 {
  --shot-image: url("./handbag.png");
}

.drop-rolex-daytona {
  --shot-image: url("./chrono.png");
}