@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;font-family:'DM Sans',Arial,sans-serif;color:#fff;background:#174759;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a,select,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #ffda83;outline-offset:5px}button:disabled{opacity:.5;cursor:wait}#game{width:100vw;height:100dvh;min-height:420px;position:relative;overflow:hidden}#world,.vignette{position:absolute;inset:0;width:100%;height:100%}.vignette{pointer-events:none;background:linear-gradient(180deg,rgba(5,27,35,.36),transparent 25%,transparent 65%,rgba(4,18,23,.67))}.topbar{position:absolute;left:4.2%;right:4.2%;top:34px;display:flex;justify-content:space-between;align-items:center;z-index:3}.wordmark{font-weight:800;letter-spacing:4px;font-size:21px;line-height:1.15;text-decoration:none;color:white;display:grid;grid-template-columns:33px auto;align-items:center}.wordmark svg{width:25px;fill:#ffd187;grid-row:span 2}.wordmark span{font-size:8px;letter-spacing:3.1px;font-weight:500;margin-top:5px;opacity:.7}.top-right{display:flex;align-items:center;gap:14px;font-size:9px;letter-spacing:1.7px}.live-dot{width:5px;height:5px;border-radius:50%;background:#d4eccc;box-shadow:0 0 10px #d4eccc}.icon-button{border:1px solid #ffffff30;background:#102b3326;color:#fff;border-radius:4px;min-height:32px;padding:8px 12px;font-size:9px;letter-spacing:1px}.intro{position:absolute;left:7.5%;top:24%;z-index:2;text-shadow:0 2px 30px #082c3760}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2.7px;color:#ffe0a1;display:flex;align-items:center;gap:12px}.eyebrow span{height:1px;width:28px;background:#ffdf9d}h1{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;text-transform:uppercase;font-weight:600;font-size:clamp(64px,7.3vw,124px);line-height:.86;letter-spacing:-1px;margin:25px 0 24px}h1 em{font-style:normal;color:#ffda91}.intro p{font-size:12px;line-height:1.85;color:#eef7f6dc;letter-spacing:.15px}.intro-actions{display:flex;align-items:center;gap:24px;margin-top:28px}.primary{display:flex;justify-content:space-between;align-items:center;gap:34px;background:#ffda91;border:0;color:#243332;font-size:10px;font-weight:800;letter-spacing:1.2px;padding:18px 23px;border-radius:3px;box-shadow:0 4px 30px #06273022}.primary:hover{background:#ffe5b5;transform:translateY(-1px)}.primary span{font-size:20px;font-weight:400}.text-button{border:0;background:transparent;color:#fff;font-size:9px;font-weight:600;letter-spacing:1.3px;padding:10px 0}.text-button span{margin-left:13px;font-size:17px}.route-facts{display:flex;gap:33px;margin-top:40px;padding-top:24px;border-top:1px solid #fff3}.route-facts>div{padding-right:24px;border-right:1px solid #fff3}.route-facts>div:last-child{border:0;padding:0}.route-facts b{display:block;font-size:21px;font-weight:500}.route-facts b span{font-size:9px;letter-spacing:1px;color:#d6e4e3}.route-facts small{display:block;font-size:6.5px;letter-spacing:1.2px;margin-top:8px;color:#e0ebedbe}footer{position:absolute;bottom:25px;left:4.2%;right:4.2%;display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1.3px;z-index:3;color:#f0f7f2a0}.control-hints{display:flex;gap:24px;align-items:center}.control-hints span{display:flex;align-items:center;gap:8px}kbd{border:1px solid #fff4;border-radius:3px;padding:4px 6px;font-size:8px;color:white;font-family:inherit}.edition b{font-weight:400;color:#fff;margin-left:12px}#controller-status{font-size:7px}.hidden{display:none!important}.stage{position:absolute;top:125px;left:4.2%}.stage>span{font-size:10px;letter-spacing:3px;color:#ffdd9b}.stage h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:35px;text-transform:uppercase;margin:6px 0 3px;font-weight:500}.stage p{font-size:8px;letter-spacing:2px;color:#ffffffb3}.drive-status{position:absolute;right:4.2%;top:115px;display:flex;flex-direction:column;text-align:right;gap:8px}.drive-status span:first-child{font-family:'Barlow Condensed',monospace;font-size:32px;font-variant-numeric:tabular-nums}.drive-status span:last-child{font-size:8px;letter-spacing:1.5px}.route-progress{position:absolute;top:89px;left:4.2%;right:4.2%;height:2px;background:#fff2}.route-progress i{display:block;height:100%;background:#ffda91;width:0;box-shadow:0 0 12px #ffda9166}.speedometer{position:absolute;bottom:75px;right:5%;display:flex;align-items:center;gap:22px;min-width:175px}.speedometer #speed{font-family:'Barlow Condensed',Impact,sans-serif;font-size:90px;font-style:italic;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-2px}.speedometer small{font-size:9px;letter-spacing:2px;display:block;text-align:right;color:#eaf1ecb3}.gear{border:1px solid #fff5;border-radius:4px;min-width:44px;text-align:center;padding:7px}.gear small{font-size:6px;text-align:center}.gear b{font-family:'Barlow Condensed',Impact,sans-serif;font-size:28px;font-weight:500}.rpm-track{position:absolute;bottom:-12px;right:0;left:0;height:3px;background:#ffffff30}.rpm-track i{display:block;background:#ffda91;height:100%;width:0}.drive-hint{position:absolute;bottom:85px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:2px;background:#0d2d3650;padding:12px 20px;border:1px solid #fff2;border-radius:3px;white-space:nowrap}#loading{position:absolute;inset:0;background:#103440;z-index:20;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .5s}#loading p{font-size:10px;letter-spacing:3px;margin-top:30px}#loading small{font-size:10px;color:#bbcdd3}.loading-mark{font-family:Impact,sans-serif;font-size:58px;color:#ffda91;animation:pulse 1s infinite alternate}@keyframes pulse{to{opacity:.35}}.modal{position:absolute;inset:0;background:#061d29a6;backdrop-filter:blur(12px);z-index:10;display:flex;align-items:center;justify-content:center}.panel{background:#102c36ed;border:1px solid #ffffff24;padding:32px;max-width:460px;width:calc(100% - 32px);border-radius:8px;box-shadow:0 20px 100px #0004}.panel-heading{display:flex;justify-content:space-between;align-items:center}.panel h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:54px;font-weight:500;margin:14px 0 24px;text-transform:uppercase}.panel label{font-size:9px;letter-spacing:1px;display:flex;align-items:center;justify-content:space-between;margin:20px 0}.panel select,#debug select{background:#214753;border:1px solid #ffffff30;padding:8px;color:white;border-radius:3px}.panel .check{justify-content:flex-start;gap:8px;font-size:10px;letter-spacing:0}.panel input{accent-color:#ffda91}.menu-help,.panel p{font-size:11px;line-height:1.8;color:#bed0d5}.menu-buttons{display:grid;gap:12px;margin-top:24px}.secondary{border:1px solid #ffffff40;padding:12px;background:transparent;color:white;font-size:9px;letter-spacing:1px}.panel>.primary{width:100%}#debug{position:absolute;top:100px;left:4.2%;width:300px;z-index:12;background:#061a22ed;border:1px solid #8ec2c044;border-radius:6px;padding:15px;color:#cce2dd;font-size:10px;box-shadow:0 15px 40px #0003}.debug-heading{display:flex;justify-content:space-between;align-items:center;letter-spacing:1px;font-size:9px}#debug button{color:#ffe1a3;background:#27434a;border:1px solid #5a6c66;border-radius:3px;font-size:8px;padding:7px}.debug-heading button{border:0!important;background:transparent!important}#metrics{font-size:10px;line-height:1.8;margin:10px 0}.debug-actions{display:flex;gap:5px}#debug label{display:grid;gap:7px;margin-top:12px}#debug p{font-size:9px;line-height:1.7;color:#d3ded7}#toast{position:absolute;top:110px;left:50%;transform:translateX(-50%);background:#173a43dd;border:1px solid #ffda9170;color:#ffdf9d;padding:12px 22px;font-size:10px;letter-spacing:1px;border-radius:4px;opacity:0;transition:opacity .2s;z-index:13;pointer-events:none}.touch-controls{display:none;position:absolute;bottom:80px;left:20px;gap:10px;z-index:4}.touch-controls button{border:1px solid #ffffff60;background:#163d4890;color:#fff;border-radius:10px;width:52px;height:52px;touch-action:none;font-size:11px}@media(pointer:coarse){.touch-controls{display:flex}.control-hints{display:none}.drive-hint{bottom:150px}}@media(max-width:700px){.topbar{top:20px}.wordmark{font-size:16px;letter-spacing:3px}.wordmark span{font-size:6px;letter-spacing:2px}.top-right>#state-label,.live-dot,#sound{display:none}.intro{top:23%;left:7%}h1{font-size:70px}.intro p{font-size:11px}.route-facts{gap:15px;margin-top:25px}.route-facts>div{padding-right:14px}.route-facts b{font-size:17px}.route-facts small{font-size:5px}.intro-actions{gap:20px}.primary{padding:14px 18px;font-size:9px}.control-hints{gap:10px}.control-hints span:nth-child(n+3){display:none}.edition{font-size:6px}footer{bottom:16px}.stage{top:100px}.stage h2{font-size:26px}.drive-status{top:100px}.speedometer{bottom:65px;right:6%;min-width:145px;gap:12px}.speedometer #speed{font-size:72px}.route-progress{top:78px}}@media(max-height:650px) and (min-width:701px){.intro{top:22%}h1{font-size:74px;margin:16px 0}.intro-actions{margin-top:20px}.route-facts{margin-top:23px;padding-top:16px}.intro p{font-size:11px}.topbar{top:22px}}

