/* Reference HUD: full arena viewport, restrained cream outlines and edge overlays. */
body.in-battle{overflow:hidden;background:#05272b}.in-battle #app{height:100dvh}.screen.match{position:fixed;inset:0;max-width:none;padding:0;margin:0;width:100%;height:100dvh;overflow:hidden;isolation:isolate;background:#062d30}.old-battle-layout{display:none!important}
#battle-stage{position:absolute;inset:0;overflow:hidden;background:radial-gradient(ellipse at 55% 50%,#0d3837,#062b2d 75%)}
#battle-stage #board{position:absolute;inset:0;display:block;width:100%;height:100%;border:0;border-radius:0;background:transparent;touch-action:none}
#battle-stage button{touch-action:manipulation}#battle-stage .hud-top{position:absolute;z-index:10;left:18px;right:18px;top:max(16px,env(safe-area-inset-top));display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:12px;pointer-events:none}#battle-stage .hud-top>*{pointer-events:auto}
#your-hud{display:flex;gap:8px;margin:0;flex-wrap:nowrap}#your-hud>span{display:flex;align-items:center;gap:5px;background:linear-gradient(#184437ec,#0d3029eb);border:1px solid #adc4a2;border-radius:9px;padding:7px 10px;box-shadow:inset 0 0 0 2px #162e2a,0 2px 8px #001a;color:#f7f4d1;white-space:nowrap;font-size:14px;line-height:1.2}#your-hud small{display:inline;color:#f7f4d1;font-size:11px;font-weight:600}#your-hud b{font-size:14px;font-variant-numeric:tabular-nums}.resource-icon{font-size:22px;line-height:20px;filter:drop-shadow(0 0 3px #111)}.coin-icon{color:#ffda5d;-webkit-text-stroke:1px #c29635}.points-icon{color:#5cdbff}.lives-icon{color:#ff8b90}
#hud-time{display:flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid #e8dc93;border-radius:9px;background:linear-gradient(#234b37ef,#102f27ed);box-shadow:inset 0 0 0 2px #1b3829,0 3px 12px #0018;white-space:nowrap;font-size:16px;font-weight:750;color:#fff9cf;font-variant-numeric:tabular-nums}#hud-time #round-label:after{content:' ·';margin-left:3px}#hud-time .clock{padding:0;min-width:0;font-size:16px;background:none;border:0;border-radius:0;line-height:1.1}#hud-time .clock.overtime{color:#ffc4b8;font-size:12px;white-space:normal;max-width:190px}
#hud-actions{display:flex;justify-content:flex-end;gap:10px}.hud-icon{position:relative;width:40px;height:36px;min-height:36px;padding:6px!important;border:1px solid #a9c6ae!important;background:linear-gradient(#224b3a,#0c3029)!important;box-shadow:inset 0 0 0 2px #17362a;border-radius:9px!important;color:#fbf2bd}.hud-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.hud-icon b:not(:empty){position:absolute;right:-5px;top:-8px;border-radius:99px;min-width:18px;height:18px;background:#e4565a;color:white;font-size:11px;line-height:18px;padding:0 4px}
#hud-wave{position:absolute;z-index:9;top:72px;left:50%;transform:translateX(-50%);max-width:calc(100% - 34px);pointer-events:none}#hud-wave #wave-preview{margin:0;padding:7px 15px;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:13px;white-space:nowrap;background:#11372be6;border:1px solid #9ebc9d;border-radius:9px;box-shadow:inset 0 0 0 2px #13352b;color:#f6efd0;font-size:13px;line-height:1.1}#hud-wave strong{font-size:12px;letter-spacing:.02em;color:#fbf3c5;border-right:1px solid #9bb79d;padding-right:12px}#hud-wave .wave-element{display:inline-flex;gap:3px;align-items:center}.wave-element img{width:23px;height:23px;object-fit:contain}.wave-boss{display:inline-flex;color:#ffda6b;font-size:23px;padding-left:7px;border-left:1px solid #708e70;line-height:1}.wave-boss small{font-size:11px;align-self:center}.hud-chat-toast{position:absolute;z-index:12;left:50%;top:119px;transform:translateX(-50%);max-width:min(520px,calc(100% - 36px));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-height:28px!important;padding:4px 13px!important;font-size:12px;border:1px solid #9fb69b!important;border-radius:9px!important;background:#133b2ddf!important;color:#fff0c3;box-shadow:0 3px 10px #0016}
.hud-realms{position:absolute;z-index:8;left:14px;top:132px;width:106px;max-height:calc(100% - 250px);overflow:auto;scrollbar-width:none;border:1px solid #9db69a;border-radius:9px;background:#0a3027c9;box-shadow:0 2px 10px #0018}.hud-realms #toggle-realms{display:flex;justify-content:space-between;align-items:center;width:100%;padding:6px 9px;border:0;border-bottom:1px solid #809d7b;border-radius:8px 8px 0 0;min-height:30px;background:#143b2d;color:#fff1be;font-size:13px;font-weight:700}.hud-realms #opponents{display:flex;flex-direction:column;gap:5px;padding:5px}.hud-realms .opponent{width:100%;padding:5px;border:1px solid #809a78;background:#13372bcc;border-radius:7px;min-height:0}.hud-realms .mini-title{font-size:10px;gap:2px}.hud-realms .mini-title strong{max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hud-realms .mini-title>span{color:#ffd6bb}.hud-realms .mini-meta{display:none}.hud-realms .opponent canvas{width:100%;height:auto;margin:4px 0;max-height:none;background:#092d28}.hud-realms.collapsed #hud-realm-list{display:none}.hud-realms.collapsed{width:89px}.hud-realms.collapsed #toggle-realms{border-bottom:0}.hud-realms:has(#back-home:not([hidden])) #toggle-realms{border-radius:0}
#hud-bottom{position:absolute;z-index:10;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;gap:14px;align-items:center;padding:8px 10px;border:1px solid #adcaab;border-radius:13px;background:linear-gradient(#103b30e6,#0b2e25f0);box-shadow:inset 0 0 0 2px #1c4332,0 3px 12px #0018;pointer-events:auto}#hud-towers #build-buttons{display:grid;grid-template-columns:repeat(6,64px);gap:7px;margin:0}#hud-towers .build-buttons button{height:68px;min-height:44px;padding:4px 3px;gap:2px;border:1px solid #b9cc9f;border-radius:10px;background:linear-gradient(#244f3a,#13372c);color:#ffedaa;box-shadow:inset 0 0 0 2px #19392e}#hud-towers .build-buttons button>span{display:none}#hud-towers .build-buttons img{width:35px;height:35px}#hud-towers .build-buttons small{font-size:12px;color:#ffe19a;font-weight:700}#hud-towers .build-buttons button[aria-pressed=true]{border-color:#e6dc84;background:#57713b;outline-color:#fff1a5}#hud-towers .build-buttons button:disabled{opacity:.48}
#hud-bottom-actions{display:flex;gap:9px;align-items:center;border-left:1px solid #789778;padding-left:13px}#hud-bottom-actions button{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;min-height:44px;padding:7px 15px;border:1px solid #abc99f;background:linear-gradient(#284f38,#11382b);border-radius:9px;color:#fff1bc;font-size:15px;font-weight:700;white-space:nowrap}#hud-bottom-actions button svg,#hud-zoom svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}#hud-bottom-actions #open-send{background:linear-gradient(#bcb55c,#8a8236);border-color:#f3d271;color:#fff1b0;box-shadow:inset 0 0 0 2px #ada24e}#hud-bottom-actions #hide-hud{position:absolute;right:0;bottom:102px;height:30px;min-height:30px;font-size:11px;padding:4px 9px;opacity:.8}
#hud-zoom{position:absolute;z-index:9;bottom:25px;left:16px}#hud-zoom #zoom-controls{margin:0;gap:0;border:1px solid #9fbea2;background:#123b2bdc;border-radius:9px;flex-wrap:nowrap;overflow:hidden}#hud-zoom button{border:0;border-radius:0;background:none;min-height:33px;height:33px;padding:2px 9px;font-size:17px;color:#f6eac0}#hud-zoom [data-zoom-label]{font-size:12px;min-width:42px;color:#fff3c5}#hud-zoom [data-zoom-reset]{display:flex;align-items:center;gap:3px;border-left:1px solid #739575;font-size:12px}#hud-zoom #zoom-controls small{display:none}
#hud-watch{position:absolute;z-index:9;bottom:124px;left:50%;transform:translateX(-50%);pointer-events:none;font-size:12px;color:#e5eac7}.hud-realms #back-home:not([hidden]){display:block;width:100%;min-height:30px;padding:4px 3px;border:0;border-bottom:1px solid #809d7b;border-radius:8px 8px 0 0;font-size:11px;line-height:1.15;text-align:left;color:#fff1be}#hud-watch:not(.is-watching) #watch-name{display:none}#hud-notice{position:absolute;z-index:10;left:50%;bottom:112px;transform:translateX(-50%);max-width:70%;text-align:center;pointer-events:none}#hud-notice .message{margin:0;min-height:0;background:#16392ad9;border-radius:7px;padding:0 10px;font-size:12px}#hud-notice .message:empty{display:none}#hud-notice #opponent-alerts{min-height:0;padding:0;font-size:12px}
#battle-menu{max-width:440px}.battle-menu-tools{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:18px}.battle-menu-tools button{font-size:13px}.battle-menu-tools .connection{grid-column:1/-1;color:#a9d8a9;font-size:12px}.battle-menu-tools #skip-count{grid-column:1/-1}#battle-menu details{margin:12px 0;font-size:13px}#battle-menu summary{cursor:pointer;color:#e0e8bd}#battle-menu #tower-details{margin:10px 0;padding:10px}#battle-menu #room-label{display:block}.in-battle dialog{z-index:100}#show-hud{position:absolute;z-index:15;bottom:16px;right:16px;min-height:36px;font-size:12px;background:#133d2de8}.hud-hidden>.hud-top,.hud-hidden>#hud-wave,.hud-hidden>.hud-chat-toast,.hud-hidden>.hud-realms,.hud-hidden>#hud-bottom,.hud-hidden>#hud-zoom,.hud-hidden>#hud-watch,.hud-hidden>#hud-notice{display:none!important}
#battle-stage>#results{position:absolute;z-index:30;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;max-height:80%;overflow:auto;width:min(620px,calc(100% - 30px));box-shadow:0 12px 60px #001b}#battle-stage>#results h2{font-size:25px}
@media(max-width:1100px){#hud-bottom{bottom:15px;gap:9px}#hud-towers #build-buttons{grid-template-columns:repeat(6,53px);gap:5px}#hud-towers .build-buttons button{height:61px}#hud-towers .build-buttons img{width:31px;height:31px}#hud-bottom-actions{padding-left:9px;gap:7px}#hud-bottom-actions button{padding:6px 10px;font-size:13px}#hud-zoom{bottom:100px;left:12px}#hud-time{font-size:14px}#hud-time .clock{font-size:14px}#your-hud>span{padding:6px 7px;font-size:12px}#your-hud b{font-size:13px}#your-hud small{font-size:10px}#hud-actions{gap:7px}}
@media(max-width:600px) and (orientation:portrait){#battle-stage .hud-top{left:11px;right:11px;top:max(12px,env(safe-area-inset-top));grid-template-columns:1fr auto;gap:9px}#hud-wallet{grid-column:1;grid-row:1}#hud-actions{grid-column:2;grid-row:1}#hud-time{grid-column:1/-1;grid-row:2;justify-self:center;padding:5px 12px;font-size:13px}#hud-time .clock{font-size:13px}#your-hud{gap:5px}#your-hud>span{gap:3px;padding:5px 6px;font-size:11px;border-radius:7px}#your-hud b{font-size:12px}#your-hud small{font-size:9px}.resource-icon{font-size:17px;line-height:18px}.hud-icon{width:33px;height:31px;min-height:31px;padding:4px!important;border-radius:7px!important}.hud-icon svg{width:20px;height:20px}#hud-actions{gap:7px}#hud-wave{top:91px;max-width:calc(100% - 22px);width:max-content}#hud-wave #wave-preview{padding:5px 8px;gap:7px;font-size:11px;max-width:100%;white-space:normal;flex-wrap:wrap;min-height:31px}#hud-wave strong{font-size:10px;padding-right:6px}.wave-element img{width:18px;height:18px}.wave-boss{font-size:18px;padding-left:5px}.hud-chat-toast{top:137px;font-size:11px;max-width:calc(100% - 30px)}.hud-realms{left:9px;top:177px;width:75px;max-height:210px}.hud-realms #toggle-realms{font-size:11px;padding:4px 6px;min-height:27px}.hud-realms #opponents{padding:4px;gap:4px}.hud-realms .opponent{padding:3px}.hud-realms .mini-title{font-size:9px}.hud-realms .mini-title strong{max-width:49px}.hud-realms .mini-title>span{font-size:9px}.hud-realms .opponent canvas{margin:2px 0}.hud-realms.collapsed{width:72px}#hud-bottom{bottom:max(10px,env(safe-area-inset-bottom));width:calc(100% - 22px);max-width:460px;display:grid;grid-template-columns:1fr;border:0;background:none;box-shadow:none;padding:0;gap:9px}#hud-towers{padding:6px;border:1px solid #adc7a3;border-radius:12px;background:#0d342ae8;box-shadow:inset 0 0 0 2px #1c4332}#hud-towers #build-buttons{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}#hud-towers .build-buttons button{height:65px;min-width:0;border-radius:9px;gap:1px;flex-direction:column;flex-wrap:nowrap;font-size:11px}#hud-towers .build-buttons img{width:32px;height:32px}#hud-towers .build-buttons small{font-size:11px}#hud-bottom-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:0;padding:0;gap:8px}#hud-bottom-actions button{height:39px;min-height:39px;font-size:12px;gap:4px;padding:5px 7px}#hud-bottom-actions button svg{width:18px;height:18px}#hud-bottom-actions #hide-hud{position:static;opacity:1;height:39px;font-size:11px}#hud-zoom{left:11px;bottom:143px}#hud-zoom #zoom-controls{gap:0}#hud-zoom button{font-size:15px;min-height:29px;height:29px;padding:2px 7px}#hud-zoom [data-zoom-reset]{font-size:11px}#hud-zoom [data-zoom-reset] svg{width:16px;height:16px}#hud-zoom [data-zoom-label]{min-width:37px;font-size:11px}#hud-watch{bottom:180px;max-width:80%;white-space:nowrap}#hud-notice{bottom:178px;max-width:92%}#hud-notice .message{font-size:11px}#hud-time .clock.overtime{font-size:10px;max-width:200px}.battle-menu-tools{grid-template-columns:1fr}}
@media(max-width:370px) and (orientation:portrait){#your-hud small{display:none}#your-hud>span{padding:5px 7px}#hud-towers .build-buttons img{width:28px;height:28px}#hud-towers .build-buttons button{height:60px}.hud-chat-toast{top:135px}#hud-bottom-actions button{font-size:11px}}
@media(max-height:500px) and (orientation:landscape){#battle-stage .hud-top{top:8px;left:10px;right:10px;gap:7px}#your-hud>span{padding:4px 6px}#your-hud small{font-size:9px}#hud-time{padding:5px 10px}#hud-wave{top:48px}#hud-wave #wave-preview{padding:3px 9px;font-size:10px;gap:8px}#hud-wave strong{font-size:9px}.wave-element img{width:17px;height:17px}.hud-chat-toast{top:84px;font-size:10px;min-height:23px!important;padding:2px 9px!important}.hud-realms{top:85px;width:75px;left:8px;max-height:calc(100% - 170px)}.hud-realms #toggle-realms{font-size:10px;min-height:22px;padding:2px 6px}.hud-realms .mini-title{font-size:8px}.hud-realms .opponent{padding:3px}#hud-bottom{padding:5px 7px;gap:8px;bottom:8px}#hud-towers #build-buttons{grid-template-columns:repeat(6,42px);gap:4px}#hud-towers .build-buttons button{height:47px;padding:1px 2px}#hud-towers .build-buttons img{width:25px;height:25px}#hud-towers .build-buttons small{font-size:9px}#hud-bottom-actions button{height:35px;min-height:35px;font-size:11px;padding:5px 8px}#hud-bottom-actions button svg{width:17px;height:17px}#hud-zoom{left:8px;bottom:8px}#hud-zoom button{height:28px;min-height:28px;padding:1px 5px;font-size:13px}#hud-zoom [data-zoom-reset] span{display:none}#hud-zoom [data-zoom-label]{min-width:32px;font-size:10px}#hud-bottom-actions #hide-hud{bottom:67px;height:25px;min-height:25px;font-size:9px}#hud-notice{bottom:73px}#hud-watch{bottom:75px}}

@media(max-width:600px) and (orientation:portrait){#hud-bottom-actions [data-zoom-reset]{position:static;height:39px;min-height:39px;display:flex;font-size:11px}#hud-bottom-actions [data-zoom-reset] svg{width:17px;height:17px}#hud-bottom-actions #open-items,#hud-bottom-actions #open-send{font-size:12px}}

#hud-bottom-actions #skip-build { max-width: 116px; white-space: normal; line-height: 1.1; font-size: 12px; }
#hud-bottom-actions #skip-build[hidden] { display: none; }
#hud-bottom-actions #skip-build[aria-pressed="true"] { border-color: #e6dc84; background: #57713b; }
@media (min-width: 601px) and (max-width: 720px) {
  #hud-towers #build-buttons { grid-template-columns: repeat(6, 43px); }
}
@media (max-width: 600px) and (orientation: portrait) {
  #hud-bottom-actions:has(#skip-build:not([hidden])) { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; }
  #hud-bottom-actions #skip-build { padding-inline: 2px; font-size: 10px; }
  #hud-bottom-actions:has(#skip-build:not([hidden])) button { gap: 3px; padding-inline: 3px; }
  #hud-bottom-actions:has(#skip-build:not([hidden])) svg { width: 14px; flex-shrink: 0; }
}
@media (max-height: 500px) and (orientation: landscape) {
  #hud-bottom-actions #skip-build { max-width: 76px; font-size: 10px; }
  #hud-zoom { bottom: 69px; }
}

.hud-realms .opponent { position: relative; }
.hud-realms .mini-ready {
  position: absolute;
  right: 6px;
  bottom: 7px;
  display: grid;
  place-items: center;
  width: 19px;
  height: 19px;
  border: 1px solid #bce8a5;
  border-radius: 50%;
  background: #245337;
  color: #e5ffcd;
  font-size: 13px;
  font-weight: 700;
  pointer-events: none;
}
.hud-realms .mini-ready[hidden] { display: none; }

#hud-wave .wave-icon {
  pointer-events: auto;
  min-height: 23px;
  padding: 2px 4px;
  border: 1px solid #809d7b;
  border-radius: 5px;
  background: #17392d;
  color: #fff1be;
  font-size: inherit;
  white-space: nowrap;
}
#hud-wave #wave-preview { flex-wrap: wrap; }
#hud-wave .wave-icon-help:not([hidden]) {
  flex-basis: 100%;
  text-align: center;
  padding: 5px 8px;
  border-radius: 6px;
  background: #17392d;
  color: #fff1be;
  white-space: normal;
}

#hud-wave .hud-chat-toast { top: calc(100% + 5px); width: max-content; max-width: min(520px, calc(100vw - 30px)); pointer-events: auto; }
#hud-wave { width: max-content; }

#battle-stage #hud-zoom {
  left: auto;
  right: max(8px, env(safe-area-inset-right));
  bottom: max(8px, env(safe-area-inset-bottom));
  display: flex;
  gap: 4px;
  align-items: flex-end;
  flex-direction: column;
}
#battle-stage #hide-hud {
  min-height: 30px;
  padding: 3px 8px;
  border: 1px solid #9fbea2;
  border-radius: 7px;
  background: #123b2b;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
}
#battle-stage #hide-hud svg { width: 16px; height: 16px; }
#battle-chat-dock {
  position: absolute;
  z-index: 11;
  left: max(8px, env(safe-area-inset-left));
  bottom: max(8px, env(safe-area-inset-bottom));
  width: min(235px, calc(100vw - 157px));
  border: 1px solid #72967c;
  border-radius: 8px;
  background: rgba(13, 40, 34, .2);
  padding: 4px;
  color: #fff8dd;
  text-shadow: 0 1px 2px #062017;
  transition: background-color .15s ease;
}
#battle-chat-dock:focus-within { background: #0d2822; }
#battle-chat-dock .battle-chat-tabs { display: flex; gap: 4px; }
#battle-chat-dock button { min-height: 24px; padding: 2px 5px; font-size: 11px; }
#battle-chat-dock [aria-pressed="true"] { background: #365739; color: #fff3bf; }
#battle-chat-dock .chat-messages { height: 48px; min-height: 0; overflow-y: auto; padding: 3px; margin: 2px 0; background: transparent; border: 0; font-size: 11px; overflow-wrap: anywhere; }
#battle-chat-dock .chat-messages p { margin: 0 0 3px; }
#battle-chat-dock #chat-quick, #battle-chat-dock #chat-count { display: none; }
#battle-chat-dock details { font-size: 10px; }
#battle-chat-dock details[open] #chat-emojis { max-height: 70px; overflow: auto; }
#battle-chat-dock #chat-form { display: flex; gap: 4px; align-items: center; }
#battle-chat-dock #chat-form label { min-width: 0; flex: 1; font-size: 0; }
#battle-chat-dock #chat-input { min-height: 24px; width: 100%; min-width: 0; padding: 2px 3px; margin: 0; font-size: 12px; }
#battle-chat-dock .chat-footer { margin: 0; }
#battle-chat-dock #chat-status:empty { display: none; }
#battle-chat-dock [hidden], .hud-hidden > #battle-chat-dock { display: none !important; }
@media (max-width: 1200px) {
  #battle-stage #hud-bottom { bottom: calc(max(8px, env(safe-area-inset-bottom)) + 128px); }
  #battle-stage #hud-notice, #battle-stage #hud-watch { bottom: calc(max(8px, env(safe-area-inset-bottom)) + 218px); }
}
@media (max-width: 600px) and (orientation: portrait) {
  #battle-stage #hud-bottom-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #battle-stage #hud-bottom-actions:has(#skip-build:not([hidden])) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #battle-stage #hud-zoom [data-zoom-reset] svg { width: 14px; height: 14px; }
  #battle-stage #hud-notice, #battle-stage #hud-watch { bottom: calc(max(8px, env(safe-area-inset-bottom)) + 255px); }
}

@media (min-width: 720px) and (max-width: 1200px) and (max-height: 500px) and (orientation: landscape) {
  #battle-stage #hud-bottom { bottom: max(8px, env(safe-area-inset-bottom)); }
  #battle-stage #hud-notice, #battle-stage #hud-watch { bottom: 75px; }
  #battle-chat-dock { width: clamp(120px, calc(50vw - 220px), 235px); }
  #battle-chat-dock .chat-messages { height: 35px; }
}