/* Touch input never invokes iOS text selection or its magnifying callout. */
#game,#game button,#game svg{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#game button svg{pointer-events:none}#game button{touch-action:manipulation}#game .touch-controls,#game .touch-controls *{touch-action:none}
.mobile-hud,.mobile-guidance{display:none}
#orientation-gate{position:fixed;inset:0;margin:auto;width:min(390px,calc(100% - 40px));max-height:calc(100dvh - 32px);overflow:auto;padding:28px 24px;text-align:center;border-radius:24px;background:#122b30;color:#eff5ee;z-index:100}
#orientation-gate::backdrop{background:#10222ff5;backdrop-filter:blur(14px)}#orientation-gate h2{font-size:28px;margin:14px 0;letter-spacing:-1px}#orientation-gate p{font-size:14px;line-height:1.6}#orientation-gate .rotate-note{font-size:12px;color:#9fb9b8;margin-bottom:0}.rotate-phone{width:100px;height:100px;fill:none;stroke:#d2ee8a;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.mobile{--safe-left:max(12px,env(safe-area-inset-left));--safe-right:max(12px,env(safe-area-inset-right));--safe-top:max(8px,env(safe-area-inset-top));--safe-bottom:max(10px,env(safe-area-inset-bottom));overflow:hidden}
.mobile header{top:var(--safe-top);left:auto;right:var(--safe-right);gap:0;z-index:5}.mobile header .brand,.mobile header .location,.mobile .mission,.mobile .bottom-left,.mobile .controls{display:none!important}.mobile .top-actions{gap:6px}.mobile .top-actions .icon-btn{width:42px;height:42px;font-size:21px;backdrop-filter:blur(8px)}.mobile #help{display:none}
.mobile .mobile-hud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:absolute;left:var(--safe-left);right:calc(var(--safe-right) + 154px);top:var(--safe-top);gap:6px;z-index:4;pointer-events:none;max-width:510px}
.mobile-hud>div{display:grid;grid-template-columns:1fr auto;gap:5px 8px;padding:8px 10px;background:#132b30ed;border:1px solid #d4e4dc26;border-radius:10px;box-shadow:0 3px 12px #05131c22;font-size:11px;min-width:0}.mobile-hud span{color:#bbcfcc}.mobile-hud b{font-size:14px;color:#d2ee8a;font-variant-numeric:tabular-nums;white-space:nowrap}.mobile-hud .track{grid-column:1/-1;height:3px}
.mobile .touch-controls{display:flex;position:absolute;left:var(--safe-left);right:var(--safe-right);bottom:var(--safe-bottom);justify-content:space-between;align-items:flex-end;pointer-events:none;z-index:6;gap:20px}.mobile.left-handed .touch-controls{flex-direction:row-reverse}
.touch-caption{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;color:#d6e7e5;font-size:9px;font-weight:800;letter-spacing:1px;text-shadow:0 1px 8px #071722}.touch-caption span{font-size:10px;font-weight:500;letter-spacing:0;color:#cee8aa}.mobile .touch-bucket{display:grid;grid-template-columns:74px 74px;grid-template-rows:50px 50px;gap:6px}.mobile .touch-bucket button{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px;padding:3px;border-radius:12px;font-size:10px;background:#142f35e6;color:#eaf3ed;border:1px solid #d6e9e03b;min-height:50px;pointer-events:auto}.touch-bucket svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.mobile .touch-bucket button.pressed{background:#d2ee8a;color:#152c2c;border-color:#e8ffbd}
.drive-controls{width:132px}#joystick{position:relative;width:132px;height:132px;border-radius:50%;pointer-events:auto;touch-action:none;background:radial-gradient(circle,#35585e88 0 30%,#17343aaa 31% 65%,#153137da 66%);border:1px solid #d6e9e04d;box-shadow:inset 0 0 0 11px #ffffff04,0 4px 20px #06182022}#joystick.active{border-color:#d2ee8a99}#joystick-knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:49px;height:49px;border-radius:50%;background:#bed5c9e8;border:2px solid #e1f0df;box-shadow:0 3px 12px #061b2d55;pointer-events:none}#joystick.active #joystick-knob{background:#d2ee8a}.joystick-arrows{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#d4e2d9aa;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.mobile .mobile-guidance{display:block;position:absolute;bottom:calc(var(--safe-bottom) + 4px);left:calc(var(--safe-left) + 166px);right:calc(var(--safe-right) + 146px);text-align:center;font-size:11px;line-height:1.4;color:#d9e6dc;text-shadow:0 2px 5px #000;background:#142d3370;border-radius:8px;padding:6px 8px;pointer-events:none}.mobile.left-handed .mobile-guidance{left:calc(var(--safe-left) + 146px);right:calc(var(--safe-right) + 166px)}
.mobile #unload-panel{left:50%!important;top:auto!important;bottom:calc(var(--safe-bottom) + 46px);transform:translateX(-50%);z-index:7}.mobile #unload{min-height:48px;padding:12px 16px;font-size:13px}.mobile #unload kbd{display:none}.mobile .world-label{font-size:10px;max-width:150px;white-space:nowrap;padding:6px 9px;z-index:2}.mobile .world-label.locked{font-size:22px}
.mobile.menu-open .mobile-hud,.mobile.menu-open .mobile-guidance{visibility:hidden}
/* Keep the native dialog out of CSS grid sizing. Only its content scrolls;
   the close button stays in a reserved, non-scrolling top strip. */
.mobile #dialog{left:50%;top:50%;transform:translate(-50%,-50%);width:620px;max-width:calc(100% - env(safe-area-inset-left) - env(safe-area-inset-right) - 32px);max-height:calc(100dvh - 24px);padding:42px 0 0;border-radius:17px;overflow:hidden;box-sizing:border-box}
.mobile #dialog[open]{display:block}.mobile #dialog .close{top:3px;right:8px;width:40px;height:36px;z-index:2;margin:0;border-radius:8px}
.mobile #menu-scroll{max-height:calc(100dvh - 68px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:0 22px 18px;scroll-padding:12px;min-height:0}
.mobile #dialog.home-view #menu-scroll{display:flex;align-items:flex-start;gap:24px}
.mobile .menu-intro{flex:1;min-width:0}.mobile .menu-pages{flex:1.15;min-width:0}
.mobile #dialog h2{font-size:27px;letter-spacing:-1px;margin:9px 0 12px}.mobile #dialog.home-view h2{font-size:32px;line-height:1.08;margin-top:14px}
.mobile #dialog #menu-subtitle{font-size:13px;line-height:1.5;margin:0}.mobile #dialog .eyebrow{font-size:9px;line-height:1.4;display:block}
.mobile .menu-level,.mobile .menu-footnote{display:none}.mobile .primary{min-height:44px;padding:11px 13px;font-size:14px}.mobile .menu-button{min-height:44px;padding:10px 13px;font-size:13px;margin-top:7px}.mobile .secondary{font-size:11px;padding:10px 0;min-height:36px}.mobile .setting-toggle{margin-top:14px}.mobile .setting-toggle b{font-size:14px}.mobile .setting-toggle small{font-size:11px}.mobile .instructions,.mobile #dialog li{font-size:12px;line-height:1.5}.mobile .menu-shortcuts{display:none}
/* Retain focus outlines for keyboard navigation, not Safari's automatic
   focus after tapping or opening a native dialog. */
.mobile:not(.keyboard-input) #dialog button:focus-visible{outline:none}
@media(max-height:340px) and (orientation:landscape){.mobile .touch-bucket{grid-template-columns:67px 67px;grid-template-rows:44px 44px;gap:4px}.mobile .touch-bucket button{min-height:44px}.mobile .drive-controls{width:112px}.mobile #joystick{width:112px;height:112px}.mobile #joystick-knob{width:43px;height:43px}.mobile .touch-caption{margin-bottom:4px}.mobile #dialog.home-view h2{font-size:27px}.mobile #menu-scroll{padding:0 18px 12px}.mobile #menu-subtitle{font-size:12px}.mobile .mobile-guidance{font-size:10px}}
@media(max-width:620px) and (orientation:landscape){.mobile-hud>div{padding:6px;gap:4px;font-size:9px}.mobile-hud b{font-size:12px}.mobile .mobile-hud{right:calc(var(--safe-right) + 142px)}.mobile .top-actions .icon-btn{width:38px;height:38px}.mobile .mobile-guidance{font-size:10px}.mobile #dialog.home-view #menu-scroll{gap:16px}.mobile #dialog.home-view h2{font-size:27px}}