/* One row of relics, one shared description, one deliberate pick. */
.reward-view { scrollbar-gutter: auto; }
.reward-view .shop-scenery::after { background: linear-gradient(#191d2455, #191d24bd 24%, #191d24d9 60%, #191d2490); }
.boss-reward { --reward-ink: #f1e6cc; --reward-gold: #e2c48c; position: relative; flex-shrink: 0; display: grid; gap: 18px; width: min(100%, 680px); margin: auto; padding: 24px max(18px, env(safe-area-inset-right)) 24px max(18px, env(safe-area-inset-left)); color: var(--reward-ink); }
.reward-heading { text-align: center; }
.reward-heading h2 { font: clamp(25px, 5vw, 32px)/1.15 Georgia, serif; text-wrap: balance; text-shadow: 0 2px #191d24; }
.relic-offers { display: grid; grid-template-columns: repeat(var(--relic-count), minmax(0, 1fr)); gap: clamp(8px, 2vw, 24px); justify-self: center; width: min(100%, calc(var(--relic-count) * 200px)); }
.relic-choice { position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; min-width: 0; padding: 16px 6px 12px; border: 0; border-bottom: 2px solid #cfbe9838; border-radius: 3px 3px 0 0; color: inherit; background: transparent; text-align: center; transition: background-color .16s, border-color .16s; }
.relic-choice.chosen { border-color: var(--reward-gold); background: #cfbe9814; }
.relic-art { display: block; flex-shrink: 0; width: clamp(64px, 18vw, 112px); max-width: 100%; aspect-ratio: 1; transition: transform .18s ease-out; }
.relic-art .relic-painting { --art-shadow: drop-shadow(3px 5px 0 #10141d55); }
.relic-choice.chosen .relic-art { transform: translateY(-3px); }
.relic-choice > strong { font: clamp(14px, 3.6vw, 18px)/1.25 Georgia, serif; overflow-wrap: anywhere; }
.relic-select-mark { position: absolute; top: 2px; inset-inline-end: 3px; width: 16px; height: 16px; color: var(--reward-gold); visibility: hidden; }
.relic-select-mark .icon { width: 100%; height: 100%; }
.chosen .relic-select-mark { visibility: visible; }
.relic-detail { display: grid; align-items: center; justify-self: center; width: min(100%, 400px); min-height: 4.5em; color: #d2d1c9; font-size: 14px; line-height: 1.5; text-align: center; text-wrap: pretty; }
.relic-actions { justify-self: center; width: min(100%, 300px); }
.reward-primary { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 48px; padding: 10px 16px; border: 1px solid #f2dba7; border-bottom: 3px solid #a98d5d; border-radius: 4px; color: #29262b; background: #e2c48c; font-size: 15px; line-height: 1.3; font-weight: 650; }
.reward-primary:disabled { opacity: 1; color: #bbb8ad; border-color: #696653; background: #393b37; }
.reward-primary .icon { width: 18px; height: 18px; flex-shrink: 0; }
.reward-open-gate { display: grid; place-items: center; padding-block: 16px; color: var(--reward-gold); }
.reward-open-gate > .icon { width: 64px; height: 64px; stroke-width: 1; }
.reward-next-area { text-align: center; color: #d2d1c9; }
@media (hover: hover) {
  .relic-choice:not(:disabled):hover { background: #cfbe9814; border-color: #cfbe9880; }
  .relic-choice.chosen:hover { border-color: var(--reward-gold); }
  .reward-primary:not(:disabled):hover { background: #f0d6a3; }
}
@media (max-width: 359px) {
  .boss-reward { padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right)); gap: 14px; }
}
@media (max-height: 480px) {
  .boss-reward { padding-block: 8px; gap: 8px; }
  .reward-heading h2 { font-size: 23px; }
  .relic-art { width: 64px; }
  .relic-choice { padding-block: 8px; gap: 6px; }
  .relic-detail { min-height: 3em; }
}
:lang(ar) :is(.reward-heading h2, .relic-choice > strong), :lang(ko) :is(.reward-heading h2, .relic-choice > strong) { font-family: inherit; }
@media (prefers-reduced-motion: reduce) { .relic-choice, .relic-art { transition: none; } }