/* Large controls for the interactive board. The middle of the game stays visible. */
.virtual-pad{position:absolute;inset:0;z-index:16;pointer-events:none;user-select:none;-webkit-user-select:none}
.vp-directions{position:absolute;left:32px;bottom:30px;display:grid;grid-template-columns:repeat(3,112px);grid-template-rows:repeat(3,106px);gap:9px;align-items:center;justify-items:center}
.vp-button{pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:112px;height:106px;border:3px solid #d8e9d3aa;border-radius:24px;background:linear-gradient(145deg,#205765ef,#10343df2);color:#fff6d7;box-shadow:0 6px 0 #062a35,0 10px 20px #041c3355;transition:background .12s,box-shadow .12s;cursor:pointer}
.vp-button>span{font-size:37px;line-height:1}.vp-button>b{font:800 26px/1.2 var(--display);letter-spacing:.01em}
.vp-button:hover{border-color:#ffe6a0;background:#326b6f}
.vp-button.is-held,.vp-button:active{background:#ffc75b;color:#123b40;border-color:#fff5c6;box-shadow:0 2px 0 #9d7028;transform:translateY(4px)}
.vp-up{grid-column:2;grid-row:1}.vp-left{grid-column:1;grid-row:2}.vp-right{grid-column:3;grid-row:2}.vp-down{grid-column:2;grid-row:3}
.vp-center{grid-column:2;grid-row:2;font-size:37px;color:#f8d789;opacity:.7;filter:drop-shadow(0 3px 4px #062837)}
.vp-directions>p{position:absolute;bottom:-25px;left:0;right:0;text-align:center;font:17px var(--body);color:#e1eddb;margin:0;text-shadow:0 2px 3px #08242c}
.vp-action-group{position:absolute;right:40px;bottom:52px;display:flex;flex-direction:column;align-items:center;gap:15px;width:218px}
.vp-action-group>p{margin:0;color:#fff5db;font:20px/1.4 var(--body);text-align:center;text-shadow:0 2px 5px #08252b;background:#103541b8;padding:9px 12px;border-radius:14px}
.vp-action{width:176px;height:176px;border-radius:50%;background:linear-gradient(145deg,#f6935c,#db633f);border-color:#ffdab1;box-shadow:0 8px 0 #8f3e2b,0 12px 26px #082d3b77}
.vp-action svg{width:66px;height:66px;filter:drop-shadow(0 2px 0 #9f3e2c)}
.vp-action>b{font-size:33px}.vp-action:hover{background:#ed8455}.vp-action.is-held,.vp-action:active{background:#ffda79;box-shadow:0 3px 0 #9d7028}
.has-virtual-pad #hudB,.has-virtual-pad .horse-hud .hud-b{width:1010px}
.has-virtual-pad .hud-b .chip{padding:12px 17px}
.has-virtual-pad #jumpBox{max-width:1070px}.has-virtual-pad #jumpBox .k{font-size:57px}.has-virtual-pad #jumpBox p{max-width:20em}
@media(prefers-reduced-motion:reduce){.vp-button{transition:none}}

.manual-control-note{background:#24525d;border:1px solid #91b3a966;border-radius:17px;padding:15px 20px;font:21px/1.5 var(--body);margin:0}.manual-control-note b{color:#ffda87}
/* The former status cards are now native controls sharing the joystick input. */
.hud-controls{grid-template-columns:repeat(5,minmax(0,1fr))}
.hud-control{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:100px;min-width:0;width:100%;touch-action:none;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;box-shadow:0 4px 0 #082f38;pointer-events:auto}
.hud-control .k{font-size:32px;white-space:nowrap}.hud-control .d{font-size:16px;line-height:1.2}
.hud-control:disabled{cursor:default;opacity:1}
.hud-control:enabled{cursor:pointer;border-color:#d0e9df66;background:linear-gradient(150deg,#20515ef2,#123744f2)}
.hud-control:enabled:hover{border-color:#ffe3a1;background:#30606c}
.hud-control:enabled.on,.hud-control.is-held{background:#ffd067;color:#103940;border-color:#fff1be;box-shadow:0 2px 0 #9a6e27;transform:none}
.hud-control:enabled.on .k,.hud-control:enabled.on .d,.hud-control.is-held .k,.hud-control.is-held .d{color:#103940}
.hud-control.is-held{box-shadow:inset 0 4px 9px #8d5c2533,0 2px 0 #9a6e27}
.hud-control-status{display:flex;justify-content:center;gap:26px;font-size:16px;color:#d4e9e1;text-shadow:0 2px 3px #092f3d;background:#103541bb;padding:5px 18px;border-radius:12px}
.hud-control-status b{color:#ffe1a1;margin-left:6px}