
/* Rocket Flight v0.2: immersive gameplay, responsive UX, touch stability */
html{-webkit-tap-highlight-color:transparent}
.gameArea,.gameArea *,.gameArea canvas,.flight-ui,.flight-ui button{
  -webkit-touch-callout:none!important;
  -webkit-user-select:none!important;
  user-select:none!important;
  -webkit-tap-highlight-color:transparent!important;
}
.gameArea{touch-action:none;overscroll-behavior:contain}
.gameArea canvas{touch-action:none!important;-webkit-user-drag:none;user-select:none;display:block}
.gameArea canvas:focus{outline:none}
body.playing-fullscreen{overflow:hidden!important;height:100dvh}
body.playing-fullscreen .gameArea{
 position:fixed!important;z-index:1000;inset:0;border:0;border-radius:0;
 width:100vw;height:100vh;height:100dvh;background:#0a1124;
}
body.playing-fullscreen .gameArea canvas{width:100vw;height:100vh;height:100dvh;max-height:none}
body.playing-fullscreen .gameArea .hud{
 top:calc(env(safe-area-inset-top,0px) + 16px);
 left:calc(env(safe-area-inset-left,0px) + 18px);
 right:calc(env(safe-area-inset-right,0px) + 22px);
 padding-right:45px
}
.flight-ui{position:absolute;inset:0;pointer-events:none;z-index:4}
.flight-ui button{pointer-events:auto}
.exit-game,.flip-button,.sound-button{
 border:1px solid #d8e9ff66;border-radius:11px;
 background:#111b34b8;color:white;font-weight:900;letter-spacing:1px;backdrop-filter:blur(9px)
}
.exit-game{position:absolute;top:calc(env(safe-area-inset-top,0px) + 16px);
 right:calc(env(safe-area-inset-right,0px) + 13px);font-size:17px;
 width:42px;height:42px;display:none}
.playing-fullscreen .exit-game{display:block}
.flip-button{position:absolute;bottom:calc(env(safe-area-inset-bottom,0px) + 23px);
 right:22px;padding:20px 18px;background:#7448dbe0;display:none;font-size:11px}
.flip-button.show{display:block}
.sound-button{position:absolute;bottom:calc(env(safe-area-inset-bottom,0px) + 19px);
 left:16px;font-size:11px;padding:10px}
.game-toast{position:absolute;z-index:5;top:85px;left:50%;transform:translateX(-50%);
 padding:10px 18px;background:#172a45e8;border:1px solid #91e8ff91;border-radius:24px;
 color:#c6f6ff;font-size:11px;font-weight:900;letter-spacing:1px;text-shadow:0 1px 5px #000;
 opacity:0;transition:opacity .25s;pointer-events:none;white-space:nowrap}
.game-toast.visible{opacity:1}
.power-badge{position:absolute;left:16px;top:86px;color:#b2f9fb;
 background:#0b2739d9;border:1px solid #4ad8df88;border-radius:6px;
 padding:7px 9px;font-size:11px;font-weight:900;display:none}
.power-badge.visible{display:block}
.mode-buttons{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.mode-buttons button{border:1px solid #4b5873;background:#222c43;border-radius:7px;
 color:#f8fafc;padding:11px 15px;font-size:11px;font-weight:850}
.mode-buttons button.selected{background:#f33d63;border-color:#fd738c}
.mode-explainer{color:#b3c4d9!important;margin-bottom:10px!important}
.car-mode-label{font-size:11px;letter-spacing:1px;color:#bcc8dc;font-weight:900}
.top-actions{display:flex;align-items:center;gap:8px}
.auth-pill{border:1px solid #ff6b8a;background:#4c2039;color:white;border-radius:5px;
 padding:11px 12px;font-size:10px;font-weight:900;white-space:nowrap}
.rank-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.rank-tabs button{border:1px solid #485573;border-radius:5px;
 background:#1b253b;color:#cad6e7;padding:10px 15px;font-size:11px;font-weight:900}
.rank-tabs button.active{background:#ea3e60;border-color:#ea3e60;color:white}
.auth-note,.rank-note{color:#acbdd3;font-size:12px;line-height:1.6}
.dialog-mask{position:fixed;inset:0;background:#02050be6;z-index:3000;
 display:none;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(7px)}
.dialog-mask.visible{display:flex}
.dialog-card{position:relative;width:min(100%,465px);border:1px solid #465775;
 border-radius:16px;padding:30px 25px;background:linear-gradient(145deg,#192440,#0c1429);
 box-shadow:0 25px 85px #000a}
.dialog-card h3{font-size:31px;font-weight:1000;line-height:1;margin:9px 0 12px}
.dialog-card p{font-size:13px;line-height:1.7;color:#afbdd2}
.dialog-close{position:absolute;right:15px;top:12px;border:0;background:none;
 color:#a9b6cb;font-size:25px}
.dialog-card input{display:block;width:100%;padding:14px;margin:16px 0 12px;
 background:#09132a;border:1px solid #556887;border-radius:7px;color:white;font-size:16px}
.dialog-card input:focus{outline:2px solid #f04a6f}
.dialog-action{display:block;width:100%;border:0;border-radius:7px;padding:14px 17px;
 background:#fc4266;color:white;font-weight:950;font-size:12px}
.dialog-action:disabled{opacity:.6}
.share-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.share-options button,.share-options a{display:flex;align-items:center;justify-content:center;
 min-height:45px;padding:12px 8px;border:1px solid #526182;border-radius:7px;
 background:#1a2742;color:white;font-size:12px;font-weight:900;text-align:center}
.share-url{overflow-wrap:anywhere;font-size:11px;color:#a1b4d2;
 background:#080f20;padding:13px;border:1px solid #384964;border-radius:6px}
.share-status{font-size:12px;color:#7be7cd;margin-top:12px}
.gameArea .overlay{z-index:6}
.gameArea .modal{max-height:90dvh;overflow-y:auto;overscroll-behavior:contain}
.gameArea .modal .cta{touch-action:manipulation}
.gameArea .help{letter-spacing:.5px}
.run-prompts{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:13px 0}
.run-prompts button{padding:10px 12px;border:1px solid #576986;
 background:#1b2a43;color:white;font-size:11px;font-weight:900;border-radius:6px}
.player-tag{display:inline-block;background:#182944;border:1px solid #425774;
 font-size:10px;color:#c8dfff;font-weight:850;padding:8px;border-radius:5px;margin:12px 0}
.chal-banner{display:none;max-width:1150px;margin:14px auto 0;padding:15px 24px;
 background:#46243d;border:1px solid #ff5a7a77;border-radius:8px;color:white;
 font-size:13px;font-weight:800}
.chal-banner.visible{display:block}
.flow-note{color:#b8c5d9;font-size:12px;line-height:1.6}
@media(max-width:620px){
 .top-actions .inviteTop{display:none}
 .top-actions .auth-pill{padding:10px;font-size:9px}
 .gameArea canvas{height:min(132vw,590px)}
 body.playing-fullscreen .gameArea canvas{height:100dvh}
 .hero h1{letter-spacing:-4px}
 .gameArea .modal{padding:18px 16px}
 .gameArea .modal h3{font-size:clamp(30px,9vw,45px)}
 .gameArea .hud b{font-size:29px}
 .share-options{grid-template-columns:1fr 1fr}
 .share-options a,.share-options button{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.game-toast{transition:none}}
