:root {
    --orange: #e35b19;
    --orange-dark: #b83f10;
    --ink: #28201c;
    --muted: #74665e;
    --surface: #fffdfb;
    --map: #e8eee5;
    --shadow: 0 18px 55px rgba(56, 42, 32, .17);
}

* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; overflow: hidden; }
body { font-family: Inter, "Segoe UI", Arial, sans-serif; color: var(--ink); background: var(--map); }
button, input { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }

.festival-map-page { display: grid; grid-template-rows: 72px minmax(0, 1fr); position: relative; }
.map-topbar { z-index: 40; display: grid; grid-template-columns: 96px minmax(0, 1fr) 96px; align-items: center; padding: 10px 18px; color: #fff; background: linear-gradient(135deg, #ca4615, #ef721d); box-shadow: 0 3px 18px rgba(115, 50, 15, .22); }
.map-topbar-actions { display: flex; justify-content: flex-end; gap: 2px; }
.map-back, .map-refresh, .map-search-toggle { position: relative; display: grid; width: 44px; height: 44px; place-items: center; border: 0; border-radius: 14px; color: #fff; background: transparent; font-size: 24px; }
.map-refresh { font-size: 20px; }
.map-back:hover, .map-refresh:hover, .map-search-toggle:hover { background: rgba(255, 255, 255, .15); }
.map-refresh.is-refreshing i { animation: map-refresh-spin .8s linear infinite; }
.map-refresh.has-update::after { position: absolute; top: 7px; right: 6px; width: 9px; height: 9px; border: 2px solid #d04b17; border-radius: 50%; background: #fff; content: ''; box-shadow: 0 0 0 2px rgba(255, 255, 255, .26); }
@keyframes map-refresh-spin { to { transform: rotate(360deg); } }
.map-title-wrap { min-width: 0; text-align: center; }
.map-title-wrap strong, .map-title-wrap span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-title-wrap strong { font-size: 18px; font-weight: 850; }
.map-title-wrap span { margin-top: 2px; font-size: 10px; opacity: .83; }

.map-search { position: fixed; z-index: 70; top: 12px; left: 50%; display: grid; width: min(680px, calc(100% - 24px)); grid-template-columns: 28px minmax(0, 1fr) 38px; align-items: center; padding: 7px 8px 7px 14px; border: 1px solid rgba(92, 65, 50, .12); border-radius: 17px; background: #fff; box-shadow: 0 16px 45px rgba(46, 35, 27, .22); transform: translateX(-50%); }
.map-search > i { color: var(--orange); font-size: 18px; }
.map-search input { height: 42px; min-width: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 15px; }
.map-search > button, .map-place-heading button { display: grid; width: 36px; height: 36px; place-items: center; border: 0; border-radius: 50%; color: #79685e; background: #f3eeeb; }
.map-search-results { position: absolute; top: calc(100% + 8px); right: 0; left: 0; max-height: min(60vh, 480px); overflow: auto; padding: 7px; border-radius: 16px; background: #fff; box-shadow: 0 16px 45px rgba(46, 35, 27, .22); }
.search-result { display: grid; width: 100%; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 11px; align-items: center; padding: 10px; border: 0; border-bottom: 1px solid #f0e9e5; color: var(--ink); background: #fff; text-align: left; }
.search-result:last-child { border-bottom: 0; }
.search-result:hover:not(.is-empty) { border-radius: 10px; background: #fff5ef; }
.search-result-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; color: #fff; background: var(--orange); font-size: 13px; font-weight: 900; }
.search-result strong, .search-result small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-result small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.search-result > i { color: #ad9c91; }

.map-viewport { position: relative; min-height: 0; overflow: hidden; cursor: grab; touch-action: none; background: #e7eee3; }
.map-viewport.is-dragging { cursor: grabbing; }
.map-viewport.is-pinching { cursor: zoom-in; }
.map-stage { position: absolute; inset: 0; }
.map-stage svg { display: block; width: 100%; height: 100%; }
.map-stage svg.is-animating { transition: all .35s ease; }

.map-controls { position: absolute; z-index: 15; top: 18px; right: 16px; display: grid; gap: 7px; }
.map-controls button { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid rgba(91, 70, 57, .13); border-radius: 13px; color: #4d423c; background: rgba(255, 255, 255, .95); box-shadow: 0 8px 20px rgba(49, 40, 34, .13); font-size: 18px; }
.map-controls button:hover { color: #fff; background: var(--orange); }
.map-status { position: absolute; z-index: 14; top: 18px; left: 16px; display: flex; align-items: center; gap: 8px; padding: 8px 11px; border-radius: 999px; color: #5e5149; background: rgba(255, 255, 255, .92); box-shadow: 0 6px 18px rgba(49, 40, 34, .1); font-size: 11px; font-weight: 750; }
.map-status-dot { width: 8px; height: 8px; border-radius: 50%; background: #d49a2b; }
.map-status.is-online .map-status-dot { background: #27a266; }
.map-status.is-offline .map-status-dot { background: #db5d19; }
.map-update-notice { position: absolute; z-index: 18; top: 18px; left: 50%; display: flex; max-width: min(360px, calc(100% - 150px)); min-height: 40px; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid rgba(183, 75, 23, .18); border-radius: 13px; color: #743216; background: rgba(255, 250, 246, .97); box-shadow: 0 10px 28px rgba(73, 43, 25, .16); font-size: 11px; font-weight: 800; transform: translateX(-50%); }
.map-update-notice > i { flex: 0 0 auto; color: var(--orange); font-size: 16px; }
.map-update-notice > span { min-width: 0; line-height: 1.35; }
.map-update-notice > button { flex: 0 0 auto; min-height: 28px; padding: 0 9px; border: 0; border-radius: 9px; color: #fff; background: var(--orange); font-size: 10px; font-weight: 900; }
.map-update-notice.is-offline { border-color: rgba(104, 90, 82, .18); color: #61554e; }
.map-update-notice.is-offline > i { color: #776960; }
.map-legend { position: absolute; z-index: 14; right: 16px; bottom: 16px; display: flex; gap: 13px; padding: 9px 12px; border: 1px solid rgba(91, 70, 57, .12); border-radius: 13px; color: #5d514a; background: rgba(255, 255, 255, .92); box-shadow: 0 6px 18px rgba(49, 40, 34, .1); font-size: 11px; font-weight: 750; }
.map-legend span { display: flex; align-items: center; gap: 6px; }
.legend-road { width: 22px; height: 2px; border: 0; border-radius: 999px; background: #98a293; opacity: .7; }
.legend-gate { width: 10px; height: 10px; border: 3px solid #e35b19; border-radius: 50%; background: #fff; }

.map-sheet { position: fixed; z-index: 30; top: 94px; right: 22px; width: min(390px, calc(100% - 44px)); max-height: calc(100vh - 116px); overflow: hidden; border: 1px solid rgba(104, 78, 63, .12); border-radius: 24px; background: rgba(255, 253, 251, .97); box-shadow: var(--shadow); backdrop-filter: blur(18px); }
.map-sheet-handle { display: none; width: 100%; height: 24px; border: 0; background: transparent; }
.map-sheet-handle span { display: block; width: 40px; height: 4px; margin: auto; border-radius: 99px; background: #cfc6c0; }
.map-sheet-content { max-height: calc(100vh - 140px); overflow: auto; padding: 24px; }
.map-kicker { display: inline-flex; align-items: center; gap: 6px; color: var(--orange-dark); font-size: 11px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.map-welcome h1, .map-plan-panel h1, .map-place h2 { margin: 7px 0 5px; font-size: 22px; line-height: 1.15; font-weight: 900; }
.map-welcome p, .map-plan-panel > p, .map-place p, .map-error p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.map-primary, .map-secondary { display: flex; width: 100%; min-height: 50px; align-items: center; justify-content: center; gap: 9px; margin-top: 18px; border-radius: 15px; font-weight: 850; }
.map-primary { border: 0; color: #fff; background: linear-gradient(135deg, #d84c14, #f17b1a); box-shadow: 0 10px 24px rgba(222, 81, 21, .23); }
.map-primary:hover { filter: brightness(.96); transform: translateY(-1px); }
.map-secondary { border: 1px solid #e6d9d1; color: var(--orange-dark); background: #fff; }
.map-plan-summary { margin-top: 16px; padding: 12px; border: 1px solid #eadbd2; border-radius: 16px; background: #fff8f3; }
.map-plan-summary-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #743216; font-size: 11px; font-weight: 900; }
.map-plan-summary-heading > span { display: inline-flex; align-items: center; gap: 7px; }
.map-plan-summary-heading > strong { display: grid; min-width: 28px; height: 28px; place-items: center; border-radius: 999px; color: #fff; background: var(--orange); font-size: 11px; }
.legend-plan { display: inline-block; width: 13px; height: 13px; border: 3px solid #9a3412; border-radius: 4px; background: #ffd166; box-shadow: 0 0 0 2px rgba(255, 255, 255, .9); }
.map-plan-list { display: grid; gap: 7px; margin-top: 10px; }
.map-plan-stop { display: grid; width: 100%; min-height: 54px; grid-template-columns: 34px minmax(0, 1fr) 32px; gap: 9px; align-items: center; padding: 7px 8px; border: 1px solid #eadfd8; border-radius: 12px; color: var(--ink); background: #fff; text-align: left; }
.map-plan-stop:hover, .map-plan-stop:focus-visible { border-color: #df6d35; outline: 0; background: #fff0e7; }
.map-plan-stop > span:first-child { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: #8a2d0b; background: #ffd166; font-size: 11px; font-weight: 900; }
.map-plan-stop strong, .map-plan-stop small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-plan-stop strong { font-size: 12px; font-weight: 900; }
.map-plan-stop small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.map-plan-stop > i { color: var(--orange); font-size: 16px; justify-self: center; }
.map-plan-empty { margin-top: 10px !important; padding: 10px; border-radius: 10px; background: #fff; text-align: center; }
.map-plan-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.map-plan-actions .map-primary, .map-plan-actions .map-secondary { min-height: 44px; margin-top: 0; padding: 8px; text-align: center; text-decoration: none; font-size: 11px; }
.map-place-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.map-place-heading-actions { display: flex; flex: 0 0 auto; gap: 8px; }
.map-place-preview { display: none; }
.map-place-heading > div { min-width: 0; }
.map-place-heading h2 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-merchant-list { display: grid; gap: 8px; margin-top: 14px; }
.map-merchant-card { display: grid; grid-template-columns: minmax(0, 1fr) 42px; gap: 7px; align-items: stretch; }
.map-merchant { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 11px; align-items: center; padding: 9px; border-radius: 13px; color: var(--ink); background: #f8f4f1; text-decoration: none; }
.map-entry-share { display: grid; min-height: 100%; place-items: center; border: 1px solid #eadbd2; border-radius: 13px; color: #a8451b; background: #fff8f3; }
.map-entry-share:hover, .map-entry-share:focus-visible { border-color: #e97239; outline: 0; background: #fff0e7; }
.map-merchant img, .map-merchant-fallback { width: 48px; height: 48px; border-radius: 11px; object-fit: cover; }
.map-merchant-fallback { display: grid; place-items: center; color: #fff; background: var(--orange); }
.map-merchant strong, .map-merchant small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-merchant small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.map-merchant > i { color: #b3a29a; }
.map-directory-entry { border: 1px solid #f0d2bd; background: #fff8f2; }
.map-directory-entry .map-merchant-fallback { color: #a94416; background: #ffe4d3; }
.map-directory-badge { align-self: center; padding: 5px 7px; border-radius: 999px; color: #8b3a18; background: #ffe1cd; font-size: 9px; font-weight: 900; white-space: nowrap; }
.map-place-actions { margin-top: 12px; }
.map-place-actions .map-primary { margin-top: 0; }
.map-route-panel { margin-top: 14px; padding: 13px; border: 1px solid #ecd8cb; border-radius: 17px; background: linear-gradient(145deg, #fff8f3, #fffdfb); }
.map-route-heading { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 10px; align-items: center; }
.map-route-icon { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg, var(--orange-dark), var(--orange)); }
.map-route-icon img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.map-route-heading strong, .map-route-heading small { display: block; }
.map-route-heading strong { overflow: hidden; font-size: 13px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.map-route-heading small { display: -webkit-box; overflow: hidden; margin-top: 2px; color: var(--muted); font-size: 10px; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.map-route-heading-actions { display: flex; gap: 6px; align-items: center; }
.map-route-heading-actions button { display: inline-flex; min-height: 34px; align-items: center; gap: 5px; padding: 0 9px; border: 1px solid #eadbd2; border-radius: 10px; color: #9b4926; background: #fff; font-size: 10px; font-weight: 850; }
.map-route-heading-actions button:hover, .map-route-heading-actions button:focus-visible { border-color: #e97239; outline: 0; color: #8c330f; background: #fff0e7; }
.map-plan-route-actions { display: grid; grid-template-columns: auto 1fr 1fr; gap: 7px; align-items: center; margin-top: 9px; padding-top: 9px; border-top: 1px solid #eddcd1; }
.map-plan-route-actions[hidden] { display: none; }
.map-plan-route-actions > span { color: #8c330f; font-size: 11px; font-weight: 900; white-space: nowrap; }
.map-plan-route-actions button { min-height: 38px; padding: 0 10px; border: 1px solid #dfc5b7; border-radius: 11px; color: #8c330f; background: #fff; font-size: 10px; font-weight: 850; }
.map-plan-route-actions button:first-of-type { color: #fff; border-color: var(--orange-dark); background: var(--orange-dark); }
.map-route-camera { display: none; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.map-route-camera button { display: flex; min-width: 0; min-height: 38px; align-items: center; justify-content: center; gap: 5px; padding: 0 7px; border: 1px solid #eadbd2; border-radius: 11px; color: #7b5b4c; background: #fff; font-size: 9px; font-weight: 850; }
.map-route-camera button i { color: var(--orange); font-size: 13px; }
.map-route-camera button.is-active { border-color: #e97239; color: #9b3d16; background: #fff0e7; }
.map-route-options-toggle { display: none; width: 100%; min-height: 36px; align-items: center; justify-content: center; gap: 7px; margin-top: 8px; border: 1px solid #eadbd2; border-radius: 11px; color: #9b4926; background: #fff; font-size: 10px; font-weight: 850; }
.map-route-options-toggle i:last-child { transition: transform .2s ease; }
.map-sheet.is-route-options-open .map-route-options-toggle i:last-child { transform: rotate(180deg); }
.map-entrance-list { display: grid; gap: 6px; margin-top: 11px; }
.map-entrance-button { display: grid; width: 100%; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 7px 9px; border: 1px solid #eee3dc; border-radius: 12px; color: var(--ink); background: #fff; text-align: left; }
.map-entrance-button:hover:not(:disabled), .map-entrance-button.is-active { border-color: #e97239; background: #fff0e7; }
.map-entrance-button:disabled { cursor: not-allowed; opacity: .5; }
.map-entrance-button > span:first-child { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; color: var(--orange); background: #fff1e8; }
.map-entrance-button strong, .map-entrance-button small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-entrance-button strong { font-size: 11px; }
.map-entrance-button small { margin-top: 2px; color: var(--orange-dark); font-size: 9px; font-weight: 800; }
.map-entrance-button > i { color: #2c9b67; }
.map-route-message { margin-top: 10px !important; padding: 9px; border-radius: 10px; color: #9d4523 !important; background: #fff0e7; font-size: 10px !important; }
.is-map-share-open { overflow: hidden; }
.map-share-dialog { position: fixed; z-index: 120; inset: 0; display: grid; place-items: center; padding: 20px; }
.map-share-dialog[hidden] { display: none; }
.map-share-backdrop { position: absolute; inset: 0; border: 0; background: rgba(35, 25, 20, .54); backdrop-filter: blur(6px); }
.map-share-sheet { position: relative; width: min(430px, 100%); padding: 22px; border: 1px solid rgba(117, 74, 49, .16); border-radius: 24px; background: #fffdfb; box-shadow: 0 26px 70px rgba(39, 25, 18, .3); }
.map-share-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.map-share-heading h2 { margin: 7px 0 0; font-size: 21px; line-height: 1.15; }
.map-share-heading > button { display: grid; width: 40px; height: 40px; flex: 0 0 auto; place-items: center; border: 1px solid #eadbd2; border-radius: 50%; color: #7c5d4e; background: #fff; }
.map-share-summary { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 12px; align-items: center; margin-top: 18px; padding: 12px; border: 1px solid #efd9cb; border-radius: 16px; background: #fff7f1; }
.map-share-summary img { width: 58px; height: 58px; border-radius: 13px; background: #fff; object-fit: cover; }
.map-share-summary strong, .map-share-summary small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-share-summary strong { font-size: 14px; font-weight: 900; }
.map-share-summary small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.map-share-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 14px; }
.map-share-actions > * { display: flex; min-height: 50px; align-items: center; justify-content: center; gap: 8px; padding: 8px; border: 1px solid #eadbd2; border-radius: 14px; color: #7d3719; background: #fff; font-size: 12px; font-weight: 850; text-decoration: none; }
.map-share-actions > *:hover, .map-share-actions > *:focus-visible { border-color: #e97239; outline: 0; background: #fff0e7; }
.map-share-actions .bi-whatsapp { color: #159447; }
.map-share-actions .bi-facebook { color: #1877f2; }
.map-share-status { min-height: 18px; margin: 10px 2px 0; color: #6f5b50; font-size: 11px; text-align: center; }
.map-mobile-nav { display: none; }
.map-error { text-align: center; }
.map-error > i { display: block; margin-bottom: 8px; color: var(--orange); font-size: 36px; }
.map-error strong { font-size: 18px; }
.map-error p { margin-top: 5px; }

/* Modern map rendering. The visual base and route graph can evolve, while the
   confirmed stall polygons remain isolated in the locked data asset. */
.site-background { fill: #e7ece3; }
.official-context-map { pointer-events: none; }
.terrain-park { fill: #dce6cf; stroke: #c3cfb6; stroke-width: 7; }
.terrain-garden { fill: #cbdba9; stroke: #adbf8f; stroke-width: 7; }
.terrain-lawn { fill: #aec77e; stroke: #93ad68; stroke-width: 7; }
.map-lake { fill: #96c5d2; stroke: #71aebf; stroke-width: 8; }
.stage { fill: #d9cbb7; stroke: #ad9f8b; stroke-width: 8; }
.map-road { fill: #bfc4c0; }
.road-mark { fill: none; stroke: rgba(255, 255, 255, .78); stroke-width: 8; stroke-dasharray: 35 32; }
.map-road-label { fill: #5f5a55; font-size: 24px; font-weight: 800; letter-spacing: .04em; text-anchor: middle; }
.map-building { fill: #ded2bd; stroke: #bdb19e; stroke-width: 7; }
.games-building { fill: #d8cdb9; }
.indoor-building { fill: #d9ccb5; }
.indoor-court { fill: #f1eadc; stroke: #b8aa94; stroke-width: 7; }
.school-building { fill: #d7c6aa; }
.toilet-building { fill: #e3d9c6; }
.map-building-label { fill: #4b413b; font-size: 28px; font-weight: 850; text-anchor: middle; }
.map-area-label { fill: #403832; font-size: 32px; font-weight: 900; letter-spacing: .035em; text-anchor: middle; paint-order: stroke; stroke: rgba(231, 238, 227, .72); stroke-width: 7px; stroke-linejoin: round; }
.map-minor-label { fill: #655950; font-size: 18px; font-weight: 800; text-anchor: middle; paint-order: stroke; stroke: rgba(231, 238, 227, .8); stroke-width: 5px; stroke-linejoin: round; }
.map-soft-label { fill: #403832; font-size: 29px; font-weight: 900; letter-spacing: .03em; text-anchor: middle; opacity: .78; paint-order: stroke; stroke: #eef3ea; stroke-opacity: .78; stroke-width: 7px; stroke-linejoin: round; }
.indoor-label { font-size: 39px; }
.map-soft-label.indoor-label { font-size: 31px; }
.map-soft-label.games-label { font-size: 28px; }
.school-label { font-size: 33px; }
.stadium-outer { fill: #c8d9a7; stroke: #9fb474; stroke-width: 9; }
.stadium-track { fill: none; stroke: #c47462; stroke-width: 76; }
.stadium-field { fill: #a7c17d; stroke: #f5f5eb; stroke-width: 8; }
.stadium-line { fill: none; stroke: rgba(255, 255, 255, .8); stroke-width: 5; }
.stadium-name { font-size: 31px; }
.balloon-stall { fill: #82bd73; stroke: #d69c7f; stroke-width: 13; }
.zone-label { fill: #8d8179; font-size: 49px; font-weight: 900; letter-spacing: .2em; opacity: .82; }
.special-layer { pointer-events: none; }
.special-feature rect { fill: #f4eee4; fill-opacity: .74; stroke: #807465; stroke-opacity: .42; stroke-width: 5; vector-effect: non-scaling-stroke; }
.special-feature text { fill: #403832; font-size: 13px; font-weight: 900; text-anchor: middle; letter-spacing: .04em; paint-order: stroke; stroke: #f5f1e8; stroke-opacity: .9; stroke-width: 3px; stroke-linejoin: round; }
.special-feature .special-tiny { font-size: 8px; letter-spacing: .02em; }
.special-feature .special-micro { font-size: 4.6px; letter-spacing: 0; }
.special-beer rect { fill: #ebdabe; fill-opacity: .82; stroke: #977e57; stroke-opacity: .58; }
.special-drink rect { fill: #e5f1f4; fill-opacity: .8; stroke: #538a97; stroke-opacity: .55; }
.special-food rect { fill: #f2e0d1; fill-opacity: .82; stroke: #ad7e5d; stroke-opacity: .52; }
.heritage-food-marker rect { fill: #fff2cf; fill-opacity: .96; stroke: #a84916; stroke-width: 3; stroke-opacity: .88; filter: drop-shadow(0 4px 7px rgba(116, 55, 20, .2)); }
.heritage-food-marker .special-tiny { fill: #7d2e0d; font-size: 8px; font-weight: 950; letter-spacing: .04em; }
.heritage-food-marker .special-range { fill: #a83e12; font-size: 8px; font-weight: 950; text-anchor: middle; }
.special-service rect { fill: #f5ecdd; fill-opacity: .8; stroke: #91826f; stroke-opacity: .5; }
.special-station rect { fill: #172bd1; stroke: #fff; stroke-opacity: .88; stroke-width: 3; }
.game-stall-cell rect { fill: #5969b6; fill-opacity: .76; stroke: rgba(255, 255, 255, .86); stroke-width: 1.8; vector-effect: non-scaling-stroke; }
.game-stall-cell text { fill: #171514; font-size: 11px; font-weight: 900; text-anchor: middle; paint-order: stroke; stroke: rgba(255,255,255,.9); stroke-width: 2.4px; stroke-linejoin: round; }
.games-label { font-size: 30px; }
.facility-chip circle { fill: #fff; stroke: #bcb4aa; stroke-width: 5; }
.facility-chip text { fill: #2f2926; font-size: 20px; font-weight: 900; text-anchor: middle; }
.facility-dot circle { fill: #1f2520; stroke: #fff; stroke-width: 8; }
.map-walkway-edge, .map-walkway { fill: none; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.map-walkway-edge { stroke: #c8cbc2; stroke-width: 42; opacity: .9; }
.map-walkway { stroke: #f4f1e8; stroke-width: 31; }
.map-route-underlay, .map-route-line, .map-route-flow { fill: none; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; vector-effect: non-scaling-stroke; }
.map-route-underlay { stroke: rgba(255, 255, 255, .96); stroke-width: 15; }
.map-route-line { stroke: rgba(239, 100, 28, .28); stroke-width: 9; }
.map-route-flow { stroke: #ef641c; stroke-width: 9; stroke-dasharray: 18 14; animation: map-route-flow 1s linear infinite; filter: drop-shadow(0 4px 5px rgba(153, 55, 12, .24)); }
@keyframes map-route-flow { to { stroke-dashoffset: -32; } }
.map-route-start circle:first-child { fill: #fff; stroke: #ef641c; stroke-width: 7; vector-effect: non-scaling-stroke; }
.map-route-start circle:last-child { fill: #ef641c; }
.map-route-end circle { fill: #ef641c; stroke: #fff; stroke-width: 6; vector-effect: non-scaling-stroke; }
.map-route-end path { fill: none; stroke: #fff; stroke-width: 5; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.map-route-start, .map-route-end { pointer-events: none; }

.map-stall { cursor: pointer; fill-opacity: .78; stroke: rgba(255, 255, 255, .82); stroke-width: 1.6; vector-effect: non-scaling-stroke; transition: filter .15s ease, fill-opacity .15s ease, stroke-width .15s ease; }
.map-stall:hover, .map-stall.is-selected { stroke: #fff; stroke-width: 6; filter: url(#mapShadow); }
.map-stall:hover { fill-opacity: .72; }
.map-stall.is-selected { fill: #ff641d !important; fill-opacity: .92; filter: url(#targetGlow); }
.map-stall.is-route-target { stroke: #ef641c; stroke-width: 5; filter: url(#targetGlow); }
.map-stall.has-merchant { fill-opacity: .96; stroke: #123f34; stroke-width: 2; }
.map-stall.has-directory { fill-opacity: .94; stroke: #c95a22; stroke-width: 1.8; stroke-dasharray: 5 4; }
.map-stall.is-heritage-food:not(.is-selected):not(.is-route-target):not(.is-plan) { fill: #f3b33e !important; fill-opacity: 1; filter: drop-shadow(0 0 5px rgba(181, 80, 18, .38)); }
.map-stall.is-heritage-food:not(.has-merchant):not(.has-directory):not(.is-selected):not(.is-route-target):not(.is-plan) { stroke: #8f3f13; stroke-width: 4; }
.map-stall.is-plan { fill: #ffd166 !important; fill-opacity: 1; stroke: #9a3412; stroke-width: 5; filter: drop-shadow(0 0 7px rgba(154, 52, 18, .48)); }
.map-stall.is-plan.is-selected, .map-stall.is-plan.is-route-target { fill: #ff641d !important; stroke: #fff; stroke-width: 6; filter: url(#targetGlow); }
.stall-label { pointer-events: none; fill: #171514; font-size: 11px; font-weight: 900; text-anchor: middle; paint-order: stroke; stroke: rgba(255,255,255,.92); stroke-width: 2.4px; stroke-linejoin: round; }
.stall-label.is-small { font-size: 10px; }
.entrance-label { pointer-events: none; filter: url(#mapShadow); }
.entrance-label > circle:first-child { fill: rgba(255, 255, 255, .96); stroke: #ed3e0e; stroke-width: 8; }
.entrance-label .entrance-center { fill: #ed3e0e; }
.entrance-label rect { fill: #ed3e0e; }
.entrance-label.is-active > circle:first-child { fill: #fff0e7; stroke-width: 12; }
.entrance-label.is-nearest:not(.is-active) > circle:first-child { stroke: #f08b4e; }
.entrance-label.is-disabled { opacity: .42; filter: none; }
.facility-label { fill: #a4310f; font-size: 19px; font-weight: 900; text-anchor: middle; paint-order: stroke; stroke: #f8f4ec; stroke-width: 8px; stroke-linejoin: round; }

.map-tooltip { position: absolute; z-index: 25; padding: 13px; border: 1px solid rgba(99, 69, 52, .14); border-radius: 18px; background: rgba(255, 253, 251, .98); box-shadow: 0 18px 48px rgba(52, 38, 30, .25); backdrop-filter: blur(16px); cursor: default; touch-action: auto; }
.map-tooltip::before { position: absolute; top: calc(50% - 8px); left: -8px; width: 16px; height: 16px; border-bottom: 1px solid rgba(99, 69, 52, .12); border-left: 1px solid rgba(99, 69, 52, .12); background: #fffdfb; content: ''; transform: rotate(45deg); }
.map-tooltip.is-left::before { right: -8px; left: auto; border: 0; border-top: 1px solid rgba(99, 69, 52, .12); border-right: 1px solid rgba(99, 69, 52, .12); }
.map-tooltip-close { position: absolute; z-index: 2; top: 7px; right: 7px; display: grid; width: 28px; height: 28px; place-items: center; border: 0; border-radius: 50%; color: #7d6d64; background: #f4eeea; }
.map-tooltip-main { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 11px; align-items: center; padding-right: 21px; }
.map-tooltip-image { width: 58px; height: 58px; border-radius: 14px; object-fit: cover; }
.map-tooltip-fallback { display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--orange-dark), var(--orange)); font-size: 22px; }
.map-tooltip-main small, .map-tooltip-main strong, .map-tooltip-main span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-tooltip-main small { color: var(--orange-dark); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.map-tooltip-main strong { margin-top: 3px; font-size: 14px; font-weight: 900; }
.map-tooltip-main span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.map-tooltip-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin-top: 11px; }
.map-tooltip-actions > * { display: flex; min-height: 38px; align-items: center; justify-content: center; gap: 6px; padding: 0 8px; border-radius: 11px; font-size: 10px; font-weight: 850; text-decoration: none; }
.map-tooltip-actions a { border: 1px solid #eadbd2; color: var(--orange-dark); background: #fff; }
.map-tooltip-actions button { border: 0; color: #fff; background: linear-gradient(135deg, var(--orange-dark), var(--orange)); }
.map-tooltip-actions button:disabled { color: #6f625b; background: #eee8e4; cursor: default; }
.map-tooltip-multiple-title { padding: 1px 34px 9px 1px; }
.map-tooltip-multiple-title small, .map-tooltip-multiple-title strong { display: block; }
.map-tooltip-multiple-title small { color: var(--orange-dark); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.map-tooltip-multiple-title strong { margin-top: 3px; font-size: 15px; font-weight: 900; }
.map-tooltip-entry-list { display: grid; gap: 7px; }
.map-tooltip-entry { display: grid; grid-template-columns: 40px minmax(0, 1fr) 34px auto; gap: 8px; align-items: center; padding: 7px; border: 1px solid #eeddd3; border-radius: 12px; background: #fff8f3; }
.map-tooltip-entry > img, .map-tooltip-entry-image { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 10px; color: #a8451b; background: #ffe4d3; object-fit: cover; }
.map-tooltip-entry strong, .map-tooltip-entry small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-tooltip-entry strong { font-size: 11px; font-weight: 900; }
.map-tooltip-entry small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.map-tooltip-entry button, .map-tooltip-entry > a { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid #eadbd2; border-radius: 9px; color: #9b4926; background: #fff; text-decoration: none; }
.map-tooltip-actions.is-single { grid-template-columns: 1fr; }

@media (min-width: 768px) {
    .map-viewport { margin-right: 430px; }
    .festival-map-page.is-stall-preview .map-viewport { margin-right: 0; }
    .festival-map-page.is-stall-preview .map-sheet { display: none; }
}

@media (max-width: 767.98px) {
    .festival-map-page { grid-template-rows: 64px minmax(0, 1fr) calc(72px + env(safe-area-inset-bottom)); }
    .map-topbar { padding: 8px 10px; }
    .map-title-wrap strong { font-size: 16px; }
    .map-title-wrap span { font-size: 9px; }
    .map-controls { top: 13px; right: 11px; }
    .map-controls button { width: 42px; height: 42px; }
    .map-status { top: 13px; left: 11px; max-width: calc(100% - 70px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .map-update-notice { top: 62px; right: 66px; left: 11px; max-width: none; transform: none; }
    .map-legend { right: 11px; bottom: 88px; flex-direction: column; gap: 7px; }
    .map-sheet { top: auto; right: 0; bottom: calc(72px + env(safe-area-inset-bottom)); left: 0; width: 100%; max-height: 58vh; border-right: 0; border-bottom: 0; border-left: 0; border-radius: 24px 24px 0 0; transition: transform .25s ease; }
    .map-sheet.is-collapsed { transform: translateY(calc(100% - 184px)); }
    .map-sheet-handle { display: block; }
    .map-sheet-content { max-height: calc(58vh - 24px); padding: 10px 18px calc(18px + env(safe-area-inset-bottom)); }
    .map-place-preview { display: grid; gap: 11px; }
    .map-place.has-multiple-destinations .map-place-preview { display: none; }
    .map-place.has-multiple-destinations .map-place-heading { display: flex !important; }
    .map-place.has-multiple-destinations .map-place-actions { display: block !important; }
    .map-place-preview-main { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 11px; align-items: center; }
    .map-place-preview-image { display: grid; width: 72px; height: 64px; place-items: center; overflow: hidden; border-radius: 15px; color: #fff; background: linear-gradient(135deg, var(--orange-dark), var(--orange)); font-size: 24px; }
    .map-place-preview-image img { width: 100%; height: 100%; object-fit: cover; }
    .map-place-preview-copy { min-width: 0; }
    .map-place-preview-copy .map-kicker, .map-place-preview-copy strong, .map-place-preview-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .map-place-preview-copy strong { margin-top: 4px; font-size: 17px; font-weight: 900; }
    .map-place-preview-copy small { margin-top: 4px; color: var(--muted); font-size: 11px; }
    .map-place-preview-close { display: grid; width: 36px; height: 36px; place-items: center; border: 0; border-radius: 50%; color: #79685e; background: #f3eeeb; }
    .map-place-preview-tools { display: flex; gap: 7px; }
    .map-place-share { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid #eadbd2; border-radius: 50%; color: #a8451b; background: #fff8f3; }
    .map-place-preview-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .map-place-preview-actions > * { display: flex; min-height: 46px; align-items: center; justify-content: center; gap: 7px; margin: 0 !important; text-decoration: none; }
    .map-place-preview-actions > [hidden] + .map-primary { grid-column: 1 / -1; }
    .map-place-heading { display: none; }
    .map-place-actions { display: none; }
    .map-sheet.is-collapsed .map-merchant-list, .map-sheet.is-collapsed .map-route-panel { display: none; }
    .map-welcome h1, .map-plan-panel h1, .map-place h2 { font-size: 19px; }
    .map-plan-list { max-height: 25vh; overflow: auto; overscroll-behavior: contain; }
    .map-primary { min-height: 48px; margin-top: 14px; }
    .map-search { top: 8px; }
    .map-tooltip { display: none !important; }
    .map-route-heading-actions button span { display: none; }
    .map-route-panel { margin-top: 11px; padding: 11px; }

    .map-viewport.is-navigating .map-status,
    .map-viewport.is-navigating .map-legend { visibility: hidden; opacity: 0; }
    .map-sheet.is-route-mode {
        right: 12px;
        bottom: calc(84px + env(safe-area-inset-bottom));
        left: 12px;
        width: auto;
        max-height: min(54vh, 430px);
        border: 1px solid rgba(104, 78, 63, .14);
        border-radius: 19px;
        box-shadow: 0 14px 38px rgba(48, 34, 26, .2);
        transform: none;
    }
    .map-sheet.is-route-mode.is-collapsed { transform: none; }
    .map-sheet.is-route-mode .map-sheet-handle { display: none; }
    .map-sheet.is-route-mode .map-sheet-content {
        max-height: min(54vh, 430px);
        overflow: hidden;
        padding: 10px;
    }
    .map-sheet.is-route-mode .map-place-heading,
    .map-sheet.is-route-mode .map-place-preview,
    .map-sheet.is-route-mode .map-merchant-list,
    .map-sheet.is-route-mode .map-place-actions { display: none; }
    .map-sheet.is-route-mode .map-route-panel {
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
    }
    .map-sheet.is-route-mode .map-route-heading { grid-template-columns: 40px minmax(0, 1fr) auto; }
    .map-sheet.is-route-mode .map-route-heading-actions button { width: 36px; min-height: 36px; justify-content: center; padding: 0; border-radius: 50%; }
    .map-sheet.is-route-mode .map-route-camera { display: grid; }
    .map-sheet.is-route-mode .map-route-options-toggle { display: flex; }
    .map-sheet.is-route-mode .map-entrance-list { display: none; max-height: 220px; overflow: auto; overscroll-behavior: contain; }
    .map-sheet.is-route-mode.is-route-options-open .map-sheet-content { overflow: auto; }
    .map-sheet.is-route-mode.is-route-options-open .map-entrance-list { display: grid; }
    .map-sheet.is-route-mode .map-route-message { margin-bottom: 0 !important; }
    .map-share-dialog { align-items: end; padding: 0; }
    .map-share-sheet { width: 100%; padding: 20px 18px calc(18px + env(safe-area-inset-bottom)); border-right: 0; border-bottom: 0; border-left: 0; border-radius: 24px 24px 0 0; }
    .map-mobile-nav { position: fixed; z-index: 48; right: 0; bottom: 0; left: 0; display: grid; min-height: calc(72px + env(safe-area-inset-bottom)); grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; align-items: start; padding: 8px 8px max(7px, env(safe-area-inset-bottom)); border-top: 1px solid rgba(126, 63, 22, .12); background: rgba(255, 253, 249, .96); box-shadow: 0 -18px 40px rgba(91, 48, 20, .14); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
    .map-mobile-nav a { display: flex; min-width: 0; min-height: 54px; align-items: center; justify-content: center; flex-direction: column; gap: 4px; border-radius: 9px; color: #5f5149; font-size: 10px; font-weight: 750; line-height: 1; text-decoration: none; }
    .map-mobile-nav a i { font-size: 21px; }
    .map-mobile-nav a span { overflow: hidden; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; }
    .map-mobile-nav a.active { color: #9f3c13; background: #fff1e4; box-shadow: inset 0 0 0 1px rgba(217, 91, 34, .12); }
    .map-mobile-nav .moments-map-nav { position: relative; color: #9c3412; font-weight: 850; }
    .map-mobile-nav .moments-map-nav i { display: grid; width: 42px; height: 42px; margin-top: -18px; place-items: center; border: 4px solid #fff; border-radius: 50%; color: #fff; background: linear-gradient(135deg,#a62f0d,#df7118); box-shadow: 0 7px 17px rgba(150,49,14,.3); font-size: 17px; }
    .map-mobile-nav .moments-map-nav::after { position: absolute; top: -13px; left: calc(50% + 12px); width: 9px; height: 9px; border: 2px solid #fff; border-radius: 50%; background: #e22b2b; content: ""; animation: mapMomentsPulse 1.9s ease-out infinite; }
    @keyframes mapMomentsPulse { 0% { box-shadow: 0 0 0 0 rgba(226,43,43,.5); } 70% { box-shadow: 0 0 0 9px rgba(226,43,43,0); } 100% { box-shadow: 0 0 0 0 rgba(226,43,43,0); } }
    @media (prefers-reduced-motion: reduce) { .map-mobile-nav .moments-map-nav::after { animation: none; } }
    .map-share-dialog { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
}

@media (prefers-reduced-motion: reduce) {
    .map-stage svg.is-animating, .map-sheet { transition: none; }
    .map-route-flow { animation: none; }
}