/* Touch ergonomics are separate from combat and the desktop stylesheet. */
#app{height:100vh;height:var(--app-height,100dvh)}
button,.stick{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
#touch-hint{display:none}
.show-touch kbd{display:none}
.show-touch .small-button{min-width:44px;min-height:44px}
.show-touch .command-tools button{min-height:44px}
.show-touch .unit-chip{min-width:44px;min-height:44px}
.show-touch .stick{width:100px;height:100px;touch-action:none}
.show-touch .stick i{width:42%;height:42%;left:29%;top:29%}
.show-touch .stick span{font-size:12px;bottom:8px}
.show-touch .menu{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.show-touch .dialog{flex-shrink:0;margin-block:auto}
.show-touch .menu button{min-height:44px}
.show-touch .settings-row select{font-size:16px;min-height:44px;max-width:55%}
.show-touch .settings-row input[type=checkbox]{width:28px;height:28px}
.show-touch #auto-button{display:block}
.show-touch #control-help{display:none}
.show-touch #commands{flex-shrink:0}
.show-touch #hud{flex-shrink:0}
.show-touch #squad-units{display:none}
.show-touch .squad-heading{display:block;line-height:1.45}
.show-touch .squad-heading b{display:block}
.show-touch .command-tools kbd{display:none}
.show-touch .summon-button strong{white-space:normal;line-height:1.25}
@media(max-width:600px) and (orientation:portrait){
  .show-touch #hud{display:grid;grid-template-columns:55px 1fr 1fr 44px;grid-template-rows:40px 29px;gap:5px 8px;min-height:84px;padding:5px 10px}
  .show-touch .operation{grid-column:1;grid-row:1}
  .show-touch .operation span{display:none}
  .show-touch .operation strong{font-size:22px}
  .show-touch .wave-readout{grid-column:2/4;grid-row:1;display:flex;gap:8px;align-items:center;justify-content:center;margin:0}
  .show-touch .wave-readout small{font-size:10px}
  .show-touch .wave-readout strong{font-size:19px}
  .show-touch #pause-button{grid-column:4;grid-row:1;padding:2px;font-size:18px}
  .show-touch .base-readout{grid-column:1/3;grid-row:2;max-width:none}
  .show-touch .energy-readout{grid-column:3/5;grid-row:2;max-width:none}
  .show-touch .readout span,.show-touch .readout b{font-size:10px}
  .show-touch #commands{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:64px 44px;gap:6px;padding:7px 8px;min-height:128px}
  .show-touch #summon-list{grid-column:1/3;grid-row:1;max-width:none;gap:5px;min-width:0}
  .show-touch .summon-button{height:64px;grid-template-columns:29px 1fr;padding:3px 4px 3px 0}
  .show-touch .summon-button canvas{width:30px;height:48px}
  .show-touch .summon-button strong{font-size:10px}
  .show-touch .summon-button span{font-size:10px}
  .show-touch .squad{grid-column:1;grid-row:2;min-width:0;max-width:none}
  .show-touch .squad-heading{font-size:10px;min-width:0}
  .show-touch .squad-heading span{display:block;max-width:130px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .show-touch .squad-heading b{font-size:10px;margin-top:2px}
  .show-touch .command-tools{grid-column:2;grid-row:2;display:flex;gap:4px;min-width:0}
  .show-touch .command-tools button{width:54px;min-width:44px;min-height:44px;font-size:11px;padding:4px;line-height:1.4}
  /* Keep fingers outside the rendered battlefield in portrait orientation. */
  .show-touch.in-battle #battlefield{height:calc(100% - 116px)}
  .show-touch #touch-controls:before{content:"";position:absolute;left:0;right:0;bottom:0;height:116px;background:#102732;border-top:1px solid #35515b}
  .show-touch .stick{left:16px;bottom:7px;width:96px;height:96px}
  .show-touch .attack-stick{left:auto;right:16px}
  .show-touch #touch-hint{display:block;position:absolute;bottom:43px;left:118px;right:118px;color:#b9cecd;font-size:10px;line-height:1.6;text-align:center}
  .show-touch #boss-hud{top:6px;left:50%;width:calc(100% - 20px);padding:7px 10px}
  .show-touch #boss-hud:not([hidden])~#notice{top:61px}
  .show-touch .menu{padding:18px 14px}
  .show-touch .home h1{font-size:44px;margin:15px 0}
  .show-touch .home-lead{font-size:12px;margin-bottom:18px}
  .show-touch .home-actions{gap:7px}
  .show-touch .home-actions .mobile-start{background:#263f47;border-color:#92d7c5;color:#c9f5e7}
  .show-touch .home-status{margin-top:22px}
  .show-touch .temp-label{margin-top:20px}
}
@media(orientation:landscape) and (max-height:550px){
  .show-touch #hud{height:56px;min-height:56px;padding:4px 10px;gap:10px}
  .show-touch .operation{min-width:50px;gap:4px}
  .show-touch .operation span{display:none}
  .show-touch #pause-button{padding:4px}
  .show-touch #commands{display:grid;grid-template-columns:90px minmax(0,1fr) 156px;grid-template-rows:64px;gap:8px;min-height:78px;padding:6px 8px}
  .show-touch .squad{grid-column:1;grid-row:1;min-width:0;max-width:none}
  .show-touch .squad-heading{font-size:10px}
  .show-touch .squad-heading b{font-size:10px}
  .show-touch #summon-list{grid-column:2;grid-row:1;min-width:0;gap:5px;max-width:none}
  .show-touch .summon-button{height:62px;grid-template-columns:28px 1fr;padding:3px 4px 3px 0}
  .show-touch .summon-button canvas{width:30px;height:48px}
  .show-touch .summon-button strong,.show-touch .summon-button span{font-size:10px}
  .show-touch .command-tools{grid-column:3;grid-row:1;display:flex;gap:3px;min-width:0}
  .show-touch .command-tools button{width:50px;min-width:44px;min-height:44px;padding:3px;font-size:10px;line-height:1.4}
  .show-touch .stick{width:84px;height:84px;bottom:8px;left:12px}
  .show-touch .attack-stick{left:auto;right:12px}
  .show-touch .stick span{font-size:10px}
  .show-touch #boss-hud{top:4px;width:60%;padding:5px 8px}
  .show-touch #boss-hud:not([hidden])~#notice{top:53px}
  .show-touch .menu{padding:12px 18px}
  .show-touch .home .menu-inner{padding-block:8px}
  .show-touch .home h1{font-size:32px;margin:10px 0}
  .show-touch .home-lead{font-size:11px;line-height:1.5;margin:8px 0 12px}
  .show-touch .home-status,.show-touch .temp-label{display:none}
  .show-touch .home-actions{max-width:600px;gap:7px}
  .show-touch .home-actions button{padding:8px 12px}
  .show-touch .menu:not(.home){align-items:flex-start}
}
@media(max-width:350px) and (orientation:portrait){
  .show-touch #touch-hint{font-size:9px;left:112px;right:112px}
  .show-touch .command-tools button{width:48px;font-size:10px}
  .show-touch .summon-button{grid-template-columns:24px 1fr}
  .show-touch .summon-button canvas{width:25px;height:42px}
  .show-touch .summon-button strong,.show-touch .summon-button span{font-size:9px}
  .show-touch .home h1{font-size:38px}
  .show-touch .home-status{display:none}
}