.tt-reward{position:absolute;left:50%;top:var(--tr-top,124px);width:352px;height:272px;z-index:6;transform:translateX(-50%) scale(var(--tr-scale,1));transform-origin:50% 0;pointer-events:none;box-sizing:border-box;padding:30px 20px 10px;display:flex;flex-direction:column;align-items:center;color:#f0e6d0;border-radius:14px;background:linear-gradient(160deg,rgba(42,34,28,.88),rgba(16,14,12,.84) 60%);/* backdrop-filter is a grouping property: on this real-game ancestor it flattens the coin's preserve-3d scene. */border:6px solid transparent;border-image:url("../assets/treasure/reward/tr-frame.webp?v=2026.10.04.12") 64/32px/0 round;box-shadow:0 18px 40px rgba(0,0,0,.55),0 0 var(--tr-glow-r,24px) var(--tr-glow-a,rgba(165,107,50,.35))}
.tt-reward[hidden]{display:none}.tt-reward *{pointer-events:none}.tt-reward.no-frame{border:1px solid rgba(245,197,66,.55);border-image:none}.tr-ribbon{position:absolute;top:-30px;left:50%;width:400px;height:75px;transform:translateX(-50%);background:url("../assets/treasure/reward/tr-ribbon.webp?v=2026.10.04.12") center/100% 100% no-repeat;display:flex;align-items:center;justify-content:center}.tr-title{font:600 16px/1 "Cinzel Lore",Georgia,serif;letter-spacing:.08em;text-transform:uppercase;color:#f0d58a;text-shadow:0 2px 0 #120c06,0 0 14px rgba(255,140,50,.35);margin-top:6px}.tr-gem{position:absolute;top:-18px;left:50%;width:48px;height:48px;margin-left:-24px;background:url("../assets/treasure/reward/tr-gems.webp?v=2026.10.04.12") 0 0/240px 48px no-repeat}.tt-reward[data-rarity=uncommon] .tr-gem{background-position:-48px 0}.tt-reward[data-rarity=rare] .tr-gem{background-position:-96px 0}.tt-reward[data-rarity=epic] .tr-gem{background-position:-144px 0}.tt-reward[data-rarity=legendary] .tr-gem{background-position:-192px 0}
.tr-stage{position:relative;width:168px;height:168px;perspective:700px;margin-top:0}.tr-coin-fx{position:absolute;left:16px;top:16px;width:136px;height:136px;will-change:transform,opacity}.tr-coin{position:relative;width:136px;height:136px;transform-style:preserve-3d;will-change:transform;filter:drop-shadow(0 0 var(--tr-r,6px) var(--tr-glow,#a56b32)) drop-shadow(0 6px 8px rgba(0,0,0,.55))}.tr-face{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;backface-visibility:hidden;-webkit-backface-visibility:hidden}.tr-back{transform:rotateY(180deg)}.tr-edge{position:absolute;left:62px;top:0;width:12px;height:136px;border-radius:50%;background:url("../assets/treasure/reward/tr-coin-edge.webp?v=2026.10.04.12") center/100% 100% no-repeat;transform:rotateY(90deg);backface-visibility:hidden;filter:var(--tr-edge-filter,none)}
.tr-aura{position:absolute;left:50%;top:50%;width:var(--tr-d,200px);height:var(--tr-d,200px);margin:calc(var(--tr-d,200px)/-2) 0 0 calc(var(--tr-d,200px)/-2);border-radius:50%;background:radial-gradient(circle,var(--tr-glow) 0,transparent 68%);opacity:var(--tr-aura-a,.3);mix-blend-mode:screen}.tr-rays,.tr-runes{position:absolute;left:50%;top:50%;background:var(--tr-glow);mix-blend-mode:screen;opacity:0}.tr-rays{width:300px;height:300px;margin:-150px 0 0 -150px;-webkit-mask:url("../assets/treasure/reward/tr-rays.webp?v=2026.10.04.12") center/contain no-repeat;mask:url("../assets/treasure/reward/tr-rays.webp?v=2026.10.04.12") center/contain no-repeat}.tr-runes{width:220px;height:220px;margin:-110px 0 0 -110px;-webkit-mask:url("../assets/treasure/reward/tr-runes.webp?v=2026.10.04.12") center/contain no-repeat;mask:url("../assets/treasure/reward/tr-runes.webp?v=2026.10.04.12") center/contain no-repeat}.tt-reward[data-rarity=epic] .tr-rays,.tt-reward[data-rarity=legendary] .tr-rays,.tt-reward[data-rarity=rare] .tr-runes,.tt-reward[data-rarity=epic] .tr-runes,.tt-reward[data-rarity=legendary] .tr-runes{opacity:.42}.tr-name{margin-top:6px;font:600 20px/1.15 "Cinzel Lore",Georgia,serif;color:#ffd98a;text-shadow:0 2px 0 #120c06,0 0 10px rgba(0,0,0,.6);white-space:nowrap;max-width:312px;overflow:hidden;text-overflow:ellipsis}.tr-meta{margin-top:4px;display:flex;gap:8px;align-items:center}.tr-chip{font:600 12px/1 "Cinzel Lore",Georgia,serif;letter-spacing:.14em;text-transform:uppercase;color:var(--tr-text);padding:3px 8px 2px;border-radius:999px;border:1px solid var(--tr-glow);background:rgba(8,8,10,.55)}.tr-note{font:italic 14px/1 "Fell Lore",Georgia,serif;color:#d8cbb0}#combat-flash,#defend-flash{z-index:8}
.tt-reward.tr-in{animation:tr-in 280ms cubic-bezier(.22,1,.36,1) both}.tr-coin-fx.tr-pop{animation:tr-pop 360ms cubic-bezier(.34,1.56,.64,1) both}.tr-coin.tr-spin-back{animation:tr-spin-back 600ms ease-in-out both}.tr-coin.tr-spin-front{animation:tr-spin-front 600ms ease-in-out both}.tr-aura.tr-breathe{animation:tr-breathe 480ms ease-in-out}.tt-reward.tr-charge .tr-aura{opacity:var(--tr-aura-a);filter:brightness(var(--tr-charge,1))}.tr-coin-fx.tr-charged{animation:tr-charge var(--tr-charge-ms,450ms) ease-in-out both}.tt-reward.tr-out{animation:tr-out 320ms ease-in both}.tt-reward.tr-mini{display:none}.tt-reward.tr-reduced .tr-rays,.tt-reward.tr-reduced .tr-runes{display:none}
@keyframes tr-in{from{opacity:0;transform:translateX(-50%) translateY(-14px) scale(calc(var(--tr-scale,1)*.94))}to{opacity:1;transform:translateX(-50%) translateY(0) scale(var(--tr-scale,1))}}@keyframes tr-pop{0%{opacity:0;transform:scale(.2) rotate(-12deg)}70%{opacity:1;transform:scale(1.12) rotate(2deg)}100%{opacity:1;transform:scale(1) rotate(0)}}@keyframes tr-spin-back{from{transform:rotateY(0)}50%{filter:drop-shadow(0 0 calc(var(--tr-r,6px)*2.6) var(--tr-glow,#a56b32)) drop-shadow(0 6px 8px rgba(0,0,0,.55)) brightness(var(--tr-charge,1.1))}to{transform:rotateY(180deg)}}@keyframes tr-spin-front{from{transform:rotateY(180deg)}50%{filter:drop-shadow(0 0 calc(var(--tr-r,6px)*2.6) var(--tr-glow,#a56b32)) drop-shadow(0 6px 8px rgba(0,0,0,.55)) brightness(var(--tr-charge,1.1))}to{transform:rotateY(360deg)}}@keyframes tr-breathe{50%{transform:scale(1.06)}}@keyframes tr-charge{50%{transform:scale(1.08);filter:drop-shadow(0 0 calc(var(--tr-r,6px)*3) var(--tr-glow)) drop-shadow(0 6px 8px rgba(0,0,0,.55)) brightness(var(--tr-charge,1))}to{transform:scale(1);filter:drop-shadow(0 0 calc(var(--tr-r,6px)*1.4) var(--tr-glow)) drop-shadow(0 6px 8px rgba(0,0,0,.55)) brightness(1)}}@keyframes tr-out{to{opacity:0;transform:translateX(-50%) scale(calc(var(--tr-scale,1)*.96))}}@media(prefers-reduced-motion:reduce){.tt-reward *,.tt-reward{animation-duration:1ms!important;transition-duration:1ms!important}.tr-rays,.tr-runes{display:none!important}}
.tt-reward.tr-loading{opacity:1}.tt-reward.tr-loading .tr-coin{visibility:hidden}.tt-reward.tr-loading .tr-stage:after{content:"";position:absolute;left:50%;top:50%;width:92px;height:92px;margin:-46px;border-radius:50%;background:radial-gradient(circle,rgba(255,248,174,.95) 0,var(--tr-glow) 34%,transparent 72%);filter:blur(3px);animation:tr-loading-pulse 900ms ease-in-out infinite}.tt-reward.tr-loading .tr-name,.tt-reward.tr-loading .tr-meta{visibility:hidden}@keyframes tr-loading-pulse{50%{transform:scale(1.16);opacity:.65}}
/* J-1003-TYPING-COIN-REPEAT: per-spin magic surge (scales with rarity via --tr-charge / --tr-aura-a) and the flight wrapper that carries the real banner coin to the chest. */
.tr-aura.tr-surge{animation:tr-surge 600ms ease-out}@keyframes tr-surge{45%{transform:scale(calc(1 + (var(--tr-charge,1.1) - 1) * .8));opacity:calc(var(--tr-aura-a,.3) * 2.6)}}
.tr-fly{position:absolute;width:136px;height:136px;z-index:9;pointer-events:none;transform:translate(-50%,-50%);will-change:transform}.tr-fly .tr-coin{left:0;top:0}

/* J-1004-COIN-FIX12: keep every 3-D operation on the preserve-3d coin. */
.tr-stage{perspective:none}
.tr-coin-fx{perspective:700px;filter:drop-shadow(0 0 var(--tr-r,6px) var(--tr-glow,#a56b32)) drop-shadow(0 6px 8px rgba(0,0,0,.55))}
.tr-coin{filter:none}
@keyframes tr-spin-back{from{transform:rotateY(0)}to{transform:rotateY(180deg)}}
@keyframes tr-spin-front{from{transform:rotateY(180deg)}to{transform:rotateY(360deg)}}
@keyframes tr-spin-glow{50%{filter:drop-shadow(0 0 calc(var(--tr-r,6px)*2.6) var(--tr-glow,#a56b32)) drop-shadow(0 6px 8px rgba(0,0,0,.55)) brightness(var(--tr-charge,1.1))}}
.tr-coin-fx.tr-spin-glow{animation:tr-spin-glow 600ms ease-in-out both}
