body{background:#31483a}.shell{max-width:1020px}#warning{margin:0 0 8px;background:#ffed9c;border:2px solid #806521;padding:12px;text-align:center;font-weight:bold;min-height:43px}#road{position:relative;height:420px;background:repeating-linear-gradient(0deg,#658444 0 38px,#718c4e 38px 76px);border:3px inset #eee;overflow:hidden}.asphalt{position:absolute;inset:0 40px;background:#454b50;border-left:4px solid #ddd;border-right:4px solid #ddd;overflow:hidden}.centerline{position:absolute;left:calc(50% - 2px);width:4px;height:200%;top:-100%;background:repeating-linear-gradient(0deg,#eee 0 30px,transparent 30px 58px)}.driving .centerline{animation:roadflow 1s linear infinite}@keyframes roadflow{to{transform:translateY(58px)}}.roadside{position:absolute;font:bold 10px monospace;text-align:center;color:#fff;padding:6px 2px;top:22px}.roadside.left{left:0;background:#174e80}.roadside.right{right:0;background:#f4e88b;color:#222}.lanes{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr}.lanes button{background:transparent;border:0;color:white;display:flex;align-items:flex-end;justify-content:center;padding:10px 0;font:bold 11px monospace}.lanes button[aria-pressed=true]{box-shadow:inset 0 -5px #ffde72}.lanes button:focus-visible{outline-offset:-4px}.vehicle{position:absolute;transform:translate(-50%,-50%);width:43px;height:68px;border-radius:8px;border:3px solid #1b2425;background:#dc6b30;box-shadow:5px 0 #172326,-5px 0 #172326;z-index:3;pointer-events:none}.vehicle:before{content:'';position:absolute;top:13px;left:5px;right:5px;height:16px;background:#a5d9df;border:2px solid #304e5e}.vehicle:after{content:'';position:absolute;bottom:6px;left:5px;right:5px;height:5px;border-left:6px solid #ff4533;border-right:6px solid #ff4533}.vehicle span{position:absolute;top:34px;left:0;right:0;text-align:center;font:bold 9px monospace;color:#fff}.vehicle b{position:absolute;bottom:1px;left:12px;color:#ffe13b;font-size:19px}.tractor{top:65%;left:75%;background:#427daf}.overtake{background:#cb4637}.obstacle{position:absolute;transform:translate(-50%,-50%);width:65px;height:30px;background:repeating-linear-gradient(135deg,#f4ad30 0 10px,#292824 10px 20px);border:3px solid #41392b;z-index:2;pointer-events:none;box-shadow:0 5px #0004}.crash{filter:brightness(1.8)}#traffic{pointer-events:none}#status{min-height:62px}.toolbar{gap:12px}.toolbar output{font-size:24px}@media(max-width:740px){#road{height:360px}.asphalt{inset:0 30px}.roadside{font-size:8px}.toolbar{gap:8px}.toolbar output{font-size:20px;min-width:36px}.vehicle{width:35px;height:60px}.vehicle b{left:8px}.obstacle{width:54px;height:27px}.lanes button{font-size:9px}}

.oncoming{background:#ebc441;transform:translate(-50%,-50%) rotate(180deg)}.parked{background:#aeb8be;box-shadow:5px 0 #172326,-5px 0 #172326,0 0 0 3px #f3a82d}.parked:after{border-color:#ffa322;animation:hazards .65s steps(2,end) infinite}@keyframes hazards{50%{opacity:.2}}.pothole{position:absolute;transform:translate(-50%,-50%);width:68px;height:42px;border-radius:45% 55% 40% 60%;background:#171d23;border:6px solid #77766e;box-shadow:inset 0 5px 3px #000,3px 3px #2a3035;pointer-events:none;z-index:2}.pothole:after{content:"";position:absolute;inset:12px 8px 4px;background:#3e5460;border-radius:50%}@media(max-width:740px){.pothole{width:55px;height:35px}}
/* Driving geometry matches the 1000-unit simulation. */
#traffic{position:absolute;inset:0;overflow:hidden}#epa{width:11%;height:12%;top:65%;box-sizing:border-box}#steering{position:absolute;inset:0;z-index:6;touch-action:none;cursor:ew-resize}.vehicle,.obstacle,.pothole{box-sizing:border-box}.hit{opacity:.4}.drive-controls{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:8px;margin:10px 0}.drive-controls button{touch-action:none;user-select:none;padding:14px 6px}#brake{background:#842a22;color:#fff;font-weight:bold}#brake[aria-pressed=true]{background:#e43826;box-shadow:inset 0 0 0 3px #ffc97a}.braking:after{box-shadow:0 3px 8px #ff4022}.drive-help{font-size:13px}.tractor span{top:45%}.tractor b{bottom:0;left:30%;font-size:14px}.vehicle:before{top:16%;height:25%}.vehicle:after{bottom:8%}.toolbar{flex-wrap:wrap}

/* Fixed road proportions keep cars upright at every screen size. */
#road{width:100%;max-width:420px;height:auto;aspect-ratio:3/4;margin:0 auto}.asphalt{inset:0 25px}.centerline{left:calc(33.333% - 2px)}.centerline:after{content:"";position:absolute;left:0;top:0;width:4px;height:100%;background:inherit;transform:translateX(100px)}.centerline{width:100%;left:0;background:none}.centerline:before,.centerline:after{content:"";position:absolute;top:0;width:3px;height:100%;background:repeating-linear-gradient(0deg,#eee 0 25px,transparent 25px 55px);transform:none}.centerline:before{left:33.333%}.centerline:after{left:66.666%}#epa{width:18%;height:18%;left:50%}.vehicle span{font-size:8px}.drive-controls{max-width:420px;margin:10px auto}.roadside{font-size:8px}#steering{cursor:pointer}#steering:focus-visible{outline:2px solid #ffed9c;outline-offset:-2px}

.drive-controls{grid-template-columns:repeat(4,1fr)}#gas{background:#28663a;color:#fff;font-weight:bold}#gas[aria-pressed=true]{background:#369e48;box-shadow:inset 0 0 0 3px #b5ffb4}