#fight-guide{width:min(1080px,94vw);max-height:92svh;box-sizing:border-box;padding:24px;background:#f8efdd;color:#15171d;border:3px solid #15171d;border-top:8px solid #ffe500;box-shadow:7px 7px 0 #ffe500;overflow:auto}#fight-guide::backdrop{background:#08090de8}#fight-guide header{display:flex;justify-content:space-between;gap:16px;align-items:center;background:none;color:inherit;padding:0;border:0}#fight-guide h1{font:900 42px var(--display);text-transform:uppercase;margin:4px 0 14px}#fight-guide header span{font-size:12px;letter-spacing:2px}#fight-guide button{background:#15171d;color:#f8efdd;border:2px solid #15171d;padding:10px 13px;min-height:44px;font-size:14px;cursor:pointer}#fight-guide nav{display:flex;gap:8px;margin:18px 0}#fight-guide nav button[aria-pressed=true]{background:#ffe500;color:#15171d}.guide-tips{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border-top:2px solid #15171d;border-bottom:1px solid #c5bdad}.guide-tips p{font-size:14px;line-height:1.5}.guide-tips b{display:block;font-size:16px}.guide-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:24px}.binding-list h2{font:800 25px var(--display);margin:0}.binding-list>p{font-size:14px;margin:6px 0 12px}.binding-list button{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:4px!important;text-align:left;background:#fff9eb!important;color:#15171d!important;border:1px solid #b7b0a2!important;padding:7px 10px!important}.binding-list kbd{background:#ffe500;padding:5px 8px;min-width:35px;text-align:center}.keyboard-layout>div{display:flex;gap:3px;justify-content:center;margin:4px 0}.keyboard-layout>div>span{background:#ddd5c6;border:1px solid #b9b1a1;width:10%;min-height:64px;padding:4px;box-sizing:border-box}.keyboard-layout>div>span.bound{background:#ffe500;border-color:#15171d}.keyboard-layout b{font-size:16px}.keyboard-layout small{display:block;font-size:10px;line-height:1.1;margin-top:5px}.keyboard-layout p,.controller-layout p{font-size:14px;line-height:1.5}.controller-layout{background:#23252d;color:#f8efdd;padding:16px;border-radius:24px;align-self:start}.shoulder-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.shoulder-row span,.face-buttons span{text-align:center;font-size:12px}.controller-layout b{display:block;color:#ffe500;font-size:15px;margin-bottom:4px}.controller-centre{display:grid;grid-template-columns:1fr 1.3fr;align-items:center;gap:14px;padding:25px 0}.stick-diagram{border:3px solid #ffe500;border-radius:50%;width:100px;height:100px;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:28px;text-align:center}.stick-diagram small{font-size:11px}.face-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.face-3{grid-column:2}.face-2{grid-column:1;grid-row:2}.face-1{grid-column:3;grid-row:2}.face-0{grid-column:2;grid-row:3}#fight-guide footer{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 0 0;color:#15171d;background:none;font-size:14px}#binding-status{flex:1;min-width:180px}.clock-mode{padding-top:15px!important;padding-bottom:15px!important}#shot-dock{position:fixed;bottom:0;left:0;right:0;z-index:8;background:#101115ed;border-top:1px solid #746b35;padding:7px 20px;display:flex;justify-content:center;gap:28px;box-sizing:border-box}#shot-dock[hidden],#shot-dock section[hidden]{display:none!important}#shot-dock section{display:flex;align-items:center;justify-content:center;gap:6px;min-width:0}.shot-player{font:800 16px var(--display);color:#ffe500;margin-right:5px}#shot-dock:not(.two-player) .shot-player{display:none}#shot-dock button{min-height:40px;background:#1b1d24;color:#a5a6aa;border:1px solid #5b5c64;display:flex;align-items:center;gap:8px;padding:6px 10px;font-size:13px;text-transform:capitalize}#shot-dock kbd{font:800 12px sans-serif;border:1px solid currentColor;padding:3px 5px;border-radius:3px}#shot-dock button.available{border-color:#ffe500;color:#fff0a0;background:#302d17}#shot-dock button.throwing{background:#ffe500;color:#15171d;border-color:#ffe500}#shot-dock button.uppercut{box-shadow:inset 0 -3px #ffe500}#shot-dock i{height:5px;width:5px;background:#666;border-radius:50%}#shot-dock .available i{background:#ffe500}.in-bout #app{padding-bottom:56px}.in-bout.compact-controls .arena{height:calc(100svh - 134px)}.in-bout:not(.compact-controls) .arena{height:calc(100svh - 311px);min-height:330px}.in-bout footer{display:none}.in-bout .attack-controls small{display:none}
@media(max-width:760px){#fight-guide{padding:16px;width:96vw}#fight-guide h1{font-size:30px}.guide-tips{grid-template-columns:1fr;gap:0}.guide-tips p{margin:8px 0}.guide-layout{grid-template-columns:1fr}.keyboard-layout>div>span{min-height:66px;padding:3px}.keyboard-layout small{font-size:9px}#fight-guide nav{gap:5px}#fight-guide nav button{padding:8px;font-size:13px}#shot-dock{padding:6px;gap:5px;flex-wrap:wrap}#shot-dock section{width:100%;gap:4px}#shot-dock button{flex:1;min-width:0;padding:5px 4px;font-size:11px;gap:4px}#shot-dock i{display:none}#shot-dock .shot-player{font-size:14px}#shot-dock.two-player{gap:5px}.in-bout:has(#versus-select[hidden]).versus-match #app{padding-bottom:102px}.in-bout.compact-controls .arena{height:calc(100svh - 130px)}.in-bout.versus-match.compact-controls .arena{height:calc(100svh - 185px)}#fight-guide footer button{flex:1}.title-start-music{bottom:12px}.clock-menu-copy .clock-mode{padding:12px!important}.clock-menu-copy{padding-bottom:65px}}
/* Compact diagrams and tabs must shrink with the dialog, without sideways scrolling. */
#fight-guide .guide-layout>* { min-width: 0; }
#fight-guide .keyboard-layout>div>span { flex: 1 1 0; width: auto; min-width: 0; }
#fight-guide .keyboard-layout small { overflow-wrap: anywhere; }
#fight-guide nav button { min-width: 0; }
@media (max-width: 480px) {
  #fight-guide .keyboard-layout>div>span { min-height: 44px; display: grid; place-items: center; }
  /* The full action names remain in Your controls below the compact key diagram. */
  #fight-guide .keyboard-layout small { display: none; }
}
@media (max-width: 380px) {
  #fight-guide header { flex-wrap: wrap; gap: 8px; }
  #fight-guide nav { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
  #fight-guide nav button { font-size: 12px; padding: 8px 4px; }
  #fight-guide .controller-layout { padding: 12px; }
  #fight-guide .controller-centre { grid-template-columns: 74px minmax(0,1fr); gap: 8px; }
  #fight-guide .stick-diagram { width: 74px; height: 74px; font-size: 22px; }
  #fight-guide .stick-diagram small { font-size: 9px; }
  #fight-guide .face-buttons { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; }
  #fight-guide .face-buttons span,#fight-guide .shoulder-row span { min-width: 0; overflow-wrap: anywhere; font-size: 10px; }
}
.guide-status{position:sticky;top:-24px;z-index:2;background:#f8efdd;border-bottom:1px solid #bbb2a1;display:flex;gap:12px;align-items:center;margin-bottom:14px;min-height:42px}.guide-status p{font-size:14px;margin:8px 0}.guide-status button{flex-shrink:0}#fight-guide button[hidden]{display:none}.shot-player{min-width:20px}@media(max-width:760px){.guide-status{top:-16px}.guide-status p{font-size:13px}}