@import "https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;700;900&family=Barlow:wght@400;600&display=swap";:root{--hud-font:"Barlow Condensed", "Arial Narrow", Impact, sans-serif;--body-font:"Barlow", system-ui, sans-serif;--accent:#f2c94c;--money:#7ed957;--danger:#e0433a;--mm:256px}*{box-sizing:border-box}html,body{width:100%;height:100%;font-family:var(--body-font);color:#fff;background:#000;margin:0;padding:0;overflow:hidden}canvas#game{outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}.hidden{display:none!important}#hud{top:env(safe-area-inset-top,0px);right:env(safe-area-inset-right,0px);bottom:env(safe-area-inset-bottom,0px);left:env(safe-area-inset-left,0px);pointer-events:none;font-family:var(--hud-font);text-shadow:0 2px 4px #000000e6,0 0 2px #000;position:fixed}#hud-topright{text-align:right;position:absolute;top:18px;right:22px}#wanted{letter-spacing:3px;color:#ffffff47;height:30px;font-size:28px}#wanted .star{transition:color .15s;display:inline-block}#wanted .star.on{color:#fff;text-shadow:0 0 10px #ffffffb3,0 2px 4px #000}#wanted.flash .star.on{animation:.5s infinite alternate wantedflash}@keyframes wantedflash{0%{color:#fff}to{color:#ff4a3d}}#money{color:var(--money);letter-spacing:1px;margin-top:4px;font-size:34px;font-weight:700}#money.gain{animation:.4s ease-out pop}@keyframes pop{0%{transform:scale(1.25)}to{transform:scale(1)}}#clock{color:#ddd;font-size:20px;font-weight:500}#ammo{color:#eee;margin-top:10px;font-size:22px;font-weight:700}#ammo-count{color:#bbb;margin-left:10px;font-weight:500}#hud-bottomleft{position:absolute;bottom:22px;left:22px}#minimap-wrap{width:var(--mm);height:var(--mm);background:#101418;border:2px solid #000000a6;border-radius:6px;position:relative;overflow:hidden;box-shadow:0 4px 18px #0009}#minimap{width:100%;height:100%;display:block}#minimap-compass{color:#fff;font-size:14px;font-weight:900;position:absolute;top:4px;left:50%;transform:translate(-50%)}#bars{width:var(--mm);gap:4px;margin-top:8px;display:flex}.bar{background:#0009;border:1px solid #000c;border-radius:2px;flex:1;height:9px;overflow:hidden}.bar>div{width:100%;height:100%;transition:width .2s}.bar.health>div{background:#45b04f}.bar.armor>div{background:#4aa3e0;width:0}.bar.stamina>div{background:#d9c34a}#streetname{left:22px;bottom:calc(var(--mm) + 60px);color:#fff;opacity:0;font-size:22px;font-weight:700;transition:opacity .4s;position:absolute}#streetname.show{opacity:1}#streetname #district{color:var(--accent);letter-spacing:2px;text-transform:uppercase;font-size:15px;font-weight:500;display:block}#objective{color:#fff;text-align:center;border-left:4px solid var(--accent);background:#0000008c;border-radius:4px;max-width:70vw;padding:8px 18px;font-size:22px;font-weight:500;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}#objective b{color:var(--accent);font-weight:700}#notify{flex-direction:column;gap:6px;display:flex;position:absolute;top:22px;left:22px}#notify .toast{border-left:4px solid var(--accent);background:#0009;border-radius:4px;max-width:380px;padding:8px 14px;font-size:18px;animation:.3s ease-out toastin}@keyframes toastin{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:none}}#subtitle{font-family:var(--body-font);color:#fff;text-align:center;background:#00000080;border-radius:4px;max-width:70vw;padding:6px 14px;font-size:20px;position:absolute;bottom:110px;left:50%;transform:translate(-50%)}#subtitle b{color:var(--accent)}#speedo{color:#fff;font-size:44px;font-weight:900;position:absolute;bottom:22px;right:22px}#speedo .unit{color:#bbb;margin-left:6px;font-size:16px;font-weight:500}#speedo #gear{color:#999;text-align:right;font-size:15px;font-weight:500;display:block}#radio{text-align:right;color:#ddd;font-size:16px;position:absolute;bottom:90px;right:22px}#radio #radio-name{color:var(--accent);font-size:20px;font-weight:700;display:block}#crosshair{border:2px solid #ffffffd9;border-radius:50%;width:10px;height:10px;margin:-5px 0 0 -5px;position:absolute;top:50%;left:50%;box-shadow:0 0 4px #000}#hint{color:#ddd;opacity:0;background:#00000073;border-radius:4px;padding:4px 12px;font-size:18px;transition:opacity .3s;position:absolute;top:20px;left:50%;transform:translate(-50%)}#hint.show{opacity:1}#damage-vignette{pointer-events:none;opacity:0;background:radial-gradient(#f000 45%,#c80000bf 100%);transition:opacity .15s;position:absolute;inset:0}#mission-title{letter-spacing:3px;color:var(--accent);text-transform:uppercase;text-align:center;font-size:56px;font-weight:900;animation:4s ease-in-out forwards titlein;position:absolute;top:20%;left:50%;transform:translate(-50%)}#mission-title small{color:#fff;letter-spacing:2px;font-size:22px;font-weight:500;display:block}@keyframes titlein{0%{opacity:0;transform:translate(-50%,20px)}10%{opacity:1;transform:translate(-50%)}85%{opacity:1}to{opacity:0}}#bigmsg{letter-spacing:4px;text-transform:uppercase;text-align:center;font-size:72px;font-weight:900;position:absolute;top:40%;left:50%;transform:translate(-50%)}#bigmsg.fail{color:var(--danger)}#bigmsg.pass{color:var(--money)}#bigmsg small{color:#fff;letter-spacing:2px;font-size:24px;font-weight:500;display:block}#fps{color:#0f0;pointer-events:none;z-index:30;background:#00000080;padding:2px 6px;font:12px monospace;position:fixed;top:6px;left:50%;transform:translate(-50%)}#mapscreen{z-index:10;background:#06080ced;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#bigmap{cursor:crosshair;border:2px solid #333;max-width:96vw;max-height:88vh;box-shadow:0 10px 40px #000}#mapscreen-legend{font-family:var(--hud-font);letter-spacing:2px;color:#ccc;margin-top:10px;font-size:18px}#pause{z-index:20;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#000000b8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.panel{text-align:center;min-width:380px}.panel h1{font-family:var(--hud-font);letter-spacing:6px;color:var(--accent);margin:0 0 20px;font-size:64px;font-weight:900}.menu-items{flex-direction:column;align-items:center;gap:8px;display:flex}.menu-items button{font-family:var(--hud-font);letter-spacing:2px;text-transform:uppercase;color:#fff;cursor:pointer;background:#ffffff0f;border:2px solid #ffffff26;min-width:320px;padding:10px 40px;font-size:26px;font-weight:700;transition:all .12s}.menu-items button:hover:not(:disabled){background:var(--accent);color:#111;border-color:var(--accent)}.menu-items button:disabled{opacity:.35;cursor:default}#settings-panel,#controls-panel{text-align:left;background:#0006;border-radius:6px;margin-top:18px;padding:14px 18px}#settings-panel label{justify-content:space-between;align-items:center;gap:12px;margin:8px 0;font-size:16px;display:flex}#settings-panel input[type=range]{width:180px}#controls-panel table{border-collapse:collapse;width:100%;font-size:16px}#controls-panel td{padding:4px 8px}#controls-panel td:first-child{font-family:var(--hud-font);color:var(--accent);letter-spacing:1px;font-weight:700}#title{z-index:25;background:#05070a;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#title-bg{opacity:.92;background-position:50%;background-repeat:no-repeat;background-size:cover;position:absolute;inset:0}#title-bg:after{content:"";background:linear-gradient(#00000059,#000000bf);position:absolute;inset:0}#title-content{text-align:center;position:relative}#title-logo{filter:drop-shadow(0 10px 30px #000c);width:min(720px,80vw)}#title-tagline{font-family:var(--hud-font);letter-spacing:3px;color:#ddd;text-transform:uppercase;margin:8px 0 28px;font-size:24px}#title-footer{color:#999;margin-top:30px;font-size:13px}#prologue{z-index:35;cursor:pointer;-webkit-user-select:none;user-select:none;background:#05070a;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.prologue-art{opacity:0;background-position:38%;background-repeat:no-repeat;background-size:cover;transition:opacity 1.2s;animation:32s ease-in-out infinite alternate prologuebg;position:absolute;inset:0}.prologue-art.show{opacity:1}@keyframes prologuebg{0%{transform:scale(1.02)translate(0)}to{transform:scale(1.1)translate(-1.5%)}}#prologue:before{content:"";z-index:1;pointer-events:none;background:linear-gradient(90deg,#0000000d 0% 42%,#000000b8 62%,#000000e6 100%),linear-gradient(#0000 70%,#000000a6);position:absolute;inset:0}#prologue-content{z-index:2;text-align:left;width:min(560px,40vw);position:absolute;top:50%;right:6vw;transform:translateY(-50%)}@media (max-aspect-ratio:4/3){#prologue-content{width:auto;inset:auto 5vw 14vh;transform:none}#prologue:before{background:linear-gradient(#0000000d 30%,#000000bf 60%,#000000eb 100%)}.prologue-art{background-position:30%}}#prologue-kicker{font-family:var(--hud-font);letter-spacing:6px;text-transform:uppercase;color:var(--accent);margin-bottom:18px;font-size:20px;font-weight:700}#prologue-text{font-family:var(--hud-font);color:#f2f2f0;text-shadow:0 3px 12px #000000e6;font-size:clamp(26px,3.4vw,40px);font-weight:500;line-height:1.3}#prologue-content.in>*{animation:1.1s ease-out both prologuein}#prologue-content.in>#prologue-text{animation-delay:.25s}@keyframes prologuein{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}#prologue-dots{justify-content:flex-start;gap:8px;margin-top:34px;display:flex}#prologue-dots span{background:#fff3;border-radius:2px;width:34px;height:4px;transition:background .3s}#prologue-dots span.on{background:var(--accent)}#prologue-hint{z-index:2;font-family:var(--hud-font);letter-spacing:2px;text-transform:uppercase;color:#aaa;white-space:nowrap;font-size:16px;position:absolute;bottom:36px;left:50%;transform:translate(-50%)}#prologue-hint b{color:#fff;font-weight:700}#prologue.ready #prologue-hint{color:var(--accent);animation:1.1s ease-in-out infinite alternate prologuepulse}#prologue.ready #prologue-hint b{color:var(--accent)}@keyframes prologuepulse{0%{opacity:.5}to{opacity:1}}#prologue-skip{z-index:3;font-family:var(--hud-font);letter-spacing:2px;text-transform:uppercase;color:#ddd;cursor:pointer;background:#0006;border:1px solid #ffffff40;padding:6px 16px;font-size:18px;font-weight:700;transition:all .12s;position:absolute;top:24px;right:28px}#prologue-skip:hover{background:var(--accent);color:#111;border-color:var(--accent)}#loading{z-index:40;background-color:#07090d;background-position:50%;background-repeat:no-repeat;background-size:cover;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}#loading:before{content:"";background:linear-gradient(#0003 40%,#000000e6 100%);position:absolute;inset:0}#loading-inner{text-align:center;width:min(720px,90vw);margin-bottom:8vh;position:relative}#loading-title{font-family:var(--hud-font);letter-spacing:8px;color:var(--accent);font-size:42px;font-weight:900}#loading-bar{background:#ffffff1f;border-radius:5px;height:10px;margin:14px 0 10px;overflow:hidden}#loading-fill{background:var(--accent);width:0;height:100%;transition:width .2s}#loading-text{color:#ddd;font-size:16px}#loading-tip{color:#999;min-height:20px;margin-top:8px;font-size:14px}#loading.fade{animation:.8s forwards fadeout}@keyframes fadeout{to{opacity:0;visibility:hidden}}@media (max-width:800px){:root{--mm:160px}#money{font-size:26px}#speedo{font-size:32px}.menu-items button{min-width:240px;font-size:20px}}@media (max-height:760px){#title-logo{width:auto;max-width:80vw;max-height:30vh}#title-tagline{letter-spacing:2px;margin:4px 0 12px;font-size:16px}#title .menu-items button{min-width:260px;padding:7px 32px;font-size:20px}#title-footer{margin-top:12px;font-size:12px}}@media (max-height:560px){#title-logo{max-height:24vh}#title .menu-items button{padding:5px 28px;font-size:17px}}#pause{box-sizing:border-box;align-items:flex-start;padding:4vh 0;overflow-y:auto}#pause>*{margin:auto}#pause input[type=range],#pause input[type=checkbox]{accent-color:var(--accent)}#pause select{color:#eee;background:#15181d;border:1px solid #ffffff40;padding:2px 6px;font-family:inherit}@media (max-height:760px){#pause h1{margin:0 0 8px;font-size:40px}#pause .menu-items{gap:5px}#pause .menu-items button{min-width:240px;padding:6px 28px;font-size:18px}}:root{--tb:clamp(46px, 15vmin, 68px);--ts:clamp(34px, 10vmin, 44px);--tg:clamp(8px, 3vmin, 14px);--tm:clamp(10px, 4vmin, 18px);--tj:clamp(96px, 30vmin, 140px)}html.touch{overscroll-behavior:none;touch-action:manipulation;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}html.touch body{overscroll-behavior:none;touch-action:manipulation;position:fixed;inset:0}canvas#game{touch-action:none}#touch{top:env(safe-area-inset-top,0px);right:env(safe-area-inset-right,0px);bottom:env(safe-area-inset-bottom,0px);left:env(safe-area-inset-left,0px);z-index:5;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;font-family:var(--hud-font);position:fixed}html:not(.touch) #touch{display:none}.tbtn{width:var(--tb);height:var(--tb);color:#fff;font-size:calc(var(--tb) * .24);letter-spacing:1px;text-align:center;white-space:pre-line;opacity:.55;text-shadow:0 1px 2px #000;background:#080a0e8c;border:1px solid #fff9;border-radius:50%;justify-content:center;align-items:center;font-weight:700;line-height:1.05;transition:opacity .1s,background-color .1s,transform .1s;display:flex;position:absolute;box-shadow:0 2px 10px #00000073}.tbtn.big{width:calc(var(--tb) * 1.2);height:calc(var(--tb) * 1.2);font-size:calc(var(--tb) * .3)}.tbtn.small{width:var(--ts);height:var(--ts);font-size:calc(var(--ts) * .28);letter-spacing:.5px;position:static}.tbtn.down,.tbtn.on{opacity:.9;border-color:var(--accent);background:#f2c94c6b}.tbtn.down{transform:scale(.94)}.tbtn.dim{opacity:.22}#ttop{gap:var(--tg);display:flex;position:absolute;top:8px;left:50%;transform:translate(-50%)}#tstick{width:var(--tj);height:var(--tj);opacity:0;pointer-events:none;will-change:transform;background:#080a0e59;border:1px solid #ffffff80;border-radius:50%;transition:opacity .15s;position:absolute;top:0;left:0}#tstick.on{opacity:.85}#tknob{background:#fff9;border:1px solid #ffffffd9;border-radius:50%;width:42%;height:42%;margin:-21% 0 0 -21%;position:absolute;top:50%;left:50%;box-shadow:0 2px 8px #00000080}html.touch #hint{top:calc(var(--ts) + 16px);font-size:15px}html.touch #objective{bottom:var(--tm);max-width:42vw;padding:5px 12px;font-size:16px}html.touch #hud.driving #objective{bottom:calc(var(--tm) + 66px)}html.touch #speedo{left:50%;right:auto;bottom:var(--tm);text-align:center;white-space:nowrap;font-size:34px;transform:translate(-50%)}html.touch #speedo #gear{text-align:center}html.touch #radio{bottom:auto;left:50%;right:auto;top:calc(var(--ts) + 16px);text-align:center;font-size:14px;transform:translate(-50%)}html.touch #radio #radio-name{font-size:17px}html.touch #notify .toast{max-width:30vw;padding:6px 10px;font-size:15px}html.touch #subtitle{bottom:calc(var(--tm) + 66px);max-width:50vw;font-size:16px}html.touch #fps{left:12px;transform:none}html.touch #mapscreen,html.touch #pause{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}@media (max-height:520px){:root{--mm:150px}#hud-topright{top:12px}#wanted{letter-spacing:2px;height:24px;font-size:22px}#money{margin-top:2px;font-size:26px}#clock{font-size:15px}#ammo{margin-top:4px;font-size:17px}#streetname{font-size:18px}#streetname #district{font-size:13px}#speedo{font-size:32px}}#map-close{color:#fff;cursor:pointer;z-index:1;background:#ffffff14;border:1px solid #ffffff4d;border-radius:50%;width:44px;height:44px;font-size:22px;line-height:1;position:absolute;top:14px;right:18px}#map-close:hover{background:var(--accent);color:#111}#pause{touch-action:pan-y;overscroll-behavior:contain}@media (hover:none){.menu-items button:hover:not(:disabled){color:#fff;background:#ffffff0f;border-color:#ffffff26}.menu-items button:active:not(:disabled),#map-close:active,#prologue-skip:active{background:var(--accent);color:#111;border-color:var(--accent)}}#controls-panel table.touch,html.touch #controls-panel table.kb{display:none}html.touch #controls-panel table.touch{display:table}#rotate{z-index:50;text-align:center;font-family:var(--hud-font);color:var(--accent);background:#05070af7;flex-direction:column;justify-content:center;align-items:center;display:none;position:fixed;inset:0}@media (orientation:portrait){html.touch #rotate{display:flex}}#rotate-icon{animation:2.4s ease-in-out infinite rotatehint}@keyframes rotatehint{0%,15%{transform:rotate(0)}50%,65%{transform:rotate(90deg)}to{transform:rotate(0)}}#rotate-text{letter-spacing:2px;text-transform:uppercase;margin-top:18px;font-size:clamp(20px,6.5vw,30px);font-weight:700}#rotate-text small{color:#ddd;letter-spacing:2px;margin-top:6px;font-size:18px;font-weight:500;display:block}