/* Compact, unboxed vitals: shield above health, icons left, values right. */
#hud #healthPanel{width:clamp(250px,27vw,380px);display:flex;flex-direction:column;gap:8px;background:none;border:0;box-shadow:none}
#hud #shieldPanel,#hud #healthMeter{display:grid;grid-template-columns:24px minmax(0,1fr) 43px;align-items:center;gap:9px;margin:0;padding:0;min-width:0;color:#fff}
#hud #shieldPanel{order:0}#hud #healthMeter{order:1}
#hud #healthPanel .vital-icon{display:grid;place-items:center;width:24px;height:30px;margin:0;padding:0;background:none;border:0;border-radius:0;color:#fff;filter:drop-shadow(0 2px 2px #061522cc)}
#hud .vital-icon svg{width:22px;height:22px;fill:currentColor}
#hud #health,#hud #shieldValue{font:1000 25px/1 Arial,Helvetica,sans-serif;letter-spacing:-.5px;color:#fff;font-variant-numeric:tabular-nums;text-align:left;text-shadow:0 2px 0 #071a28,0 0 4px #061522;-webkit-text-stroke:.4px #fff}
#hud #healthPanel .health-track,#hud #healthPanel .shield-track{position:relative;overflow:hidden;width:100%;margin:0;padding:0;border:0;border-radius:0;outline:1px solid #06152299;box-shadow:0 2px 4px #06152266;background:#0d151b80}
#hud #healthPanel .health-track{height:34px}#hud #healthPanel .shield-track{height:22px}
#hud #healthBar,#hud #shieldBar{display:block;position:relative;overflow:hidden;height:100%;margin:0;border:0;border-radius:0;box-shadow:none;transition:width .16s ease-out}
#hud #healthBar{background:#26df18}#hud #shieldBar{background:linear-gradient(90deg,#0098df,#13c4ff)}
#hud #healthBar:after,#hud #shieldBar:after{content:'';position:absolute;right:0;top:0;bottom:0;width:5px;background:#ffffff99}
#hud #healthPanel #plateButton{position:relative;inset:auto;order:2;width:calc(100% - 29px);max-width:175px;min-height:38px;margin:3px 0 0 29px;padding:6px 9px;background:#132c3d8c;border-color:#b6e6ff33;border-radius:3px;gap:7px}
#hud #healthPanel #plateButton .plate-icon{font-size:20px}#hud #healthPanel #plateButton>span:nth-child(2){display:flex;align-items:center;justify-content:space-between;gap:8px}
#hud #statusText{order:3;margin-left:29px;line-height:1.4;font-size:7px;letter-spacing:.9px;text-shadow:0 1px 2px #071725}
/* A translucent, square-edged panel pulses once for each elimination. */
#hud #killSplash{grid-template-columns:40px minmax(0,1fr) 40px;gap:9px;padding:13px 12px;text-align:center;justify-items:center;background:linear-gradient(110deg,#102b3d70,#102b3d47);border:1px solid #b9e4eb40;border-radius:2px;box-shadow:0 6px 22px #06152226;backdrop-filter:none;text-shadow:0 2px 4px #061522cc}
#hud #killSplash.show{animation:elimination-panel-pulse .56s ease-out both}
#hud #killSplash:before,#hud #killSplash:after,#hud #killSplash .kill-sparks{display:none;content:none}
#hud #killSplash .kill-emblem svg{fill:none}
#hud #killSplash .kill-copy,#hud #killSplash .kill-reward{align-items:center;min-width:0;background:none;border:0;box-shadow:none;text-align:center}
#hud #killSplash .kill-copy{width:100%}#hud #killSplash #killDetail{max-width:100%;overflow:hidden;text-overflow:ellipsis}
#hud #killSplash #killDistance{background:none;border:0;box-shadow:none;padding:0}
@keyframes elimination-panel-pulse{0%{opacity:0;transform:translate(-50%,8px) scale(.9);box-shadow:0 0 0 0 #ffffff00}32%{opacity:1;transform:translate(-50%,0) scale(1.055);box-shadow:0 0 0 3px #ffffff20,0 0 24px #ffffff20}58%{opacity:1;transform:translate(-50%,0) scale(.985);box-shadow:0 0 0 1px #ffffff10}80%{opacity:1;transform:translate(-50%,0) scale(1.012)}100%{opacity:1;transform:translate(-50%,0) scale(1);box-shadow:0 6px 22px #06152226}}
@media(max-height:520px){#hud #killSplash{grid-template-columns:33px minmax(0,1fr) 33px;gap:8px;padding:10px}}
body.touch-mode #hud #healthPanel{width:min(265px,calc(100vw - 48px));gap:6px}
body.touch-mode #hud #shieldPanel,body.touch-mode #hud #healthMeter{grid-template-columns:20px minmax(0,1fr) 36px;gap:7px}
body.touch-mode #hud #healthPanel .vital-icon{width:20px;height:25px}body.touch-mode #hud .vital-icon svg{width:19px;height:19px}
body.touch-mode #hud #health,body.touch-mode #hud #shieldValue{font-size:22px}
body.touch-mode #hud #healthPanel .health-track{height:28px}body.touch-mode #hud #healthPanel .shield-track{height:18px}
body.touch-mode #hud #healthPanel #plateButton{min-height:44px;margin-left:23px;width:calc(100% - 23px)}body.touch-mode #hud #statusText{margin-left:23px;font-size:6px}
@media(orientation:portrait){body.touch-mode #hud #healthPanel{bottom:calc(env(safe-area-inset-bottom) + 210px)}body.touch-mode #hud #healthPanel #plateButton{max-width:108px}body.touch-mode #hud #healthPanel #plateButton>span:nth-child(2){display:grid;justify-content:start;gap:2px}body.touch-mode #hud #healthPanel #plateButton b{font-size:8px}body.touch-mode #hud #healthPanel #plateButton kbd{display:none}body.touch-mode #hud #killSplash{top:auto;bottom:calc(env(safe-area-inset-bottom) + 350px)}}
@media(orientation:landscape){body.touch-mode #hud .hud-bottom #healthPanel{width:100%;gap:5px}body.touch-mode #hud #shieldPanel,body.touch-mode #hud #healthMeter{grid-template-columns:17px minmax(0,1fr) 31px;gap:5px}body.touch-mode #hud #health,body.touch-mode #hud #shieldValue{font-size:19px}body.touch-mode #hud #healthPanel .vital-icon{width:17px;height:22px}body.touch-mode #hud .vital-icon svg{width:17px;height:17px}body.touch-mode #hud #healthPanel .health-track{height:23px}body.touch-mode #hud #healthPanel .shield-track{height:15px}body.touch-mode #hud #healthPanel #plateButton{margin-left:22px;width:calc(100% - 22px);padding:5px;gap:4px}body.touch-mode #hud #healthPanel #plateButton b{font-size:7px}body.touch-mode #hud #healthPanel #plateButton small{font-size:9px}body.touch-mode #hud #statusText{margin-left:22px;font-size:5px}}
@media(prefers-reduced-motion:reduce){#hud #healthBar,#hud #shieldBar{transition:none}#hud #killSplash.show{animation:none;transform:translate(-50%,0)}}
#hud #wallBuy.forge-offer{width:min(460px,85vw);border:2px solid #ff7194;border-radius:3px;background:linear-gradient(110deg,#301b2aeb,#142d3deb);box-shadow:0 0 22px #ff3d6526}
#hud #wallBuy.forge-offer strong{font-weight:1000;color:#fff0dd;line-height:1.35}#hud #wallBuy.forge-offer small{font-size:9px;line-height:1.65;color:#ffb9ca;white-space:normal}#hud #wallBuy.forge-offer kbd{color:#ffc1d1;border-color:#ff7194}
#hud #wallBuy.forge-offer:disabled{opacity:.78;cursor:default}
@media(max-height:520px){body.touch-mode #hud #wallBuy.forge-offer{width:min(360px,46vw);padding:8px 10px}body.touch-mode #hud #wallBuy.forge-offer small{font-size:8px}}

/* Streamlined gameplay HUD: hide the four regions highlighted in the
   player's screenshot without disturbing compass, radar, vitals or loadout. */
#hud #zone,
#hud .scorebox,
#hud #statusText,
#hud .movement-hints{display:none!important}

/* Touch players still need a reachable pause control without the score panel. */
body.touch-mode #hud .scorebox{display:flex!important;padding:0;background:none;border:0;box-shadow:none}
body.touch-mode #hud .scorebox > :not(#pauseBtn){display:none!important}

/* Circular aerial minimap: clean, borderless terrain with a soft drop shadow,
   anchored on the right across desktop and touch layouts. */
#hud .hud-top .radar-wrap{
 position:absolute;top:0;right:0;left:auto;
 width:clamp(142px,13vw,190px);height:auto;aspect-ratio:1;
 padding:0;overflow:visible;border:0;border-radius:50%;
 background:transparent;
 box-shadow:0 9px 24px #00101b82,0 3px 8px #00101b59;
 isolation:isolate;
}
#hud .hud-top .radar-wrap::before{
 display:none;content:none;
}
#hud .hud-top #radar{
 display:block;width:100%;height:100%;border:0;
 border-radius:50%;background:#7fbd9b;object-fit:cover;
}
#hud .hud-top .radar-label{display:none}
/* Keep recording/replay capture active, but never draw the REC badge in-game. */
#hud .hud-top #replayRecording{display:none!important}
#hud #killfeed{top:clamp(202px,calc(13vw + 48px),247px)}
body.touch-mode #hud .hud-top .radar-wrap{width:clamp(88px,15vw,124px);padding:0}
body.touch-mode #hud .hud-top .scorebox{position:absolute;left:0;right:auto;top:0}
body.touch-mode #hud #killfeed{top:calc(max(8px,env(safe-area-inset-top)) + clamp(111px,15vw + 20px,149px));right:max(12px,env(safe-area-inset-right))}
@media(max-width:700px){#hud .hud-top .radar-wrap{width:clamp(112px,25vw,142px);padding:0}#hud #killfeed{top:176px}}
@media(orientation:portrait){body.touch-mode #hud .hud-top .radar-wrap{width:clamp(108px,29vw,138px)}body.touch-mode #hud #killfeed{top:calc(max(8px,env(safe-area-inset-top)) + 158px)}}

/* Battle Royale reference layout: small, widely spaced readouts on a subtle,
   transparent, nearly square backing beneath the right-hand circular map. */
#hud{--frost-map-size:clamp(142px,13vw,190px);--frost-map-top:25px;--frost-map-right:30px}
#hud .hud-top .radar-wrap{width:var(--frost-map-size)}
#hud #brHud{
 position:absolute;top:calc(var(--frost-map-top) + var(--frost-map-size) + 15px);
 right:var(--frost-map-right);left:auto;width:clamp(150px,calc(var(--frost-map-size) - 2px),192px);
 display:flex;flex-direction:column;align-items:flex-end;gap:9px;padding:0;
 border:0;border-radius:0;background:transparent;box-shadow:none;z-index:4;
}
#hud #brHud[hidden]{display:none!important}
#hud #brHud .br-mini-stats{
 display:grid;grid-template-columns:1fr 1fr 1.4fr;column-gap:9px;align-items:center;width:100%;
 min-height:30px;padding:3px 8px;color:#fff;
 background:rgba(5,18,29,.18);border:1px solid #b5e9fa55;
 border-radius:4px;box-shadow:0 3px 9px #00101b30;
 font-variant-numeric:tabular-nums;text-shadow:0 2px 2px #0009;
}
#hud #brHud .br-mini-stats>div{
 display:flex;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:21px;
 border-right:1px solid #d3f3ff46;
}
#hud #brHud .br-mini-stats>div:last-child{border-right:0}
#hud #brHud .br-mini-stats svg{width:13px;height:13px;flex:0 0 13px;color:#fff;fill:currentColor}
#hud #brHud .br-elims svg{width:16px;height:16px;flex-basis:16px;color:#fff;fill:#fff}
#hud #brHud .br-storm svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#hud #brHud .br-alive{border-right:1px solid #d3f3ff46}
#hud #brHud .br-mini-stats strong,#hud #brHud .br-mini-stats b{
 display:block;margin:0;color:#fff;font:900 13px/1 Arial,Helvetica,sans-serif;letter-spacing:-.15px;white-space:nowrap;
}
#hud #brHud .br-storm b{font-size:12px;letter-spacing:-.3px}
#hud #brHud .br-visually-hidden{
 position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
 clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
#hud #brHud .br-rarity-key{display:none}
#hud #brHud #brTeammate{width:100%;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:7px 9px;background:#052d3de0;border:1px solid #60ead1a0;border-radius:4px;color:#d6fff6;box-shadow:0 2px 10px #00232c55}
#hud #brHud #brTeammate[hidden]{display:none!important}
#hud #brHud #brTeammate small{font-size:7px;letter-spacing:.5px;font-weight:800;color:#60eccc;white-space:nowrap}
#hud #brHud #brTeammate strong{font-size:10px;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#hud #brHud #brTeammate span{font-size:7px;font-weight:900;white-space:nowrap;color:#75f6b1}
#hud #brHud #brTeammate span.down{color:#ffa7a7}
#hud #brHud #brInventoryButton{
 width:auto;min-height:25px;padding:3px 7px;gap:6px;align-self:flex-end;
 background:transparent;border:1px solid #ffffff8c;border-radius:4px;
 color:#fff;font-size:7px;letter-spacing:.6px;box-shadow:none;
}
#hud #brHud #brInventoryButton>span{font-size:11px}
#hud #brHud #brInventoryButton kbd{font-size:6px;padding:2px 4px;background:transparent;border-color:#ffffff8c;color:#fff}
#hud #brHud #playgroundsAdminButton{
 width:auto;min-height:26px;padding:4px 9px;align-self:flex-end;
 border-radius:4px;font-size:7px;
}
#hud #brHud #playgroundsAdminButton[hidden]{display:none!important}
#hud #brHud.outside .br-mini-stats{border-color:#d6a6ff8c;box-shadow:0 0 9px #b050ff4f}
#hud:has(#brHud:not([hidden])) #killfeed{top:calc(var(--frost-map-top) + var(--frost-map-size) + 106px)}
@media(max-height:520px){#hud{--frost-map-top:12px;--frost-map-right:18px}}
@media(max-width:700px){#hud{--frost-map-size:clamp(112px,25vw,142px)}}
body.touch-mode #hud{
 --frost-map-size:clamp(88px,15vw,124px);
 --frost-map-top:max(10px,env(safe-area-inset-top));
 --frost-map-right:max(16px,calc(env(safe-area-inset-right) + 10px));
}
body.touch-mode #hud .hud-top .radar-wrap{width:var(--frost-map-size)}
body.touch-mode #hud #brHud .br-mini-stats{min-height:28px;padding:3px 6px;column-gap:7px}
body.touch-mode #hud #brHud .br-mini-stats>div{gap:4px;min-height:20px}
body.touch-mode #hud #brHud .br-mini-stats svg{width:11px;height:11px;flex-basis:11px}
body.touch-mode #hud #brHud .br-mini-stats strong,body.touch-mode #hud #brHud .br-mini-stats b{font-size:11px}
body.touch-mode #hud #brHud #brInventoryButton{min-height:28px;padding:4px 8px}
@media(orientation:portrait){body.touch-mode #hud{--frost-map-size:clamp(108px,29vw,138px)}}
@media(orientation:landscape){body.touch-mode #hud{
 --frost-map-size:clamp(88px,15vw,124px);
 --frost-map-top:max(8px,env(safe-area-inset-top));
 --frost-map-right:max(12px,env(safe-area-inset-right));
}}
@media(max-height:450px) and (orientation:landscape){body.touch-mode #hud #brHud{gap:3px}body.touch-mode #hud #brHud #brInventoryButton{min-height:27px}body.touch-mode #hud:has(#brHud:not([hidden])) #killfeed{top:calc(var(--frost-map-top) + var(--frost-map-size) + 84px)}}

/* Restore the original icon-and-number vitals, scaled down about 25%. */
#hud #healthPanel{width:clamp(195px,21vw,295px);display:flex;flex-direction:column;gap:5px}
#hud #healthPanel #duoVitals{order:-1;display:flex;flex-direction:column;align-items:stretch;gap:3px;margin:0 0 4px 24px;width:calc(80% - 24px);min-width:120px;max-width:190px}
#hud #healthPanel #duoVitals[hidden]{display:none!important}
#hud #duoVitals .duo-vital-name{font:900 9px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.5px;color:#b8ffe4;text-shadow:0 1px 3px #001923;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#hud #duoVitals .duo-shield-track,#hud #duoVitals .duo-health-track{width:100%;padding:0;overflow:hidden;border:1px solid #071e28d9;border-radius:2px;background:#132b3570;box-shadow:0 1px 3px #0017254d}
#hud #duoVitals .duo-shield-track{height:8px}
#hud #duoVitals .duo-health-track{height:11px}
#hud #duoVitals #duoShieldBar,#hud #duoVitals #duoHealthBar,#hud #duoVitals .duo-shield-fill,#hud #duoVitals .duo-health-fill{display:block;width:100%;height:100%;transition:width .13s ease-out}
#hud #duoVitals #duoShieldBar,#hud #duoVitals .duo-shield-fill{background:linear-gradient(90deg,#007ed9,#28d4ff)}
#hud #duoVitals #duoHealthBar,#hud #duoVitals .duo-health-fill{background:#48e54a}
#hud #duoVitals .squad-vital-row{display:flex;flex-direction:column;gap:3px;margin-top:6px;width:100%;min-width:0}
#hud #duoVitals .duo-vital-name.eliminated{color:#ffb5b5;opacity:.6}
#hud #duoVitals .duo-vital-name.knocked{color:#ff8f9d}
#hud #duoVitals .duo-health-track.knocked{border-color:#f8515f;box-shadow:0 0 8px #fa354650}
#hud #duoVitals.eliminated{opacity:.52}
#hud #duoVitals.eliminated .duo-vital-name{color:#ffb5b5}
#hud #duoVitals.knocked .duo-vital-name{color:#ff8f9d}
#hud #duoVitals.knocked .duo-health-track{border-color:#f8515f;box-shadow:0 0 8px #fa354650}
#hud #healthMeter[aria-label="Knocked health"] .health-track{outline:2px solid #fb4056;box-shadow:0 0 12px #ff263e66}
#hud #healthMeter[aria-label="Knocked health"] .vital-icon{color:#fa4d65}
#hud #weaponHud[hidden]{display:none!important}
#hud #shieldPanel,#hud #healthMeter{display:grid;grid-template-columns:18px minmax(0,1fr) 31px;gap:6px}
#hud #healthPanel .vital-icon{width:18px;height:23px}
#hud .vital-icon svg{width:17px;height:17px}
#hud #health,#hud #shieldValue{font-size:19px}
#hud #healthPanel .health-track{height:26px}
#hud #healthPanel .shield-track{height:17px}
#hud #healthPanel #plateButton{width:calc(100% - 23px);max-width:160px;min-height:33px;margin-left:23px;padding:5px 7px}
body.touch-mode #hud #healthPanel{width:min(215px,calc(100vw - 48px));gap:4px}
body.touch-mode #hud #healthPanel #duoVitals{margin-left:19px;width:calc(86% - 19px);min-width:98px;gap:2px}
body.touch-mode #hud #duoVitals .duo-vital-name{font-size:8px}
body.touch-mode #hud #duoVitals .duo-shield-track{height:6px}
body.touch-mode #hud #duoVitals .duo-health-track{height:9px}
body.touch-mode #hud #duoVitals .squad-vital-row{gap:2px;margin-top:4px}
body.touch-mode #hud #shieldPanel,body.touch-mode #hud #healthMeter{grid-template-columns:16px minmax(0,1fr) 27px;gap:5px}
body.touch-mode #hud #healthPanel .vital-icon{width:16px;height:21px}
body.touch-mode #hud .vital-icon svg{width:15px;height:15px}
body.touch-mode #hud #health,body.touch-mode #hud #shieldValue{font-size:16px}
body.touch-mode #hud #healthPanel .health-track{height:22px}
body.touch-mode #hud #healthPanel .shield-track{height:14px}
body.touch-mode #hud #healthPanel #plateButton{margin-left:21px;width:calc(100% - 21px);min-height:37px}
@media(orientation:landscape){
 body.touch-mode #hud .hud-bottom #healthPanel{width:100%;gap:3px}
 body.touch-mode #hud #shieldPanel,body.touch-mode #hud #healthMeter{grid-template-columns:13px minmax(0,1fr) 21px;gap:4px}
 body.touch-mode #hud #health,body.touch-mode #hud #shieldValue{font-size:14px}
 body.touch-mode #hud #healthPanel .vital-icon{width:13px;height:17px}
 body.touch-mode #hud .vital-icon svg{width:12px;height:12px}
 body.touch-mode #hud #healthPanel .health-track{height:18px}
 body.touch-mode #hud #healthPanel .shield-track{height:12px}
 body.touch-mode #hud #healthPanel #plateButton{margin-left:17px;width:calc(100% - 17px)}
 body.touch-mode #hud #healthPanel #duoVitals{margin-left:16px;width:calc(85% - 16px)}
}
@media(prefers-reduced-motion:reduce){#hud #duoVitals #duoShieldBar,#hud #duoVitals #duoHealthBar,#hud #duoVitals .duo-shield-fill,#hud #duoVitals .duo-health-fill{transition:none}}

/* Compact elimination feed, docked directly above pickup notices at the left vitals. */
#hud #healthPanel #killfeed{
 position:absolute;top:auto;right:auto;left:0;
 bottom:calc(100% + 12px + var(--pickup-stack-height,0px));
 display:flex;flex-direction:column;align-items:flex-start;gap:3px;
 width:min(218px,calc(100vw - 40px));max-height:100px;overflow:hidden;
 pointer-events:none;z-index:4;
}
/* BR has a more-specific legacy top offset; explicitly reset it now that
   the feed is anchored above the pickup stack instead of below the minimap. */
#hud:has(#brHud:not([hidden])) #healthPanel #killfeed,
body.touch-mode #hud:has(#brHud:not([hidden])) #healthPanel #killfeed{
 top:auto;
}
#hud #healthPanel #killfeed:empty{display:none}
#hud #healthPanel #killfeed .feed-row{
 display:block;box-sizing:border-box;max-width:100%;min-width:0;
 padding:3px 6px;background:rgba(8,25,35,.33);border-left:2px solid #70e1c8;
 border-radius:2px;color:#fff;font:700 8px/1.35 Arial,Helvetica,sans-serif;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 3px #08131f;
}
#hud #healthPanel #killfeed .feed-row b{margin:0 3px}
#hud #healthPanel #killfeed .feed-row.feed-knock{border-left-color:#f5b957;background:rgba(36,27,20,.48);color:#fff2d6}
body.touch-mode #hud #healthPanel #killfeed{width:min(172px,calc(100vw - 32px));gap:2px;max-height:78px}
body.touch-mode #hud #healthPanel #killfeed .feed-row{padding:2px 4px;font-size:7px}
#hud #knockGlowOverlay{position:fixed;inset:0;pointer-events:none;z-index:2;background:radial-gradient(ellipse at 50% 106%,#ffe25122 0,transparent 54%),radial-gradient(ellipse at 50% -15%,#fff5a315 0,transparent 49%);box-shadow:inset 0 0 96px 10px #ffcb3a55;animation:knock-yellow-screen-pulse .32s ease-in-out infinite alternate}
#hud #knockGlowOverlay[hidden]{display:none!important}
@keyframes knock-yellow-screen-pulse{from{opacity:.55}to{opacity:1}}
#hud #duoVitals .duo-vital-name.knock-protected{color:#ffe375;text-shadow:0 0 9px #ffc631cc}
#hud #duoVitals .duo-health-track.knock-protected{outline:1px solid #ffd439;box-shadow:0 0 9px #ffe66b88}
@media(prefers-reduced-motion:reduce){#hud #knockGlowOverlay{animation:none;opacity:.76}}

/* SURGE team wipe floats over gameplay instead of obscuring it with a solid card.
   The entire reveal is CSS-driven to avoid adding per-frame effects to combat. */
#surgeTeamWipe{
 --wipe:#76ffe4;position:fixed;z-index:75;left:50%;top:calc(50% + 36px);
 width:max-content;max-width:90vw;min-width:min(300px,90vw);height:57px;
 display:flex;gap:15px;align-items:center;justify-content:center;padding:9px 23px;
 pointer-events:none;text-align:center;color:#f4fffc;isolation:isolate;
 background:linear-gradient(90deg,#0b213110 0%,#0a263c44 23%,#14384b55 50%,#0a263c44 77%,#0b213110 100%);
 border-block:1px solid color-mix(in srgb,var(--wipe) 28%,transparent);
 border-inline:1px solid transparent;border-radius:2px;
 box-shadow:0 7px 18px #02132235,inset 0 0 14px #a8ffe10a;
 backdrop-filter:blur(2.5px);-webkit-backdrop-filter:blur(2.5px);
 opacity:0;transform:translate(-50%,10px) scale(.85);
}
#surgeTeamWipe[hidden]{display:none!important}
#surgeTeamWipe.defeat{--wipe:#ff8095}
#surgeTeamWipe .surge-wipe-copy{display:flex;flex-direction:column;align-items:center;gap:5px;line-height:1;position:relative;z-index:1}
#surgeTeamWipe strong{font:1000 clamp(20px,2.25vw,28px)/1 Arial Black,Arial,sans-serif;letter-spacing:2.2px;font-style:italic;text-shadow:0 0 7px #032b35,0 0 17px color-mix(in srgb,var(--wipe) 55%,transparent)}
#surgeTeamWipe small{color:var(--wipe);font:800 8px/1 Arial,sans-serif;letter-spacing:2.4px;text-shadow:0 0 8px #021e25}
#surgeTeamWipe .surge-wipe-mark{position:relative;z-index:1;font:900 22px/1 Arial,sans-serif;color:var(--wipe);filter:drop-shadow(0 0 8px var(--wipe))}
#surgeTeamWipe .surge-wipe-mark:before,#surgeTeamWipe .surge-wipe-mark:after{content:'✧';position:absolute;font-size:8px;opacity:0;pointer-events:none}
#surgeTeamWipe .surge-wipe-mark:before{top:-11px;left:-9px}
#surgeTeamWipe .surge-wipe-mark:after{bottom:-12px;right:-11px}
#surgeTeamWipe .surge-wipe-copy:after{content:'';position:absolute;left:4%;right:4%;bottom:-11px;height:2px;background:linear-gradient(90deg,transparent,var(--wipe),#fff,var(--wipe),transparent);box-shadow:0 0 11px var(--wipe);transform:scaleX(0)}
#surgeTeamWipe:before{content:'';position:absolute;inset:-7px -12px;border:1.5px solid var(--wipe);border-radius:5px;opacity:0;pointer-events:none}
#surgeTeamWipe:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(110deg,transparent 36%,#d8fff410 43%,color-mix(in srgb,var(--wipe) 28%,transparent) 50%,#eafffd12 57%,transparent 64%);background-size:320% 100%;background-position:120% 0}
#surgeTeamWipe.show{animation:surge-wipe-arrive .7s cubic-bezier(.16,.9,.3,1.1) both}
#surgeTeamWipe.show:before{animation:surge-wipe-wave .78s ease-out .08s both}
#surgeTeamWipe.show:after{animation:surge-wipe-scan .72s ease-in-out .12s both}
#surgeTeamWipe.show strong{animation:surge-wipe-text .52s ease-in-out .12s both}
#surgeTeamWipe.show .surge-wipe-copy:after{animation:surge-wipe-line .62s cubic-bezier(.17,.8,.3,1) .23s both}
#surgeTeamWipe.show .surge-wipe-mark{animation:surge-wipe-star .72s ease-out both}
#surgeTeamWipe.show .surge-wipe-mark:last-child{animation-delay:.13s}
#surgeTeamWipe.show .surge-wipe-mark:before{animation:surge-wipe-spark .6s ease-out .15s both}
#surgeTeamWipe.show .surge-wipe-mark:after{animation:surge-wipe-spark .55s ease-out .2s both}
@keyframes surge-wipe-arrive{0%{opacity:0;transform:translate(-50%,17px) scale(.68);clip-path:inset(0 48% 0 48%)}24%{opacity:.9;clip-path:inset(0 5% 0 5%)}44%{opacity:1;transform:translate(-50%,-5px) scale(1.09);clip-path:inset(0 0 0 0)}69%{transform:translate(-50%,1px) scale(.97)}100%{opacity:1;transform:translate(-50%,0) scale(1);clip-path:inset(0 0 0 0)}}
@keyframes surge-wipe-wave{0%{opacity:.88;transform:scale(.88)}75%{opacity:.26}100%{opacity:0;transform:scale(1.19,1.65)}}
@keyframes surge-wipe-scan{0%{opacity:0;background-position:120% 0}28%{opacity:.85}100%{opacity:0;background-position:-85% 0}}
@keyframes surge-wipe-text{0%,100%{filter:brightness(1);transform:translateY(0)}45%{filter:brightness(1.7);text-shadow:0 0 4px #fff,0 0 25px var(--wipe);transform:translateY(-1px)}}
@keyframes surge-wipe-line{0%{transform:scaleX(0);opacity:.3}100%{transform:scaleX(1);opacity:1}}
@keyframes surge-wipe-star{0%{transform:scale(.15) rotate(-90deg);opacity:0}48%{transform:scale(1.55) rotate(17deg);opacity:1}100%{transform:scale(1) rotate(0);opacity:1}}
@keyframes surge-wipe-spark{0%{opacity:0;transform:translate(0,6px) scale(.3)}27%{opacity:1;transform:translate(-4px,-4px) scale(1.25)}100%{opacity:0;transform:translate(-13px,-16px) scale(.1)}}
@media(max-height:520px){#surgeTeamWipe{top:calc(50% - 16px);height:46px;padding:6px 14px}#surgeTeamWipe strong{font-size:19px}}
@media(orientation:portrait){body.touch-mode #surgeTeamWipe{top:auto;bottom:calc(env(safe-area-inset-bottom) + 427px);min-width:min(265px,88vw);height:50px}}
@media(prefers-reduced-motion:reduce){#surgeTeamWipe.show,#surgeTeamWipe.show:before,#surgeTeamWipe.show:after,#surgeTeamWipe.show strong,#surgeTeamWipe.show .surge-wipe-mark,#surgeTeamWipe.show .surge-wipe-mark:before,#surgeTeamWipe.show .surge-wipe-mark:after,#surgeTeamWipe.show .surge-wipe-copy:after{animation:none;opacity:1}#surgeTeamWipe.show{transform:translate(-50%,0);clip-path:none}#surgeTeamWipe.show:before,#surgeTeamWipe.show:after{opacity:0}#surgeTeamWipe.show .surge-wipe-mark,#surgeTeamWipe.show strong{transform:none}#surgeTeamWipe.show .surge-wipe-copy:after{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){#surgeTeamWipe.show .surge-wipe-mark:before,#surgeTeamWipe.show .surge-wipe-mark:after{opacity:0}}

/* Small, semi-transparent SURGE counter above the vitals. */
#hud #surgeRespawns{order:-1;display:inline-flex;align-self:flex-start;align-items:center;gap:6px;min-height:27px;margin:0 0 1px 24px;padding:4px 9px 4px 7px;border:1px solid #39cdf3a8;border-radius:16px;background:#071a2b99;box-shadow:0 3px 9px #03132030;backdrop-filter:blur(3px);text-shadow:none;pointer-events:none;white-space:nowrap}
#hud #surgeRespawns .surge-respawn-icon{width:17px;height:17px;flex:none;fill:none;stroke:#21d8ff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
#hud #surgeRespawns span{display:inline;color:#82eaf7;font:800 8px/1 Arial,Helvetica,sans-serif;letter-spacing:.35px}
#hud #surgeRespawnCount{display:inline;color:#22e7f4;font:900 15px/1 Arial,Helvetica,sans-serif;letter-spacing:-.3px;font-variant-numeric:tabular-nums}
#hud #surgeRespawns:not(.infinite):not(.locked) #surgeRespawnCount:before{content:'0'}
#hud #surgeRespawns.infinite #surgeRespawnCount{color:#9affdd}
#hud #surgeRespawns.locked{border-color:#a65b68a8;background:#291922a3}
#hud #surgeRespawns.locked :is(span,strong){color:#efb1bb}
#hud #surgeRespawns.locked .surge-respawn-icon{stroke:#efb1bb}
body.touch-mode #hud #surgeRespawns{min-height:22px;margin-left:19px;padding:3px 6px;gap:4px}
body.touch-mode #hud #surgeRespawns .surge-respawn-icon{width:13px;height:13px}
body.touch-mode #hud #surgeRespawns span{font-size:6.5px;letter-spacing:0}
body.touch-mode #hud #surgeRespawnCount{font-size:12px}
@media(orientation:landscape){body.touch-mode #hud #surgeRespawns{min-height:19px;margin-left:13px;padding:2px 5px;gap:3px}body.touch-mode #hud #surgeRespawns .surge-respawn-icon{width:12px;height:12px}body.touch-mode #hud #surgeRespawns span{font-size:6px}body.touch-mode #hud #surgeRespawnCount{font-size:11px}}

/* One-shot center-screen storm callouts, paced to storm-stage transitions. */
#stormAnnouncement{--storm-alert:#b38cff;position:fixed;top:clamp(48px,7.4vh,88px);left:50%;z-index:17;display:flex;align-items:center;justify-content:center;gap:14px;min-width:min(355px,82vw);max-width:92vw;padding:11px 20px 13px;border:1px solid color-mix(in srgb,var(--storm-alert) 55%,transparent);border-top:2px solid var(--storm-alert);border-radius:5px;background:linear-gradient(90deg,#0d1b2a55,#1b1d3570 50%,#0d1b2a55);box-shadow:0 8px 24px #0307133d;text-align:center;pointer-events:none;opacity:0;transform:translate(-50%,-24px) scale(.84);overflow:hidden}
#stormAnnouncement[hidden]{display:none!important}
#stormAnnouncement[data-state="warning"]{--storm-alert:#f4bb79}
#stormAnnouncement[data-state="clear"]{--storm-alert:#80dfd4}
#stormAnnouncement[data-state="final"]{--storm-alert:#fa7e9a}
#stormAnnouncement .storm-alert-copy{position:relative;z-index:1;min-width:0}
#stormAnnouncement .storm-alert-copy small{display:block;color:var(--storm-alert);font-size:8px;font-weight:900;letter-spacing:2px}
#stormAnnouncement .storm-alert-copy strong{display:block;color:#fff;font:400 clamp(23px,2.7vw,33px)/1.06 'Big Black Bear',Impact,'Arial Black',sans-serif;letter-spacing:1px;margin:3px 0;text-shadow:0 2px 3px #091425}
#stormAnnouncement .storm-alert-copy span{display:block;font-size:8px;letter-spacing:1.1px;font-weight:800;color:#e2e8f5}
#stormAnnouncement .storm-alert-icon{font-size:23px;line-height:1;color:var(--storm-alert);text-shadow:0 0 10px var(--storm-alert)}
#stormAnnouncement:before{content:'';position:absolute;inset:0;border:1px solid var(--storm-alert);opacity:0;pointer-events:none}
#stormAnnouncement:after{content:'';position:absolute;inset:-1px;background:linear-gradient(100deg,transparent 32%,#ffffff26 49%,transparent 64%);transform:translateX(-125%);pointer-events:none}
#stormAnnouncement.show{animation:storm-notice-enter .78s cubic-bezier(.15,.85,.22,1.14) both}
#stormAnnouncement.show .storm-alert-icon{animation:storm-notice-pulse .75s ease-out .12s both}
#stormAnnouncement.show .storm-alert-copy strong{animation:storm-notice-text .55s ease-out .1s both}
#stormAnnouncement.show:before{animation:storm-notice-wave .85s ease-out .08s both}
#stormAnnouncement.show:after{animation:storm-notice-sweep .9s ease-out .1s both}
@keyframes storm-notice-enter{0%{opacity:0;transform:translate(-50%,-24px) scale(.84);clip-path:inset(0 46%)}42%{opacity:1;transform:translate(-50%,3px) scale(1.045);clip-path:inset(0)}72%{transform:translate(-50%,-1px) scale(.985)}100%{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes storm-notice-pulse{0%{opacity:0;transform:scale(.35) rotate(-60deg)}50%{opacity:1;transform:scale(1.6) rotate(12deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes storm-notice-text{0%{opacity:.3;filter:brightness(1)}55%{opacity:1;filter:brightness(1.75)}100%{opacity:1;filter:brightness(1)}}
@keyframes storm-notice-wave{0%{opacity:.9;transform:scale(.92)}100%{opacity:0;transform:scale(1.1,1.6)}}
@keyframes storm-notice-sweep{0%{transform:translateX(-125%)}100%{transform:translateX(125%)}}
body.touch-mode #stormAnnouncement{top:calc(env(safe-area-inset-top) + 23px);min-width:min(270px,76vw);gap:9px;padding:8px 10px 10px}
body.touch-mode #stormAnnouncement .storm-alert-copy strong{font-size:21px}
body.touch-mode #stormAnnouncement .storm-alert-copy span{font-size:6px}
body.touch-mode #stormAnnouncement .storm-alert-icon{font-size:17px}
@media(prefers-reduced-motion:reduce){#stormAnnouncement.show,#stormAnnouncement.show .storm-alert-icon,#stormAnnouncement.show .storm-alert-copy strong,#stormAnnouncement.show:before,#stormAnnouncement.show:after{animation:none}#stormAnnouncement.show{opacity:1;transform:translate(-50%,0)}#stormAnnouncement.show:before,#stormAnnouncement.show:after{opacity:0}}