/* ---------- Подарок к обновлению (ui/updateGift.js): загадочный сундук, награды веером ---------- */
.ug-overlay { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; background: rgba(6,8,16,.82); backdrop-filter: blur(3px); animation: ugIn .3s ease-out; }
@keyframes ugIn { from { opacity: 0; } }
.ug-box { position: relative; width: 460px; max-width: 100%; height: 470px; text-align: center; color: #fff; }
/* заголовок — как в баннере сезона (season-banner.css) */
.ug-kicker { position: relative; font: 700 11px/1 var(--font-ui); letter-spacing: 3px; text-transform: uppercase; color: #8d96a6; margin-top: 4px; }
.ug-box h3 { position: relative; margin: 6px 0 0; font: 400 34px/1.05 'Russo One', var(--font-display); letter-spacing: .5px; color: #fff; text-shadow: 0 4px 18px rgba(0,0,0,.6); }
.ug-sub { position: relative; margin: 6px 0 0; font: 800 12px/1.3 var(--font-ui); letter-spacing: .8px; text-transform: uppercase; color: #9aa1ae; }
.ug-rays { position: absolute; left: 50%; top: 52%; width: 560px; height: 560px; margin: -280px 0 0 -280px; opacity: 0; transition: opacity .5s; pointer-events: none;
  background: repeating-conic-gradient(rgba(255,210,90,.22) 0 9deg, transparent 9deg 22deg); -webkit-mask: radial-gradient(circle, #000 15%, transparent 65%); mask: radial-gradient(circle, #000 15%, transparent 65%); animation: ugSpin 18s linear infinite; }
.ug-box.open .ug-rays { opacity: 1; }
@keyframes ugSpin { to { transform: rotate(360deg); } }
.ug-chest { position: absolute; left: 50%; top: 110px; margin-left: -115px; cursor: pointer; transform-origin: 50% 80%; transition: transform .5s, opacity .4s .25s; }
.ug-box:not(.opening) .ug-chest { animation: ugWiggle 2.2s ease-in-out infinite; }
.ug-box:not(.opening) .ug-chest:hover { filter: brightness(1.1) drop-shadow(0 0 14px rgba(180,120,255,.5)); }
@keyframes ugWiggle { 0%, 70%, 100% { transform: rotate(0); } 76% { transform: rotate(-6deg); } 84% { transform: rotate(6deg); } 92% { transform: rotate(-3deg); } }
.ug-box.opening .ug-chest { cursor: default; animation: ugHop .35s ease-out; }
@keyframes ugHop { 40% { transform: translateY(-10px) scale(1.04, .96); } }
.ug-box.open .ug-chest { transform: translateY(60px) scale(.8); opacity: 0; pointer-events: none; }
.ug-hint { position: absolute; left: 0; right: 0; top: 345px; color: #e6defc; font-weight: 600; transition: opacity .3s; }
.ug-box.opening .ug-hint { opacity: 0; }
/* награды: картинка в одинаковом квадрате, «×3» — в правом нижнем углу капсулы */
.ug-fan { position: absolute; left: 0; right: 0; top: 130px; display: flex; justify-content: center; gap: 10px; pointer-events: none; }
.ug-rw { width: 96px; padding: 8px 0 6px; border-radius: 12px; background: rgba(30,20,50,.9); border: 2px solid #b48cff; box-shadow: 0 0 18px rgba(180,140,255,.4);
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start; opacity: 0; transform: translateY(80px) scale(.3); transition: transform .6s cubic-bezier(.3,1.5,.6,1), opacity .3s; }
.ug-rw.coins { border-color: #ffd23f; box-shadow: 0 0 18px rgba(255,210,63,.45); }
.ug-box.open .ug-rw { opacity: 1; transform: none; }
.ug-box.open .ug-rw:nth-child(1) { transition-delay: .25s; } .ug-box.open .ug-rw:nth-child(2) { transition-delay: .35s; }
.ug-box.open .ug-rw:nth-child(3) { transition-delay: .45s; } .ug-box.open .ug-rw:nth-child(4) { transition-delay: .55s; }
.ug-box.taken .ug-rw { transform: translateY(-80px) scale(.5); opacity: 0; transition-delay: 0s; }
.ug-art { position: relative; width: 78px; height: 78px; display: grid; place-items: center; }
.ug-coin { width: 52px; height: 52px; } .ug-coin svg { width: 100%; height: 100%; display: block; }
.ug-cap { display: block; }
.ug-x { position: absolute; right: 2px; bottom: 6px; font: 400 15px 'Russo One', sans-serif; color: #fff; text-shadow: 0 2px 0 #000, 0 0 6px #000; }
.ug-rw small { font-size: 10px; color: #cfc6ea; line-height: 1.2; min-height: 24px; padding: 0 4px; display: flex; align-items: center; }
.ug-rw b { font: 400 13px 'Russo One', sans-serif; color: #ffd86b; }
.ug-take { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); opacity: 0; pointer-events: none; transition: opacity .3s .7s;
  border: 0; cursor: pointer; font: 700 17px/1 Oswald, sans-serif; letter-spacing: 1.5px; text-transform: uppercase; color: #2a1600; padding: 13px 34px; border-radius: 12px;
  background: linear-gradient(#ffe27a, #f5b324); box-shadow: 0 4px 0 #a8650c, 0 8px 22px rgba(255,180,40,.35); }
.ug-box.open .ug-take { opacity: 1; pointer-events: auto; }
.ug-take:hover { filter: brightness(1.08); } .ug-take:active { transform: translate(-50%, 3px); box-shadow: 0 1px 0 #a8650c; }
.ug-take:disabled { filter: grayscale(.6); cursor: default; }
.ug-overlay:has(.taken) { transition: opacity .5s .2s; opacity: 0; }
@media (max-height: 500px) { .ug-box { transform: scale(.82); } }