.gift-reaction { position:fixed; inset:50% auto auto 50%; transform:translate(-50%,-50%); margin:0; z-index:6000; display:grid; justify-items:center; gap:8px; width:min(290px,calc(100vw - 40px)); padding:25px 25px 23px; border:1px solid var(--tc-line); border-radius:24px; background:var(--tc-surface); color:var(--tc-text); box-shadow:0 18px 90px #0f294440; text-align:center; pointer-events:none; animation:gift-reaction-in 260ms cubic-bezier(.16,1,.3,1) both; }
.gift-reaction::backdrop { background:transparent; pointer-events:none; }
.gift-reaction > button { position:absolute; top:4px; right:4px; width:44px; height:44px; padding:0; border-radius:50%; font-size:22px; color:var(--tc-muted); background:none; border:0; pointer-events:auto; }
.gift-reaction-picture { display:grid; place-items:center; width:105px; height:105px; margin-bottom:6px; border-radius:50%; background:radial-gradient(circle,var(--tc-accent-soft),transparent 72%); }
.gift-reaction-picture svg { width:85px; height:85px; stroke:var(--tc-accent); }
.gift-reaction-sender { margin:0; color:var(--tc-muted); font-size:12px; line-height:1.65; overflow-wrap:anywhere; }
.gift-reaction-name { font-size:21px; font-weight:750; line-height:1.4; overflow-wrap:anywhere; }
.gift-reaction-value { font-size:11px; color:var(--tc-accent); font-weight:600; }
@keyframes gift-reaction-in { from { opacity:0; transform:translate(-50%,calc(-50% + 12px)) scale(.84); } to { opacity:1; transform:translate(-50%,-50%) scale(1); } }
@media(prefers-reduced-motion:reduce) { .gift-reaction { animation:none; } }
