/* Shared battle layout. Controls stay in their own columns, never over the map. */
.arena-cards .arena-arcade-card .arcade-battle-entry{display:block;width:100%;margin-top:9px;border:1px solid #f3d992!important;background:#123f35!important;color:#fff0bb!important;min-height:44px;border-radius:11px;font-weight:900}
.battle-home{max-width:1120px;margin:0 auto 32px;color:#f9f3e4}
.battle-home button,.arcade-battle button{font:inherit;cursor:pointer}
.battle-back{padding:9px 13px;border:1px solid #a7c4b5;border-radius:10px;background:#193f34;color:#fff2cf;font-weight:800}
.battle-hero{margin:14px 0;padding:clamp(20px,3vw,32px);border:1px solid #a48f63;border-radius:22px;background:radial-gradient(circle at 95% 5%,#2d7661,#124539 43%,#0a2826 100%)}
.battle-hero span,.battle-list-head small,.battle-invite small{font-size:10px;font-weight:900;letter-spacing:.16em;color:#f6d895}
.battle-hero h1{margin:8px 0;color:#fff8e9;font-size:clamp(25px,3vw,38px)}
.battle-hero p{max-width:650px;margin:0;color:#e0ede3;line-height:1.55}
.battle-setup,.battle-lobby{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.battle-lobby{grid-template-columns:1fr minmax(220px,320px)}
.battle-panel{min-width:0;padding:21px;border:1px solid #5c8f78;border-radius:18px;background:#102d27;color:#f9f4e8}
.battle-panel h2{margin:0 0 16px;color:#fff8e9;font-size:20px}
.battle-panel label{display:grid;gap:6px;margin:0 0 13px;color:#d6e8d9;font-size:12px;font-weight:800}
.battle-panel input,.battle-panel select{width:100%;min-height:44px;padding:10px 12px;border:1px solid #86ae9a;border-radius:10px;background:#193e34;color:#fff8e9;font:inherit;font-size:14px}
.battle-panel input::placeholder{color:#b2c8bd}
.battle-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.battle-choice{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}
.battle-choice button{flex:1;min-width:140px}
.battle-primary,.battle-secondary,.battle-room button,.battle-invite button,.battle-list-head button,.battle-join button{min-height:44px;padding:9px 14px;border:1px solid #e5cb89;border-radius:10px;font-weight:900}
.battle-primary,.battle-room button{background:#efd18c;color:#153d31}
.battle-secondary,.battle-list-head button,.battle-join button,.battle-invite button{background:#205447;color:#fff2d2}
.battle-choice button:disabled{opacity:.48;cursor:not-allowed}
.battle-help,.battle-empty,.battle-invite p{color:#cce0d3;font-size:12px;line-height:1.5}
html[data-theme] main .battle-home p,html[data-theme] main .battle-home .battle-empty,
html[data-theme] main .battle-home .battle-help{color:#d8e9df!important}
html[data-theme] main .battle-home small{color:#e8d699!important}
html[data-theme] main .battle-panel label{color:#e7f0e8!important}
html[data-theme] main .battle-panel input::placeholder{color:#677c70!important}
html[data-theme] main .battle-panel .battle-secondary,
html[data-theme] main .battle-panel .battle-list-head button,
html[data-theme] main .battle-panel .battle-invite button{color:#fff2d2!important}
html[data-theme] main .battle-panel .battle-primary,
html[data-theme] main .battle-panel .battle-room button{color:#153d31!important}
.battle-list-head{display:flex;justify-content:space-between;gap:12px;align-items:center}
.battle-list-head h2{margin:3px 0 10px}
.battle-list-head button{min-height:36px;padding:6px 10px;font-size:11px}
.battle-room{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:8px 0;padding:10px;border:1px solid #5c8875;border-radius:11px;background:#183d33}
.battle-room strong,.battle-room small{display:block}.battle-room small{margin-top:3px;color:#d8e6dc;font-size:11px}
.battle-room button{min-height:37px;font-size:12px}
.battle-join{display:flex;align-items:end;gap:9px;padding-top:12px;border-top:1px solid #638d7880}
.battle-join label{flex:1;margin:0}.battle-join button{flex:none}
.battle-player-slot{display:flex;align-items:center;gap:11px;margin-bottom:8px;padding:11px;border:1px solid #618d77;border-radius:12px;background:#183c33}
.battle-player-slot.ready{border-color:#d7c180}
.battle-player-slot>span{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:50%;background:#e4cb8e;color:#163b30;font-weight:900}
.battle-player-slot div{flex:1;min-width:0}.battle-player-slot b,.battle-player-slot small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.battle-player-slot small{color:#bddbc8;font-size:11px}
.battle-player-slot em{color:#f3da97;font-size:11px;font-style:normal;text-align:right}
.battle-invite strong{display:block;margin:9px 0;color:#ffe29a;font-size:29px;letter-spacing:.13em}.battle-invite button{width:100%}
.battle-invite .battle-share{margin-top:8px;background:#e8cc8c;color:#173c30}
.battle-status{min-height:21px;margin:12px 2px;color:#ffe5a4;font-size:12px;font-weight:800}
.arcade-battle:fullscreen .battle-status:not(:empty),.arcade-battle.arcade-immersive .battle-status:not(:empty){position:absolute;z-index:4;right:12px;bottom:8px;max-width:min(420px,70vw);margin:0;padding:6px 10px;border:1px solid #e6c678;border-radius:8px;background:#10382fe8;color:#fff0bd}
.arcade-battle{max-width:1500px;margin:auto;padding:12px!important;color:#fff5e7}
.battle-top{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:43px}
.battle-top>b{color:#ffde91;font-size:13px;letter-spacing:.07em}.battle-top>div{display:flex;gap:6px}
.battle-top button,.battle-footer button,.battle-stop{min-height:38px;padding:7px 12px;border:1px solid #789f8e;border-radius:9px;background:#1b4a3c;color:#fff2d6;font-weight:900}
.battle-score{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:8px auto;max-width:1050px}
.battle-score span{display:grid;gap:2px;padding:5px 8px;border:1px solid #528570;border-radius:9px;background:#14392f;color:#cce2d4;font-size:9px;font-weight:900;letter-spacing:.04em;text-align:center}
.battle-score b{color:#ffe19a;font-size:17px}
.battle-arena{display:grid;grid-template-columns:minmax(115px,1fr) minmax(0,700px) minmax(115px,1fr);align-items:center;gap:10px;margin:auto;max-width:1120px}
.battle-left,.battle-right{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0}
.battle-team-label{color:#ffe3a5;font-size:11px;font-weight:900;text-align:center}
.battle-board{position:relative;width:100%;aspect-ratio:1;border:3px solid #e4c67d;border-radius:14px;overflow:hidden;box-shadow:0 0 0 4px #b9d0ac20,0 13px 32px #0008;background:#071c1c}
.battle-board canvas{display:block;width:100%;height:100%}
.battle-joystick{position:relative;width:126px;height:126px;border:2px solid #ebd28b;border-radius:50%;background:radial-gradient(circle,#2c6855,#11362e);touch-action:none;user-select:none}
.battle-joystick button{position:absolute;z-index:1;width:42px;height:42px;border:1px solid #f2d897;border-radius:50%;background:#205749;color:#ffe8b6;font-size:20px;font-weight:900;touch-action:none}
.battle-joystick [data-battle-dir="up"]{top:0;left:calc(50% - 21px)}.battle-joystick [data-battle-dir="right"]{right:0;top:calc(50% - 21px)}
.battle-joystick [data-battle-dir="down"]{bottom:0;left:calc(50% - 21px)}.battle-joystick [data-battle-dir="left"]{left:0;top:calc(50% - 21px)}
.battle-knob{position:absolute;top:calc(50% - 18px);left:calc(50% - 18px);display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#edce85;color:#174033;pointer-events:none}
.battle-dpad{display:grid;grid-template-columns:repeat(3,42px);grid-template-rows:repeat(2,42px);gap:4px;grid-template-areas:'. up .' 'left down right'}
.battle-dpad [data-battle-dir="up"]{grid-area:up}.battle-dpad [data-battle-dir="right"]{grid-area:right}.battle-dpad [data-battle-dir="down"]{grid-area:down}.battle-dpad [data-battle-dir="left"]{grid-area:left}
.battle-dpad button{border:1px solid #e4cc8d;border-radius:9px;background:#225848;color:#ffeabd;font-size:21px;font-weight:900}
.battle-joystick button.active,.battle-dpad button.active{background:#f2d889;color:#153d31}
.arcade-battle[data-control-mode="analog"] .battle-dpad{display:none}.arcade-battle[data-control-mode="dpad"] .battle-joystick{display:none}
.battle-stop{min-height:33px;font-size:11px}.battle-attack,.battle-power{width:min(100%,150px);min-height:49px;border:1px solid #eacb86;border-radius:11px;background:#eed28f;color:#173c30;font-size:13px;font-weight:900}
.battle-power{background:#205847;color:#fff0c6}.battle-power.charged{background:#f4d484;color:#153c30;box-shadow:0 0 15px #f1dc8780}
.battle-power.active:disabled{opacity:1;background:#e6ca76;border-color:#fff0b0;color:#133a2e;box-shadow:0 0 0 2px #ffe39a77,0 0 15px #f8d78262}
.battle-right>small{max-width:160px;color:#d8e7d7;font-size:10px;text-align:center}
.battle-rivals{width:100%;max-width:165px}.battle-rivals>div{display:flex;justify-content:space-between;gap:4px;margin-bottom:5px;padding:6px;border:1px solid #5d8d78;border-radius:7px;background:#153c31;color:#f9f2df;font-size:10px}.battle-rivals .out{opacity:.63}
html[data-theme] .arcade-battle .battle-rivals b,html[data-theme] .arcade-battle .battle-rivals span{color:#fff3d6!important;font-size:11px}
.battle-overlay{position:absolute;inset:0;display:grid;place-items:center;padding:15px;background:#062019d9;text-align:center}.battle-overlay>div{max-width:340px;padding:18px;border:1px solid #e6d293;border-radius:17px;background:#184536;color:#fff4da}
.battle-overlay span{font-size:36px}.battle-overlay h2{color:#fff4dc}.battle-overlay button{min-height:40px;padding:8px 14px;border:0;border-radius:9px;background:#edcf84;color:#153f32;font-weight:900}
.battle-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;max-width:1120px;margin:8px auto;color:#f4dfab;font-size:12px;font-weight:800}
.battle-footer span{flex:1}.battle-footer button{font-size:11px}
.arcade-battle:fullscreen,.arcade-battle.arcade-immersive{display:flex;flex-direction:column;overflow:hidden}
.arcade-battle:fullscreen .battle-arena,.arcade-battle.arcade-immersive .battle-arena{flex:1;min-height:0;width:100%;max-width:none;grid-template-columns:minmax(115px,1fr) minmax(0,min(100%,calc(100dvh - 115px))) minmax(115px,1fr)}
.arcade-battle:fullscreen .battle-board,.arcade-battle.arcade-immersive .battle-board{max-height:calc(100dvh - 115px);margin:auto}
@media(max-width:700px){.battle-setup,.battle-lobby{grid-template-columns:1fr}.battle-panel{padding:16px}.battle-join{flex-wrap:wrap}.battle-join button{width:100%}.battle-hero{padding:20px}.battle-arena{grid-template-columns:1fr;gap:8px}.battle-left{order:2;flex-direction:row;justify-content:center}.battle-board{order:1;width:min(100%,calc(100dvh - 320px));margin:auto}.battle-right{order:3;flex-direction:row;justify-content:center;flex-wrap:wrap}.battle-rivals{display:none}.battle-right>small{display:none}.battle-attack,.battle-power{width:auto;min-width:110px}.battle-score b{font-size:13px}.battle-score span{font-size:7px}.battle-team-label{display:none}}
@media(max-width:700px) and (orientation:landscape), (pointer:coarse) and (orientation:landscape) and (max-height:520px){
  .arcade-battle:fullscreen,.arcade-battle.arcade-immersive{padding:max(3px,env(safe-area-inset-top)) max(5px,env(safe-area-inset-right)) max(3px,env(safe-area-inset-bottom)) max(5px,env(safe-area-inset-left))!important}
  .arcade-battle:fullscreen .battle-top,.arcade-battle.arcade-immersive .battle-top{position:absolute;top:2px;left:6px;right:6px;z-index:2;min-height:34px;pointer-events:none}
  .arcade-battle:fullscreen .battle-top button,.arcade-battle.arcade-immersive .battle-top button{pointer-events:auto;min-height:32px}
  .arcade-battle:fullscreen .battle-top>b,.arcade-battle.arcade-immersive .battle-top>b{display:none}
  .arcade-battle:fullscreen .battle-score,.arcade-battle.arcade-immersive .battle-score{position:absolute;top:0;left:58px;right:100px;z-index:1;display:flex;justify-content:center;margin:0;pointer-events:none}
  .arcade-battle:fullscreen .battle-score span,.arcade-battle.arcade-immersive .battle-score span{min-width:45px;padding:2px;font-size:7px}.arcade-battle:fullscreen .battle-score b,.arcade-battle.arcade-immersive .battle-score b{font-size:10px}
  .arcade-battle:fullscreen .battle-arena,.arcade-battle.arcade-immersive .battle-arena{display:grid;grid-template-columns:minmax(96px,1fr) minmax(0,min(calc(100dvh - 7px),calc(100vw - 205px))) minmax(100px,1fr);gap:3px}
  .arcade-battle:fullscreen .battle-left,.arcade-battle.arcade-immersive .battle-left{grid-column:1;grid-row:1;flex-direction:column;order:0;gap:4px}
  .arcade-battle:fullscreen .battle-board,.arcade-battle.arcade-immersive .battle-board{grid-column:2;grid-row:1;width:min(calc(100dvh - 7px),calc(100vw - 205px));max-height:none;order:0}
  .arcade-battle:fullscreen .battle-right,.arcade-battle.arcade-immersive .battle-right{grid-column:3;grid-row:1;flex-direction:column;flex-wrap:nowrap;order:0;gap:5px}
  .arcade-battle:fullscreen .battle-joystick,.arcade-battle.arcade-immersive .battle-joystick{width:100px;height:100px}
  .arcade-battle:fullscreen .battle-joystick button,.arcade-battle.arcade-immersive .battle-joystick button{width:34px;height:34px}
  .arcade-battle:fullscreen .battle-joystick [data-battle-dir="up"],.arcade-battle.arcade-immersive .battle-joystick [data-battle-dir="up"]{left:calc(50% - 17px)}
  .arcade-battle:fullscreen .battle-joystick [data-battle-dir="right"],.arcade-battle.arcade-immersive .battle-joystick [data-battle-dir="right"]{top:calc(50% - 17px)}
  .arcade-battle:fullscreen .battle-joystick [data-battle-dir="down"],.arcade-battle.arcade-immersive .battle-joystick [data-battle-dir="down"]{left:calc(50% - 17px)}
  .arcade-battle:fullscreen .battle-joystick [data-battle-dir="left"],.arcade-battle.arcade-immersive .battle-joystick [data-battle-dir="left"]{top:calc(50% - 17px)}
  .arcade-battle:fullscreen .battle-dpad,.arcade-battle.arcade-immersive .battle-dpad{grid-template-columns:repeat(3,31px);grid-template-rows:repeat(2,31px)}
  .arcade-battle:fullscreen .battle-attack,.arcade-battle.arcade-immersive .battle-attack,.arcade-battle:fullscreen .battle-power,.arcade-battle.arcade-immersive .battle-power{min-width:90px;min-height:38px}
  .arcade-battle:fullscreen .battle-footer,.arcade-battle.arcade-immersive .battle-footer{display:none}
}
@media(prefers-reduced-motion:reduce){.arena-cards .arena-arcade-card:before{animation:none}}