:root{--night:#1d2333;--ink:#161b28;--sand:#ead9b0;--sand-lit:#f7ebcd;--sand-shade:#b39a66;--flamboyan:#ff6a3d;--strip:#161b28d9;--art:2px;--space-1:4px;--space-2:8px;--space-3:12px;--gutter:var(--space-3);--target:36px;--compass:104px;--type-title:"Futura", "Century Gothic", "Avenir Next", system-ui, sans-serif;--type-text:system-ui, -apple-system, "Segoe UI", sans-serif;--step-small:.75rem;--step-body:.875rem;--step-lead:1.125rem;--step-display:1.5rem;--edge:0 var(--art) 0 var(--ink), var(--art) 0 0 var(--ink), 0 calc(-1 * var(--art)) 0 var(--ink), calc(-1 * var(--art)) 0 0 var(--ink), var(--art) var(--art) 0 var(--ink);--ring:0 0 0 calc(3 * var(--art)) var(--ink);--reveal:opacity .15s ease-out}@media (pointer:coarse){:root{--target:44px}}html,body{background:var(--night);overscroll-behavior:none;height:100%;margin:0;overflow:hidden}#map{image-rendering:pixelated;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;display:block}#map.dragging{cursor:grabbing}#weather{image-rendering:pixelated;pointer-events:none;position:fixed;top:0;left:0}#weather.overcast{background:color-mix(in srgb, var(--ink) 16%, transparent)}#map:focus-visible{outline:none}body:has(#map:focus-visible) #centre-mark{fill:var(--flamboyan)}.unseen{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.frame{color:var(--sand);font:var(--step-body) / 1.35 var(--type-text);text-shadow:var(--edge);position:fixed}.strip{border-radius:var(--art);corner-shape:notch;background:var(--strip);font-size:var(--step-small);text-shadow:none;padding:2px 6px}:is(.frame,.layers-panel) :focus-visible{outline:var(--art) solid var(--flamboyan);outline-offset:var(--art);box-shadow:var(--ring)}.title{top:max(var(--gutter), env(safe-area-inset-top));left:max(var(--gutter), env(safe-area-inset-left));max-width:min(26rem, 100vw - 3 * var(--gutter) - var(--compass));pointer-events:none;text-shadow:var(--edge)}.title h1{font:700 var(--step-display) / 1 var(--type-title);letter-spacing:.01em;margin:0}.title p{margin:var(--space-1) 0 0;font:500 var(--step-body) / 1 var(--type-title);letter-spacing:.04em}.tile{width:var(--target);height:var(--target);padding:0 0 var(--art);border-radius:var(--art);corner-shape:notch;background:var(--sand);box-shadow:inset 0 calc(-2 * var(--art)) 0 var(--sand-shade);color:var(--ink);cursor:pointer;border:0;flex:none;place-items:center;display:grid}.tile:focus-visible{box-shadow:inset 0 calc(-2 * var(--art)) 0 var(--sand-shade), var(--ring)}.tile svg{fill:currentColor;shape-rendering:crispedges;width:22px;height:22px}.tile:hover{background:var(--sand-lit)}.tile:active{padding:var(--art) 0 0;box-shadow:inset 0 calc(-1 * var(--art)) 0 var(--sand-shade)}.heading{top:max(var(--gutter), env(safe-area-inset-top));right:max(var(--gutter), env(safe-area-inset-right));justify-content:space-between;gap:var(--space-1);grid-template:"rose rose""left right"/auto auto;display:grid}#turn-left{grid-area:left}#turn-right{grid-area:right;justify-self:end}@media (hover:hover){.heading .tile{opacity:0;transition:var(--reveal)}.heading:is(:hover,:focus-within) .tile{opacity:1}}#compass{cursor:pointer;background:0 0;border:0;border-radius:50%;grid-area:rose;padding:0;display:block}#compass-rose{width:var(--compass);height:var(--compass);display:block}#compass-rose .rim,#compass-rose .pivot{fill:var(--ink)}#compass-rose .face{fill:#232b40}#compass-rose .ring,#compass-rose .tick,#compass-rose .letter,#compass-rose .south{fill:var(--sand)}#compass-rose .north{fill:var(--flamboyan)}#compass:hover #compass-rose .ring{fill:var(--sand-lit)}.foot{right:max(var(--gutter), env(safe-area-inset-right));bottom:max(var(--gutter), env(safe-area-inset-bottom));left:max(var(--gutter), env(safe-area-inset-left));align-items:flex-end;gap:var(--space-3);pointer-events:none;flex-wrap:wrap;display:flex}.foot>*{pointer-events:auto}.tools{justify-items:end;gap:var(--space-3);flex:none;margin-left:auto;display:grid;position:relative}.hint{right:0;bottom:calc(100% + var(--space-2));box-sizing:border-box;text-align:right;text-wrap:balance;opacity:0;width:max-content;max-width:100%;transition:var(--reveal);margin:0;animation:8s paused on-arrival;position:absolute}body:has(#map[data-complete]) .hint{animation-play-state:running}.tools:has(.scale:is(:hover,:focus-within)) .hint{opacity:1}body:has(.layers-panel:popover-open) .hint{visibility:hidden}@keyframes on-arrival{0%{opacity:0}3%,88%{opacity:1}to{opacity:0}}.hint kbd{font:600 var(--step-small) / 1 var(--type-text)}@media (pointer:coarse),(width<=720px){.hint{display:none}}.zoom{align-items:flex-end;gap:var(--space-2);display:flex}.zoom-buttons{gap:var(--space-1);display:grid}.reading{width:calc(var(--scale-bar-max) + var(--space-2) + 3.5rem);font-variant-numeric:tabular-nums;justify-content:flex-end;display:flex}.bar{align-items:center;gap:var(--space-2);display:flex}#scale-bar{height:var(--art);border:var(--art) solid var(--sand);border-top:0;display:inline-block}.credits{flex:1 1 var(--target);align-items:flex-end;gap:var(--space-2);min-width:0;display:flex}.credits ul{margin:0;list-style:none}.credits-panel ul{padding:0}.credits a{color:inherit;text-underline-offset:2px}#credits-button{anchor-name:--credits}#credits-line{gap:0 var(--space-3);flex-wrap:wrap;min-width:0;transition:opacity .6s ease-out,visibility 0s .6s;display:flex}.credits.folded #credits-line{opacity:0;visibility:hidden}@media (prefers-reduced-motion:reduce){#credits-line{transition:none}}@media (width<=719.98px){#credits-line{display:none}}.credits-panel{box-sizing:border-box;max-width:min(100vw - 2 * var(--gutter), 30rem);padding:var(--space-2) var(--space-3);border-radius:var(--art);corner-shape:notch;background:var(--ink);color:var(--sand);font:var(--step-small) / 1.5 var(--type-text);border:0}@supports (position-area:block-start){.credits-panel{position-anchor:--credits;position-area:block-start span-inline-end;margin:0 0 var(--space-2);inset:auto}}@supports not (position-area:block-start){.credits-panel{inset:auto auto calc(max(var(--gutter), env(safe-area-inset-bottom)) + var(--target) + var(--space-2)) max(var(--gutter), env(safe-area-inset-left));margin:0}}.where{margin-top:var(--space-3)}.title .place{margin:0 0 var(--space-1);font:600 var(--step-lead) / 1.2 var(--type-title);text-wrap:balance}.title .barrio{min-height:1lh;font-family:var(--type-title);letter-spacing:.02em;margin:0;line-height:1.2}.link{margin:var(--space-2) 0 0 -6px;justify-content:start;display:grid}.link>*,.coordinates>*{grid-area:1/1}.coordinates{border-radius:var(--art);corner-shape:notch;min-block-size:24px;color:inherit;font:var(--step-body) / 1.35 var(--type-text);font-variant-numeric:tabular-nums;text-align:left;text-shadow:inherit;pointer-events:auto;cursor:pointer;background:0 0;border:0;align-items:center;padding:2px 6px;display:grid}@media (pointer:coarse){.coordinates{min-block-size:var(--target)}}.coordinates:has(#centre-coordinates:empty){display:none}.coordinates>*{transition:var(--reveal)}.coordinates .action,.coordinates:is(:hover,:focus-visible) #centre-coordinates{opacity:0}.link:has(.copied:not(:empty)) .coordinates>*{opacity:0}.coordinates:is(:hover,:focus-visible){background:var(--strip);text-shadow:none}.coordinates:is(:hover,:focus-visible) .action{opacity:1}.link:has(.copied:not(:empty)) .coordinates .action{opacity:0}.copied{font-size:inherit;pointer-events:none;place-self:stretch stretch;align-items:center;display:flex}.copied:empty{opacity:0}.title .weather{width:fit-content;min-height:1lh;margin:var(--space-1) 0 0 -6px;font-variant-numeric:tabular-nums}.title .weather:has(#weather-reading:empty){visibility:hidden}.title .weather a{margin-left:var(--space-2);color:inherit;text-underline-offset:2px;pointer-events:auto}@media (width<=359.98px) and (height<=539.98px){.title .weather{display:none}}#layers-button{anchor-name:--layers}body:has(.layers-panel:popover-open) #layers-button{padding:var(--art) 0 0;box-shadow:inset 0 calc(-1 * var(--art)) 0 var(--sand-shade)}.layers-panel{box-sizing:border-box;max-width:calc(100vw - 2 * var(--gutter));padding:var(--space-2) var(--space-3);border-radius:var(--art);corner-shape:notch;background:var(--ink);color:var(--sand);font:var(--step-body) / 1.35 var(--type-text);border:0}.layers-panel:popover-open{gap:var(--space-2) calc(2 * var(--space-3));flex-wrap:wrap;display:flex}@supports (position-area:block-start){.layers-panel{position-anchor:--layers;position-area:inline-start span-block-start;margin:0 var(--space-2) 0 0;inset:auto}}@supports not (position-area:block-start){.layers-panel{inset:auto max(var(--gutter), env(safe-area-inset-right)) calc(max(var(--gutter), env(safe-area-inset-bottom)) + 3 * (var(--target) + var(--art)) + var(--space-1) + var(--space-3) + var(--space-2)) auto;margin:0}}.layers-panel fieldset{border:0;min-inline-size:0;margin:0;padding:0}.layers-panel legend{margin-bottom:var(--space-1);font:600 var(--step-body) / 1.35 var(--type-title);padding:0}.layers-panel ul{margin:0;padding:0;list-style:none;display:grid}.layers-panel .columns{column-gap:var(--space-3);grid-template-columns:repeat(2,auto)}.layers-panel label{align-items:center;gap:var(--space-2);cursor:pointer;min-block-size:28px;display:flex}@media (pointer:coarse){.layers-panel label{min-block-size:var(--target)}}.layers-panel input{accent-color:var(--sand);margin:0}#centre-mark{left:round(down, 50%, var(--art));top:round(down, 50%, var(--art));width:calc(7 * var(--art));height:calc(7 * var(--art));translate:calc(-3 * var(--art)) calc(-3 * var(--art));fill:var(--sand);shape-rendering:crispedges;pointer-events:none;filter:drop-shadow(var(--art) 0 0 var(--ink)) drop-shadow(calc(-1 * var(--art)) 0 0 var(--ink)) drop-shadow(0 var(--art) 0 var(--ink)) drop-shadow(0 calc(-1 * var(--art)) 0 var(--ink));position:fixed}.pins{pointer-events:none;margin:0;padding:0;list-style:none;position:absolute;inset:0;overflow:hidden}.pin:is(:hover,:focus-visible,.open):not(.dismissed){z-index:1}.pin{width:calc(10 * var(--art));height:calc(12 * var(--art));color:var(--sand);pointer-events:auto;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:none;display:block;position:absolute;top:0;left:0}.pin[hidden]{display:none}.pin:before{content:"";position:absolute;inset:-4px -6px}@media (pointer:coarse){.pin:before{inset:-10px -12px}}.pin svg{shape-rendering:crispedges;width:100%;height:100%;display:block}.pin .outline{fill:var(--ink)}.pin .pole{fill:var(--sand)}.pin .cloth{fill:var(--flamboyan)}.pin:is(:hover,:focus-visible,.open) .cloth{fill:var(--sand-lit)}.pin:focus-visible{outline:var(--art) solid var(--flamboyan);outline-offset:var(--art);box-shadow:var(--ring)}.plate{top:calc(-1 * var(--art));left:calc(11 * var(--art));padding:var(--space-1) var(--space-2);border-left:calc(2 * var(--art)) solid var(--flamboyan);background:var(--strip);width:max-content;max-width:var(--plate-room);box-sizing:border-box;font:var(--step-small) / 1.2 var(--type-text);text-align:left;flex-direction:column;gap:2px;display:none;position:absolute}.plate strong{font:600 var(--step-body) / 1.2 var(--type-title)}.plate small{font-size:inherit;text-underline-offset:2px;text-decoration:underline}.pin:is(:hover,:focus-visible,.open):not(.dismissed) .plate{display:flex}.pin.flip .plate{right:calc(11 * var(--art));border-right:calc(2 * var(--art)) solid var(--flamboyan);text-align:right;border-left:0;left:auto}