@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--pink:#ff619a;--gold:#ffc876}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#111721;color:#fff3e5;font-family:'Space Grotesk',Arial,sans-serif}#world{position:fixed;inset:0}#world canvas{display:block}header{position:absolute;top:28px;left:34px;right:34px;display:flex;align-items:center;gap:30px;pointer-events:none}.brand{font-family:'Barlow Condensed',Impact,sans-serif;font-size:28px;line-height:.85;font-weight:900;text-transform:uppercase;text-decoration:none;color:#fff3e5;letter-spacing:-1px;pointer-events:auto;text-shadow:2px 3px #101620}.brand>span{display:block;font-size:48px}.dot{color:var(--pink);font-size:22px;padding-left:4px}.edition{font-size:11px;letter-spacing:3px;border-left:1px solid #ffffff30;padding:12px 25px}.edition b{display:block;font-size:8px;letter-spacing:1.5px;color:#aaa9b2;margin-top:8px}.topbuttons{margin-left:auto;display:flex;gap:8px;pointer-events:auto}button{cursor:pointer;border:1px solid #ffffff28;background:#131923dc;color:#fff3e5;border-radius:5px;font:500 12px 'Space Grotesk',Arial;padding:11px 15px}button:hover{background:#30323f}button:focus-visible{outline:2px solid var(--pink);outline-offset:3px}kbd{display:inline-block;font:10px monospace;background:#ffffff0d;border:1px solid #ffffff25;border-radius:3px;padding:3px 5px;margin-left:8px}.mission{position:absolute;left:34px;top:165px;width:285px;padding:23px;background:linear-gradient(135deg,#171c28ed,#141923d9);border:1px solid #fff2;border-top:2px solid var(--pink);backdrop-filter:blur(15px);box-shadow:0 20px 70px #0004}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--pink)}h1{font:800 36px/1 'Barlow Condensed',Impact,sans-serif;text-transform:uppercase;margin:18px 0 12px}.mission p{font-size:12px;line-height:1.8;color:#b6b7c2}.step{border-top:1px solid #ffffff15;padding-top:18px;margin-top:22px;display:flex;align-items:center;gap:14px;font-size:11px}.step span{color:var(--pink);font:10px monospace;white-space:nowrap}.progress{height:3px;background:#ffffff15;margin:16px 0}.progress i{display:block;background:var(--pink);height:100%;width:8%;transition:width .4s}.action{width:100%;background:var(--pink);color:#171521;font-weight:700;border:0;display:flex;justify-content:space-between;align-items:center}.action:hover{background:#ff93b9}.mission small{display:block;color:#9298a8;font-size:9px;line-height:1.6;margin-top:12px}.stats{position:absolute;right:35px;top:126px;display:flex;gap:30px;text-align:right}.stats span,.district>span{font-size:8px;letter-spacing:2px;color:#b3b5c0;display:block;margin-bottom:7px}.stats b{font:700 23px monospace;color:var(--gold);letter-spacing:2px}.district{position:absolute;left:34px;bottom:98px;text-shadow:0 2px 20px #000}.district h2{font:800 37px 'Barlow Condensed',Impact;margin:0;letter-spacing:1px}.district p{font-size:10px;color:#adb4c6}.mapbox{position:absolute;right:34px;bottom:93px;width:190px;padding:8px;background:#101522e8;border:1px solid #ffffff28}.mapbox canvas{width:100%;display:block}.mapbox div{font:7px monospace;display:flex;gap:6px;justify-content:center;padding:7px 0 0}.pink{color:var(--pink)}.yellow{color:var(--gold)}.blue{color:#5dbfff}footer{position:absolute;bottom:0;left:0;right:0;min-height:60px;border-top:1px solid #fff2;background:#10141cf2;display:flex;align-items:center;justify-content:space-between;padding:12px 34px;font-size:9px;color:#acb1bf;gap:12px}footer button{border:0;font-size:10px;margin-left:12px}.live{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--pink);margin-right:8px}#speed{font:700 15px monospace;color:var(--gold);white-space:nowrap}#toast{position:absolute;bottom:95px;left:50%;transform:translateX(-50%);padding:13px 22px;border:1px solid #ff619a55;background:#171c28e8;border-radius:5px;font-size:11px;transition:opacity .4s;text-align:center}.touch{display:none}#error{position:absolute;top:45%;left:30%;padding:30px;background:#241d31}@media(max-width:850px){header{top:16px;left:18px;right:18px}.edition{display:none}.brand{font-size:20px}.brand>span{font-size:36px}.mission{left:18px;top:105px;width:220px;padding:15px}h1{font-size:28px}.mission p{font-size:10px}.stats{top:110px;right:18px;display:block}.stats>div{margin-bottom:15px}.stats b{font-size:18px}.district{left:18px;bottom:85px}.district h2{font-size:27px}.mapbox{right:18px;bottom:85px;width:130px}footer{padding:10px 18px}footer>div{display:none}#toast{bottom:260px;font-size:10px;width:230px}.touch{display:block;position:absolute;bottom:170px;left:18px;text-align:center}.touch button{touch-action:none;width:40px;height:40px;padding:5px;background:#1b2031d9}.mission small{display:none}}@media(max-height:680px){.mission{top:115px}.mission p{display:none}.district{bottom:75px}.mapbox{width:135px;bottom:75px}}

