﻿/* ---------- Награды за матч (ui/dropReveal.js): справа от рейтинга, без рамок; сундук — у всех, монетки — свои ---------- */
.rkr-rewards, .go-rewards { position: relative; display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; }
.rkr-rewards:empty, .go-rewards:empty { display: none; }
.rkr-row.final .rkr-rating { flex-wrap: nowrap; }
.rkr-rating .rkr-rewards { margin-left: auto; }
#overlay .rank-row > span:last-child { white-space: nowrap; }
/* место под сундук одной ширины во всех строках — сундуки стоят ровно друг под другом */
.dr-chest-slot { display: inline-flex; justify-content: center; width: 48px; height: 32px; }

.dr-item { display: inline-flex; align-items: center; gap: 4px; opacity: 0; }
.dr-item b { font-family: var(--font-display); font-size: 18px; line-height: 1; color: #ffd23f; font-variant-numeric: tabular-nums; text-shadow: 0 0 10px rgba(255,210,63,.35); }
.dr-item.coins { animation: drCoinIn .4s ease-out both; }
@keyframes drCoinIn { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: none; } }
.dr-coin { display: inline-flex; width: 24px; height: 24px; flex: none; }
.dr-coin svg { width: 100%; height: 100%; }
#overlay .go-rewards .dr-item b { font-size: 15px; }
#overlay .go-rewards .dr-coin { width: 19px; height: 19px; }
.dr-pulse { animation: drPulse .22s ease-out; }
@keyframes drPulse { 40% { transform: scale(1.3); } }

/* сундук-«печать»: огромный, с размаху впечатывается в строку; дальше мягко светится цветом сундука */
.dr-item.chest { animation: drStamp .45s cubic-bezier(.6,0,.9,.5) both, drChestGlow 2s ease-in-out infinite; }
.dr-item.chest canvas { width: 48px; height: 44px; margin: -6px 0; }
@keyframes drStamp { 0% { opacity: 0; transform: scale(3.2) rotate(-12deg); } 60% { opacity: 1; transform: scale(.88) rotate(0); } 80% { transform: scale(1.06); } 100% { opacity: 1; transform: none; } }
/* строка вздрагивает от удара */
.dr-shake { animation: drShake .35s ease-out; }
@keyframes drShake { 20% { transform: translate(-3px, 2px); } 40% { transform: translate(3px, -1px); } 60% { transform: translate(-2px, 1px); } 80% { transform: translate(1px, 0); } }
@keyframes drChestGlow { 0%, 100% { filter: drop-shadow(0 0 2px var(--glow)); } 50% { filter: drop-shadow(0 0 9px var(--glow)); } }
/* блик пробегает по строке, когда в неё падает сундук */
.dr-row { position: relative; }
.dr-sweep { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
  background: linear-gradient(100deg, transparent 30%, rgba(255,240,200,.22) 48%, rgba(255,255,255,.35) 50%, rgba(255,240,200,.22) 52%, transparent 70%) no-repeat;
  background-size: 250% 100%; animation: drSweep .8s ease-out both; }
@keyframes drSweep { 0% { opacity: 1; background-position: 120% 0; } 100% { opacity: 1; background-position: -30% 0; } }
/* холст луча, вспышки и искр — над итогами, нажатия проходят сквозь него */
.dr-fx { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 400; pointer-events: none; }

/* победитель сверху итогов рейтинга: крупный живой персонаж на золотом сиянии и ник */
.rkr-champ { position: relative; display: flex; flex-direction: column; align-items: center; margin: -10px 0 4px; }
.rkr-champ::before { content: ''; position: absolute; top: 10px; left: 50%; width: 260px; height: 190px; transform: translateX(-50%);
  background: radial-gradient(circle, rgba(255,210,63,.26), transparent 65%); pointer-events: none; }
.rkr-champ canvas { position: relative; width: 300px; height: 230px; max-width: 100%; }
.rkr-champ b { position: relative; margin-top: -30px; font-family: var(--font-display); font-size: 22px; letter-spacing: .5px; color: #ffd23f; line-height: 1.1; }
