/* Shared live artwork: event page, equipped badge, avatar and store preview. */
.hw-relic { position:relative; display:inline-block; flex-shrink:0; width:var(--hw-size,128px); height:var(--hw-size,128px); isolation:isolate; vertical-align:middle; pointer-events:none; }
.hw-relic.hw-relic > img.hw-layer { position:absolute; inset:0; width:100%; height:100%; max-width:none; margin:0; object-fit:contain; animation:none; filter:none; transform-origin:50% 50%; }
.hw-relic.hw-relic > img.hw-body { z-index:2; filter:drop-shadow(0 2px 2px #09061880); }
.hw-relic.hw-relic > img.hw-light { z-index:3; animation:hw-light 3.6s ease-in-out infinite; filter:drop-shadow(0 0 2px #e4bbff); }
.hw-relic.hw-relic > img.hw-orbit { z-index:3; animation:hw-orbit 14s linear infinite; filter:drop-shadow(0 0 1px #ffa343); }
.hw-relic.hw-relic > img.hw-wing-left { z-index:4; transform-origin:28% 30%; animation:hw-wing-left 5s ease-in-out infinite; }
.hw-relic.hw-relic > img.hw-wing-right { z-index:4; transform-origin:72% 30%; animation:hw-wing-right 5s ease-in-out infinite; }
.hw-relic.hw-relic > img.hw-fire { z-index:5; animation:hw-fire 3s ease-in-out infinite; filter:drop-shadow(0 0 2px #ff9a2a); }
.hw-relic > .hw-spark { position:absolute; z-index:6; width:4%; height:4%; border-radius:1px; background:#ffe8ba; box-shadow:0 0 6px #ecb2ff; left:18%; top:53%; animation:hw-spark 5s ease-in-out infinite; }
.hw-relic > .hw-spark:nth-last-child(2) { left:76%; top:64%; animation-delay:-1.7s; background:#ccaeff; }
.hw-relic > .hw-spark:last-child { left:49%; top:14%; animation-delay:-3.4s; }
.hw-relic[data-halloween-art='guardian'] > .hw-spark { background:#ffcb72; box-shadow:0 0 5px #ff842c; }
.hw-relic[data-hw-compact='true'] > .hw-spark { display:none; }
.hw-profile { position:relative; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; vertical-align:middle; }
.hw-profile > .hw-relic { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2; }
.hw-avatar { display:grid; place-items:center; width:64%; height:64%; border-radius:50%; background:radial-gradient(circle at 35% 20%,#70607c,#24172f); background-size:cover; background-position:center; color:#f5e7d1; font:700 30px/1 Georgia,serif; }
.hw-profile[data-mode='tight'] > .hw-avatar { width:100%; height:100%; }
.hw-profile[data-mode='tight'] > .hw-relic { width:134%; height:134%; }
.hw-relic[data-hw-paused='true'] *, .hw-profile[data-hw-paused='true'] *, .paused .hw-relic * { animation-play-state:paused!important; }
@keyframes hw-orbit { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@keyframes hw-light { 0%,100% { opacity:.35; } 50% { opacity:1; } }
@keyframes hw-fire { 0%,100% { opacity:.45; } 45% { opacity:1; } 65% { opacity:.65; } }
@keyframes hw-wing-left { 50% { transform:rotate(-5deg); } }
@keyframes hw-wing-right { 50% { transform:rotate(5deg); } }
@keyframes hw-spark { 0%,100% { transform:translateY(0) rotate(45deg) scale(.35); opacity:0; } 45% { opacity:1; } 85% { transform:translateY(-14px) rotate(135deg) scale(.85); opacity:0; } }
@media(prefers-reduced-motion:reduce) { .hw-relic.hw-relic > img.hw-layer, .hw-relic > .hw-spark { animation:none!important; } .hw-relic > .hw-spark { display:none; } }

/* ── Kor Dükkânı (2026-10-01) ───────────────────────────────────────────────
   İsim efekti önizlemeleri uygulamadaki gerçek efektle aynı palet ve hareket
   (raidcall-desktop shell.module.css .name-fx-halloween-2026-*, koyu tema). */
.name-art { display:inline-block; font-family:Georgia,serif; font-size:24px; letter-spacing:1px; line-height:1.2; color:transparent; -webkit-text-fill-color:transparent; background-clip:text; -webkit-background-clip:text; }
.large-art .name-art { font-size:42px; }
@media(max-width:950px) { .name-art { font-size:20px; } .large-art .name-art { font-size:38px; } }
.name-art[data-name-art='whisper'] {
  background-image:radial-gradient(ellipse 21px 9px at 50% 56%,#8b5cf6f2 0%,#8b5cf680 48%,#8b5cf600 100%),radial-gradient(ellipse 34px 11px at 50% 44%,#6d28d9d1 0%,#6d28d900 100%),linear-gradient(180deg,#ffe7a1 0%,#ffbb4d 30%,#ff7d1f 62%,#d9480f 100%);
  background-size:84px 100%,136px 100%,100% 170%; background-repeat:repeat-x,repeat-x,no-repeat; background-position:0 50%,20px 50%,50% 40%;
  filter:drop-shadow(0 0 2.5px #ff8a28b3) drop-shadow(0 0 7px #7c3aed8c); animation:whisper 4.5s linear infinite;
}
.name-art[data-name-art='bloodmoon'] {
  background-image:radial-gradient(circle 20px at 50% 52%,#ff9678f2 0%,#ff4040b3 38%,#ff404000 72%),linear-gradient(180deg,#ff6a5c 0%,#e0242f 46%,#8e0f20 100%);
  background-size:110px 100%,100% 100%; background-repeat:repeat-x,no-repeat; background-position:0 50%,50% 50%;
  filter:drop-shadow(0 0 2.5px #ff2e40b3) drop-shadow(0 0 7px #96001880); animation:name-bloodmoon 5s linear infinite;
}
.name-art[data-name-art='potion'] {
  background-image:radial-gradient(circle at 30% 70%,#ecffbeb3 0 .9px,transparent 1.7px),radial-gradient(circle at 72% 35%,#d9ff9a8c 0 .7px,transparent 1.4px),linear-gradient(0deg,#15803d 0%,#22c55e 38%,#a3e635 72%,#ecff8f 100%);
  background-size:14px 16px,22px 20px,100% 100%; background-repeat:repeat,repeat,no-repeat; background-position:0 0,5px 0,50% 50%;
  filter:drop-shadow(0 0 2.5px #84ff5a99) drop-shadow(0 0 6px #7c3aed59); animation:name-potion 2.4s linear infinite;
}
.name-art[data-name-art='graveyard'] {
  background-image:radial-gradient(ellipse 24px 9px at 50% 58%,#334155d9 0%,#33415500 100%),radial-gradient(ellipse 36px 10px at 50% 40%,#1e293bb3 0%,#1e293b00 100%),linear-gradient(180deg,#f1f8f3 0%,#c3d6ca 46%,#84a092 100%);
  background-size:90px 100%,150px 100%,100% 100%; background-repeat:repeat-x,repeat-x,no-repeat; background-position:0 50%,30px 50%,50% 50%;
  filter:drop-shadow(0 0 3px #c8e8d78c) drop-shadow(0 0 8px #6e968759); animation:name-graveyard 7s linear infinite;
}
@keyframes name-bloodmoon { to { background-position:110px 50%,50% 50%; } }
@keyframes name-potion { to { background-position:0 -16px,5px -20px,50% 50%; } }
@keyframes name-graveyard { to { background-position:90px 50%,-120px 50%,50% 50%; } }

/* Yarasa Sürüsü / Örümcek Ağı: arka katman · avatar · ön katman (512 tuval,
   avatar %72 — uygulamadaki tarifle aynı oran). */
.hw-frame { position:relative; display:inline-block; flex-shrink:0; width:var(--hw-size,108px); height:var(--hw-size,108px); vertical-align:middle; pointer-events:none; }
.hw-frame.hw-frame > img { position:absolute; inset:0; width:100%; height:100%; max-width:none; margin:0; object-fit:contain; filter:none; animation:none; transform-origin:50% 50%; }
.hw-frame > .hw-frame-back { z-index:0; }
.hw-frame > .hw-avatar { position:absolute; left:14%; top:14%; width:72%; height:72%; z-index:1; font-size:calc(var(--hw-size,108px) * .26); }
.hw-frame > .hw-frame-front { z-index:2; }
.hw-frame.hw-frame[data-frame='batswarm'] > img.hw-frame-back { animation:hw-ring-pulse 3.2s ease-in-out infinite; }
.hw-frame.hw-frame[data-frame='batswarm'] > img.hw-frame-front { animation:hw-orbit 14s linear infinite; }
.hw-frame.hw-frame[data-frame='spiderweb'] > img.hw-frame-back { animation:hw-web-breathe 6s ease-in-out infinite; }
.hw-frame.hw-frame[data-frame='spiderweb'] > img.hw-frame-front { transform-origin:72.7% 0; animation:hw-spider-bob 3.6s ease-in-out infinite; }
.large-art .hw-frame { --hw-size:176px; }
@keyframes hw-ring-pulse { 0%,100% { opacity:.72; } 50% { opacity:1; } }
@keyframes hw-web-breathe { 50% { transform:scale(1.012); } }
@keyframes hw-spider-bob { 0%,100% { transform:translateY(0) rotate(-3deg); } 50% { transform:translateY(3.5%) rotate(3deg); } }
.paused .hw-frame *, .paused .name-art { animation-play-state:paused!important; }

/* Henüz dükkâna gelmemiş ürün: önizleme görünür ama soluk. */
.reward.locked .reward-art { opacity:.55; filter:saturate(.55); }
.reward.locked .reward-cost { opacity:.7; }
@media(prefers-reduced-motion:reduce) { .hw-frame.hw-frame > img, .name-art { animation:none!important; } }

/* Satıştan kalkmış ürün (haftalık satış bitti) ve satışın son günleri. */
.reward.ended .reward-art { opacity:.5; filter:saturate(.4); }
.reward.ended .reward-cost { opacity:.6; }
.reward-top strong.sale-ending { color:#ffb35c; font-weight:600; }

/* Final ödülü (Kabak Muhafızı) — 2026-10-02: dükkân 11 ürüne inince son satırda
   tek başına kalıyordu. Geniş ekranda ve telefonda satırın tamamını kaplayan
   yatay "final" kartı olur (sol: çerçeve, orta: ad/tür/fiyat, sağ: düğme);
   3 sütunlu ara genişlikte (3+3+3+2) normal kart kalır. */
@media (min-width: 901px), (max-width: 650px) {
  .reward[data-reward-art='guardian'] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr) minmax(190px, 260px);
    grid-template-rows: auto auto auto auto;
    column-gap: 24px;
    align-items: center;
  }
  .reward[data-reward-art='guardian'] .reward-top { grid-column: 1 / -1; grid-row: 1; }
  .reward[data-reward-art='guardian'] .reward-art { grid-column: 1; grid-row: 2 / 5; height: 140px; margin: 4px 0; }
  .reward[data-reward-art='guardian'] h3 { grid-column: 2; grid-row: 2; min-height: 0; padding-top: 0; font-size: 18px; align-self: end; }
  .reward[data-reward-art='guardian'] .reward-type { grid-column: 2; grid-row: 3; }
  .reward[data-reward-art='guardian'] .reward-cost { grid-column: 2; grid-row: 4; margin-top: 6px; align-self: start; }
  .reward[data-reward-art='guardian'] .reward-action { grid-column: 3; grid-row: 2 / 5; margin-top: 0; }
}
@media (max-width: 650px) {
  .reward[data-reward-art='guardian'] { grid-template-columns: 112px minmax(0, 1fr); column-gap: 14px; }
  .reward[data-reward-art='guardian'] .reward-art { grid-row: 2 / 5; height: 112px; }
  .reward[data-reward-art='guardian'] .reward-art .hw-relic,
  .reward[data-reward-art='guardian'] .reward-art .hw-profile { --hw-size: 108px; width: 108px; height: 108px; }
  .reward[data-reward-art='guardian'] .reward-action { grid-column: 1 / -1; grid-row: 5; margin-top: 12px; }
}