/* Map drawings: colors and classes from the planning maps */
.mapscope {
  --asphalt: #16191a; --sheet: #241b28; --sheet-2: #2e2333; --line: #44354a;
  --chalk: #efe6dc; --dim: #b3a5a9; --hazard: #f4b23b; --ink: #140f17;
  --go: #6cc56f; --stop: #e2604f; --maybe: #7fb4e8;
}
.mapbox { overflow-x: auto }
.mapbox svg { display: block; width: 100%; min-width: 680px; height: auto; border-radius: 4px; background: var(--sheet-2) }
.mapbox text { font-family: var(--body); fill: var(--chalk) }
.mapbox .zl { font-family: var(--display); font-size: 15px }
.mapbox .sub { font: 500 10px var(--mono); fill: var(--dim) }
.mapbox .poi { font-size: 12px; fill: var(--dim) }
.mapbox .poi.b { fill: var(--chalk); font-weight: 700 }
.legend { display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--dim); font-size: 12.5px }
.legend span { display: inline-flex; align-items: center; gap: 6px }
.legend i { width: 10px; height: 10px; border-radius: 50%; display: inline-block }
.legend i.dash { width: 18px; height: 0; border-radius: 0; border-top: 2px dashed var(--hazard) }
.legend i.line { width: 18px; height: 0; border-radius: 0; border-top: 2px solid var(--chalk) }
.subnav { display: flex; flex-wrap: wrap; gap: 6px }
.subnav button { font: 600 13px/1 var(--body); color: var(--chalk); background: var(--sheet-2); border: 1px solid var(--line); border-radius: 99px; padding: 7px 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px }
.subnav button i { width: 8px; height: 8px; border-radius: 50%; background: var(--c, var(--dim)) }
.subnav button[aria-pressed="true"] { border-color: var(--c, var(--hazard)); background: color-mix(in srgb, var(--c, var(--hazard)) 18%, var(--sheet-2)) }
.subnav button:focus-visible { outline: 2px solid var(--hazard); outline-offset: 2px }
.submap svg { display: block; width: 100%; min-width: 560px; height: auto }
.submap .cell { fill: var(--sheet-2); stroke: var(--line) }
.submap .cell.res { fill: color-mix(in srgb, var(--c) 20%, var(--sheet-2)); stroke: var(--c) }
.submap .cell.mini { fill: color-mix(in srgb, var(--stop) 14%, var(--sheet-2)); stroke: var(--stop); stroke-dasharray: 5 4 }
.submap .cell.boss { fill: color-mix(in srgb, var(--stop) 28%, var(--sheet-2)); stroke: var(--stop); stroke-width: 2 }
.submap .cell.locked { fill: var(--sheet); stroke: var(--line); stroke-dasharray: 4 4 }
.submap .path { fill: none; stroke: var(--hazard); stroke-width: 3; stroke-opacity: .35; stroke-dasharray: 2 8; stroke-linecap: round }
.submap .num { font: 400 15px var(--display); fill: var(--c) }
.submap .nm { font: 700 12.5px var(--body); fill: var(--chalk) }
.submap .nt { font: 400 11.5px var(--body); fill: var(--dim) }
.submap .nt.hot { fill: var(--chalk) }
.submap .nt.red { fill: var(--stop); font-weight: 700 }
.submap .tag { font: 500 9.5px var(--mono); letter-spacing: .06em; fill: var(--ink) }
.submap .tagbg { fill: var(--hazard) }
.submap .tagbg.in { fill: var(--chalk) }
.submap svg { min-width: 700px }
.submap polyline.road { fill: none; stroke: var(--line); stroke-width: 26; stroke-linejoin: round; stroke-linecap: round }
.submap rect.road { fill: var(--line) }
.submap .roadline { fill: none; stroke: var(--hazard); stroke-opacity: .5; stroke-width: 2; stroke-dasharray: 8 8 }
.submap .street { stroke: var(--line); stroke-width: 10 }
.submap .bld { fill: var(--chalk); fill-opacity: .55 }
.submap .gatebar { fill: var(--chalk) }
.submap .gatebar.submap .gate-t { font: 500 10px var(--mono); letter-spacing: .08em; fill: var(--hazard) }
.submap .gate-k { font: 600 12px var(--body); fill: var(--chalk) }
.submap .zone { cursor: pointer; outline: none }
.submap .zone:hover .cell, .submap .zone:focus-visible .cell { stroke: var(--hazard); stroke-width: 2.5 }
.submap .cell.sel { stroke: var(--hazard) !important; stroke-width: 3.5 !important }
.submap svg rect:not(.cell):not(.lot), .submap svg text, .submap svg circle, .submap svg line, .submap svg polyline { pointer-events: none }
.submap svg { min-width: 760px }
.submap .ground { fill: var(--sheet) }
.submap .cell { fill: color-mix(in srgb, var(--c) 6%, var(--sheet)); stroke: none }
.submap .cell.res { fill: color-mix(in srgb, var(--go) 16%, var(--sheet)) }
.submap .cell.mini { fill: color-mix(in srgb, var(--stop) 10%, var(--sheet)); stroke: none }
.submap .cell.boss { fill: color-mix(in srgb, var(--stop) 22%, var(--sheet)); stroke: none }
.submap .cell.locked { fill: var(--sheet-2); stroke: none }
.submap .zone:hover .cell, .submap .zone:focus-visible .cell, .submap .zone:hover .lot, .submap .zone:focus-visible .lot { stroke: var(--hazard); stroke-width: 3 }
.submap .cell.sel, .submap .lot.sel { stroke: var(--hazard) !important; stroke-width: 4 !important }
.submap polyline.road { stroke-width: 12 }
.submap .wall { fill: none; stroke: var(--chalk); stroke-opacity: .7; stroke-width: 4 }
.submap .fence { stroke: var(--dim); stroke-opacity: .7; stroke-width: 2; stroke-dasharray: 6 5 }
.submap .gate { fill: var(--hazard); stroke: var(--ink); stroke-width: 1.5 }
.submap .gate.big { fill: var(--chalk) }
.submap .gate.big.submap .gate-c { font: 600 12px var(--mono); fill: var(--hazard) }
.submap .gate-t { font: 500 12px var(--mono) }
.submap .gate-k { font: 600 14px var(--body) }
.submap .bld { fill: var(--chalk); fill-opacity: .8; stroke: var(--ink); stroke-width: 1 }
.submap .bld.outdoor { fill: none; stroke: var(--chalk); stroke-dasharray: 4 3; stroke-opacity: .7 }
.submap .bld.landmark { fill: var(--stop); fill-opacity: .55 }
.submap .bld.cave { fill: var(--ink); stroke: var(--dim) }
.submap .bld.locked { fill: var(--dim); fill-opacity: .45; stroke-dasharray: 4 3 }
.submap .bl { font: 600 11px var(--body); fill: var(--chalk) }
.submap .bl.hot { fill: var(--go) }
.submap .zt-n { font: 400 14px var(--display); fill: var(--c) }
.submap .zt-c { font: 500 11px var(--mono); fill: var(--dim) }
.submap .nest { fill: var(--stop); stroke: var(--ink); stroke-width: 2 }
.submap .pad { fill: var(--hazard); stroke: var(--ink); stroke-width: 1.5 }
.submap .pad-t { font: 700 11px var(--body); fill: var(--ink) }
.submap .decor.tree { fill: var(--go); fill-opacity: .35 }
.submap .decor.bush { fill: var(--go); fill-opacity: .22 }
.submap .decor.barrel { fill: var(--hazard); fill-opacity: .3 }
.submap .decor.rock { fill: var(--chalk); fill-opacity: .22 }
.submap .decor.fog { fill: var(--stop); fill-opacity: .14 }
.submap .dim { stroke: var(--dim); stroke-width: 1.5 }
.submap .dim-t { font: 500 12px var(--mono); fill: var(--dim) }
.submap .sb { fill: var(--chalk) }
.submap .sb.alt { fill: var(--dim) }
.submap .asphalt { fill: var(--line) }
.submap .lot { fill: var(--sheet); stroke: var(--sheet-2) }
.submap .lot.locked { fill: color-mix(in srgb, var(--sheet) 70%, var(--asphalt)) }
.submap .lot.free { fill: none; stroke: var(--dim); stroke-dasharray: 5 4 }
.submap .plaza { fill: color-mix(in srgb, var(--hazard) 12%, var(--sheet)); stroke: var(--hazard); stroke-opacity: .5; stroke-dasharray: 4 3 }
.submap .runway { fill: var(--ink); stroke: var(--chalk); stroke-opacity: .5 }
.submap .block { fill: var(--sheet-2); stroke: var(--line) }
.submap .block.mine { fill: var(--sheet) }
.wm { min-width: 760px !important; background: #0f1d26 !important }
.wm-sea { fill: #10222d }
.wm-wave { fill: none; stroke: #2a4a5c; stroke-width: 1.2; opacity: .55 }
.wm-shore { fill: none; stroke: #3d6a80; stroke-width: 10; opacity: .35 }
.wm-landf { fill: #26302a }
.wm-coast { fill: none; stroke: #c9b98a; stroke-width: 2; opacity: .55 }
.wm-reg { fill-opacity: .13 }
.wm-reg.hub { fill: var(--hazard); fill-opacity: .2 }
.wm-reg.home { fill-opacity: .2 }
.wm-border { fill: none; stroke: var(--asphalt); stroke-width: 3; stroke-dasharray: 2 5; stroke-linecap: round; opacity: .9 }
.wm-river { fill: none; stroke: #4a8fb3; stroke-width: 7; stroke-linecap: round }
.wm-isle { fill: #2a2d24 }
.wm-isle-c { fill: var(--stop); fill-opacity: .14; stroke: #c9b98a; stroke-width: 2; stroke-opacity: .55 }
.wm-tree { fill: #3f6b3c; stroke: #2b4a2a }
.wm-field rect { fill: #6b6a3a; opacity: .7 }
.wm-field path { stroke: #4a4a28; stroke-width: 2 }
.wm-barn { fill: #9c4b3c }
.wm-house { fill: #5d7d9c; stroke: #1b2a36 }
.wm-house.own { fill: var(--hazard); stroke: var(--ink) }
.wm-mall { fill: #4f6c88; stroke: #1b2a36 }
.wm-fac rect, .wm-fac path { fill: #7a6b3c; stroke: #3a3220 }
.wm-pylon { stroke: #8c8263; stroke-width: 1.5; stroke-dasharray: 3 3 }
.wm-smoke { fill: #8a8f8a; opacity: .35 }
.wm-mtn { fill: #5b6466; stroke: #3a4243 }
.wm-snow { fill: #e6ebe8 }
.wm-goo { fill: #8ccf3c; opacity: .55 }
.wm-tank circle, .wm-tank rect { fill: #6d6f68; stroke: #3d3f3a }
.wm-town rect { fill: #5a5f55; stroke: #2a2e28 }
.wm-runway { fill: #3a3e3d; stroke: #8e9592 }
.wm-rwy-c { stroke: var(--chalk); stroke-dasharray: 5 4; opacity: .7 }
.wm-mkt { fill: var(--hazard) }
.wm-pad { fill: var(--hazard); stroke: var(--ink); stroke-width: 2 }
.wm-plots rect { fill: none; stroke: var(--go); stroke-opacity: .55; stroke-dasharray: 3 2 }
.wm-plots rect.own { fill: var(--go); fill-opacity: .18; stroke-dasharray: none }
.mapbox .wm-t { font: 700 8.5px var(--mono); fill: var(--ink) }
.mapbox .wm-poi { font-size: 11.5px; fill: var(--dim) }
.mapbox .wm-name { font: 400 15px var(--display); paint-order: stroke; stroke: #16191a; stroke-width: 3px }
.mapbox .wm-name.hubn { fill: var(--hazard) }
.mapbox .wm-name.homen { fill: var(--go) }
.mapbox .wm-sub { font: 500 9.5px var(--mono); fill: var(--chalk); opacity: .7; letter-spacing: .04em }
.wm-gate rect { fill: var(--ink); stroke: var(--line) }
.mapbox .wm-gate text { font: 700 9px var(--mono); fill: var(--hazard); letter-spacing: .03em }
.wm-tp { fill: var(--hazard); stroke: var(--ink); stroke-width: 1.5 }
.wm-taxi { fill: none; stroke: var(--hazard); stroke-width: 2; stroke-dasharray: 6 5; opacity: .55 }
.wm-plane { fill: none; stroke: var(--chalk); stroke-width: 2; opacity: .8 }
.wm-ahd { fill: var(--chalk) }
.wm-trail polyline { fill: none; stroke: var(--chalk); stroke-width: 2; opacity: .35 }
.wm-z circle { fill: var(--sheet); stroke: var(--chalk); stroke-width: 1.5 }
.mapbox .wm-z text { font: 700 9px var(--mono); fill: var(--chalk) }
.wm-z.mini circle { stroke: #f08a3c; stroke-width: 2.5 }
.wm-z.boss circle { fill: var(--stop); stroke: var(--stop) }
.mapbox .wm-z.boss text { fill: var(--ink) }
.wm-lock rect { fill: var(--hazard) }
.mapbox .wm-lock text { font: 700 8px var(--mono); fill: var(--ink) }
.wm-start path { stroke: var(--go); stroke-width: 2 }
.mapbox .wm-start text { font: 700 10px var(--mono); fill: var(--go) }
.wm-comp circle { fill: var(--sheet); stroke: var(--line) }
.wm-comp path { fill: var(--dim) }
.wm-comp path.n { fill: var(--stop) }
.mapbox .wm-comp text { font: 700 10px var(--mono); fill: var(--chalk) }
.legend i.wz { width: 12px; height: 12px; background: var(--sheet); border: 1.5px solid var(--chalk) }
.legend i.wz.mini { border: 2.5px solid #f08a3c }
.legend i.wz.boss { background: var(--stop); border-color: var(--stop) }
.legend i.wlk { width: auto; height: auto; border-radius: 6px; background: var(--hazard); color: var(--ink); font: 700 8px/1 var(--mono); font-style: normal; padding: 3px 5px }
.submap .zone, .submap .zone * { cursor: default }
.mapscope .mapbox { border-radius: 6px; border: 1px solid var(--line) }
.mapscope .mapbox svg { border-radius: 0 }