/* The WebGL experience intentionally replaces the previous visual prototype. */
body:has(#gameApp) { overflow: hidden; background: #091d22; }
.app-shell { display: none !important; }
#gameApp { position: fixed; inset: 0; overflow: hidden; color: #eff9f5; font-family: 'DM Sans', sans-serif; background: #0d2429; }
#gameApp canvas { display: block; width: 100%; height: 100%; touch-action: none; }
.game-topbar { position: absolute; inset: 20px 26px auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; pointer-events: none; }
.game-brand, .game-help, .game-office-prompt { border: 1px solid #b8e4d755; background: #09262beb; box-shadow: 0 12px 30px #0007; backdrop-filter: blur(12px); }
.game-languages { display:flex; gap:4px; padding:5px; border:1px solid #b8e4d755; border-radius:11px; background:#09262beb; box-shadow:0 12px 30px #0007; pointer-events:auto; }.game-languages button { border:0; border-radius:7px; padding:6px 9px; color:#c9ded8; background:transparent; font:700 11px 'DM Sans'; cursor:pointer; }.game-languages button.active { color:#082427; background:#71dfbd; }
.game-brand { padding: 12px 18px; border-radius: 14px; letter-spacing: .7px; font: 800 15px Manrope, sans-serif; }.game-brand b { color: #6ce0bf; }
.game-help { padding: 10px 14px; border-radius: 12px; color: #d8ede6; font-size: 12px; }.game-help kbd { display: inline-grid; place-items: center; min-width: 20px; margin: 0 2px; border: 1px solid #81ada3; border-radius: 4px; background: #173e42; font: 700 10px 'DM Sans'; }
.game-hud { position: absolute; left: 26px; bottom: 24px; display: flex; gap: 10px; align-items: end; pointer-events: none; }.game-location { padding: 12px 15px; border-left: 4px solid #68d8b7; border-radius: 0 11px 11px 0; background: #09262be8; box-shadow: 0 10px 24px #0006; }.game-location small { display: block; color: #94bbb0; font-size: 9px; font-weight: 700; letter-spacing: 1.2px; }.game-location strong { font: 700 15px Manrope; }
.game-office-prompt { position: absolute; left: 50%; bottom: 28px; display: none; transform: translateX(-50%); padding: 13px 18px; border-radius: 12px; text-align: center; pointer-events: none; }.game-office-prompt.show { display: block; }.game-office-prompt b { color: #7ee9c7; }.game-office-prompt span { font-size: 12px; color: #d8eae4; }
.game-crosshair { position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; transform: translate(-50%,-50%); pointer-events:none; opacity:.75; }.game-crosshair:before,.game-crosshair:after{content:'';position:absolute;background:#eaf6f2;box-shadow:0 0 4px #000}.game-crosshair:before{width:18px;height:1px;top:8px}.game-crosshair:after{height:18px;width:1px;left:8px}
.game-modal { position: absolute; inset: 0; display: none; place-items: center; background: #041416a8; backdrop-filter: blur(6px); }.game-modal.show { display: grid; }.game-modal-card { width: min(480px, calc(100% - 32px)); padding: 30px; border: 1px solid #a7d8ca66; border-radius: 18px; background: linear-gradient(145deg,#11383b,#092426); box-shadow: 0 24px 80px #0009; }.game-modal-card h2 { margin: 5px 0 10px; font: 800 26px Manrope; }.game-modal-card p { color: #c1dbd3; line-height: 1.5; }.game-modal-card button { float:right; border:0; border-radius:8px; padding:9px 12px; color:#0c292b;background:#70dbbc;font-weight:800;cursor:pointer; }
@media (max-width: 700px) { .game-topbar { inset: 12px; }.game-help { display:none; }.game-hud { left:12px; bottom:12px; }.game-brand { padding:9px 11px; font-size:12px; } }