#open-city-map{position:fixed;right:18px;bottom:246px;z-index:15;display:flex;align-items:center;gap:8px;border:1px solid #d8ecd54d;border-radius:14px;padding:10px 14px;background:#173932df;color:#f1f4df;backdrop-filter:blur(18px);font:600 13px inherit;min-height:46px;cursor:pointer}#open-city-map svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6}#open-city-map[hidden]{display:none}.dialog-open #open-city-map{visibility:hidden}.city-map-dialog{box-sizing:border-box;width:min(1120px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:24px;border:1px solid #b9d6bc66;border-radius:26px;background:#183b35f2;color:#f6f1de;box-shadow:0 30px 120px #0008;backdrop-filter:blur(28px);font-family:inherit}.city-map-dialog::backdrop{background:#061915ab;backdrop-filter:blur(8px)}.city-map-dialog header{display:flex;align-items:center;justify-content:space-between;gap:18px}.city-map-dialog header small{letter-spacing:.2em;font-size:10px;color:#b6cdb6}.city-map-dialog h2{font:500 clamp(22px,3vw,35px) Georgia,serif;margin:8px 0 20px}.city-map-dialog button{font:inherit;cursor:pointer;color:inherit}.city-map-dialog header button{border:1px solid #a8c3ae77;border-radius:24px;padding:12px 18px;background:#ffffff0d;min-height:46px}.city-map-body{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:20px}.city-map-body canvas{width:100%;height:420px;min-width:0;border-radius:18px;border:1px solid #aac7ad33}.city-map-body nav{display:grid;gap:5px;max-height:420px;overflow:auto}.city-map-body nav button{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid transparent;border-radius:13px;padding:10px;background:#ffffff06}.city-map-body nav button:hover,.city-map-body nav button[aria-pressed=true]{background:#d2bd8122;border-color:#dbcfa277}.city-map-body nav b{font-size:22px;width:28px;text-align:center;color:#e4d4a5}.city-map-body nav strong{display:block;font-size:13px}.city-map-body nav small{display:block;font-size:11px;line-height:1.35;color:#b9cfbf;margin-top:3px}.city-map-dialog footer{padding-top:14px;font-size:11px;color:#b9ccbc}.city-map-dialog footer span{margin-right:18px}.city-map-dialog footer p{margin-bottom:0;color:#f0dfb7}@media(max-width:700px){#open-city-map{right:12px;bottom:252px;padding:9px;min-width:46px}#open-city-map span{display:none}.city-map-dialog{padding:18px;width:calc(100vw - 16px);max-height:calc(100dvh - 20px);border-radius:20px}.city-map-body{display:flex;flex-direction:column;gap:10px}.city-map-body canvas{height:280px;flex-shrink:0}.city-map-body nav{max-height:175px;grid-template-columns:1fr 1fr}.city-map-body nav button{padding:8px}.city-map-body nav small{font-size:10px}.city-map-dialog h2{margin-bottom:16px}.city-map-dialog header button{font-size:11px;padding:9px}.city-map-dialog footer span{margin-right:8px}}@media(max-height:550px){#open-city-map{bottom:18px;right:220px}.city-map-body canvas{height:250px}.city-map-body nav{max-height:250px}.city-map-dialog{padding:14px}.city-map-dialog h2{margin-bottom:10px}}

.city-navigation{position:fixed;top:140px;left:18px;z-index:14;display:flex;gap:12px;align-items:center;width:260px;box-sizing:border-box;padding:12px 14px;border:1px solid #d0e0bb44;border-radius:18px;background:#244f43ef;color:#f6f2df;backdrop-filter:blur(22px)}.city-navigation[hidden]{display:none}.city-navigation>b{font-size:30px;color:#efca88}.city-navigation strong{display:block;font-size:13px}.city-navigation small{display:block;font-size:10px;line-height:1.5;color:#c2d4bd}.city-navigation button{border:0;background:none;color:inherit;font-size:23px;margin-left:auto;cursor:pointer;min-width:28px;min-height:38px}.dialog-open .city-navigation{visibility:hidden}@media(max-width:700px){.city-navigation{top:202px;left:12px;width:220px;padding:9px 11px}}@media(max-height:550px){.city-navigation{top:115px;left:12px;width:235px}}
.area-arrival{position:fixed;left:50%;top:28%;transform:translateX(-50%);width:min(640px,80vw);z-index:10;pointer-events:none;text-align:center;opacity:0;color:#fff7da;text-shadow:0 2px 20px #142b27,0 1px 2px #15251c}.area-arrival strong{display:block;font-family:Georgia,serif;font-variant:small-caps;font-weight:500;font-size:clamp(28px,4.5vw,56px);letter-spacing:.025em;line-height:1.1;padding-bottom:13px;border-bottom:1px solid #fff6cfaa}.area-arrival span{display:block;margin-top:10px;text-align:right;font-size:11px;letter-spacing:.18em}.dialog-open .area-arrival{visibility:hidden}

/* The map action has its own space beside the minimap; navigation replaces the existing route card. */
@media(min-width:701px) and (min-height:551px){#open-city-map{bottom:24px;right:164px}}
@media(max-width:700px){#open-city-map{bottom:270px;right:12px}}
#topbar .city-navigation{position:static;inset:auto;flex:1;min-width:0;width:auto;max-width:100%;margin:0;border-radius:14px;padding:10px 14px;z-index:auto}#topbar .city-navigation strong{font-size:15px}#topbar .city-navigation small{font-size:10px}#topbar .city-navigation button{flex-shrink:0}#topbar #instr[hidden]{display:none}