/* A true 4:3 game surface in a small, rectangular metal surround. */
:root{background:#071726;--unit:min(1px,calc(100vw / 832),calc(100dvh / 656))}
body{background:#071726}
.cabinet{width:calc(832 * var(--unit));height:calc(656 * var(--unit))}
.bezel{left:0;top:0;width:calc(768 * var(--unit));height:calc(576 * var(--unit));transform-origin:0 0}
.bezel-label{display:none}
.cabinet:not(:fullscreen) footer{left:50%;right:auto;top:calc(628 * var(--unit));bottom:auto;width:max-content;transform:translate(-50%,-50%);justify-content:center;gap:0}
.cabinet:not(:fullscreen) footer p,.cabinet:not(:fullscreen) footer .directions{display:none}
.cabinet:not(:fullscreen) footer .controls{gap:calc(7 * var(--unit))}
.cabinet:not(:fullscreen) footer button,.cabinet:not(:fullscreen) footer a{width:clamp(20px,calc(28 * var(--unit)),28px);height:clamp(20px,calc(28 * var(--unit)),28px);padding:clamp(3px,calc(5 * var(--unit)),5px);border-color:#8eb8bd80;background:#061725e8;color:#c4e3e6}
.cabinet:not(:fullscreen) footer button:hover,.cabinet:not(:fullscreen) footer a:hover{border-color:#d8c591;background:#153745;color:#fff0c8}
/* In the shop, use the lower trim for its helper and the narrow right rail
   for the system tray. Neither covers the game's illustration or menu. */
.cabinet:not(:fullscreen) #shop-controls{left:calc(44 * var(--unit));top:calc(628 * var(--unit));width:calc(744 * var(--unit));transform:translateY(-50%);padding:1px 4px;gap:4px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.cabinet:not(:fullscreen) #shop-controls button{height:clamp(16px,calc(28 * var(--unit)),28px);min-width:24px;padding:2px clamp(2px,calc(5 * var(--unit)),5px)}
.cabinet:not(:fullscreen) #shop-controls #shop-dismiss{width:clamp(16px,calc(24 * var(--unit)),24px);height:clamp(16px,calc(24 * var(--unit)),24px);min-width:0;padding:2px}
.cabinet:not(:fullscreen):has(#shop-controls:not([hidden])) footer{left:calc(816 * var(--unit));top:calc(328 * var(--unit))}
.cabinet:not(:fullscreen):has(#shop-controls:not([hidden])) footer .controls{flex-direction:column;gap:calc(4 * var(--unit))}
.cabinet:not(:fullscreen):has(#shop-controls:not([hidden])) footer button,.cabinet:not(:fullscreen):has(#shop-controls:not([hidden])) footer a{width:clamp(12px,calc(24 * var(--unit)),24px);height:clamp(12px,calc(24 * var(--unit)),24px);padding:calc(3 * var(--unit))}
.cabinet:not(:fullscreen):has(#shop-controls:not([hidden])) footer svg{width:clamp(9px,calc(14 * var(--unit)),14px);height:clamp(9px,calc(14 * var(--unit)),14px)}
@media(max-width:650px),(max-height:600px){
 .cabinet:not(:fullscreen) #shop-controls{grid-template-columns:minmax(0,1fr) 20px}
 .cabinet:not(:fullscreen) .shop-controls-label{display:none}
 .cabinet:not(:fullscreen) .shop-controls-actions{grid-column:1;grid-row:1;gap:3px}
 .cabinet:not(:fullscreen) #shop-controls #shop-dismiss{grid-column:2;grid-row:1}
}
.cabinet:fullscreen{width:100%;height:100%}
.cabinet:fullscreen .bezel{height:auto}