/* Prominent paid-hunt bonus banner. Kept versioned separately so live clients
   receive this UI without waiting for the main stylesheet cache to expire. */
.area-detail-bonus-strip {
  position: relative;
  display: grid;
  grid-template-columns: 1.12fr repeat(3, minmax(0, 1fr));
  gap: 6px;
  max-width: 620px;
  margin: -6px 0 13px;
  padding: 7px;
  overflow: hidden;
  border: 1px solid rgba(250, 204, 21, .48);
  border-radius: 12px;
  background: linear-gradient(110deg, rgba(66, 45, 5, .9), rgba(6, 25, 20, .9));
  box-shadow: 0 0 24px rgba(250, 204, 21, .13), inset 0 1px rgba(255, 255, 255, .08);
  backdrop-filter: blur(10px);
}
.area-detail-bonus-strip[hidden] { display: none; }
#areasHudPanel[data-area-id^="golden-hunt-"] .area-detail-bonus-strip[hidden] { display: grid; }
.area-detail-bonus-strip::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .08) 47%, transparent 63%);
  animation: paidHuntBonusSweep 3.2s ease-in-out infinite;
}
.area-detail-bonus-heading { display:flex; align-items:center; gap:7px; padding:0 7px; color:#fde68a; font:700 6px/1.55 var(--font-game, 'Press Start 2P', monospace); letter-spacing:.65px; }
.area-detail-bonus-heading i { width:7px; height:7px; flex:0 0 auto; border-radius:50%; background:#facc15; box-shadow:0 0 11px #facc15; animation:paidHuntBonusPulse 1.25s ease-in-out infinite alternate; }
.area-detail-bonus { display:flex; align-items:center; justify-content:center; gap:7px; min-width:0; padding:7px 8px; border:1px solid rgba(255,255,255,.1); border-radius:8px; background:rgba(1,12,10,.68); }
.area-detail-bonus-icon { font-size:13px; line-height:1; filter:drop-shadow(0 0 5px currentColor); }
.area-detail-bonus > span:last-child { display:flex; min-width:0; flex-direction:column; gap:3px; }
.area-detail-bonus strong { font:900 11px/1 var(--font-game, 'Press Start 2P', monospace); }
.area-detail-bonus small { color:#9aada4; font:700 5px/1.2 var(--font-game, 'Press Start 2P', monospace); white-space:nowrap; }
.area-detail-bonus-drops { color:#67e8f9; border-color:rgba(34,211,238,.24); }
.area-detail-bonus-exp { color:#bef264; border-color:rgba(163,230,53,.28); }
.area-detail-bonus-variant { color:#f9a8d4; border-color:rgba(244,114,182,.28); }
@keyframes paidHuntBonusSweep { 0%,45% { transform:translateX(-115%); } 75%,100% { transform:translateX(115%); } }
@keyframes paidHuntBonusPulse { to { opacity:.45; transform:scale(.72); } }
@media (max-width: 980px) {
  .area-detail-bonus-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .area-detail-bonus-heading { grid-column:1/-1; padding:2px 5px 0; }
}
@media (max-width: 680px) {
  .area-detail-bonus-strip { gap:4px; padding:5px; }
  .area-detail-bonus { gap:4px; padding:6px 4px; }
  .area-detail-bonus-icon { display:none; }
  .area-detail-bonus strong { font-size:9px; }
  .area-detail-bonus small { font-size:4.5px; }
}