/* Turbo Drift — pit garage / timing wall identity */
#screen-menu{padding:0;align-items:stretch;justify-content:stretch;background:linear-gradient(180deg,#bbb9b0 0 20%,#3c4042 20% 100%);overflow:hidden}
#screen-menu::before{content:'';position:absolute;left:5%;right:5%;bottom:5%;height:65%;background:repeating-linear-gradient(90deg,#44494c 0 12%,#515659 12% 24%);border:7px solid #26292b;box-shadow:0 13px 0 #151718;clip-path:polygon(0 14%,25% 14%,25% 6%,54% 6%,54% 19%,78% 19%,78% 10%,100% 10%,100% 100%,0 100%)}
#screen-menu::after{content:'PIT 04  •  TYRES  •  FUEL  •  LAP DELTA';position:absolute;left:6%;top:7%;padding:.42rem .7rem;background:#f2eee2;color:#272a2c;border:3px solid #272a2c;font:900 .68rem/1 ui-monospace,monospace;letter-spacing:.13em;box-shadow:4px 4px 0 #272a2c}
#screen-menu .panel{position:absolute;inset:0;width:100%;max-width:none;padding:0;background:transparent;border:0;box-shadow:none;text-align:left;overflow:visible}
#screen-menu .panel::before,#screen-menu .panel::after{display:none!important}
#screen-menu .eyebrow{position:absolute;left:7%;top:14%;background:#db4b32;color:#fff;border-radius:0;padding:.3rem .6rem;letter-spacing:.17em}
#screen-menu h1{position:absolute;left:7%;top:21%;margin:0!important;max-width:53%;background:none!important;color:#f3f1ea!important;font:900 clamp(3rem,8vw,6rem)/.76 'Arial Narrow',Impact,sans-serif!important;letter-spacing:-.045em!important;text-shadow:5px 5px 0 #222627!important}
#screen-menu h1 span{display:block;color:#f3c23f!important;font-size:.58em}
#screen-menu .subtitle{position:absolute;left:7%;top:47%;width:min(42vw,500px);margin:0;padding:.65rem .75rem;background:#efebe0;color:#333638;border-left:7px solid #db4b32;font-family:ui-monospace,monospace;line-height:1.45}
#screen-menu .stat-strip{position:absolute;right:6%;top:11%;width:min(30vw,330px);display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0;background:transparent;border:0}
#screen-menu .stat-strip span{background:#202426;color:#edf1f2;border:1px solid #5a6266;border-radius:0;padding:.5rem .65rem;font:800 .68rem/1 ui-monospace,monospace;text-align:center}
#screen-menu .menu-actions{position:absolute;right:6%;bottom:8%;width:min(31vw,340px);display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}
#screen-menu .menu-actions button{min-height:50px;border-radius:0!important;border:2px solid #303436!important;background:#e8e4da!important;color:#303436!important;box-shadow:5px 5px 0 #303436!important;font:800 .68rem/1 ui-monospace,monospace!important;text-align:left;padding:.55rem .65rem!important;text-transform:uppercase}
#screen-menu .menu-actions button.primary{grid-column:1/-1;min-height:72px;background:#db4b32!important;color:#fff!important;border-color:#8c2e20!important;font-size:.88rem!important}
#screen-garage .panel,#screen-settings .panel,#screen-how .panel,#screen-pause .panel,#screen-gameover .panel,#screen-results .panel{background:#ebe7dd!important;color:#303436!important;border-radius:0!important;border:3px solid #303436!important;box-shadow:8px 8px 0 #1d2022!important;text-align:left!important}

/* Edge-device and accessibility polish. Keep gameplay geometry owned by style.css/game.js. */
.game-bar{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right));padding-top:env(safe-area-inset-top)}
.game-wrap{min-height:0}
.screen{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));padding-bottom:max(16px,env(safe-area-inset-bottom))}
.icon-btn,.hud-btn,.menu-actions button,.car-swatch,.td-btn{min-width:44px;min-height:44px}
button:focus-visible,a:focus-visible{outline:3px solid #f3c23f;outline-offset:3px}
#screen-how .panel,#screen-leaderboard .panel,#screen-pause .panel,#screen-gameover .panel{max-height:calc(100dvh - 72px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain}
#td-controls{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));padding-bottom:max(12px,env(safe-area-inset-bottom))}

@media(max-width:700px){
  #screen-menu{overflow:auto;overscroll-behavior:contain;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
  #screen-menu h1{left:max(5%,env(safe-area-inset-left));top:17%;max-width:90%;font-size:clamp(2.8rem,15vw,5rem)!important}
  #screen-menu .eyebrow{left:max(5%,env(safe-area-inset-left));top:11%}
  #screen-menu .subtitle{left:max(5%,env(safe-area-inset-left));top:40%;width:42%;font-size:.67rem}
  #screen-menu .stat-strip{right:max(4%,env(safe-area-inset-right));top:45%;width:43%}
  #screen-menu .menu-actions{right:max(4%,env(safe-area-inset-right));bottom:max(5%,env(safe-area-inset-bottom));width:51%}
  #screen-menu .menu-actions button{min-height:44px;font-size:.58rem!important}
  #screen-menu .menu-actions button.primary{min-height:54px}
}

@media(max-width:430px){
  #screen-menu::after{left:max(4%,env(safe-area-inset-left));right:max(4%,env(safe-area-inset-right));top:calc(6% + env(safe-area-inset-top));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #screen-menu h1{top:18%;font-size:clamp(2.45rem,14vw,4rem)!important}
  #screen-menu .subtitle{top:39%;width:90%;max-width:none}
  #screen-menu .stat-strip{left:max(5%,env(safe-area-inset-left));right:max(5%,env(safe-area-inset-right));top:54%;width:auto}
  #screen-menu .menu-actions{left:max(5%,env(safe-area-inset-left));right:max(5%,env(safe-area-inset-right));bottom:max(4%,env(safe-area-inset-bottom));width:auto}
}

@media(max-height:560px) and (orientation:landscape){
  #screen-menu::after{top:calc(3% + env(safe-area-inset-top));font-size:.58rem}
  #screen-menu .eyebrow{top:15%;left:max(4%,env(safe-area-inset-left))}
  #screen-menu h1{top:25%;left:max(4%,env(safe-area-inset-left));font-size:clamp(2.2rem,8vw,3.8rem)!important;max-width:45%}
  #screen-menu .subtitle{left:max(4%,env(safe-area-inset-left));top:auto;bottom:max(6%,env(safe-area-inset-bottom));width:42%;font-size:.62rem}
  #screen-menu .stat-strip{right:max(4%,env(safe-area-inset-right));top:16%;width:43%}
  #screen-menu .menu-actions{right:max(4%,env(safe-area-inset-right));bottom:max(6%,env(safe-area-inset-bottom));width:43%}
  #screen-menu .menu-actions button{min-height:44px}
  #screen-menu .menu-actions button.primary{min-height:48px}
}

@media(prefers-reduced-motion:reduce){
  #screen-menu *,#screen-menu *::before,#screen-menu *::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
