:root{--barH:48px;--gold:#e7bd55;--cream:#fff7cf;--navy:#071827;--blue:#12325c;}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#06121e;color:#fff;font-family:Impact,Haettenschweiler,'Arial Narrow Bold',system-ui,sans-serif;touch-action:none;user-select:none;overscroll-behavior:none;}
#gameCanvas{display:block;width:100vw;height:calc(100vh - var(--barH));height:calc(100dvh - var(--barH));background:#06121e;image-rendering:pixelated;}
body.mobile #gameCanvas{height:100vh;height:100dvh;}
#arcadeBar{height:var(--barH);box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 12px;background:linear-gradient(180deg,var(--blue),var(--navy));border-bottom:3px solid var(--gold);box-shadow:0 3px 0 #000;}
#arcadeTitle{font-size:18px;letter-spacing:1px;color:#f6d777;text-shadow:2px 2px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#arcadeLinks{display:flex;align-items:center;gap:7px;}
#arcadeLinks a,#arcadeLinks button,#arcadeLinks select,#mobileTopButtons button{color:var(--cream);background:#0a2038;border:2px solid var(--gold);padding:5px 8px;font:12px Impact,system-ui;text-decoration:none;text-shadow:2px 2px #000;cursor:pointer;box-shadow:2px 2px 0 #000;border-radius:2px;}
button:disabled{opacity:.45;cursor:default;}
body.titleMode #arcadeBar{display:none;} body.titleMode.desktop #gameCanvas{height:100vh;height:100dvh;}
#touchControls{display:none;}
body.mobile #touchControls{display:block;position:fixed;left:0;right:0;bottom:max(4px,env(safe-area-inset-bottom));height:148px;pointer-events:none;z-index:10;}
body.mobile:not(.playMode) #touchControls,body.mobile.transitionMode #touchControls,body.mobile.pausedMode #touchControls{display:none;}
#joyBase{position:absolute;left:14px;bottom:10px;width:102px;height:102px;border-radius:50%;border:3px solid rgba(255,247,207,.55);background:rgba(6,18,30,.22);box-shadow:0 0 0 3px rgba(0,0,0,.22);pointer-events:auto;box-sizing:border-box;}
#joyKnob{position:absolute;left:34px;top:34px;width:34px;height:34px;border-radius:50%;background:rgba(255,217,74,.86);border:3px solid rgba(0,0,0,.55);box-sizing:border-box;}
#crumbBtn,#boostBtn{position:absolute;bottom:14px;width:72px;height:72px;border-radius:50%;font:15px Impact,system-ui;color:#fff7cf;text-shadow:2px 2px #000;box-shadow:3px 3px 0 #000;pointer-events:auto;padding:0;}
#crumbBtn{right:96px;border:3px solid #ffd94a;background:rgba(74,38,12,.62);} #boostBtn{right:14px;border:3px solid #9eefff;background:rgba(8,42,70,.68);}
#crumbBtn.disabled,#boostBtn.disabled{opacity:.32;pointer-events:none;}
#mobileTopButtons{display:none;}
body.mobile #mobileTopButtons{display:flex;gap:5px;position:fixed;right:max(7px,env(safe-area-inset-right));top:max(7px,env(safe-area-inset-top));z-index:12;}
body.mobile #mobileTopButtons button{min-width:42px;height:38px;padding:4px 7px;font-size:11px;line-height:1;}
@media(max-width:760px){#arcadeLinks a{display:none}#arcadeTitle{font-size:15px}#arcadeLinks button,#arcadeLinks select{font-size:11px;padding:4px 5px}}
@media(max-height:680px) and (orientation:landscape){
  body.mobile #touchControls{height:112px;}
  #joyBase{width:88px;height:88px;left:10px;bottom:8px;}
  #joyKnob{left:28px;top:28px;width:32px;height:32px;}
  #crumbBtn,#boostBtn{width:62px;height:62px;bottom:10px;font-size:13px;}
  #crumbBtn{right:82px} #boostBtn{right:10px}
}

body.mobile:not(.playMode) #mobileTopButtons{display:none;}