:root{--ink:#eeeadd;--gold:#e5c16b;--panel:rgba(18,25,26,.91)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#202c2b;color:var(--ink);font-family:Arial,Helvetica,sans-serif}button{font:inherit;color:inherit;cursor:pointer}#world{position:absolute;width:100%;height:100%;image-rendering:auto}.vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 150px #0008}header{position:absolute;top:27px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center}.identity{display:flex;gap:14px;align-items:center;text-shadow:0 2px 8px #000}.mark{font-weight:900;font-size:29px;border:1px solid #d1bd8644;padding:10px}.mark span{color:var(--gold)}strong{font-size:17px;letter-spacing:4px}.identity small{display:block;font-size:9px;letter-spacing:2.7px;margin-top:6px;color:#c2c5bd}.topright{display:flex;gap:10px;align-items:center}.topright button{background:var(--panel);border:1px solid #ffffff24;padding:11px 14px;font-size:10px;letter-spacing:1px}.live{font-size:9px;letter-spacing:2px;color:#afc6a5;margin-right:12px}.district{position:absolute;left:32px;top:116px}.district>span{font-size:11px;letter-spacing:3px;font-weight:700}.district small{display:block;font-size:9px;letter-spacing:1.5px;color:#b5c1bb;margin-top:8px}.contract{position:absolute;top:170px;left:32px;width:290px;background:var(--panel);border:1px solid #ffffff20;border-top:2px solid var(--gold);padding:21px}.eyebrow{font-size:9px;letter-spacing:2px;color:#b4bdb6}.accent{color:var(--gold)}#contractnum{float:right;font-size:8px;color:#949e99;letter-spacing:0}.contract h2{font-size:18px;line-height:1.4;margin:15px 0 9px;font-weight:500}.contract p{font-size:11px;line-height:1.6;color:#aeb8b2}.contractbottom{border-top:1px solid #ffffff1b;padding-top:13px;margin-top:16px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px}.mapcard{position:absolute;bottom:74px;left:32px;background:var(--panel);padding:14px;border:1px solid #ffffff20;width:278px}.maphead,.mapfoot{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.3px}.maphead{margin-bottom:12px}.mapfoot{margin-top:10px;color:#a9b4ac;font-size:8px}#minimap{width:250px;height:180px;display:block;background:#253430}.mapfoot i{display:inline-block;width:5px;height:5px;background:var(--gold);margin-right:5px}kbd{font:inherit;border:1px solid #ffffff44;padding:2px 4px}.speedcard{position:absolute;right:32px;bottom:86px;text-align:right;text-shadow:0 2px 8px #000}.cash{color:var(--gold);font-family:monospace;font-size:23px;letter-spacing:3px}.speed{display:flex;gap:12px;justify-content:flex-end;align-items:center;margin-top:16px}.speed>span{font-size:72px;line-height:1;font-weight:700;letter-spacing:-5px}.speed small{font-size:10px;letter-spacing:2px;line-height:2;text-align:left}.speed b{font-size:8px;font-weight:400;color:#b9c4bc;letter-spacing:1px}.health{display:flex;gap:4px;justify-content:flex-end;margin-top:15px}.health span{width:25px;height:3px;background:#c4d0a3}.status{position:absolute;bottom:99px;left:50%;transform:translateX(-50%);font-size:10px;letter-spacing:2px;background:#131a1acc;padding:12px 18px;border:1px solid #ffffff22}footer{position:absolute;bottom:30px;left:32px;right:32px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:#ddd}footer em{font-style:normal;color:#89978e;margin:0 17px 0 7px}footer b{font-weight:400}.build{color:#87988d;font-size:8px}.attribution{position:absolute;right:9px;bottom:6px;font-size:8px;color:#8a9c95}.attribution a{color:inherit}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,#101a18ee 0%,#101a18b0 43%,#101a1844);display:flex;align-items:center;padding:7vw}.introcontent{max-width:600px}.introcontent .eyebrow{color:var(--gold);font-size:10px;letter-spacing:3px}h1{font-size:clamp(90px,12vw,170px);line-height:.84;letter-spacing:-8px;margin:32px 0;font-weight:900}h1 span{color:var(--gold)}.introcontent p{font-size:16px;line-height:1.8;color:#c2c9bf}.introcontent button{display:flex;justify-content:space-between;align-items:center;background:var(--gold);color:#1c2820;border:0;width:310px;padding:19px 22px;font-size:11px;font-weight:700;letter-spacing:2px;margin-top:30px}.introcontent button span{font-size:20px}.introcontent button:disabled{opacity:.4;cursor:wait}.introdetails{font-size:8px;letter-spacing:2px;color:#8eaa97;margin-top:22px}#load{display:block;margin-top:18px;color:#8eaa97;font-size:10px}.introaside{position:absolute;right:9vw;bottom:15vh;text-align:right}.introaside span{font-size:58px;line-height:1.2;font-weight:700;color:#eeeadd66}.introaside p{font-size:10px;letter-spacing:4px;line-height:2;color:#c6d1c2}dialog{background:#182422;color:var(--ink);border:1px solid #ffffff33;max-width:460px;padding:40px}dialog::backdrop{background:#0009}dialog h2{font-size:28px;font-weight:400}dialog p{font-size:13px;line-height:2.3}dialog b{display:inline-block;width:170px;color:var(--gold)}dialog small{font-size:10px;color:#9aaea0;line-height:1.7}#closehelp{position:absolute;right:15px;top:12px;border:0;background:none;font-size:25px}#touch{display:none}body.playing #intro{display:none}body.map-open .contract,body.map-open .district{display:none}@media(max-width:800px){header{left:18px;right:18px;top:18px}.identity strong{font-size:12px;letter-spacing:2px}.mark{font-size:20px;padding:6px}.topright .live,#audio,.build{display:none}.contract{width:225px;left:18px;top:138px;padding:14px}.district{left:18px;top:93px}.mapcard{left:18px;bottom:62px;width:180px;padding:10px}#minimap{width:158px;height:112px}.mapfoot{font-size:6px;letter-spacing:0}.speedcard{right:18px;bottom:70px}.speed>span{font-size:48px}.cash{font-size:18px}.status{bottom:207px;font-size:8px;max-width:80%;text-align:center}footer{bottom:28px;left:18px;font-size:7px}footer em{margin-right:7px}.introaside{display:none}.introcontent .eyebrow{font-size:8px}h1{font-size:110px}.introcontent p{font-size:14px}}@media(pointer:coarse){#touch{position:absolute;display:block;right:15px;bottom:210px;text-align:center}#touch button{background:#14231dcc;border:1px solid #ffffff45;padding:14px;margin:3px;border-radius:6px;touch-action:none}.status{bottom:340px}}

body.map-open .mapcard,body.map-open .speedcard,body.map-open .status,body.map-open footer{display:none}

#touch button.held{background:#e5c16b;color:#1c2820}button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(pointer:coarse){#touch{display:none;left:15px;right:15px;bottom:30px;justify-content:space-between;align-items:end;pointer-events:none}body.playing #touch{display:flex}#touch button{min-width:48px;min-height:48px;pointer-events:auto;user-select:none}#touch .touch-actions{display:grid;grid-template-columns:repeat(2,auto)}#touch .touch-move{display:flex;align-items:center}#touch .touch-move>div{display:flex;flex-direction:column}.mapcard{bottom:150px}.speedcard{bottom:160px}.status{bottom:275px}footer{display:none}body.map-open #touch{display:flex}}
@media(pointer:coarse) and (max-height:540px){.contract{top:90px;width:205px;padding:10px}.contract h2{font-size:14px;margin:8px 0}.contract p{display:none}.district{display:none}.mapcard{display:none}.speedcard{bottom:140px}.status{bottom:150px;max-width:40%}header{top:10px}.introcontent h1{font-size:70px;margin:20px 0}.introcontent p{display:none}.introcontent button{margin-top:15px}}

@media(pointer:coarse) and (min-height:541px){.status{bottom:325px}}

/* Keep the longer 2032 title inside narrow screens. */
@media(max-width:800px){.introcontent h1{font-size:clamp(54px,19vw,110px);letter-spacing:-.065em}.introcontent{width:100%;min-width:0}.introcontent button{max-width:100%}}

.ride-choice{display:flex;flex-direction:column;gap:8px;margin-top:18px;font-size:9px;letter-spacing:2px;color:var(--gold);max-width:310px}.ride-choice select{font:14px Arial;color:var(--ink);background:#182c29;border:1px solid #748777;padding:11px;border-radius:4px}.introcontent .ride-choice+button{margin-top:15px}
@media(max-width:800px){.ride-choice{margin-top:10px}.introcontent h1{margin:22px 0}.introcontent button{padding:15px 20px}.introdetails{margin-top:15px}}

.interaction-hint{position:absolute;left:50%;bottom:148px;transform:translateX(-50%);max-width:70%;padding:9px 14px;border:1px solid #65d7d466;border-radius:5px;background:#142b2bee;color:#9ce6df;font-size:11px;letter-spacing:.7px;text-align:center;pointer-events:none}.interaction-hint[hidden]{display:none}body:not(.playing) .interaction-hint,body.map-open .interaction-hint{display:none}@media(max-width:800px){.interaction-hint{bottom:256px;max-width:85%;font-size:10px}}@media(pointer:coarse){.interaction-hint{bottom:365px}}@media(pointer:coarse) and (max-height:540px){.interaction-hint{bottom:194px;max-width:55%}}

/* Player-created identity; appearance never locks story paths. */
.overlay{overflow-y:auto;padding:5vh 7vw}.introcontent{width:min(600px,100%);margin:auto 0}.introcontent h1{font-size:clamp(62px,8vw,116px);letter-spacing:-4px;margin:22px 0}.player-setup{max-width:480px;margin-top:18px}.player-setup label,.appearance-label{display:block;font-size:9px;letter-spacing:2px;color:#c5d3c5;margin:0 0 8px}.player-setup input{box-sizing:border-box;width:100%;padding:11px 13px;border:1px solid #6a8173;border-radius:3px;background:#132622;color:#f8ecd1;font:15px system-ui;outline-offset:3px}.appearance-label{margin-top:15px}.appearance-label[hidden]{display:none}.appearance-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.introcontent .appearance-choice{display:flex;flex-direction:column;gap:5px;justify-content:center;align-items:center;width:auto;padding:6px;margin:0;background:#203730;color:#e7ead9;border:1px solid #5e786a;border-radius:4px;letter-spacing:.4px}.introcontent .appearance-choice[aria-pressed="true"]{border-color:#e5c16b;background:#385045;box-shadow:inset 0 0 0 1px #e5c16b}.appearance-choice img{width:100%;height:64px;object-fit:contain}.introcontent .appearance-choice span{font-size:9px}.introcontent #start{margin-top:18px}.introdetails{margin-top:14px}#load{margin-top:10px}
@media(max-width:1000px){.introaside{display:none}}
@media(max-width:500px){.overlay{padding:26px 7vw;align-items:flex-start}.introcontent{margin:0}.introcontent h1{font-size:clamp(52px,15vw,74px);letter-spacing:-3px;margin:18px 0}.introcontent p{font-size:13px;line-height:1.6}.appearance-choice img{height:48px}.introcontent .appearance-choice span{font-size:8px}.player-setup{margin-top:12px}.introcontent #start{width:100%;padding:15px 18px}.introdetails{font-size:7px}}

#contactDialog{box-sizing:border-box;width:min(540px,92vw);max-height:85vh;overflow:auto}#contactDialog h3{color:#e5c16b;font-size:20px;margin:20px 0 12px}#contactDialog p{white-space:pre-line;line-height:1.7}#contactReward{color:#85ded5}.contact-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.contact-actions button{padding:12px 16px;border:1px solid #708d7f;color:#f0e8d5;background:#253e34;font:11px system-ui;letter-spacing:1px;cursor:pointer}.contact-actions button[hidden]{display:none}#acceptJob,#reportJob{background:#e5c16b;color:#172b22}#abandonJob{color:#f2b2a1}#contactResult:empty{display:none}@media(max-width:500px){.topright{gap:5px}.topright button{padding:7px 8px;font-size:8px}.topright .live{display:none}#contactDialog{padding:28px 22px}.contact-actions button{flex:1}}

#closeContact{position:absolute;right:15px;top:12px;border:0;background:none;color:#e8eedf;font-size:25px;line-height:1;padding:4px;cursor:pointer}#closeContact:focus-visible{outline:2px solid #e5c16b;outline-offset:2px}

.hover-status{position:absolute;left:50%;bottom:192px;transform:translateX(-50%);max-width:75%;padding:8px 13px;border:1px solid #76e9e177;background:#122b2cec;color:#92eee5;font-size:10px;letter-spacing:1px;text-align:center;pointer-events:none}.hover-status[hidden],#touchJump[hidden]{display:none}#touchJump:disabled{opacity:.45}@media(max-width:800px){.hover-status{bottom:298px;max-width:85%}}@media(pointer:coarse){.hover-status{bottom:405px}}@media(pointer:coarse) and (max-height:540px){.hover-status{bottom:235px;max-width:60%}}

#contactDialog .contact-location{font-size:11px;line-height:1.5;color:#91c7bd;margin:0 0 20px;overflow-wrap:anywhere}

.contact-badge{float:left;width:40px;height:40px;image-rendering:pixelated;margin:0 12px 10px 0}.contact-badge[hidden]{display:none}

.cargo-status{display:flex;align-items:center;gap:8px;padding:7px 0;color:#f0cb81;font-size:10px;letter-spacing:.6px}.cargo-status[hidden]{display:none}.cargo-status img{width:24px;height:24px;image-rendering:pixelated}.cargo-status img[hidden]{display:none}#pickupCargo{background:#e5c16b;color:#172b22}

/* Keep extended story objectives clear of the map on short desktop screens. */
@media(min-width:801px) and (max-height:800px){#minimap{height:100px}}

.save-notice{position:absolute;top:78px;right:32px;max-width:min(400px,85vw);padding:8px 12px;background:#241c16ee;border:1px solid #e5c16b;color:#ffdc88;font-size:11px;line-height:1.5;z-index:5}.save-notice[hidden],#resumeNotice[hidden]{display:none}#resumeNotice{display:block;max-width:420px;margin-top:12px;color:#ffdc88;font-size:11px;line-height:1.5}@media(max-width:800px){.save-notice{top:70px;right:18px;font-size:10px}}

/* Supplied artwork governs the charcoal, ivory and gold conversation panel. */
#contactDialog{width:min(1180px,96vw);max-width:1180px;max-height:42vh;margin:auto auto 22px;padding:22px 28px;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,30%);gap:24px;background:#101718f5;border:2px solid #d6ac4f;box-shadow:0 0 0 3px #080e10;font-family:'Courier New',monospace}#contactDialog:not([open]){display:none}#contactDialog.has-portrait{grid-template-columns:150px minmax(0,1fr) minmax(220px,30%)}.contact-portrait{width:150px;height:auto;max-height:170px;object-fit:contain;object-position:center;image-rendering:pixelated;border:3px solid #e5c16b;align-self:center}.contact-portrait[hidden]{display:none}#contactDialog h2{font:700 23px 'Courier New',monospace;letter-spacing:2px;color:#f1c965;margin:4px 0 8px}#contactDialog h3{font-size:15px;margin:10px 0 8px}#contactDialog p{font-size:15px;line-height:1.5;margin:8px 0}#contactDialog .contact-location{font-size:11px;margin:0 0 8px}.contact-actions{display:flex;flex-direction:column;align-self:center;gap:10px;margin:0}.contact-actions button{width:100%;font:700 13px 'Courier New',monospace;letter-spacing:1px;background:#151d20;color:#eeeadd;border:2px solid #65706f;padding:11px}#acceptJob,#reportJob,#pickupCargo{background:#141c1e;color:#f4ce6b;border-color:#e5c16b}.contact-badge{width:28px;height:28px}#closeContact{position:absolute;right:7px;top:3px;background:none;border:0;color:#aaa;font-size:22px}@media(max-width:700px){#contactDialog,#contactDialog.has-portrait{grid-template-columns:76px minmax(0,1fr);gap:12px;padding:18px 14px;margin:auto auto 12px;max-height:72vh;width:96vw}#contactDialog:not(.has-portrait){grid-template-columns:1fr}.contact-portrait{width:76px;height:auto;max-height:88px;align-self:start}#contactDialog h2{font-size:18px;letter-spacing:1px}#contactDialog p{font-size:13px}.contact-actions{grid-column:1/-1;display:flex;flex-direction:row;flex-wrap:wrap}.contact-actions button{width:auto;flex:1 1 140px;font-size:11px}.contact-copy{min-width:0}}

/* Compact play tracker and independent full-screen map controls. */
#world{image-rendering:pixelated;outline:none}.contract{top:96px;width:300px;padding:12px 14px}.contract h2{font:700 15px/1.35 'Courier New',monospace;margin:8px 0}.contract:not(.expanded) #missiondesc{display:none}.contractbottom{margin-top:8px;padding-top:8px}.contract .eyebrow{padding-right:60px}#contractnum{display:none}#missionDetails{position:absolute;top:9px;right:8px;background:none;border:1px solid #8b8051;color:#e5c16b;font:9px monospace;padding:3px}.district{left:32px;top:55px;pointer-events:none}.district small{display:none}.mapcard{bottom:auto;left:auto;right:24px;top:100px;width:202px;padding:10px}#minimap{width:180px;height:130px}.mapfoot{font-size:7px}.camera-controls{position:absolute;right:24px;bottom:32px;display:flex;gap:4px}.camera-controls button{background:#101718ed;border:1px solid #a68c42;padding:7px 10px;font:11px monospace;color:#f5cf57}.map-open .camera-controls{display:none}#mapSearch{width:100%;background:#202e2c;color:#eeeadd;padding:10px;border:1px solid #75857b}.map-open header,.map-open .mapcard,.map-open .contract,.map-open .district,.map-open .speedcard,.map-open footer,.map-open #touch,.map-open .status{display:none}@media(max-width:800px){header{top:14px;left:16px;right:16px}.identity strong{font-size:13px;letter-spacing:1px}.district{display:none}.contract{top:64px;left:12px;width:220px;padding:10px}.contract h2{font-size:12px}.mapcard{right:12px;top:230px;width:142px}#minimap{width:120px;height:85px}.camera-controls{right:12px;bottom:52px}}

.contract:not(.expanded) h2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.map-open .vignette{display:none}

/* Supplied title art remains unchanged; live controls cover only its baked fields. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
#intro{z-index:20;padding:0;justify-content:center;align-items:center;overflow:auto;background:#101d20}#intro::before{content:'';position:fixed;inset:0;background:linear-gradient(#06171c66,#06171c88),url('assets/ui/gorilla-city-title.webp') center/cover;filter:blur(8px);pointer-events:none}.title-stage{position:relative;flex:none;width:min(100vw,calc((100dvh - 105px)*1.7787234));aspect-ratio:1672/940;background:url('assets/ui/gorilla-city-title.webp') center/100% 100% no-repeat;image-rendering:pixelated;margin:0 0 55px}.title-stage .introcontent{max-width:none;width:100%;height:100%;margin:0}.title-stage .player-setup{position:static;margin:0}.title-stage #playerName{position:absolute;left:29%;top:55.4%;width:42%;height:8.1%;max-width:none;border:0;border-radius:0;outline:none;background:linear-gradient(90deg,#003630,#00312e);color:#c9e3bc;padding:0 2%;font:700 clamp(20px,3.2vw,50px)/1 'Courier New',monospace;letter-spacing:1px;box-shadow:none}.title-stage #playerName::placeholder{color:#a9cfb4;opacity:1}.title-stage #playerName:focus{box-shadow:inset 0 0 0 2px #77e3c3}.title-stage #start{position:absolute;left:27.6%;top:67.6%;width:44.8%;height:11.2%;min-height:40px;max-width:none;margin:0;padding:0;background:transparent;border:0;border-radius:0;color:transparent}.title-stage #start:hover:not(:disabled){box-shadow:inset 0 0 0 3px #fff1a477}.title-stage #start:disabled{background:#0b1c2688;opacity:1;cursor:wait}.intro-appearance{position:absolute;top:82%;left:27.6%;width:44.8%;padding:7px 10px;background:#102426ed;border:1px solid #c7a759}.title-stage .appearance-label{margin:0 0 5px;text-align:center;font:700 9px 'Courier New',monospace;letter-spacing:.8px;color:#f0d890}.title-stage .appearance-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.title-stage .appearance-choice{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;margin:0;padding:3px;background:#13282b;border:1px solid #68897c;letter-spacing:0;color:#e2dfc8}.title-stage .appearance-choice[aria-pressed='true']{border-color:#f1c95c;box-shadow:inset 0 0 0 1px #d8af49;background:#28433b}.title-stage .appearance-choice img{height:38px;width:100%;object-fit:contain;image-rendering:pixelated}.title-stage .appearance-choice span{font:700 9px 'Courier New',monospace}.intro-notices{position:absolute;top:99%;left:15%;width:70%;padding:8px 10px;text-align:center;background:#0d2022f0;font:10px/1.4 'Courier New',monospace}.intro-notices #load,.intro-notices #resumeNotice{margin:0;max-width:none;font-size:10px;color:#d2dfc7}.title-stage #introMusic{display:inline-block;width:auto;margin:6px 0 0;padding:6px 10px;background:#152d2f;border:1px solid #987f43;color:#e3c568;font:10px 'Courier New',monospace;letter-spacing:1px}.title-stage #introMusic[aria-pressed='true']{color:#88e2cb;border-color:#88e2cb}
/* One charcoal/gold HUD family, with circular local map and radio together. */
header{top:15px;left:20px;right:20px}.identity strong{font:700 13px 'Courier New',monospace;letter-spacing:2px}.identity small{font-size:8px;letter-spacing:2px}.topright{gap:5px;margin-right:175px}.topright button{padding:7px 10px;background:#0e1b1dde;border-color:#817044;font:9px 'Courier New',monospace}.live{display:none}.district{left:20px;top:55px}.district>span{font:700 10px 'Courier New',monospace;letter-spacing:1px;color:#d7dbbd}.contract{left:20px;top:78px;width:315px;border:0;border-top:0;background:url('assets/ui/hud-frame.svg') center/100% 100%;padding:16px 17px}.contract h2{font-size:14px;color:#eadcae;margin:8px 0;line-height:1.4}.contract .eyebrow{font:700 10px 'Courier New',monospace;letter-spacing:1.2px;color:#edc757}.contractbottom{font:9px 'Courier New',monospace;border-color:#c8af5033}#missionDetails{border-color:#756a3c;color:#bcb58f;font-size:8px;right:10px;top:12px}.cash{position:fixed;right:22px;top:24px;color:#f4d671;font:700 26px 'Courier New',monospace;letter-spacing:2px;text-shadow:3px 3px #18201c,-1px -1px #6b592a}.speedcard{right:22px;bottom:58px}.speed{margin:0;background:#0c1a1abb;padding:8px 12px;border-left:2px solid #b69b4c}.speed>span{font:700 34px 'Courier New',monospace;letter-spacing:0}.speed small{font:9px/1.6 'Courier New',monospace;letter-spacing:0}.speed b{font-size:8px}.mapcard{left:20px;bottom:45px;right:auto;top:auto;width:385px;height:166px;padding:0;background:none;border:0;display:flex;align-items:center;gap:12px}.map-open-button{position:relative;flex:none;padding:0;width:164px;height:164px;overflow:hidden;border:3px solid #c4a45b;border-radius:50%;background:#1a2b27;box-shadow:0 0 0 4px #111b1c,0 4px 14px #0008;color:#ede0a9}.map-open-button #minimap{width:100%;height:100%;border-radius:50%;image-rendering:pixelated;display:block}.map-north{position:absolute;top:6px;left:50%;transform:translateX(-50%);font:bold 10px monospace;color:#ffdf8a;z-index:1;text-shadow:1px 1px #000}.map-key{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);white-space:nowrap;font:8px monospace;background:#071915cc;padding:3px 7px;border-radius:4px}.radio-panel{width:200px;padding:10px 12px;background:#0f1a1ced;border:1px solid #9d864a;border-left:3px solid #c4a45b;font-family:'Courier New',monospace;min-width:0}.radio-panel #stationName{color:#f0cf74;font-size:12px;font-weight:bold;letter-spacing:.8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.radio-panel #radioSong{color:#e1dfc7;font-size:10px;margin-top:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.radio-panel #radioArtist{font-size:9px;color:#99b4a9;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.radio-controls{display:flex;gap:5px;margin-top:9px}.radio-controls button{width:32px;height:26px;padding:0;background:#172a2b;border:1px solid #6e7c66;font-size:11px;color:#e1c875}.radio-controls button[aria-pressed='true']{color:#81dcc3;border-color:#81dcc3}.player-gauges{position:absolute;left:20px;bottom:221px;width:164px;padding:6px 8px;background:#111c1dd9;border:1px solid #7c754e;display:grid;gap:5px;font:8px 'Courier New',monospace}.gauge{display:flex;gap:7px;align-items:center}.gauge>span{width:42px;color:#ccd0b2}.gauge-track{height:6px;flex:1;background:#33423a;border:1px solid #101a17}.gauge-track i{display:block;width:100%;height:100%;background:#c3a956}.stamina-gauge .gauge-track i{background:#79b699}.camera-controls{bottom:17px;right:20px}.camera-controls button{font-size:9px;padding:5px 8px}.status{bottom:49px;max-width:min(550px,42vw);font:10px 'Courier New',monospace;letter-spacing:.7px}.interaction-hint{bottom:97px;font:11px 'Courier New',monospace}.hover-status{bottom:145px}.save-notice{top:62px;right:20px;font-size:10px}footer{left:20px;bottom:15px;right:20px;font-size:8px}footer .build{display:none}.map-open .player-gauges{display:none}body:not(.playing) header,body:not(.playing) .contract,body:not(.playing) .mapcard,body:not(.playing) .player-gauges,body:not(.playing) .speedcard,body:not(.playing) .district,body:not(.playing) .camera-controls,body:not(.playing) footer,body:not(.playing) .attribution{visibility:hidden}
@media(max-width:800px){header{left:12px;right:12px;top:12px}.identity strong{font-size:10px;letter-spacing:1px}.identity small{font-size:7px}.topright{margin-right:0;padding-top:43px;gap:3px}.topright button{font-size:8px;padding:5px 6px}#audio{display:block}.cash{top:16px;right:12px;font-size:21px;letter-spacing:1px}.contract{left:12px;top:78px;width:240px;padding:12px 14px}.contract h2{font-size:12px}.contract .eyebrow{font-size:8px}.district{display:none}.mapcard{left:12px;bottom:39px;width:297px;height:124px;gap:9px}.map-open-button{width:120px;height:120px}.radio-panel{width:165px;padding:8px 9px}.radio-panel #stationName{font-size:10px}.radio-controls button{width:28px;height:26px}.player-gauges{left:12px;bottom:173px;width:120px;padding:5px}.gauge{gap:4px}.gauge>span{width:34px;font-size:7px}.speedcard{right:12px;bottom:206px}.speed>span{font-size:27px}.status{bottom:219px;max-width:75vw;font-size:9px}.interaction-hint{bottom:267px}.hover-status{bottom:308px}.camera-controls{right:12px;bottom:13px}.save-notice{top:52px;max-width:60vw}.title-stage{width:680px;margin-bottom:75px}.title-stage #playerName{font-size:22px;min-height:34px}.title-stage .appearance-choice img{height:32px}.title-stage .appearance-choice span{font-size:8px}.title-stage .appearance-label{font-size:8px}.intro-notices{font-size:9px;left:24%;width:52%}.intro-notices #load,.intro-notices #resumeNotice{font-size:9px}.title-stage #introMusic{font-size:9px}.attribution{font-size:7px}}
@media(pointer:coarse){.mapcard{bottom:154px}.player-gauges{bottom:288px}.status{bottom:335px}.interaction-hint{bottom:378px}.hover-status{bottom:420px}.speedcard{bottom:300px}#touch{bottom:16px}.camera-controls{bottom:130px}footer{display:none}.radio-controls button{min-height:32px}#intro{padding-bottom:20px}}
@media(max-height:540px){.title-stage{width:min(100vw,calc((100dvh - 100px)*1.7787234));margin-bottom:65px}.title-stage #playerName{font-size:clamp(15px,3vw,26px);min-height:24px}.intro-appearance{top:81%;padding:4px 7px}.title-stage .appearance-choice img{height:23px}.title-stage .appearance-label{font-size:7px}.title-stage .appearance-choice span{font-size:7px}.intro-notices{top:103%;padding:4px;font-size:8px}.title-stage #introMusic{padding:3px 7px;margin-top:3px}.mapcard{display:flex;bottom:21px;height:96px;width:275px}.map-open-button{width:96px;height:96px}.radio-panel{width:165px}.player-gauges{bottom:127px;width:96px}.gauge>span{display:none}.speedcard{bottom:68px}.status{bottom:33px;left:64%;max-width:34vw}.interaction-hint{bottom:102px;max-width:45vw}.hover-status{bottom:146px}.contract{top:62px;width:230px}.topright{padding-top:0}.camera-controls{bottom:10px}.radio-controls button{min-height:26px}}

.gauge-track{overflow:hidden}#equipmentDialog{width:min(620px,92vw);max-height:85dvh;overflow:auto;padding:24px;background:#0f2022;color:#eadbb5;border:2px solid #a48946;font:13px/1.5 'Courier New',monospace}#equipmentDialog::backdrop{background:#07121399}.equipment-actions,.equipment-locations{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}#equipmentDialog button{padding:9px 12px;background:#1b3432;border:1px solid #8f7b41;color:#edd181;font-size:11px}#equipmentDialog details{border-top:1px solid #687353;margin:16px 0;padding-top:12px}#equipmentDialog summary{cursor:pointer}.equipment-locations button{font-size:10px}.map-open #gear{display:none}
/* Compact reference-inspired stack, with live map and station metadata. */
@media(min-width:801px) and (min-height:541px){.mapcard{width:270px;height:365px;flex-direction:column;gap:8px;align-items:stretch}.map-open-button{width:260px;height:260px;align-self:center;border-width:4px}.map-north{font-size:17px;top:10px}.map-key{font-size:10px}.radio-panel{width:270px;padding:11px 14px;border:2px solid #b89543;border-radius:8px}.radio-panel #stationName{font-size:14px}.radio-panel #radioSong{font-size:12px}.radio-panel #radioArtist{font-size:10px}.radio-controls{position:relative;justify-content:center;margin-top:8px}.radio-controls button{width:40px;height:28px}.player-gauges{bottom:422px;width:220px;padding:8px 10px;border:2px solid #b89543;border-radius:5px;font-size:10px}.gauge-track{height:11px}.map-open-button::after{content:'GORILLA CITY 2032';position:absolute;left:18%;right:18%;top:28px;background:#0c171acb;padding:3px;font:9px 'Courier New',monospace;letter-spacing:1px;color:#eddb9e;pointer-events:none}}
.health-gauge .gauge-track i{background:#ed4132}.stamina-gauge .gauge-track i{background:#edbc35}.gauge-track{background:#1c2324;box-shadow:inset 0 0 0 1px #a28b44}.gauge-track i{background-image:repeating-linear-gradient(90deg,transparent 0,transparent calc(20% - 1px),#382910b3 calc(20% - 1px),#382910b3 20%)!important}.health-gauge>span{color:#ff5748}.stamina-gauge>span{color:#f4cd52}
@media(max-width:800px){.title-stage{margin-bottom:105px}.intro-notices{top:calc(82% + 92px)}}
@media(max-height:540px){.title-stage{width:min(100vw,calc((100dvh - 145px)*1.7787234));margin-bottom:115px}.intro-notices{top:calc(81% + 77px)}}
@media(max-width:800px) and (min-height:541px) and (pointer:fine){.status{bottom:255px}.interaction-hint{bottom:308px}footer{display:none}.camera-controls{bottom:8px}}

/* Original weathered compass frame, cached SVG over the live vector map. */
.map-open-button{border-color:transparent;box-shadow:0 4px 14px #0008}.map-open-button::before{content:'';position:absolute;inset:-3px;background:url('assets/ui/minimap-frame.svg') center/100% 100%;pointer-events:none;z-index:2}.map-open-button .map-north{top:19%;font-size:14px}.map-open-button::after{display:none}.radio-controls{justify-content:space-between}.radio-controls button{flex:1;min-width:0}.radio-panel{background-color:#0e1718;box-shadow:inset 0 0 0 1px #e7b84433,0 3px 8px #0005}

.radio-status{font:9px/1.3 'Courier New',monospace;color:#f0cf74;margin-top:4px}.radio-status:empty{display:none}

#venueDialog{width:min(720px,90vw);max-height:80vh;overflow:auto;background:#132627;color:#ede3c7;border:2px solid #c19a43;padding:24px;}#venueDialog::backdrop{background:rgba(8,16,18,.65)}#venueDialog .card-hand{font-size:20px;padding:18px;background:#214b39;line-height:1.8}#places{color:#f4d06e}
/* Touch layout keeps the world visible between separate movement and action pads. */
@media(pointer:coarse){body{overscroll-behavior:none}#world{touch-action:none}.topright button,.radio-controls button,.camera-controls button{min-height:40px}.topright{flex-wrap:wrap;justify-content:flex-end;max-width:calc(100vw - 24px)}#touch{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}#touch .touch-move{order:-1}#touch button{min-width:44px;min-height:44px;padding:10px;margin:2px}.radio-controls{gap:3px}dialog{max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}dialog button{min-height:44px}input{font-size:16px}}
@media(pointer:coarse) and (max-width:600px) and (min-height:541px){header{left:12px;right:12px;top:max(12px,env(safe-area-inset-top));align-items:flex-start}.topright{position:absolute;top:35px;left:0;right:0;padding:0;gap:4px;justify-content:flex-start}.topright button{font-size:9px;padding:8px 9px}.identity strong{font-size:10px}.identity small{font-size:7px}.cash{top:max(14px,env(safe-area-inset-top));right:12px;font-size:19px}.contract{top:106px;width:min(240px,calc(100vw - 135px));padding:11px}.contract h2{font-size:11px}.contract .eyebrow{font-size:8px}#missionDetails{top:9px;right:8px}.mapcard{left:12px;bottom:150px;width:106px;height:auto;flex-direction:column;gap:6px}.map-open-button{width:104px;height:104px}.radio-panel{width:176px;padding:7px 8px}.radio-panel #stationName{font-size:10px}.radio-panel #radioSong{margin-top:4px;font-size:10px}.radio-panel #radioArtist{font-size:8px}.radio-controls{margin-top:5px}.radio-controls button{width:29px;min-height:36px}.player-gauges{left:12px;bottom:364px;width:106px}.gauge>span{width:31px;font-size:7px}.speedcard{right:12px;bottom:155px}.speed>span{font-size:26px}.status{left:62%;bottom:225px;max-width:35vw;font-size:9px}.interaction-hint{bottom:285px;left:63%;max-width:34vw;font-size:10px;padding:8px}.hover-status{bottom:333px;left:63%;max-width:34vw;font-size:9px}.camera-controls{bottom:112px;right:12px}.camera-controls button{padding:6px;min-height:32px}.save-notice{top:92px;right:12px;font-size:9px}.title-stage{width:100%;margin-bottom:124px}.title-stage #playerName{font-size:20px;min-height:30px}.title-stage .appearance-choice img{height:34px}.intro-notices{top:calc(81% + 90px);left:10%;width:80%}.intro-notices #load,.intro-notices #resumeNotice{font-size:10px;line-height:1.4}}
@media(pointer:coarse) and (max-height:540px){header{top:8px;left:12px;right:12px}.topright{padding-top:0;gap:3px;margin-right:120px;max-width:70vw}.topright button{min-height:34px;font-size:8px;padding:6px}.cash{font-size:18px;top:14px}.contract{top:55px;width:215px;padding:11px}.contract h2{font-size:11px}.mapcard{left:12px;bottom:122px;height:82px;width:auto}.map-open-button{height:82px;width:82px}.radio-panel{width:150px;padding:6px}.radio-controls button{min-height:28px;width:25px}.player-gauges{bottom:211px;width:95px}.interaction-hint{bottom:130px;max-width:40vw}.status{bottom:100px;left:65%;max-width:30vw}.speedcard{bottom:120px}.camera-controls{bottom:8px;right:48%;transform:translateX(50%)}.hover-status{bottom:179px}.save-notice{top:49px;max-width:30vw}#touch .touch-actions{grid-template-columns:repeat(3,auto)}#touch button{min-height:42px;padding:8px}}
#saveDialog{width:min(520px,94vw);max-width:520px}#saveDialog p{line-height:1.6}#saveDialog input[hidden],#saveDialog button[hidden]{display:none}

@media(pointer:coarse) and (max-width:600px) and (min-height:541px){.topright{flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:thin;padding-bottom:4px}.topright button{flex:none}.mapcard{align-items:flex-start;top:auto;right:auto}.radio-panel{align-self:flex-start}.camera-controls{bottom:174px}.speedcard{bottom:214px}.status{bottom:230px}}
@media(pointer:coarse) and (max-height:540px){.mapcard{top:auto;right:auto;align-items:flex-start}}

@media(pointer:coarse) and (max-width:600px) and (min-height:541px){.title-stage .intro-appearance{left:10%;width:80%}.title-stage .appearance-choice span{font-size:10px}.title-stage .appearance-label{font-size:9px}.title-stage #introMusic{min-height:44px;font-size:11px}}

#saveDialog{font-family:'Courier New',monospace;border:2px solid #d6ac4f;background:#101f20}#saveDialog button{background:#1f3933;color:#f5dc9b;border:2px solid #b69b4d;padding:12px 15px;font:700 13px 'Courier New',monospace}#saveDialog .equipment-actions{display:flex;flex-wrap:wrap;gap:10px}
@media(pointer:coarse) and (max-width:600px){.topright{scrollbar-width:none}.topright::-webkit-scrollbar{display:none}}

@media(pointer:coarse){.topright button,.radio-controls button,.camera-controls button{min-height:44px}.camera-controls{gap:4px}}
@media(pointer:coarse) and (max-width:600px) and (min-height:541px){.status{bottom:345px;max-height:48px;overflow:hidden;font-size:9px;line-height:1.3;letter-spacing:.5px}.speedcard{bottom:220px}}
/* boot loading bar: sits on the ENTER button until the city is ready, so a slow load never looks frozen */
.load-bar{position:absolute;left:27.6%;top:67.6%;width:44.8%;height:11.2%;min-height:40px;z-index:3;pointer-events:none;overflow:hidden;background:#071417;border:3px solid #e5c16b;box-shadow:0 0 0 3px #071417,0 6px 18px #000a;transition:opacity .45s ease,transform .45s ease}
.load-bar .load-fill{position:absolute;inset:0 auto 0 0;width:0;overflow:hidden;background:#f5c22b;transition:width .25s ease-out}
.load-bar .load-fill::after{content:'';position:absolute;top:0;bottom:0;left:-40px;right:0;background:repeating-linear-gradient(-45deg,#f5c22b 0 14px,#e0a91c 14px 28px);background-size:40px 40px;animation:loadStripes .8s linear infinite;will-change:transform}
.load-bar .load-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.7em;white-space:nowrap;font:700 clamp(11px,1.55vw,24px)/1 'Silkscreen','Courier New',monospace;letter-spacing:.06em;color:#fff6dc;text-shadow:0 2px 0 #071417,2px 0 0 #071417,-2px 0 0 #071417,0 -2px 0 #071417}
.load-bar.indeterminate .load-fill{width:38%}
.load-bar.done{opacity:0;transform:scale(1.04)}
.load-bar.failed{border-color:#ff6a4a}.load-bar.failed .load-fill{background:#5a1610;width:100%}.load-bar.failed .load-fill::after{display:none}
@keyframes loadStripes{to{transform:translateX(40px)}}   /* transform: keeps moving on the compositor while the city builds */
@keyframes loadSweep{from{transform:translateX(-100%)}to{transform:translateX(265%)}}
.load-bar.indeterminate .load-fill{animation:loadSweep 1.6s ease-in-out infinite alternate}
@media (prefers-reduced-motion:reduce){.load-bar .load-fill::after{animation:none}.load-bar.indeterminate .load-fill{animation:none;width:100%;opacity:.35}}

/* cruise picker: three destinations for the self-driving car */
#cruiseDialog{max-width:480px;width:calc(100vw - 32px);padding:22px 22px 18px;border:2px solid #ffd46a66;background:linear-gradient(180deg,#1d2b28,#141d1b);box-shadow:0 18px 60px #000a}
#cruiseDialog h2{margin:0 0 6px;font-size:20px;letter-spacing:.08em;color:#ffd46a}
#cruiseDialog .cruise-sub{margin:0 0 14px;font-size:13px;opacity:.8}
#cruiseDialog .cruise-choices{display:grid;gap:10px}
#cruiseDialog .cruise-choice{display:grid;grid-template-columns:28px 44px 1fr auto;align-items:center;gap:10px;width:100%;min-height:64px;padding:10px 14px;text-align:left;border:1px solid #ffffff2a;border-radius:10px;background:#ffffff0d;color:inherit;font:inherit;cursor:pointer}
#cruiseDialog .cruise-choice:hover,#cruiseDialog .cruise-choice:focus-visible{background:#ffd46a1f;border-color:#ffd46a;outline:none}
#cruiseDialog .cruise-choice:disabled{opacity:.45;cursor:default}
#cruiseDialog .cruise-key{display:grid;place-items:center;width:24px;height:24px;border-radius:6px;background:#ffffff1a;font-size:13px;font-weight:700}
#cruiseDialog .cruise-icon{font-size:30px;line-height:1;text-align:center}
#cruiseDialog .cruise-text{display:flex;flex-direction:column;gap:2px;min-width:0}
#cruiseDialog .cruise-text b{font-size:17px;letter-spacing:.03em}
#cruiseDialog .cruise-text small,#cruiseDialog .cruise-dist small{font-size:12px;opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#cruiseDialog .cruise-dist{display:flex;flex-direction:column;align-items:flex-end;font-weight:700;font-size:15px;color:#ffd46a}
#cruiseDialog .cruise-secondary{display:flex;gap:10px;margin-top:14px}
#cruiseDialog .cruise-secondary button{flex:1;min-height:42px}
#cruiseDialog .cruise-secondary button{background:#ffffff12;color:var(--ink,#f4efe2);border:1px solid #ffffff38;border-radius:8px;font:inherit;font-size:13px;font-weight:700;letter-spacing:.06em;cursor:pointer}
#cruiseDialog .cruise-secondary button:hover,#cruiseDialog .cruise-secondary button:focus-visible{background:#ffd46a24;border-color:#ffd46a;outline:none}

/* GCN 7 Sky Cam: the news chopper's live picture-in-picture and BREAKING NEWS ticker (fictional station) */
#chopperCam{position:fixed;top:72px;right:16px;width:248px;z-index:40;pointer-events:none;font-family:ui-monospace,Menlo,monospace;filter:drop-shadow(0 6px 14px rgba(0,0,0,.5));animation:ccIn .35s ease-out}
#chopperCam[hidden]{display:none}
#chopperCam .cc-frame{position:relative;border:2px solid #f2f4f7;border-radius:4px;overflow:hidden;background:#0b1015}
#chopperCam canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;image-rendering:auto}
#chopperCam .cc-top{position:absolute;left:6px;right:6px;top:5px;display:flex;justify-content:space-between;font-size:10px;font-weight:700;color:#fff;text-shadow:0 1px 2px #000}
#chopperCam .cc-rec{color:#ff4b4b;animation:ccBlink 1s steps(2) infinite}
#chopperCam .cc-corner{position:absolute;right:6px;bottom:4px;font-size:9px;color:#ffe9a8;text-shadow:0 1px 2px #000}
#chopperCam .cc-ticker{display:flex;align-items:stretch;height:20px;margin-top:3px;background:#0d2a5c;border-radius:3px;overflow:hidden;font-size:11px;color:#fff}
#chopperCam .cc-ticker b{flex:none;padding:0 6px;display:flex;align-items:center;background:#d6362f;letter-spacing:.04em}
#chopperCam .cc-track{flex:1;overflow:hidden;white-space:nowrap;display:flex;align-items:center}
#chopperCam .cc-scroll{display:inline-block;padding-left:8px;will-change:transform}
@keyframes ccBlink{50%{opacity:.25}}
@keyframes ccIn{from{opacity:0;transform:translateY(-8px)}}
@media (max-width:950px){#chopperCam{width:168px;top:calc(env(safe-area-inset-top,0px) + 182px);right:8px}#chopperCam .cc-top{font-size:8px}#chopperCam .cc-ticker{height:16px;font-size:9px}}
@media (prefers-reduced-motion:reduce){#chopperCam,#chopperCam .cc-rec{animation:none}}
@media (max-width:950px) and (max-height:540px){#chopperCam{width:150px;top:calc(env(safe-area-inset-top,0px) + 6px);right:auto;left:50%;transform:translateX(-50%);animation:none}}
/* 0.6.4 · "Choose your look": live 3D-rendered characters (look-picker.js) */
.title-stage .appearance-choice .look-canvas{display:block;width:100%;height:58px;image-rendering:pixelated}
.title-stage .appearance-choice{transition:transform .12s ease,background-color .12s ease}
.title-stage .appearance-choice:hover{transform:translateY(-2px);background:#1c3638}
.title-stage .appearance-choice[aria-pressed='true']{box-shadow:inset 0 0 0 1px #d8af49,0 0 12px rgba(241,201,92,.35)}
.title-stage .appearance-choice[aria-pressed='true'] span{color:#f6d77a}
@media(max-width:800px){.title-stage .appearance-choice .look-canvas{height:36px}}
@media(pointer:coarse) and (max-width:600px) and (min-height:541px){.title-stage .appearance-choice .look-canvas{height:38px}}
@media(max-height:540px){.title-stage .appearance-choice .look-canvas{height:30px}}
/* the picked look, large, beside the picker (wide screens only) */
.look-spotlight{display:none}
@media(min-width:900px) and (min-height:600px){
 .title-stage .look-spotlight{display:flex;flex-direction:column;align-items:center;position:absolute;left:74%;top:63%;width:12.5%;bottom:3%;padding:6px 6px 7px;background:linear-gradient(180deg,rgba(16,36,38,.0),rgba(16,36,38,.86) 38%);border-bottom:2px solid #c7a759;border-radius:8px 8px 4px 4px;pointer-events:none}
 .look-spotlight .look-canvas{flex:1;width:100%;min-height:0;image-rendering:pixelated}
 .look-spotlight strong{font:700 15px/1 'Courier New',monospace;letter-spacing:2px;color:#f6d77a;text-shadow:0 2px 0 #000;margin-top:2px}
 .look-spotlight small{font:700 9px/1.2 'Courier New',monospace;color:#cfe3d6;text-align:center;margin-top:3px}
}
@media (prefers-reduced-motion: reduce){.title-stage .appearance-choice{transition:none}.title-stage .appearance-choice:hover{transform:none}}
@media(pointer:coarse) and (max-width:600px) and (min-height:541px){.title-stage .intro-appearance{left:5%;width:90%}.title-stage .appearance-choice span{font-size:9px;letter-spacing:0;max-width:100%;overflow:hidden;white-space:nowrap}}
@media(pointer:coarse) and (max-width:380px) and (min-height:541px){.title-stage .appearance-choice span{font-size:8.5px;letter-spacing:-.03em}}