/* Reserve the upper HUD for status; the lower road and fighters stay visible. */
#arena .game-top{height:44px;gap:7px}
#arena .game-top .mode-pill{flex:0 1 150px;min-width:70px;max-width:150px}
#arena .game-top #stageName{max-width:100%}
#arena .game-top #timer{min-width:80px;min-height:38px;padding:3px 9px}
#arena .game-top .alive-pill{flex:0 0 auto;padding:6px 9px;gap:5px;white-space:nowrap}
#arena .game-top #stageStatus{position:static;inset:auto;transform:none;flex:1 1 220px;min-width:0;width:auto;max-width:520px;max-height:44px;margin-inline:auto;padding:4px 9px;line-height:1.5;font-size:10px;border-radius:10px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-wrap:balance;pointer-events:none}
#arena #banner{top:calc(max(8px,env(safe-area-inset-top)) + 50px);max-width:calc(45vw - 16px);line-height:1.5;padding:4px 8px;white-space:normal;font-size:10px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
#arena #spectating{top:calc(max(8px,env(safe-area-inset-top)) + 50px);bottom:auto;left:auto;right:max(16px,env(safe-area-inset-right));transform:none;width:max-content;max-width:calc(55vw - 24px);min-height:36px;padding:3px 5px 3px 9px;border-radius:10px;gap:8px;font-size:10px;line-height:1.4;z-index:2}
#arena #spectatingText{min-width:0;text-wrap:balance}
#arena #spectating button{flex:0 0 auto;min-height:34px;padding:6px 10px;font-size:10px;border-radius:7px}
body:has(#arena:not(.hidden)) #toast{top:calc(max(8px,env(safe-area-inset-top)) + 50px);bottom:auto;left:max(16px,env(safe-area-inset-left));right:auto;transform:none;max-width:calc(45vw - 16px);padding:5px 9px;border-radius:9px;font-size:10px;line-height:1.5;text-align:start;pointer-events:none;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
body:has(#arena:not(.hidden)):has(#toast:not(.hidden)) #arena #banner{visibility:hidden}
[dir=rtl] #arena .game-top #stageStatus{direction:rtl}
[dir=rtl] #arena #spectating{padding:3px 9px 3px 5px}
@media(max-width:700px){
 #arena .game-top{gap:5px}
 #arena .game-top .mode-pill{flex-basis:105px;padding:4px 6px}
 #arena .game-top #timer{min-width:69px;font-size:17px;padding:3px 6px}
 #arena .game-top .alive-pill{padding:5px 7px;gap:4px;font-size:8px}
 #arena .game-top .alive-pill strong{font-size:17px}
 #arena .game-top #stageStatus{padding:4px 6px;font-size:9px}
 #arena #spectating{gap:5px;font-size:9px}
 #arena #spectating button{padding:6px 8px;font-size:9px}
}

/* Shared control anchors: every stage keeps jump, dash and guard in place. */
#arena #controls,#arena #controls *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#arena #controls .combat{--action-size:clamp(60px,13.8vh,84px);display:grid;grid-template-columns:repeat(3,var(--action-size));grid-template-rows:repeat(2,var(--action-size));gap:12px;bottom:max(16px,env(safe-area-inset-bottom));right:max(18px,env(safe-area-inset-right));align-items:center;justify-items:center;direction:ltr}
#arena #controls .combat-button{position:relative;inset:auto;width:var(--action-size);height:var(--action-size);min-width:0;min-height:0;margin:0;align-self:center;touch-action:none}
#arena #controls .combat-button small{max-width:92%;font-size:9px;line-height:1.2;text-align:center;min-height:0;margin-top:2px;overflow-wrap:break-word}
#arena #controls .combat-button>span{font-size:26px;line-height:1}
#arena #controls #push small,#arena #controls #item small{font-size:8px}
#arena #controls #guard{grid-column:1;grid-row:2}
#arena #controls #dash{grid-column:2;grid-row:2}
#arena #controls #jump{grid-column:3;grid-row:2}
#arena #controls #special{grid-column:1;grid-row:1}
#arena #controls #item,#arena #controls #sit{grid-column:2;grid-row:1}
#arena #controls #push,#arena #controls #attack{grid-column:3;grid-row:1}
#jump{background:linear-gradient(#55dbff,#187cb2);border-color:#b0f5ff}
#special{background:linear-gradient(#ffdd71,#ec3d55);border-color:#fff2a8}
#attack{background:linear-gradient(#ff6a85,#aa2457);border-color:#ffc285}
#sit{background:linear-gradient(#ffdc79,#c57b25);border-color:#fff0af}
#arena #controls .combat-button[aria-disabled=true]{filter:saturate(.6)}
#arena.social-warmup #controls .combat{visibility:hidden;pointer-events:none}
#newsButton{position:relative;flex:0 0 auto}
#newsBadge{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;line-height:16px;border-radius:9px;background:#ef3d66;color:white;font:700 9px system-ui;text-align:center;border:1px solid #ffb890}
#modal.leave-confirm .modal-card{background:linear-gradient(135deg,#28364b,#102847);border:1px solid #c1d7e6}
#modal.leave-confirm .leave-chance{padding:12px;border-radius:12px;border:1px solid #aab8c855;background:#1f4560;color:#fff1c5;line-height:1.65}
