/* Real arena events. The winning snake keeps its color; the victim is gray. */
#killFeed{position:absolute;z-index:11;width:272px;max-width:calc(100% - var(--safe-left) - var(--safe-right) - 24px);display:flex;flex-direction:column;gap:7px;pointer-events:none;overflow:visible}
body:not(.playing) #killFeed{display:none}
.kill-notice{--notice-accent:#a4aaad;position:relative;isolation:isolate;display:flex;align-items:center;gap:8px;min-height:44px;padding:5px 8px;border:1px solid #64696d;border-radius:10px;background:linear-gradient(115deg,#16191df5,#090b0df5);box-shadow:0 3px 12px #0005;color:var(--notice-accent);animation:notice-enter .22s ease-out both,notice-out .3s ease-in 4s forwards;font:600 12px Arial,sans-serif}
.notice-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.notice-victim{text-align:right}
.notice-avatar{position:relative;flex:none;width:26px;height:26px;background:var(--snake-color);border-radius:12px 15px 13px 9px;box-shadow:inset 0 1px 0 #ffffff4d}
.notice-avatar::before,.notice-avatar::after{content:'';position:absolute;right:4px;width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:#122128}
.notice-avatar::before{top:3px}.notice-avatar::after{bottom:3px}
.notice-avatar:not(.notice-dead){background:none;box-shadow:none}
.notice-avatar:not(.notice-dead)::before,.notice-avatar:not(.notice-dead)::after{display:none}
.notice-avatar svg{display:block;width:100%;height:100%}
.notice-dead{background:linear-gradient(140deg,#8c9195,#282d32);box-shadow:inset 0 1px 0 #b9bdc24d;transform:scaleX(-1)}
.notice-dead::before,.notice-dead::after{width:7px;height:7px;right:5px;border:0;border-radius:0;background:linear-gradient(45deg,transparent 39%,#11161b 40% 60%,transparent 61%),linear-gradient(-45deg,transparent 39%,#11161b 40% 60%,transparent 61%)}
.notice-emblem{position:relative;flex:none;display:grid;place-items:center;width:30px;height:30px;color:var(--notice-accent)}
.notice-emblem svg{position:relative;width:28px;height:28px;z-index:1}
.notice-common,.notice-rare,.notice-epic,.notice-legend{border-color:var(--notice-accent);box-shadow:0 0 8px color-mix(in srgb,var(--notice-accent) 20%,transparent),0 3px 12px #0006}
.notice-common::before,.notice-rare::before,.notice-epic::before,.notice-legend::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(110deg,transparent 38%,color-mix(in srgb,var(--notice-accent) 18%,transparent) 50%,transparent 62%);background-size:280% 100%;animation:notice-sweep .65s ease-out both}
.notice-rare{border-radius:7px;background:linear-gradient(120deg,#112b39f5,#080c13f5)}
.notice-rare .notice-emblem{filter:drop-shadow(0 0 3px #6cceee99)}
.notice-epic{background:linear-gradient(120deg,#241c36f5,#0b0811f5)}
.notice-epic .notice-emblem::before,.notice-legend .notice-emblem::before{content:'';position:absolute;inset:0;border:1px solid var(--notice-accent);border-radius:50%;animation:notice-ring .75s ease-out both;pointer-events:none}
.notice-legend{background:linear-gradient(120deg,#302711f5,#120e06f5);border-radius:8px;box-shadow:inset 0 0 0 2px #f6db7215,0 0 10px #f6db7233}
.notice-legend .notice-emblem{filter:drop-shadow(0 0 4px #f6db7280)}
.notice-legend::after,.notice-epic::after{content:'';position:absolute;inset:3px;pointer-events:none;background:radial-gradient(circle at 9% 20%,var(--notice-accent) 0 1px,transparent 2px),radial-gradient(circle at 87% 80%,var(--notice-accent) 0 1px,transparent 2px),radial-gradient(circle at 57% 14%,var(--notice-accent) 0 1px,transparent 2px);animation:notice-sparks .8s ease-out both}
.notice-neutral{border-color:#4b5257;background:#111518f5;box-shadow:0 3px 10px #0005}
.notice-neutral .notice-name{flex:0 1 auto}.notice-action{white-space:nowrap;color:#a4aaad;font-weight:400;font-size:11px}
@keyframes notice-enter{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:translateX(0)}}
@keyframes notice-out{to{opacity:0;transform:translateX(12px)}}
@keyframes notice-sweep{from{background-position:100% 0;opacity:0}40%{opacity:1}to{background-position:0 0;opacity:0}}
@keyframes notice-ring{from{transform:scale(.55);opacity:0}30%{opacity:.8}to{transform:scale(1.9);opacity:0}}
@keyframes notice-sparks{from{opacity:0;transform:scale(.94)}35%{opacity:1}to{opacity:0;transform:scale(1.04)}}
@media(orientation:landscape) and (max-height:600px){#killFeed{width:232px;gap:5px}.kill-notice{min-height:34px;padding:3px 6px;gap:5px;font-size:11px}.notice-avatar{width:23px;height:24px}.notice-emblem,.notice-emblem svg{width:25px;height:25px}.notice-action{font-size:10px}}
@media(orientation:landscape) and (max-height:360px){#killFeed{width:210px}.kill-notice{min-height:30px;font-size:10px}.notice-avatar{width:21px;height:22px}.notice-emblem,.notice-emblem svg{width:22px;height:22px}}
@media(prefers-reduced-motion:reduce){.kill-notice{animation:notice-enter-static .1s linear both,notice-out-static .1s linear 4.1s forwards}.kill-notice::before,.kill-notice::after,.notice-emblem::before{animation:none!important;opacity:0}@keyframes notice-enter-static{from{opacity:0}to{opacity:1}}@keyframes notice-out-static{to{opacity:0}}}
