:root{--bg:#301F33;--green:#C3FF00;--cream:#F8F9F7;}
*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}
html,body{margin:0;min-height:100%;background:#120d13;color:var(--green);font-family:'Press Start 2P',monospace;overflow:hidden;touch-action:none;}
#shell{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at center,#3b2740 0%,#301F33 58%,#161018 100%);}
#game{width:min(100vw,177.777vh);height:min(56.25vw,100vh);image-rendering:pixelated;display:block;background:#301F33;box-shadow:0 0 58px rgba(195,255,0,.12);}
#muteBtn{position:fixed;top:22px;right:12px;z-index:5;background:#301F33;color:var(--green);border:2px solid var(--green);font-family:inherit;font-size:10px;padding:10px;cursor:pointer;}
#mobileControls{position:fixed;left:0;right:0;bottom:calc(18px + env(safe-area-inset-bottom));z-index:4;display:none;justify-content:space-between;padding:0 26px;pointer-events:none;-webkit-touch-callout:none;}
.arrowBtn{width:74px;height:74px;background:transparent;border:0;padding:0;pointer-events:auto;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;}
.arrowBtn img{width:100%;height:100%;display:block;pointer-events:none;-webkit-user-drag:none;-webkit-touch-callout:none;}
@media (pointer:coarse),(max-width:900px){#mobileControls{display:none;}}
@media (orientation:landscape){#game{width:min(100vw,177.777vh);height:min(56.25vw,100vh);}}
@media (orientation:portrait) and (pointer:coarse){
  #shell{align-items:flex-start;justify-content:center;padding-top:0;}
  #game{width:100vw;height:100vh;max-width:56.25vh;max-height:177.777vw;box-shadow:none;}
  #mobileControls{display:flex;bottom:calc(32px + env(safe-area-inset-bottom));padding:0 9vw;}
  .arrowBtn{width:54px;height:54px;}
  #muteBtn{font-size:8px;padding:8px;}
}