/* iPhone uses the same artwork, engine and controls as Android. Only the
   viewport and system-safe edges differ. Keep these after the shared rules. */
html.ios{--game-height:100dvh;--game-top:0px;-webkit-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior:none}
.ios body{overscroll-behavior:none}
.ios .workspace,.ios .drive-screen,.ios .modal{top:var(--game-top);bottom:auto;height:var(--game-height)!important}
.ios .drive-screen{overflow:hidden}
.ios .drive-shell{height:100%;min-height:0;padding-top:calc(9px + env(safe-area-inset-top));padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}
.ios .drive-track{min-height:0}
.ios .drive-track #raceCanvas{position:absolute;inset:0;width:100%;height:100%}
.ios .drive-stats{flex-wrap:wrap;align-items:center;min-width:0;gap:4px 7px;padding:8px}
.ios .drive-buttons{min-width:0;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.ios .drive-buttons button{min-width:0;touch-action:none;-webkit-appearance:none;appearance:none}
.ios .modal{padding-top:calc(12px + env(safe-area-inset-top));padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.ios .modalbox{max-height:100%;min-height:0;-webkit-overflow-scrolling:touch}
.ios .profile-box input,.ios .profile-box textarea,.ios #playerName{font-size:16px}
.ios .map-phone{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none}
@media(max-width:899px){
 .ios .topbar{top:calc(var(--game-top) + env(safe-area-inset-top) + 4px)!important;left:max(4px,env(safe-area-inset-left))!important;right:max(4px,env(safe-area-inset-right))!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto clamp(32px,12vw,60px);gap:3px!important}
 .ios .topbar .brand{width:auto!important;grid-area:auto!important;overflow:hidden}
 .ios .topbar .brand-copy h1{font-size:clamp(15px,4.6vw,18px)!important}
 .ios .topbar .top-actions{grid-area:auto!important;gap:2px!important}
 .ios .topbar-mascot{width:100%;min-width:0;height:32px;object-fit:contain}
 .ios .player-badge{top:calc(var(--game-top) + env(safe-area-inset-top) + 58px)!important}
 .ios .heading{top:calc(env(safe-area-inset-top) + 58px)!important}
 .ios .map-panel{top:calc(env(safe-area-inset-top) + 116px)!important;left:max(4px,env(safe-area-inset-left))!important;right:max(4px,env(safe-area-inset-right))!important}
 .ios .dispatch-strip{left:max(4px,env(safe-area-inset-left))!important;right:max(4px,env(safe-area-inset-right))!important}
 .ios .toast{top:calc(var(--game-top) + env(safe-area-inset-top) + 154px)!important}
}
@media(max-height:500px) and (orientation:landscape){
 .ios .drive-shell{gap:4px;padding-top:max(5px,env(safe-area-inset-top));padding-bottom:max(5px,env(safe-area-inset-bottom))}
 .ios .drive-stats{padding:4px 8px}.ios .drive-seat-icons{flex-basis:auto}
 .ios .drive-buttons button{min-height:44px;font-size:17px}.ios .drive-buttons button small{display:none}
 .ios .drive-message{min-height:27px;padding:4px;font-size:12px}.ios .drive-level-note{display:none}
}

/* Same artwork and gameplay as Android; scoped fixes for iPhone/iPad WebKit. */
html.ios{--ios-safe-top:env(safe-area-inset-top,0px);--ios-safe-bottom:env(safe-area-inset-bottom,0px);-webkit-text-size-adjust:100%;text-size-adjust:100%;height:100%;overflow:hidden}
.ios body{height:var(--game-height,100%);width:100%;overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%}
.ios .workspace,.ios .drive-screen{top:var(--game-top,0px)!important;bottom:auto!important;height:var(--game-height,100%)!important;min-height:0!important}
.ios .workspace{overflow:hidden}
.ios .topbar{top:calc(var(--game-top,0px) + 9px + var(--ios-safe-top))!important;left:calc(6px + env(safe-area-inset-left,0px))!important;right:calc(6px + env(safe-area-inset-right,0px))!important}
.ios .heading{top:calc(var(--game-top,0px) + 72px + var(--ios-safe-top))!important}
.ios .player-badge{top:calc(var(--game-top,0px) + 75px + var(--ios-safe-top))!important}
.ios .map-panel{top:calc(116px + var(--ios-safe-top))!important;bottom:calc(58px + var(--ios-safe-bottom))!important;left:calc(4px + env(safe-area-inset-left,0px))!important;right:calc(4px + env(safe-area-inset-right,0px))!important}
.ios .map-city-title{font-size:17px!important}
.ios .toast{top:calc(var(--game-top,0px) + 154px + var(--ios-safe-top))!important}
.ios .map-phones{height:var(--game-height,100%);bottom:auto}
.ios .dispatch-strip{top:calc(var(--game-top,0px) + var(--game-height,100vh) - var(--ios-safe-bottom) - 49px)!important;left:calc(4px + env(safe-area-inset-left,0px))!important;right:calc(4px + env(safe-area-inset-right,0px))!important;bottom:auto!important}
.ios .drive-shell{height:var(--game-height,100%)!important;min-height:0;width:100%;max-width:1050px;padding:calc(8px + var(--ios-safe-top)) calc(8px + env(safe-area-inset-right,0px)) calc(8px + var(--ios-safe-bottom)) calc(8px + env(safe-area-inset-left,0px));gap:6px;overflow:hidden}
.ios .drive-top,.ios .drive-stats,.ios .drive-message,.ios .drive-buttons{flex-shrink:0}
.ios .drive-track{position:relative;flex:1 1 0%;height:auto;min-height:0!important;overflow:hidden;isolation:isolate}
.ios #raceCanvas{position:absolute;inset:0;display:block;width:100%!important;height:100%!important;min-height:0;max-height:none;object-fit:fill;touch-action:none}
.ios .drive-buttons button{min-height:56px;padding:7px 2px;font-size:19px;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.ios input,.ios textarea,.ios select{font-size:16px!important}
.ios .modal{height:var(--game-height,100%);bottom:auto;padding-top:calc(12px + var(--ios-safe-top));padding-bottom:calc(12px + var(--ios-safe-bottom));overflow:auto}
.ios .modalbox{max-height:calc(var(--game-height,100vh) - var(--ios-safe-top) - var(--ios-safe-bottom) - 24px)!important;overflow-y:auto;-webkit-overflow-scrolling:touch}
@media(orientation:landscape){.ios .drive-shell{gap:4px}.ios .drive-buttons button{min-height:40px}.ios .drive-stats{gap:4px}.ios .drive-seat-icons svg{height:18px!important}.ios .drive-level-note{display:none}.ios .drive-message{min-height:28px;font-size:12px;padding:3px}}
