.map{isolation:isolate;background:var(--surface-2);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:grab;outline:none;position:relative;overflow:hidden}.map:active{cursor:grabbing}.map:focus-visible{box-shadow:inset 0 0 0 2px var(--ink)}.map.is-still{cursor:pointer;touch-action:auto}.map-tiles{pointer-events:none;position:absolute;inset:0}.map-tile{opacity:0;max-width:none;transition:opacity var(--dur-2);position:absolute;top:0;left:0}.map-tile.is-in{opacity:1}.map-tiles{filter:grayscale(.9)contrast(.88)brightness(1.04)}:root[data-theme=dark] .map-tiles{filter:invert()hue-rotate(180deg)grayscale(.9)brightness(.82)contrast(.92)}.map-pin{z-index:1;border-radius:var(--r-pill);color:var(--c);background:color-mix(in oklab, var(--c) 14%, var(--surface));border:2px solid color-mix(in oklab, var(--c) 50%, var(--surface));animation:pin-in var(--dur-3) var(--spring-bouncy) both;justify-content:center;align-items:center;display:inline-flex;position:absolute;top:0;left:0;box-shadow:0 1px 2px #0003,0 4px 12px -4px #00000059}.map-pin-count{border-radius:var(--r-pill);background:var(--c);min-width:19px;height:19px;color:var(--on-color);border:2px solid var(--surface);font-size:var(--text-xs);font-weight:var(--w-bold);font-variant-numeric:tabular-nums;justify-content:center;align-items:center;padding:0 5px;line-height:1;display:inline-flex;position:absolute;top:-7px;right:-9px}button.map-pin:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.map.is-still .map-pin{pointer-events:none}@keyframes pin-in{0%{opacity:0;scale:.4}}.map-tools{z-index:2;gap:8px;display:grid;position:absolute;top:12px;right:12px}.map-credit{z-index:2;border-top-left-radius:var(--r-s);font-size:var(--text-xs);color:var(--ink-2);background:color-mix(in oklab, var(--surface) 78%, transparent);padding:2px 7px;position:absolute;bottom:0;right:0}.map-credit a{color:inherit}.map-preview{border-radius:var(--r-m);height:220px;margin-top:12px}.app.route-map{padding-bottom:0}.map-page{animation:page-in var(--dur-2) var(--ease-emph);position:fixed;inset:0}.map-page .map{position:absolute;inset:0}.map-page .map-tools{top:calc(var(--safe-t) + 70px)}.map-page .map-credit{bottom:var(--safe-b)}.map-bar{z-index:3;padding:calc(var(--safe-t) + 12px) 12px 0;pointer-events:none;align-items:center;gap:10px;display:flex;position:absolute;top:0;left:0;right:0}.map-bar>*{pointer-events:auto}.map-title{border-radius:var(--r-pill);padding:6px 16px;line-height:1.25;display:grid}.map-title b{font:var(--w-medium) var(--text-l)/1.2 var(--serif)}.map-title span{font-size:var(--text-s);color:var(--ink-3)}.map-empty{z-index:3;left:16px;right:16px;bottom:calc(var(--safe-b) + 28px);max-width:420px;box-shadow:var(--shadow-2);gap:10px;margin:0 auto;padding:16px;display:grid;position:absolute}.map-empty p{color:var(--ink-2);font-size:var(--text-base)}.spot-list{gap:2px;display:grid}.spot-row{text-align:left;border-radius:var(--r-m);width:100%;transition:background-color var(--dur-1);grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 8px;display:grid}@media (hover:hover){.spot-row:hover{background:var(--surface-2)}}.spot-ico{color:var(--ink-2);justify-content:center;align-items:center;display:inline-flex}.spot-main{min-width:0;display:grid}.spot-title{font-weight:var(--w-bold);font-size:var(--text-base);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.spot-sub{font-size:var(--text-s);color:var(--ink-3);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.spot-when{font-size:var(--text-s);color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}.map-heat{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.map-heat-clouds{opacity:.8;mix-blend-mode:multiply}:root[data-theme=dark] .map-heat-clouds{opacity:.9;mix-blend-mode:screen}.map-marker{z-index:2;cursor:grab;touch-action:none;width:0;height:0;position:absolute;top:0;left:0}.map-marker:before{content:"";width:48px;height:60px;position:absolute;top:-56px;left:-24px}.map-marker-head{background:var(--ink);width:36px;height:36px;color:var(--surface);border:2px solid var(--surface);animation:pin-in var(--dur-3) var(--spring-bouncy) both;border-radius:50% 50% 50% 0;justify-content:center;align-items:center;display:inline-flex;position:absolute;top:-44px;left:-18px;rotate:-45deg;box-shadow:0 2px 4px #00000040,0 8px 18px -6px #00000073}.map-marker-head svg{rotate:45deg}.map-marker:after{content:"";background:#00000059;border-radius:50%;width:8px;height:4px;position:absolute;top:-2px;left:-4px}.map:active .map-marker{cursor:grabbing}.place-map{border-radius:var(--r-m);height:min(52vh,420px)}