:root{color-scheme:light;font-family:'Nunito',system-ui,sans-serif;color:#243c2f;background:#344637;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden;overscroll-behavior:none}button,select{font:inherit;color:#243c2f}button{border:2px solid #b5b286;border-radius:14px;background:#fff2c5;min-height:44px;padding:9px 15px;font-weight:900;cursor:pointer;box-shadow:0 3px 0 #8d8660}button:hover{background:#ffe399}button:active,button.held{transform:translateY(2px);box-shadow:0 1px 0 #8d8660;background:#eec263}button:focus-visible,select:focus-visible{outline:3px solid #be4c27;outline-offset:3px}button:disabled{opacity:.55;cursor:default}main{height:100dvh;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);max-width:1500px;margin:auto;background:#e5d7a6}header{height:58px;flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:5px 16px;background:#354d39;color:#ffedbd;gap:8px}header strong{letter-spacing:1px;font-size:16px;line-height:1.1}header strong span{display:block;font-size:11px;letter-spacing:4px}nav{display:flex;gap:7px}nav button{font-size:13px;min-height:44px;padding:5px 10px;border-color:#72805a;box-shadow:none}#hud{display:flex;flex-shrink:0;gap:18px;align-items:center;justify-content:space-around;padding:6px 12px;height:54px;border-bottom:2px solid #bcaa73}#hud>div{display:flex;align-items:center;gap:7px}small{font-size:11px;font-weight:900}#hud strong{font-size:18px;font-variant-numeric:tabular-nums}meter{width:80px;height:18px}#field{flex:1;min-height:100px;position:relative;overflow:hidden;background:#a77b44}canvas{display:block;width:100%;height:100%;touch-action:none}#banner{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);font-size:clamp(24px,6vw,48px);font-weight:1000;text-shadow:0 3px #334a32;color:#fff4c5;pointer-events:none;text-align:center}#hit{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);color:#fff7d6;background:#863b26dd;border-radius:12px;padding:5px 12px;pointer-events:none;font-weight:900;white-space:nowrap}#hit:empty{display:none}#controls{height:130px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:8px max(20px,env(safe-area-inset-right)) 10px max(20px,env(safe-area-inset-left));background:#354d39;color:#ffe7af;user-select:none;touch-action:none}#controls>div:first-child{display:flex;flex-direction:column;align-items:center;gap:3px}#steering{width:170px;height:78px;background:#263c2f;border:3px solid #b4b486;border-radius:44px;display:flex;justify-content:space-between;align-items:center;padding:0 16px;position:relative;touch-action:none}#steering i{position:absolute;width:55px;height:55px;border-radius:50%;left:calc(50% - 27.5px);background:#f2d38f;border:6px solid #bc9e5e;box-shadow:0 3px #1d3326;pointer-events:none}#pedals{display:flex;align-items:center;gap:10px}#pedals button{width:96px;height:78px;touch-action:none;padding:4px;font-size:14px;overflow-wrap:anywhere}#gas{background:#a9c88c}#brake{background:#e7a388}#notice{margin:0;min-height:17px;background:#fff2c5;text-align:center;font-size:11px;padding:0 4px;padding-bottom:env(safe-area-inset-bottom)}#notice:empty{min-height:0}dialog{border:2px solid #7f8a60;border-radius:24px;padding:22px;background:#fff0c9;color:#243c2f;width:min(620px,94vw);max-height:92dvh;overflow:auto;box-shadow:0 15px 60px #172b2755}dialog::backdrop{background:#243a2ad9}dialog h2{margin:0 0 12px;font-size:25px}dialog p{line-height:1.55;font-size:14px}dialog>button{margin:5px}#menu{padding:0 0 18px}#menu>p,#menu>details{margin:12px 22px}.hero{height:220px;position:relative;background:#52683e;overflow:hidden}.hero>img{width:100%;height:100%;object-fit:cover}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#263e32c9,transparent 80%)}.hero>div{position:absolute;left:24px;bottom:20px;z-index:1;color:#fff2bc;text-shadow:0 3px #354331}.hero small{letter-spacing:3px}.hero h1{font-size:46px;line-height:.94;margin:8px 0 0;letter-spacing:-1.5px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 22px}.actions #play{background:#b8ce90}.actions #practice,.actions #continue{grid-column:span 2}.settings{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 22px 0;font-size:12px}.settings label{display:flex;align-items:center;gap:7px;justify-content:space-between}.settings select{width:120px;min-height:36px;border-radius:9px;border:1px solid #a6b081;background:#fff9df}.settings input{width:19px;height:19px;accent-color:#486b3c}.settings label:has(input){justify-content:flex-start}.marshal{float:right;width:100px;max-height:145px;object-fit:contain;margin:0 0 8px 12px}#cars{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.car{position:relative;text-align:left;padding:10px;min-height:153px;display:grid;grid-template-columns:75px 1fr;gap:7px;background:#f3dfab}.car img{width:72px;height:100px;object-fit:contain;grid-row:span 3}.car strong{font-size:15px}.car small{font-weight:700;line-height:1.55;font-size:11px}.car .stats{grid-column:2}.car.selected{outline:3px solid #5c8244;background:#d2e3ab}.car.locked{filter:saturate(.45);opacity:.72}#contracts p{font-size:13px;line-height:1.5;margin:7px 0}.row{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid #c4b782;padding:8px 0;font-size:13px}.row:first-child{font-weight:900;background:#ecd69b}details{margin:12px 0}summary{cursor:pointer;font-size:13px;font-weight:900;min-height:30px}.car:disabled{cursor:default}#scoreboard .winner{background:#d0e3ac}body[data-motion=false] *{scroll-behavior:auto!important;transition:none!important}
@media(max-width:550px){header{padding:4px 9px;gap:4px}header strong{font-size:13px}nav{gap:5px}nav button{font-size:11px;padding:4px 7px}#hud{gap:5px;padding:5px 6px;height:54px}#hud>div{flex-direction:column;gap:0}#hud>div:first-child{position:relative;padding-right:0}#hud small{font-size:10px}#hud strong{font-size:17px}meter{position:absolute;bottom:-4px;left:0;width:70px;height:8px}#controls{height:122px;gap:9px;padding:7px 10px 9px}#steering{width:122px;height:76px;padding:0 8px}#steering i{width:47px;height:47px;left:calc(50% - 23.5px);border-width:5px}#pedals{display:grid;grid-template-columns:1fr 1fr;gap:7px}#pedals button{width:67px;height:44px;font-size:11px;min-height:44px}#gas{grid-column:2;grid-row:1 / 3;height:94px!important}#reverse{grid-column:1;grid-row:1}#brake{grid-column:1;grid-row:2}dialog{padding:16px;border-radius:18px}.hero{height:174px}.hero h1{font-size:36px}.hero>div{left:18px;bottom:16px}.hero small{font-size:9px}.actions{padding:0 16px;gap:8px}.actions button{font-size:12px;padding:8px}.settings{padding:12px 16px;font-size:11px;gap:8px}.settings select{width:95px}#menu>p,#menu>details{margin:10px 16px}#cars{grid-template-columns:1fr}.car{min-height:117px;grid-template-columns:70px 1fr}.car img{height:92px}.marshal{width:78px}dialog h2{font-size:22px}}
@media(max-height:500px) and (min-width:600px){header{height:44px}#hud{height:40px;padding:3px 16px}#controls{height:92px}#steering{height:64px}#pedals button{height:63px;width:95px}.hero{height:140px}.hero h1{font-size:35px}.actions{grid-template-columns:1fr 1fr 1fr}.actions #practice,.actions #continue{grid-column:auto}.settings{grid-template-columns:1fr 1fr 1fr}dialog{max-height:94dvh}#cars{grid-template-columns:1fr 1fr}}

#garageActions{position:sticky;bottom:-22px;display:flex;gap:8px;justify-content:space-between;padding:12px 0;background:#fff0c9;border-top:1px solid #b9ae7e;z-index:4}#garageActions button{flex:1;font-size:12px}
@media(max-width:550px){#garageActions{bottom:-16px}}