@media(max-width:600px){.mission p{display:none}.mission h1{margin:14px 0}.mission .step{margin-top:12px;padding-top:12px}.mission{width:220px}.district p{display:none}.topbuttons button{padding:9px;font-size:10px}}

/* Midnight crime-game HUD */
.brand{font-size:31px;line-height:.88;letter-spacing:-1.5px;-webkit-text-stroke:1px #fff3e5;text-shadow:3px 3px 0 #10121c,5px 5px 0 #10121c}.brand>span{font-size:53px}.stats{background:#10141ba8;padding:15px 20px;border-right:3px solid #ffc876}.stats b{font-size:27px;text-shadow:2px 3px #000}.wanted .stats{border-color:#ff657b;animation:heatflash 1s alternate infinite}.wanted #heat{color:#ff657b}@keyframes heatflash{to{box-shadow:0 0 28px #ff456433}}.ride-panel{position:absolute;right:34px;top:230px;width:210px;padding:16px;background:#111721df;border:1px solid #fff2}.ride-panel>span{font-size:10px;letter-spacing:1px;color:#ffc876}.ride-panel label{display:block;font:8px monospace;color:#b7bdc9;margin-top:16px}.ride-panel i{display:block;height:5px;background:#fff2;margin-top:7px}.ride-panel b{display:block;width:100%;height:100%;background:#8cc98c}.ride-panel label:nth-of-type(2) b{background:#7dd5e9}.ride-panel button{margin-top:16px;width:100%;font-size:10px}.ride-panel small{display:block;font-size:8px;color:#929baa;margin-top:8px}#event-card{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%) rotate(-3deg);pointer-events:none;opacity:0;transition:opacity .2s;text-align:center;width:min(700px,90vw);text-shadow:4px 5px #16131d}#event-card.show{opacity:1}#event-card strong{display:block;font:900 italic clamp(40px,6vw,85px)/1 'Barlow Condensed',Impact;color:#ffc876;letter-spacing:-1px}#event-card span{display:inline-block;background:#111822e8;padding:12px 24px;font-size:13px;margin-top:12px;text-shadow:none}#event-card.bad strong{color:#f25f70}.district h2{font-style:italic;font-size:45px;text-shadow:3px 3px #111}.mapbox{border:3px solid #10121a;border-radius:50%;width:185px;height:185px;padding:8px;box-shadow:0 0 0 1px #e7ddd340}.mapbox canvas{border-radius:50%}.mapbox>div{display:none}@media(max-width:850px){.ride-panel{display:none}.brand{font-size:21px}.brand>span{font-size:37px}.stats{padding:8px}.mapbox{width:135px;height:135px}.district h2{font-size:27px}}

.brand{-webkit-text-stroke:0;letter-spacing:-.4px;text-shadow:2px 2px 0 #10121c,3px 3px 0 #10121c}

/* Sunset Coast edition */
:root{--pink:#ff806c;--gold:#ffe2a2}body{background:#073e46;color:#fff1ce}.brand{color:#fff1ce;font-style:italic}.dot{color:#4be2c9}.edition{color:#fff1ce;background:#073e4690}.edition b{color:#d4e9df}.mission{background:linear-gradient(135deg,#073e46ed,#082f36e8);border-top:3px solid #ff806c;box-shadow:8px 8px 0 #062b3433}.mission p{color:#cedbd0}.action{background:#ff806c;color:#073e46}.stats,.ride-panel{background:#073e46e8}.district h2{color:#fff1ce;text-shadow:3px 3px #073e46}.district>span,.district p{color:#fff1ce;background:#073e46bc;width:fit-content;padding:4px 8px}.backsite{color:#fff1ce;padding:12px;font:11px Arial;text-decoration:none;background:#073e46d9;border:1px solid #fff2;border-radius:5px}footer{background:#07333bea}#toast{background:#073e46ed;border-color:#ff806c88}.touch-actions{display:none}.mission .eyebrow{color:#63dfc9}.mapbox{background:#073e46;box-shadow:0 0 0 2px #ffe2a280;border-color:#fff1ce}#event-card strong{color:#fff1ce}#event-card span{background:#073e46ed}@media(max-width:850px){.backsite{display:none}.touch-actions{display:flex;position:absolute;bottom:240px;left:18px;gap:5px}.touch-actions button{touch-action:none;font-size:10px;background:#073e46e0}.mission{width:210px}.topbuttons{gap:4px}.topbuttons button{font-size:9px;padding:8px}.brand{font-size:18px}.brand>span{font-size:30px}}

.photo .mission,.photo .stats,.photo .ride-panel,.photo .district,.photo .mapbox,.photo footer,.photo #toast,.photo .brand,.photo .edition,.photo .touch,.photo .touch-actions,.photo .backsite,.photo #camera,.photo #pause,.photo #fleet,.photo #lighting{display:none}.photo #photo{opacity:.4}.photo #photo:hover{opacity:1}@media(max-width:850px){#photo{display:none}}
dialog{color:#fff1ce;background:#073e46;border:1px solid #8ac4ba;padding:35px;width:min(760px,92vw);border-radius:12px;box-shadow:0 30px 140px #000a}dialog::backdrop{background:#031e29c9;backdrop-filter:blur(6px)}dialog h2{font:900 italic 45px 'Barlow Condensed',Impact;text-transform:uppercase;margin:15px 0}#garage-close{float:right}#garage-status{font-size:13px;color:#cce0d8;line-height:1.7}.fleet-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}.fleet-grid button{text-align:left;padding:24px;background:#0e4850;border:1px solid #7ab4ac55;display:flex;flex-direction:column;gap:12px}.fleet-grid button[aria-pressed=true]{border:2px solid #ff806c}.fleet-grid button:hover{background:#175d65}.fleet-grid button:disabled{opacity:.6;cursor:not-allowed}.ride-number{font:10px monospace;color:#ffae82}.fleet-grid strong{font:800 27px 'Barlow Condensed',Impact;text-transform:uppercase}.fleet-grid small{font-size:11px;color:#c9dcd7}.fleet-grid em{font:9px monospace;color:#6addc9;font-style:normal}.garage-note{font-size:10px;color:#bdd4cb}@media(max-width:850px){.topbuttons{display:grid;grid-template-columns:1fr 1fr;max-width:190px}.mission{top:125px}.stats{top:125px}.edition{display:none}header{gap:10px}}@media(max-width:500px){dialog{padding:22px}.fleet-grid{gap:9px}.fleet-grid button{padding:14px}.fleet-grid strong{font-size:22px}.fleet-grid small{font-size:10px}.fleet-grid em{line-height:1.6}.mission{width:190px}.stats b{font-size:18px}.mission h1{font-size:25px}.topbuttons button{padding:7px 9px}.brand{font-size:17px}.brand>span{font-size:29px}}
.fleet-grid img{display:block;width:100%;height:120px;object-fit:contain;margin:-8px 0}.fleet-grid button{gap:8px}dialog{max-height:90vh;overflow:auto}.fleet-grid button:focus-visible{outline:2px solid #ffd99f}.fleet-grid img[hidden]{display:none}@media(max-width:500px){.fleet-grid img{height:85px}.fleet-grid button{padding:12px}}

.photo #event-card{display:none}

#bureau-entry{position:fixed;z-index:3;transform:translate(-50%,-100%);display:flex;flex-direction:column;gap:3px;padding:9px 12px;background:#113e42ed;color:#fff0c9;border:1px solid #8cc9b5;border-radius:5px;text-align:center;font-size:11px;box-shadow:0 3px 12px #1239}#bureau-entry span{font-size:8px;letter-spacing:1px;color:#b8d4c0}#bureau-entry:after{content:"";position:absolute;bottom:-7px;left:calc(50% - 5px);border:5px solid transparent;border-top-color:#8cc9b5;border-bottom:0}#bureau-entry[hidden],#resident-name[hidden]{display:none}#resident-name{position:fixed;z-index:2;transform:translate(-50%,-100%);pointer-events:none;font:9px monospace;white-space:nowrap;background:#fff0d2e8;border:1px solid #1d5958;color:#174d4d;padding:5px 8px;border-radius:4px}#resident-name:empty{display:none}@media(max-width:700px){#bureau-entry{padding:7px 8px;font-size:9px}#bureau-entry span{font-size:6px}}

/* Touch cockpit: navigation above, driving below, open world in the middle. */
#city-menu-toggle,#mission-toggle{display:none}
@media(max-width:850px),(pointer:coarse){
 header{top:max(12px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));z-index:10;justify-content:space-between;gap:12px}.brand{font-size:17px}.brand>span{font-size:28px}.edition{display:none}
 #city-menu-toggle{display:block;pointer-events:auto;min-height:44px;background:#073e46f5;font-size:12px;padding:10px 14px}.topbuttons{display:none;position:absolute;right:0;top:54px;max-width:none;width:230px;background:#073e46f7;padding:12px;border:1px solid #8ac4ba;border-radius:10px;box-shadow:0 14px 35px #001b27aa;grid-template-columns:1fr 1fr;gap:8px}.topbuttons.open{display:grid}.topbuttons .backsite{display:flex;align-items:center;justify-content:center;min-height:46px;font-size:12px}.topbuttons button{min-height:46px;font-size:12px;padding:8px}#photo{display:none}.topbuttons kbd{display:none}
 .mission{top:calc(76px + env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));width:min(252px,calc(100vw - 100px));padding:11px 12px;z-index:5;border-radius:8px;box-shadow:0 6px 18px #001b2733;max-height:calc(100dvh - 285px);overflow:auto}.mission #mission-toggle{display:flex;justify-content:space-between;width:100%;min-height:30px;padding:0;background:transparent;border:0;font-size:11px;color:#80e8d5;align-items:center}.mission #mission-toggle span{font-size:19px}.mission #mission-details{display:none}.mission.expanded #mission-details{display:block}.mission h1{font-size:26px;margin:12px 0 7px}.mission p{display:block;font-size:12px;line-height:1.6}.mission .eyebrow{display:none}.mission .step{border:0;padding:0;margin:7px 0;gap:8px;font-size:12px}.mission .step span{font-size:10px}.mission .progress{margin:10px 0;height:3px}.mission .action{min-height:44px;font-size:12px;padding:10px}.mission kbd{display:none}.mission #tour{display:none;min-height:44px;font-size:12px}.mission.expanded #tour{display:block}.mission small{display:none}
 .stats{top:calc(82px + env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));padding:6px;background:#073e46cb;border-right:0;border-radius:5px;display:block}.stats>div{margin:0}.stats>div+div{margin-top:10px}.stats span{font-size:7px;letter-spacing:0}.stats b{font-size:12px;letter-spacing:0}.ride-panel,.district{display:none}
 footer{min-height:31px;padding:6px max(14px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom));font-size:8px;gap:6px}footer>div{display:none}#speed{font-size:12px}
 .touch{display:block;position:absolute;left:max(14px,env(safe-area-inset-left));bottom:calc(45px + env(safe-area-inset-bottom));text-align:center;z-index:6;user-select:none;-webkit-user-select:none}.touch>div{display:flex;gap:5px;margin-top:5px}.touch button{width:48px;height:48px;min-height:48px;padding:0;background:#073e46e8;border:1px solid #a6d9ca99;border-radius:10px;font-size:18px;touch-action:none;user-select:none}.touch-actions{display:flex;flex-direction:column;left:auto;right:max(14px,env(safe-area-inset-right));bottom:calc(45px + env(safe-area-inset-bottom));gap:7px;z-index:6}.touch-actions button{width:76px;min-height:48px;font-size:11px;touch-action:none;background:#073e46e8;border:1px solid #a6d9ca99;border-radius:10px}.touch-actions button:last-child{border-color:#ffa48e;color:#ffb69f}.touch button:active,.touch-actions button:active{background:#287775}
 .mapbox{width:90px;height:90px;right:max(14px,env(safe-area-inset-right));bottom:calc(166px + env(safe-area-inset-bottom));padding:4px;pointer-events:none;z-index:1}#toast{bottom:calc(175px + env(safe-area-inset-bottom));width:min(210px,55vw);left:14px;transform:none;font-size:11px;padding:10px;pointer-events:none;z-index:4}#event-card{z-index:4;top:48%}#event-card span{font-size:11px;padding:10px}#bureau-entry{font-size:10px;padding:10px;min-height:44px}#bureau-entry span{font-size:8px}
 dialog{padding:20px;max-height:calc(100dvh - 24px);width:calc(100% - 24px)}dialog h2{font-size:32px}#garage-close{min-width:44px;min-height:44px}.fleet-grid small{font-size:12px}.garage-note{font-size:11px;line-height:1.6}
}
@media(max-height:500px) and (orientation:landscape){
 header .brand{font-size:13px}header .brand>span{font-size:21px}.mission{top:64px;width:220px;max-height:calc(100dvh - 200px)}.mission #mission-toggle{min-height:22px}.mission .step{font-size:11px}.mission .progress{margin:6px 0}.mission .action{min-height:36px}.mission.expanded{z-index:12;max-height:calc(100dvh - 82px)}.stats{top:68px}.mapbox{right:104px;bottom:50px;width:80px;height:80px}#toast{left:50%;transform:translateX(-50%);bottom:42px;width:230px}.touch button{width:44px;height:44px;min-height:44px}.touch>div{margin-top:3px}.touch,.touch-actions{bottom:calc(36px + env(safe-area-inset-bottom))}.topbuttons{top:48px;width:300px;grid-template-columns:repeat(3,1fr)}.topbuttons button,.topbuttons .backsite{min-height:44px}
}
.fleet-grid img{height:165px}.garage-note a{color:#ffad8e;text-decoration:underline;margin-left:6px}@media(max-width:500px){.fleet-grid{grid-template-columns:1fr}.fleet-grid img{height:185px}.fleet-grid strong{font-size:26px}.fleet-grid button{padding:18px}}