/* App-only layout. The same game and controls remain available in the browser. */
html.native-app,html.native-app body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:#23392f}
.native-app body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.native-app main{height:100dvh;width:100%;max-width:none;padding:env(safe-area-inset-top) max(8px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px,env(safe-area-inset-left));display:flex;flex-direction:column;background:#f3f1e6}
.native-app header{height:52px;min-height:52px;gap:8px;padding:0 5px}.native-app .brand{font-size:16px;gap:6px;letter-spacing:-.6px}.native-app .brand-icon{width:28px;height:28px;font-size:23px}.native-app .brand-light{font-size:13px}.native-app .edition{display:none}.native-app .audio-controls{gap:5px}.native-app .icon-btn{padding:8px 10px;min-width:44px;min-height:44px}.native-app .icon-btn span{display:none}
.native-app .game{flex:1;height:auto;min-height:0;max-height:none;border-radius:12px;touch-action:none}.native-app canvas{touch-action:none}
.native-app footer{height:36px;min-height:36px;gap:8px;padding:0 5px}.native-app footer>div{display:none}.native-app footer button{min-height:36px;font-size:9px}.native-app #about{margin-left:auto}
.native-app .hud{inset:15px 13px auto;gap:8px}.native-app .eyebrow{font-size:8px;letter-spacing:1px}.native-app .metric b{font-size:28px}.native-app .metric small{font-size:9px}.native-app .lives b{font-size:16px;letter-spacing:2px}.native-app .right-hud{gap:10px}.native-app .condition-meter{width:75px}.native-app .pause{width:44px;height:44px}.native-app .lives #bike-status{font-size:7px}.native-app .route{top:69px;width:220px}.native-app .route .eyebrow{font-size:8px}.native-app .toast{top:157px;font-size:10px;padding:10px 16px;width:max-content;max-width:88%}
.native-app .panel{left:14px;right:14px;top:50%;width:auto;max-width:430px;margin:auto;padding:24px;max-height:calc(100% - 24px);overflow:auto}.native-app .intro h1{font-size:42px}.native-app .panel p{font-size:12px;line-height:1.65}.native-app .intro .how{font-size:0}.native-app .how .keys{display:none}.native-app .how:after{content:attr(data-native-touch-help);font-size:10px;line-height:1.6}.native-app .intro .intro-foot{font-size:7px}
.native-app .scene-label{display:none}.native-app .location{left:14px;bottom:94px;max-width:62%}.native-app .location strong{font-size:8px;letter-spacing:.6px}.native-app .location small{font-size:8px;line-height:1.4}.native-app .speed{right:14px;bottom:91px}.native-app .speed strong{font-size:42px}.native-app .boost-meter{width:80px}.native-app .speed small{font-size:6px}
.native-app .playing .touch-controls{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:absolute;left:12px;right:12px;bottom:18px;gap:7px;z-index:4}.native-app .touch-controls button{width:100%;height:56px;min-width:0;margin:0!important;border:1px solid #fff8;border-radius:14px;background:#23392fed;color:#f3f0d5;font-size:25px;touch-action:none;user-select:none}.native-app .touch-controls button[data-key=" "]{font-size:10px}.native-app .touch-controls button small{font-size:8px}.native-app .touch-controls button:active{background:#526b43}.native-app .horn{left:14px;bottom:139px;padding:12px 15px;min-height:44px}.native-app .horn span{display:none}
.native-app dialog{max-width:min(92vw,510px);max-height:84dvh;overflow:auto;padding:30px 26px}.native-app #close-privacy{position:absolute;right:13px;top:7px;min-width:44px;min-height:44px;background:none;border:0;font-size:28px;color:#657064}.native-app dialog p{-webkit-user-select:text;user-select:text}
@media(min-width:700px){.native-app header{height:60px;min-height:60px}.native-app .brand{font-size:21px}.native-app .brand-light{font-size:18px}.native-app .panel{left:30px;right:auto;width:400px;padding:30px}.native-app .intro h1{font-size:52px}.native-app .playing .touch-controls{left:24px;right:24px;max-width:440px;margin:auto;gap:10px}.native-app .touch-controls button{height:62px}.native-app .route{top:0}.native-app .toast{top:108px}.native-app .location{left:24px}.native-app .speed{right:24px}.native-app .horn{left:24px;bottom:156px}}
@media(max-height:520px){.native-app header{height:44px;min-height:44px}.native-app footer{height:28px;min-height:28px}.native-app .route{top:0}.native-app .panel{top:50%;padding:18px;max-width:390px}.native-app .intro h1{font-size:32px;margin:12px 0}.native-app .intro .kicker,.native-app .intro-foot{display:none}.native-app .level-picker{margin:10px 0}.native-app .toast{top:85px}.native-app .location{bottom:74px}.native-app .speed{bottom:73px}.native-app .touch-controls button{height:48px}.native-app .horn{bottom:112px}}
@media(prefers-reduced-motion:reduce){.native-app *{scroll-behavior:auto!important;transition:none!important}}
/* Mac Catalyst keeps the desktop keyboard interface and resizable playfield. */
.native-mac main{padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}
.native-mac header{height:64px;min-height:64px;padding:0 5px}.native-mac .brand{font-size:22px}.native-mac .brand-light{font-size:20px}.native-mac .brand-icon{width:34px;height:34px;font-size:27px}.native-mac .edition{display:flex;font-size:9px;letter-spacing:1px;gap:7px}.native-mac .icon-btn span{display:inline;font-size:9px}.native-mac .game{border-radius:16px}.native-mac footer{height:42px;min-height:42px}.native-mac .footer-controls{display:flex;gap:14px}.native-mac .playing .touch-controls{display:none!important}.native-mac .hud{inset:24px 26px auto}.native-mac .eyebrow{font-size:9px;letter-spacing:1.5px}.native-mac .metric b{font-size:36px}.native-mac .lives b{font-size:22px}.native-mac .right-hud{gap:22px}.native-mac .route{top:0;width:240px}.native-mac .route .eyebrow{font-size:9px}.native-mac .condition-meter{width:94px}.native-mac .toast{top:116px;font-size:11px}.native-mac .panel{left:32px;right:auto;width:420px;max-width:420px;padding:30px}.native-mac .intro h1{font-size:54px}.native-mac .panel p{font-size:13px}.native-mac .how:after{content:attr(data-keyboard-help)}.native-mac .location{left:26px;bottom:26px}.native-mac .location strong{font-size:10px}.native-mac .location small{font-size:9px}.native-mac .speed{right:26px;bottom:24px}.native-mac .speed strong{font-size:54px}.native-mac .boost-meter{width:105px}.native-mac .horn{left:26px;bottom:90px}

.native-app .header-tools{gap:5px}.native-app .language-control{padding:2px 5px;min-height:44px}.native-app .language-control>span{display:none}.native-app .language-control select{max-width:76px;font-size:11px;min-height:38px}.native-app .level-picker strong{white-space:normal}.native-app .route .lane-key{font-size:7px}.native-mac .language-control>span{display:inline}.native-mac .language-control select{max-width:98px;font-size:12px}
@media(max-width:380px){.native-app .brand{font-size:12px;gap:3px}.native-app .brand-light{font-size:11px}.native-app .brand-icon{width:23px;height:23px;font-size:20px}.native-app .icon-btn{padding:6px 8px;min-width:36px}.native-app .header-tools{gap:3px}.native-app .language-control select{max-width:68px}}
@media(max-width:1200px){.native-mac .edition{display:none}}

@media(max-width:460px){html.native-app:lang(fr) .intro h1,html.native-app:lang(sg) .intro h1{font-size:35px;margin:16px 0 14px}html.native-app:lang(fr) .intro>p:not(.level-description),html.native-app:lang(sg) .intro>p:not(.level-description){font-size:11px;line-height:1.5}html.native-app .intro .how{font-size:0}}

.native-mac .language-control select{display:none}.native-mac .native-language-button{display:inline-flex;align-items:center;gap:8px;border:0;background:none;padding:5px 0;color:inherit;font:inherit;font-size:12px;min-height:38px}.native-mac #language-dialog{min-width:320px}.native-mac #language-dialog h2{font-size:32px}