/* Thumb zones overlay the stage. The centre stays clear. */
.playing .toolbar button:not(#pause),.playing #profile-shortcut,.playing .edition{display:none!important}
.playing .keyboard-strip{display:none}
.playing .toolbar{margin-left:auto;gap:0}
.playing .controls{display:block;position:absolute;inset:0;width:auto;height:auto;padding:0;margin:0;border:0;pointer-events:none;z-index:20}
.playing .controls[hidden]{display:none}
.playing .understage{height:0;min-height:0;margin:0;padding:0}
.controls .move-zone,.controls .action-zone{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));width:var(--control-rail,140px);margin:0;pointer-events:auto;grid-area:auto;align-self:auto}
.controls .move-zone{left:max(12px,env(safe-area-inset-left));display:flex;flex-direction:column;align-items:center;gap:8px}
.controls .action-zone{right:max(12px,env(safe-area-inset-right));display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:stretch}
.controls .action{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:100%;height:auto;aspect-ratio:1;min-width:0;min-height:48px;margin:0;padding:5px 2px;border-radius:18px;border-width:1px;touch-action:none;transform:none;box-shadow:0 4px 0 #05070a,0 6px 20px #0004}
.controls .action-symbol{font-size:20px;line-height:1}
.controls .action strong{font-size:10px;line-height:1.15;letter-spacing:.3px;white-space:nowrap}
.controls .action small{position:static;bottom:auto;left:auto;right:auto;transform:none;display:block;font-size:7px;line-height:1.15;white-space:nowrap;letter-spacing:0;opacity:.8}
.controls .action.light{background:linear-gradient(145deg,#ff994d,#eb592e);border-color:#ffbd80;color:#140c0a}
.controls .action.heavy{background:linear-gradient(145deg,#765132,#342720);border-color:#c99755;color:#ffe2a7}
.controls .action.guard{background:linear-gradient(145deg,#304352,#18242d);border-color:#617c90;color:#d1e7f4}
.controls .action.evade{background:linear-gradient(145deg,#244448,#14272c);border-color:#52818a;color:#b7f2ee}
.controls .action.pressed{transform:translateY(3px);box-shadow:0 1px 0 #05070a;filter:brightness(1.25)}
.controls .action.recovering{filter:saturate(.35);border-color:#4b5059}
.controls .action.cue-ready{background:linear-gradient(145deg,#307658,#154b3e);color:#d6ffdf;border-color:#b3f8c5;box-shadow:0 0 0 2px #9bf4ba44,0 0 18px #76e9ac35}
.controls .action.counter-ready,.controls .action.finisher{border-color:#f9e9ac;box-shadow:0 0 0 2px #ffce6555}
.controls .pad{width:92px;height:92px;min-width:92px;margin:0;border:1px solid #656572;background:radial-gradient(circle,#353942 0,#23262e 58%,#171b23 60%);touch-action:none}
.controls .pad-knob{width:44px;height:44px;left:calc(50% - 22px);top:calc(50% - 22px);background:linear-gradient(145deg,#737681,#393d48);box-shadow:0 3px 8px #0008;border:1px solid #92919b}
.controls .pad-left,.controls .pad-right{font-size:23px;color:#bebac9;top:calc(50% - 14px)}
.controls .pad-left{left:9px}.controls .pad-right{right:9px}
.controls .control-hint{margin:0;font-size:8px;line-height:1;letter-spacing:1px;color:#9e9ba9}
.controls #jump-over{display:flex;flex-direction:row;gap:6px;min-width:80px;width:auto;height:44px;min-height:44px;padding:8px 12px;border-radius:14px;background:linear-gradient(140deg,#383643,#24232d);border-color:#71667b}
.controls #jump-over[hidden]{display:none}
.controls #jump-over>span{display:block;font-size:19px}.controls #jump-over strong{font-size:10px}
.pause-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0 8px}
.pause-options button{margin:0!important;min-width:0;padding:10px 8px;font-size:12px}
.playing #paused .panel{width:min(420px,100%)}
.playing .training-coach{bottom:10px;left:50%;transform:translateX(-50%);width:calc(100% - 2*var(--control-rail) - 40px);max-width:660px;padding:7px 10px;gap:8px;background:#10151ed9}
.playing .training-coach strong{font-size:12px}
.playing .training-tools{flex-direction:column;gap:4px}
.playing .training-tools button{width:74px;min-height:36px;padding:6px;font-size:8px}
.playing #training-cue{font-size:11px;line-height:1.3;margin-top:5px}
.playing #training-progress{font-size:10px}
.footwork-practice.playing .training-coach{top:12px;bottom:auto}
@media(orientation:landscape) and (max-height:350px){
 .controls .move-zone{gap:8px;bottom:12px}
 .controls .action-zone{bottom:12px}
 .controls .pad{width:90px;height:90px;min-width:90px}
 .controls #jump-over{height:44px;min-height:44px}
 .controls .action-symbol{font-size:20px}
 .controls .action{gap:3px;border-radius:14px}
 .controls .action small{font-size:6px}
 .playing .training-coach{gap:6px}
 .playing #training-pace{font-size:7px}
 .playing .training-tools button{width:64px}
}

.controls .action.evade{position:relative;overflow:hidden}.controls .action.evade:after{content:"";position:absolute;left:0;bottom:0;height:3px;width:calc(var(--evade-ready,1)*100%);background:#a3eadc;transition:width .06s linear}.controls .action.evade.recovering:after{background:#8a9caa}.controls .control-hint{display:none}
/* Combat choices stay in the existing thumb zones. */
.controls .action.committed{filter:saturate(.35);border-color:#925951}
.controls .action small{color:inherit}
.opponent .guard-track{margin-left:auto}.opponent .guard-track i{margin-left:auto;background:#8bd1dd}
.command-guide{margin:24px 0 26px}.command-moves{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.command-moves article{padding:15px 12px;border:1px solid #615039;border-radius:12px;background:linear-gradient(150deg,#30251b,#191b24)}
.command-moves strong{display:block;color:#f5d69b;font-size:14px;letter-spacing:.4px}.command-moves b{display:block;color:#eee9e4;font-size:10px;margin:9px 0}
.command-moves p{font-size:11px;color:#c4bdba;line-height:1.55;min-height:68px}.command-moves .combo-practice{margin:10px 0 0;padding:9px;min-height:40px;font-size:11px;width:100%}
.playing .callout{left:calc(var(--control-rail) + 12px);right:calc(var(--control-rail) + 12px);letter-spacing:1px;line-height:1.4}
@media(max-width:540px){.command-moves{grid-template-columns:1fr}.command-moves p{min-height:0;margin:8px 0}.command-moves article{padding:14px}.command-moves .combo-practice{width:auto;padding:9px 20px}}
