/* Navigation: map first, compact floating controls. */
body:has(.navigation-focus){overflow:hidden;background:#e8ece7}body:has(.navigation-focus)>header,body:has(.navigation-focus)>.demo{display:none}main:has(.navigation-focus){padding:0;margin:0;max-width:none}
.navigation-focus{position:fixed;inset:0;z-index:1000;width:100%;height:100dvh;max-width:none;margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#171a21}
.navigation-focus .nav-stage{position:absolute;inset:0;display:block;height:100%;min-height:0;border-radius:0;box-shadow:none;background:#e8ece7;overflow:hidden}
.navigation-focus .nav-stage #real-map{position:absolute!important;inset:0!important;width:100%;height:100%!important;min-height:0!important}
.navigation-focus .nav-stage .nav-prompt{position:absolute;inset:calc(env(safe-area-inset-top,0px) + 18px) 18px auto;z-index:5;display:flex;align-items:center;gap:12px;padding:14px 16px;background:rgb(255 255 255 / 97%);border:1px solid #edf0ec;border-radius:15px;box-shadow:0 3px 18px #25372b0a;backdrop-filter:blur(14px);pointer-events:auto;max-width:650px;margin:0 auto}
.nav-back-icon{border:0;background:transparent;color:#171a21;font-size:25px;padding:0;flex-shrink:0;width:28px;height:38px}.navigation-focus .nav-arrow{display:none}.nav-instruction{flex:1;min-width:0}.navigation-focus .nav-kicker{font-size:10px;letter-spacing:.3px;color:#68716b;display:block;line-height:1.4;text-transform:none}.navigation-focus .nav-prompt #nav-message{font-family:inherit;font-size:14px;line-height:1.4;font-weight:600;color:#171a21;margin:3px 0 5px;max-height:5.6em;overflow-y:auto}.nav-wordmark{font-size:11px;font-weight:800;letter-spacing:.6px;flex-shrink:0;align-self:center}.navigation-focus .nav-distance{display:flex;align-items:center;gap:7px;margin:0;flex-wrap:wrap}.navigation-focus .nav-distance>b{font-size:12px;color:#252b28;font-weight:600}.navigation-focus .nav-distance>span{font-size:11px;color:#747d76;line-height:1.3}
.nav-floating-more{position:absolute;left:20px;top:calc(env(safe-area-inset-top,0px) + 160px);z-index:4;border-radius:50%;width:42px;height:42px;padding:0;background:#fff;color:#171a21;font-size:19px;box-shadow:0 2px 10px #172b2310}
.nav-bottom-tools{position:absolute;left:20px;right:20px;bottom:calc(env(safe-area-inset-bottom,0px) + 45px);display:flex;align-items:center;justify-content:space-between;z-index:4;pointer-events:none}.nav-bottom-tools button{pointer-events:auto;box-shadow:0 3px 16px #172b231a}.nav-stops-button{background:white;color:#171a21;padding:13px 19px;border-radius:24px;font-size:13px;font-weight:500}.nav-center-button{width:49px;height:49px;border-radius:50%;background:#171a21;color:#fff;font-size:27px;padding:0;border:4px solid #fff}
.navigation-focus .nav-stage .nav-recenter{position:absolute;inset:auto 84px calc(env(safe-area-inset-bottom,0px) + 54px) auto;z-index:4;margin:0;padding:9px 13px;border-radius:20px;background:white;color:#171a21;border:1px solid #e8ece7;font-size:11px;box-shadow:0 2px 10px #172b2310}.navigation-focus .nav-progress{position:absolute;bottom:0;left:0;right:0;height:3px;margin:0;background:transparent;z-index:5}.navigation-focus .nav-progress span{background:#171a21}
.navigation-focus .tour-stop-pin{width:25px;height:25px;border:2px solid #171a21;background:#fff;color:#171a21;font-size:11px;box-shadow:0 2px 7px #172b2320}
.navigation-focus .walker-direction{width:30px;height:30px;border:3px solid #fff;border-radius:50%;background:white;box-shadow:0 3px 12px #172b2330}.navigation-focus .walker-direction:before{width:24px;height:24px;background:#171a21;clip-path:polygon(50% 8%,88% 92%,50% 71%,12% 92%);filter:none}
.nav-sheet{position:fixed;inset:auto 0 0;margin:0 auto;width:min(100%,580px);max-width:100%;max-height:80dvh;box-sizing:border-box;border:0;border-radius:24px 24px 0 0;background:#fff;color:#171a21;padding:24px 22px calc(24px + env(safe-area-inset-bottom,0px));overflow-y:auto;box-shadow:0 -8px 40px #172b2315;font-family:inherit}.nav-sheet::backdrop{background:rgb(17 24 39 / 26%)}.nav-sheet-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px}.nav-sheet-heading h2{font-family:inherit;font-size:20px;line-height:1.3;letter-spacing:-.4px;margin:4px 0}.nav-sheet-heading>button{width:34px;height:34px;border-radius:50%;background:#f5f7fa;color:#6b7280;padding:0;flex-shrink:0}.nav-sheet .nav-footer{position:static;inset:auto;padding:0;border:0;background:white;box-shadow:none;backdrop-filter:none}.nav-sheet .nav-demo-badge{display:inline-block;font-size:10px;color:#6b7280;background:#f5f7fa;padding:6px 9px;border-radius:6px;margin-bottom:14px}.nav-sheet .nav-actions{display:flex;gap:8px}.nav-sheet .nav-actions .primary{background:#171a21;color:#fff;flex:1;font-size:12px}.nav-sheet .nav-actions .secondary{background:#f5f7fa;color:#374151;padding:12px;font-size:12px}.nav-sheet .nav-mode-tabs{margin:15px 0}.nav-sheet .lab-appearance{margin-top:24px}.nav-sheet .lab-theme-choices{gap:5px}.nav-sheet .lab-theme-choices button{font-size:11px;padding:9px 8px}.nav-sheet .lab-theme-choices button.on{background:#171a21;color:#fff;border-color:#171a21}.nav-sheet .small{color:#737b77;font-size:12px;line-height:1.6}.nav-sheet .eyebrow{color:#737b77;font-size:10px}.nav-sheet .nav-settings{margin-top:18px}
#nav-stops-items{padding:0;margin:20px 0;list-style:none}#nav-stops-items li{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid #eef0f3;align-items:center}#nav-stops-items li>span{display:grid;place-items:center;flex-shrink:0;border:1px solid #d5dad7;border-radius:50%;width:28px;height:28px;font-size:12px}#nav-stops-items .is-current>span{background:#171a21;color:#fff;border-color:#171a21}#nav-stops-items b{font-size:14px;font-weight:600}#nav-stops-items small{display:block;color:#7b837e;font-size:11px;margin-top:5px}
.navigation-focus #lab-arrival{position:fixed;z-index:8;left:0;right:0;bottom:0;margin:0 auto;box-sizing:border-box;width:min(100%,580px);max-height:72dvh;overflow-y:auto;background:#fff;border:0;border-radius:24px 24px 0 0;padding:24px 22px calc(24px + env(safe-area-inset-bottom,0px));box-shadow:0 -8px 35px #172b2320}.navigation-focus #lab-arrival h2{font-family:inherit;font-size:24px;letter-spacing:-.5px}.navigation-focus #lab-arrival .primary{background:#171a21;color:white}.navigation-focus #lab-arrival .secondary{background:#f5f7fa;color:#374151}.navigation-focus #lab-arrival .eyebrow{font-size:9px;color:#6b7280;letter-spacing:.6px}.navigation-focus .nav-stage .mapboxgl-ctrl-bottom-left{bottom:5px}.navigation-focus .nav-stage .mapboxgl-ctrl-bottom-right{bottom:5px}
@media(min-width:700px){.navigation-focus .nav-stage .nav-prompt{left:24px;right:auto;width:min(650px,calc(100% - 48px));box-sizing:border-box}.nav-floating-more{left:26px}.nav-bottom-tools{left:26px;right:26px}}
@media(prefers-reduced-motion:reduce){.nav-sheet{scroll-behavior:auto}}
/* Navegación: cámara, vista general y menú de recorrido. */
.navigation-focus .nav-prompt>.nav-distance{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0;padding-left:10px;border-left:1px solid #edf0ec;min-width:43px}
.navigation-focus .nav-prompt>.nav-distance>b{font-size:12px}.navigation-focus .nav-prompt>.nav-distance>span{font-size:10px;white-space:nowrap}
.navigation-focus .nav-wordmark{font-size:10px}.navigation-focus .nav-prompt{gap:10px}.navigation-focus .nav-instruction{min-width:0}
.nav-camera-button,.nav-center-button{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;padding:12px;box-sizing:border-box;border:1px solid #edf0ec;background:#fff;color:#202622;box-shadow:0 3px 14px #172b231a}
.nav-camera-button svg,.nav-center-button svg{display:block;width:24px;height:24px;flex-shrink:0}.nav-center-button.needs-recenter{background:#171d19;color:#fff;border:3px solid #fff;padding:10px}
.navigation-focus #recenter{display:none!important}
.nav-tour-drawer{position:fixed;inset:0 auto 0 0;margin:0;width:min(84vw,345px);max-width:84vw;height:100dvh;min-height:100dvh;max-height:100dvh;border:0;border-radius:0 20px 20px 0;padding:max(24px,env(safe-area-inset-top)) 20px max(24px,env(safe-area-inset-bottom));box-sizing:border-box;background:#fff;color:#171a21;overflow-y:auto;overscroll-behavior:contain;font-family:inherit;box-shadow:10px 0 40px #172b231a}
.nav-tour-drawer:not([open]){display:none}.nav-tour-drawer[open]{display:flex;flex-direction:column;gap:5px;animation:nav-menu-enter .2s ease-out}.nav-tour-drawer::backdrop{background:rgb(17 24 39 / 28%)}.nav-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:6px 10px 20px;border-bottom:1px solid #eef0f3;margin-bottom:22px}.nav-drawer-head>b{font-size:24px;letter-spacing:1px}.nav-drawer-head button,.nav-arrival-close{background:#f5f7fa;color:#6b7280;border-radius:50%;width:34px;height:34px;padding:0;flex-shrink:0}.nav-tour-drawer>button{background:white;color:#374151;text-align:left;padding:16px 12px;border-radius:10px;font-size:14px;line-height:1.5;font-weight:500}.nav-tour-drawer>button:hover{background:#f5f7fa}.nav-tour-drawer>.nav-end-tour{margin-top:auto;color:#6b7280}
#nav-info-body{color:#68716b;font-size:14px;line-height:1.7}#nav-info-body h3{color:#171a21;font-size:19px;font-weight:600}#nav-info-body details{border-bottom:1px solid #eef0f3;padding:15px 0}#nav-info-body summary{font-weight:600;color:#374151;cursor:pointer}.nav-access-options{display:grid;gap:12px;margin:20px 0}.nav-access-options a{display:block;padding:14px;background:#f5f7fa;border-radius:10px;text-decoration:none;color:#1f2937;font-weight:600}
.navigation-focus .tour-stop-pin{cursor:pointer;padding:0}.navigation-focus .tour-stop-pin.has-arrived{background:#171a21;color:#fff;box-shadow:0 0 0 6px #ffffffa6,0 3px 14px #172b2320}.nav-arrival-close{float:right;margin:0 0 12px 12px}.nav-stop-ai{margin:22px 0 16px}.nav-stop-ai>button{display:flex;gap:10px;justify-content:space-between;align-items:center;width:100%;padding:14px;background:#f5f7fa;color:#737b77;border:1px solid #e5e7eb;border-radius:12px;text-align:left;font-size:12px}.nav-stop-ai span{font-size:10px;white-space:nowrap}
@keyframes nav-menu-enter{from{transform:translateX(-100%)}to{transform:translateX(0)}}
@media(max-width:400px){.navigation-focus .nav-stage .nav-prompt{left:12px;right:12px;padding:12px 10px;gap:7px}.nav-back-icon{width:24px}.navigation-focus .nav-prompt #nav-message{font-size:12px}.navigation-focus .nav-kicker{font-size:9px}.navigation-focus .nav-wordmark{font-size:9px}}
@media(prefers-reduced-motion:reduce){.nav-tour-drawer[open]{animation:none}}