/* A real, locally cached coastal map. Colours belong to the Shack. */
.trail-photograph{margin:0;min-width:0}
.trail-photograph img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.trail-photograph figcaption{display:flex;justify-content:space-between;gap:12px;font:10px/1.6 Arial,sans-serif;color:#536557;padding-top:9px}
.trail-photograph figcaption a{text-underline-offset:3px}
.trail-explorer{padding:30px;background:var(--cream,#faf7ef);color:var(--ink,#214d3d);min-width:0}
.trail-explorer-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:20px}
.trail-explorer .trail-eyebrow{font:700 10px/1.5 Arial,sans-serif;letter-spacing:.14em;margin:0 0 9px}
.trail-explorer-heading h3{font:32px/1.15 Georgia,serif;letter-spacing:-.025em;margin:0 0 8px}
.trail-explorer-heading p:last-child{font:12px/1.5 Arial,sans-serif;margin:0}
.trail-layer-switch{display:flex;align-self:center;border:1px solid #aebbad;flex-shrink:0}
.trail-layer-switch button{min-height:44px;padding:10px 20px;border:0;border-radius:0;background:transparent;color:#214d3d;font:700 12px Arial,sans-serif;cursor:pointer}
.trail-layer-switch button[aria-pressed=true]{background:#214d3d;color:#faf7ef}
.trail-explorer button:focus-visible,.trail-explorer a:focus-visible,.trail-explorer summary:focus-visible,.trail-explorer input:focus-visible,.trail-map-stage:focus-visible,.trail-map-close:focus-visible{outline:3px solid #ac4828;outline-offset:3px}
.trail-map-stage{height:auto;aspect-ratio:16/9;position:relative;overflow:hidden;background:#bdd2d8;touch-action:pan-y;isolation:isolate;cursor:grab}
.trail-map-stage.is-zoomed{touch-action:none}
.trail-map-stage.is-dragging{cursor:grabbing}
.trail-map-canvas{display:block;width:100%;height:100%;user-select:none}
.trail-route-line,.trail-route-halo{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.trail-route-halo{stroke:#fff9e9;stroke-width:6;stroke-opacity:.95}
.trail-route-line{stroke:#b64b25;stroke-width:3}
.trail-endpoint-circle{fill:#214d3d;stroke:white;stroke-width:2}
.trail-endpoint-letter{fill:white;font:700 11px Arial,sans-serif}
.trail-endpoint-label{fill:#173c2e;stroke:#fffbed;stroke-width:4px;paint-order:stroke;stroke-linejoin:round;font:700 11px Arial,sans-serif}
.trail-position-halo{fill:#fff;fill-opacity:.9}
.trail-position-dot{fill:#214d3d;stroke:#fff;stroke-width:1.5;vector-effect:non-scaling-stroke}
.trail-map-tools{position:absolute;top:14px;right:14px;display:grid;gap:1px;background:#c8cebd;box-shadow:0 1px 8px #122e3026}
.trail-map-tools button{width:44px;height:44px;display:grid;place-items:center;padding:10px;border:0;border-radius:0;background:#fffdf7;color:#214d3d;cursor:pointer}
.trail-map-tools svg{width:22px;height:22px}
.trail-map-tools button:hover{background:#e6ecde}
.trail-map-tools button:disabled{color:#81917d;cursor:default;background:#f1f0e8}
.trail-compass{position:absolute;top:16px;left:17px;color:#fffdf3;filter:drop-shadow(0 1px 2px #183426);font:700 10px Arial,sans-serif;display:grid;justify-items:center;gap:3px;pointer-events:none}
.trail-compass svg{width:19px;height:28px}
.trail-map-stage[data-layer=topo] .trail-compass{color:#214d3d;filter:none}
.trail-map-scale{position:absolute;bottom:14px;left:16px;background:#fffdf3ec;padding:4px 7px;font:10px Arial,sans-serif;color:#214d3d;pointer-events:none}
.trail-map-scale i{display:block;height:5px;border:solid currentColor;border-width:0 1px 2px;margin-top:4px}
.trail-map-route-key{position:absolute;bottom:14px;right:14px;display:flex;align-items:center;gap:6px;padding:7px 9px;background:#fffdf3ed;font:10px Arial,sans-serif;color:#214d3d;pointer-events:none}
.trail-map-route-key i{width:20px;height:3px;background:#b64b25}
.trail-map-caption{display:flex;justify-content:space-between;gap:16px;margin:9px 0 24px}
.trail-map-caption p{font:10px/1.65 Arial,sans-serif;color:#536557;margin:0}
.trail-map-caption p:last-child{flex-shrink:0}
.trail-map-caption a{text-underline-offset:2px}
.trail-elevation{border-top:1px solid #d7dccd;padding-top:22px}
.trail-elevation-heading{display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin-bottom:10px}
.trail-elevation-heading h4{font:23px/1.25 Georgia,serif;letter-spacing:-.02em;margin:0}
.trail-elevation-heading p{font:12px/1.6 Arial,sans-serif;margin:0;display:flex;gap:22px}
.trail-profile-chart{width:100%;min-width:0}
.trail-profile-svg{display:block;width:100%;height:178px;touch-action:pan-y;cursor:crosshair;overflow:visible}
.profile-grid{stroke:#dce0d4;stroke-width:1}
.profile-axis{fill:#536557;font:11px Arial,sans-serif}
.profile-area{fill:#d7e1ca;fill-opacity:.8}
.profile-line{fill:none;stroke:#426646;stroke-width:2;stroke-linejoin:round}
.profile-turnaround{stroke:#8c9d84;stroke-width:1;stroke-dasharray:3 4}
.profile-cursor{stroke:#ac4828;stroke-width:1.3}
.profile-point{fill:#ac4828;stroke:#fffdf3;stroke-width:2}
.trail-profile-readout{display:flex;justify-content:space-between;align-items:center;gap:12px;font:11px/1.5 Arial,sans-serif;margin-top:5px}
.trail-profile-readout label{font-weight:bold}
.trail-profile-readout output{font:700 12px/1.5 Arial,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}
.trail-distance{width:100%;height:44px;padding:0;margin:0;border:0;border-radius:0;box-shadow:none;display:block;accent-color:#214d3d;cursor:ew-resize;background:transparent;touch-action:pan-y}
.trail-distance{-webkit-appearance:none;appearance:none}
.trail-distance::-webkit-slider-runnable-track{height:3px;background:#bbc9b5}
.trail-distance::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#214d3d;border:2px solid #faf7ef;margin-top:-7px;box-shadow:0 0 0 1px #214d3d}
.trail-distance::-moz-range-track{height:3px;background:#bbc9b5}
.trail-distance::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#214d3d;border:2px solid #faf7ef;box-shadow:0 0 0 1px #214d3d}
.trail-profile-hint{font:10px/1.6 Arial,sans-serif;color:#536557;margin:0}
.trail-map-notes{border-bottom:1px solid #d7dccd;margin-top:13px;padding-bottom:3px}
.trail-map-notes summary{font:11px/1.5 Arial,sans-serif;cursor:pointer;min-height:44px;align-content:center;padding:12px 0}
.trail-map-notes p{font:12px/1.75 Arial,sans-serif;margin:0 0 12px;max-width:760px}
.trail-map-notes p:last-child{display:flex;flex-wrap:wrap;gap:10px 28px}
.trail-map-notes a{text-underline-offset:3px}
.trail-map-unavailable{padding:24px;font-size:13px}
dialog.trail-map-dialog{width:min(1250px,96vw);max-width:96vw;max-height:96dvh;margin:auto;padding:0;border:0;color:#214d3d;background:#faf7ef;overflow:auto;overscroll-behavior:contain}
dialog.trail-map-dialog::backdrop{background:#112b26d9}
.trail-map-dialog .trail-explorer{padding:22px 30px 26px}
.trail-map-dialog .trail-map-stage{height:auto;aspect-ratio:16/9}
.trail-map-close{position:sticky;top:0;display:block;margin:0 0 0 auto;z-index:3;padding:12px 22px;min-height:44px;border:0;background:#214d3d;color:#faf7ef;font:700 12px Arial,sans-serif;cursor:pointer}
@media(max-width:800px){
 .trail-photograph img{aspect-ratio:4/3}
 .trail-photograph figcaption{font-size:9px}
 .trail-explorer{padding:25px 20px}
 .trail-explorer-heading{display:block;margin-bottom:16px}
 .trail-explorer-heading h3{font-size:29px}
 .trail-explorer-heading p:last-child{font-size:11px}
 .trail-layer-switch{width:fit-content;margin-top:17px}
 .trail-layer-switch button{min-width:82px}
 .trail-map-stage{height:430px;aspect-ratio:auto}
 .trail-map-tools{right:10px;top:10px}
 .trail-map-tools button{width:44px;height:44px}
 .trail-compass{left:12px;top:12px}
 .trail-map-caption{display:block;margin-bottom:19px}
 .trail-map-caption p{font-size:10px}
 .trail-map-caption p:last-child{margin-top:4px}
 .trail-map-route-key{font-size:9px;right:10px;bottom:10px;padding:6px}
 .trail-map-scale{bottom:10px;left:10px}
 .trail-elevation-heading{display:block;margin-bottom:10px}
 .trail-elevation-heading p{font-size:11px;margin-top:9px;gap:20px}
 .trail-profile-readout{font-size:10px}
 .trail-profile-readout output{font-size:11px}
 .trail-map-dialog .trail-explorer{padding:18px 16px}
 dialog.trail-map-dialog{width:100vw;max-width:100vw;max-height:100dvh;height:100dvh}
 .trail-map-dialog .trail-map-stage{height:55dvh;min-height:320px;aspect-ratio:auto}
}
@media(max-width:360px){.trail-explorer{padding-left:16px;padding-right:16px}.trail-explorer-heading h3{font-size:27px}.trail-map-route-key{font-size:8px;gap:4px}.trail-map-route-key i{width:12px}.trail-map-stage{height:400px}}