#title-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#06354366,transparent 72%)}.debug-actions{flex-wrap:wrap}#auto-run{flex-basis:100%}

@media(max-width:700px) and (max-height:650px){.intro{top:20%}h1{font-size:54px;margin:18px 0}.intro-actions{gap:14px;margin-top:17px}.intro-actions .primary{gap:16px;padding:12px 14px;font-size:8px}.intro-actions .text-button{font-size:7px}.route-facts{margin-top:20px;padding-top:13px;gap:12px}.route-facts b{font-size:16px}.route-facts small{font-size:5px}.intro p{font-size:10px}.edition{display:none}}
.arcade-timer{position:absolute;top:12px;left:50%;transform:translateX(-50%);min-width:110px;text-align:center;pointer-events:none;z-index:4;text-shadow:0 3px 4px #04171b,0 0 22px #04171bcc}.arcade-timer small{display:block;font-size:9px;font-weight:800;letter-spacing:3px;color:#ffe0a1}.arcade-timer strong{display:block;font-family:'Barlow Condensed',Impact,sans-serif;font-size:68px;line-height:1;font-weight:700;font-variant-numeric:tabular-nums;color:#ffe0a1}.arcade-timer.urgent strong{color:#ff6255;animation:clock-warning .5s steps(2,end) infinite}.arcade-timer.urgent small{color:#ff9788}@keyframes clock-warning{50%{opacity:.55}}#hud .route-progress{top:103px}#hud .stage{top:132px}#hud .drive-status{top:126px}@media(max-width:1000px){.top-right>#state-label,.top-right>.live-dot{display:none}}@media(max-width:700px){.arcade-timer{top:70px}.arcade-timer strong{font-size:54px}.arcade-timer small{font-size:8px}#hud .route-progress{top:143px}#hud .stage{top:156px}#hud .drive-status{top:154px}}@media(prefers-reduced-motion:reduce){.arcade-timer.urgent strong{animation:none}}

#debug{max-height:calc(100dvh - 125px);overflow-y:auto}#mw-sweep{flex-basis:100%}

.start-lights{position:absolute;left:50%;top:28%;transform:translateX(-50%);z-index:8;pointer-events:none;text-align:center;min-width:270px;color:#fff;text-shadow:0 3px 8px #06141d}.start-lights small{font-size:11px;letter-spacing:5px;font-weight:800}.light-housing{display:flex;gap:20px;padding:22px 28px;margin:16px auto 8px;width:max-content;border:2px solid #7b8a88;border-radius:18px;background:linear-gradient(#273234,#071114);box-shadow:0 12px 30px #00151b66}.light-housing i{width:58px;height:58px;border-radius:50%;background:#301d1b;border:4px solid #050b0d;box-shadow:inset 0 4px 9px #000}.light-housing i.on{background:#ff3528;box-shadow:0 0 24px #ff3a2877,inset 0 3px 7px #ffb7a4}.start-lights.green .light-housing i{background:#4bff89;box-shadow:0 0 32px #4bff8977}.start-lights strong{display:block;font-family:'Barlow Condensed',Impact,sans-serif;font-size:86px;line-height:1.1}.start-lights.green strong{color:#70ff98}.start-lights>span{font-size:9px;letter-spacing:2px}@media(max-width:700px){.start-lights{top:35%}.light-housing i{width:42px;height:42px}.start-lights strong{font-size:66px}.light-housing{padding:16px 20px}}
.music-choice{display:flex;align-items:center;gap:18px;margin-top:26px;font-size:9px;letter-spacing:2px;font-weight:700}.music-choice select{min-width:175px;padding:10px 28px 10px 12px;border:1px solid #f4edd54d;background:#10343bd9;color:#fff;font:500 12px 'Inter',sans-serif;border-radius:4px}.music-choice select option{background:#10343b}.music-choice+.intro-actions{margin-top:20px}@media(max-width:700px){.music-choice{margin-top:16px;gap:12px;font-size:7px}.music-choice select{min-width:135px;font-size:10px;padding:8px}.music-choice+.intro-actions{margin-top:15px}.route-facts{margin-top:22px}}@media(max-height:650px){.music-choice{margin-top:12px}.music-choice select{padding:7px}.music-choice+.intro-actions{margin-top:14px}}
/* Mobile mode can be forced with ?mobile=1, and activates on touch phones. */
.mobile body{overscroll-behavior:none;touch-action:manipulation}.mobile #game{min-height:100dvh}.mobile .topbar{top:max(12px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right))}.mobile .icon-button{min-width:42px;min-height:42px;padding:10px}.mobile #sound{display:block;font-size:7px;letter-spacing:0}.mobile .top-right{gap:6px}.mobile .wordmark{font-size:14px;letter-spacing:2px}.mobile .wordmark span{display:none}.mobile .wordmark svg{width:20px}.mobile .modal{padding:max(8px,env(safe-area-inset-top)) 0 max(8px,env(safe-area-inset-bottom))}.mobile .panel{max-height:calc(100dvh - 24px);overflow-y:auto;padding:20px}.mobile .panel h2{font-size:38px;margin:10px 0}.mobile .panel label{margin:14px 0}.mobile .panel select{min-height:42px;font-size:16px}.mobile .music-choice select{font-size:16px;min-height:44px}.mobile .menu-help{display:none}.mobile .touch-controls{display:none;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));width:auto;justify-content:space-between;align-items:flex-end;pointer-events:none;user-select:none;-webkit-user-select:none}.mobile body[data-mode="drive"] .touch-controls,.mobile body[data-mode="countdown"] .touch-controls{display:flex}.touch-controls button,.touch-controls #steering-pad{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none}.mobile .touch-controls button{height:56px;width:56px;border:1px solid #e6f3ef99;background:#14343ddd;box-shadow:0 3px 12px #03191b88;font-weight:800;font-size:12px}.touch-controls button.pressed{background:#ffda91!important;color:#19333a!important}.steering-controls{width:140px}.steering-buttons{display:flex;gap:10px;justify-content:center;margin-top:8px}#steering-pad{position:relative;width:140px;height:56px;border:1px solid #ffffff80;border-radius:28px;background:#14343dbb;--steer:0}#steering-pad>span{position:absolute;top:8px;left:0;right:0;text-align:center;font-size:8px;font-weight:700;letter-spacing:2px;color:#ffdf9d}#steering-pad i{position:absolute;width:27px;height:27px;border-radius:50%;left:calc(50% - 13.5px + var(--steer)*44px);top:24px;background:#ffda91;box-shadow:0 2px 8px #001d24}.pedals{display:flex;gap:10px}.mobile [data-input="throttle"]{height:88px!important;background:#466047db!important}.mobile body[data-mode="drive"] footer,.mobile body[data-mode="countdown"] footer{display:none}.mobile .drive-hint{bottom:160px;font-size:8px;padding:10px;letter-spacing:1px}.mobile .speedometer{bottom:155px;right:14px;min-width:105px;gap:8px}.mobile .speedometer #speed{font-size:52px}.mobile .gear{display:none}.mobile .start-lights{top:32%;min-width:240px}.mobile .start-lights>span{font-size:8px;letter-spacing:1px}.mobile #toast{top:90px;max-width:85%;font-size:9px;padding:8px 12px}.mobile .intro{left:7%;top:19%;right:7%}.mobile .intro-actions{flex-wrap:wrap}.mobile .route-facts{gap:15px}.mobile .arcade-timer{top:65px}.mobile .arcade-timer strong{font-size:49px}.mobile #hud .route-progress{top:125px}.mobile #hud .stage{top:140px;left:14px;max-width:60%}.mobile .stage h2{font-size:23px}.mobile .stage p{font-size:7px;letter-spacing:1px}.mobile #hud .drive-status{top:140px;right:14px}.mobile .drive-status span:first-child{font-size:24px}.mobile .drive-status span:last-child{font-size:7px;letter-spacing:0}.mobile .edition{font-size:6px}.mobile #debug{left:12px;top:65px;max-height:calc(100dvh - 80px);max-width:calc(100vw - 24px)}.mobile-option{display:none!important}.mobile .mobile-option{display:flex!important}#fullscreen{display:none}.mobile #fullscreen{display:block}
@media(orientation:landscape){.mobile .intro{top:16%;width:48%;right:auto}.mobile h1{font-size:clamp(38px,7vw,62px);margin:12px 0}.mobile .intro p{font-size:10px;line-height:1.5;margin:8px 0}.mobile .eyebrow{font-size:7px}.mobile .music-choice{margin-top:10px;font-size:7px;gap:10px}.mobile .music-choice select{font-size:12px;min-height:36px}.mobile .intro-actions{margin-top:10px;gap:18px}.mobile .intro-actions .primary{padding:10px 14px;font-size:8px}.mobile .route-facts{display:none}.mobile .arcade-timer{top:14px;min-width:80px}.mobile .arcade-timer small{font-size:7px;letter-spacing:2px}.mobile .arcade-timer strong{font-size:40px}.mobile #hud .route-progress{top:65px}.mobile #hud .stage{top:77px;max-width:42%}.mobile #hud .stage h2{font-size:22px;margin:3px 0}.mobile #hud .stage p{display:none}.mobile #hud .drive-status{top:77px}.mobile .drive-status span:first-child{font-size:22px}.mobile .speedometer{bottom:20px;right:50%;transform:translateX(50%);min-width:80px}.mobile .speedometer #speed{font-size:38px}.mobile .speedometer small{font-size:6px}.mobile .rpm-track{bottom:-5px}.mobile .drive-hint{bottom:85px;font-size:7px}.mobile .start-lights{top:22%}.mobile .start-lights strong{font-size:50px}.mobile .light-housing{margin:8px auto 2px;padding:12px 20px}.mobile .light-housing i{width:36px;height:36px}.mobile footer{bottom:10px}.mobile .control-hints{display:none}.mobile .top-right>#state-label,.mobile .live-dot{display:none}}
@media(orientation:portrait){.mobile .drive-hint{bottom:205px}.mobile .control-hints{display:none}}

/* Keep the detailed inspector out of the live telemetry paint region. */
#collision-tools{margin-top:12px;border-top:1px solid #8ec2c044;padding-top:10px}#collision-tools summary{cursor:pointer;color:#ffe1a3;margin-bottom:10px}#collision-tools input[type=number]{width:100%;background:#214753;border:1px solid #ffffff30;padding:8px;color:white;border-radius:3px}

#metrics{white-space:pre-wrap;overflow-wrap:anywhere}
.starter-cameo{position:absolute;inset:0;z-index:9;overflow:hidden;pointer-events:none}.starter-actor{position:absolute;left:-25%;bottom:10%;width:clamp(180px,22vw,320px);aspect-ratio:2/3;will-change:transform,left}.starter-sprite{position:absolute;inset:0;background-image:url('/jlg-games/azureline/assets/starter-cameo.png');background-size:300% 200%;background-repeat:no-repeat;filter:drop-shadow(0 5px 5px #03161c55)}.starter-shadow{position:absolute;bottom:3%;left:15%;width:70%;height:6%;border-radius:50%;background:#04161a55;filter:blur(6px)}.starter-caption{position:absolute;top:24%;left:54%;width:min(460px,39vw);margin:0;padding:22px 26px;border-radius:20px 20px 20px 3px;background:#fff9e8;color:#18323b;box-shadow:0 8px 28px #00192155;font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(21px,2.3vw,35px);font-weight:700;line-height:1.2;text-wrap:balance}.starter-caption:after{content:'';position:absolute;bottom:-15px;left:20px;border-width:16px 18px 0 0;border-style:solid;border-color:#fff9e8 transparent transparent transparent}.mobile .starter-actor{width:clamp(130px,32vw,220px);bottom:13%}.mobile .starter-caption{top:27%;left:52%;width:43%;padding:13px;font-size:clamp(16px,3.4vw,23px)}@media(orientation:landscape) and (max-height:550px){.starter-actor,.mobile .starter-actor{width:140px;bottom:6%}.starter-caption,.mobile .starter-caption{top:29%;font-size:20px;padding:14px}}
@media(max-width:600px) and (orientation:portrait){.starter-caption,.mobile .starter-caption{left:6%;top:25%;width:88%;padding:15px 18px;font-size:22px;line-height:1.15}.starter-actor,.mobile .starter-actor{width:clamp(150px,41vw,220px);bottom:10%}.starter-caption:after{left:38%}}
