/* pantalla.css (23-oct-2026) — pantalla completa en el teléfono + panel plegable del mapa.
   Lo comparten /, /mundo, /base y /pista. Lo carga <link> DESPUÉS del <style> de cada página para ganar en empate. */
html{height:100%}
body{overscroll-behavior:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}

/* Botón «Pantalla completa»: vive dentro de la barra de cada página ([data-pantalla-host]); si no hay barra, flota. */
#pc-btn{appearance:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0;
  height:40px;min-width:40px;padding:0 10px;border:2px solid #4a2e14;border-radius:12px;background:var(--panel,rgba(245,236,214,.92));color:var(--fg,#2b1a0a);
  font:inherit;font-size:14px;font-weight:600;box-shadow:var(--shadow,0 3px 0 #4a2e14);touch-action:manipulation}
#pc-btn svg{width:22px;height:22px;flex-shrink:0}
#pc-btn .tx{display:none}
@media (min-width:900px){#pc-btn{height:44px}#pc-btn .tx{display:inline}}
#pc-btn.flotante{position:fixed;z-index:60;top:calc(10px + env(safe-area-inset-top,0px));right:max(10px,env(safe-area-inset-right,0px))}
#pc-btn.mapa{position:fixed;z-index:7;right:max(12px,env(safe-area-inset-right,0px));bottom:44px;width:44px;height:44px;padding:0;border-radius:50%}
#pc-btn.mapa .tx{display:none}
@media (max-width:899px){#pc-btn.mapa{bottom:calc(var(--panel-h,52vh) + 12px + env(safe-area-inset-bottom,0px))}}
body.pc.es-mapa #pc-salir{display:none}
#pc-btn .ic-salir{display:none}
#pc-btn[aria-pressed="true"] .ic-entrar{display:none}
#pc-btn[aria-pressed="true"] .ic-salir{display:block}

/* Chip para salir cuando la barra está escondida (modo inmersivo) */
#pc-salir{display:none;position:fixed;z-index:60;top:calc(8px + env(safe-area-inset-top,0px));right:max(8px,env(safe-area-inset-right,0px));
  appearance:none;cursor:pointer;align-items:center;gap:6px;height:36px;padding:0 10px 0 8px;border:2px solid #4a2e14;border-radius:999px;
  background:rgba(245,236,214,.82);color:#2b1a0a;font:600 13px/1 system-ui,sans-serif;box-shadow:0 2px 0 #4a2e14;backdrop-filter:blur(4px);touch-action:manipulation}
#pc-salir svg{width:18px;height:18px}
body.pc #pc-salir{display:inline-flex}

/* Modo inmersivo en el MAPA: se esconde la barra de arriba y la hora; el panel se queda plegado a sus pestañas. */
/* En inmersivo se esconden logo, sitios, enlaces, hora y buscador. En escritorio se quedan los tres botones redondos
   (ubicación · a pie · capas) arriba a la derecha; en teléfono esos tres viven desde el 24-oct en la columna del pulgar
   (#pulgar, fuera de la barra), así que ahí la barra entera se va. */
body.pc #hora-lugar,body.pc #nubes,body.pc #barra .logo,body.pc #barra .sitios,body.pc #barra .enlace,body.pc #barra .bus-caja,body.pc #bus-res{display:none!important}
body.pc #barra{padding-top:calc(8px + env(safe-area-inset-top,0px))}
@media (max-width:899px){body.pc.es-mapa #barra{display:none!important}}
body.pc #barra .bus{flex:0 0 auto;order:0;margin-left:auto}

/* Panel del mapa en teléfono: tres alturas (min = solo pestañas · medio · alto) y un asa visible para plegarlo. */
#asa{display:none}
@media (max-width:899px){
  #panel{transition:max-height .22s ease}
  #asa{display:flex;align-items:center;justify-content:center;gap:8px;height:30px;flex-shrink:0;cursor:pointer;user-select:none;touch-action:none;
    color:var(--muted,#6b5538);font:600 12px/1 system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid var(--line,rgba(74,46,20,.18))}
  #asa i{display:block;width:40px;height:5px;border-radius:3px;background:#4a2e14;opacity:.55}
  #asa svg{width:16px;height:16px;transition:transform .2s}
  #panel[data-estado="medio"] #asa svg,#panel[data-estado="alto"] #asa svg{transform:rotate(180deg)}
  #panel[data-estado="min"] .cuerpo{display:none}
  #panel[data-estado="min"]{max-height:none}
  #panel[data-estado="medio"]{max-height:52vh;max-height:min(52vh,calc(var(--vvh,100vh) - 120px - env(safe-area-inset-top,0px)))}
  #panel[data-estado="alto"]{max-height:calc(var(--vvh,100vh) - 64px - env(safe-area-inset-top,0px));height:calc(var(--vvh,100vh) - 64px - env(safe-area-inset-top,0px))}
  /* El reloj del mapa sube arriba de «Contar una aventura» (52 px + 12 de aire + 10): antes compartían
     la misma banda sobre el borde del panel y el botón lo tapaba (revisión 0b, 25-oct). */
  #hora-lugar{bottom:calc(var(--panel-h,52vh) + 74px)}
  body.pc #panel[data-estado="min"] .tabs{opacity:.92}
}

/* Aviso de iPhone: Safari no da pantalla completa; se instala en la pantalla de inicio. */
#pc-aviso{position:fixed;inset:0;z-index:80;display:none;align-items:flex-end;justify-content:center;background:rgba(20,12,4,.45);padding:0 10px max(10px,env(safe-area-inset-bottom,0px))}
#pc-aviso.abierto{display:flex}
#pc-aviso .hoja{width:min(440px,100%);background:#f5ecd6;color:#2b1a0a;border:2px solid #4a2e14;border-radius:18px;box-shadow:0 10px 30px rgba(0,0,0,.35);padding:16px 16px 14px;font:15px/1.4 system-ui,sans-serif}
#pc-aviso h3{margin:0 0 6px;font:700 17px/1.2 Georgia,serif}
#pc-aviso ol{margin:8px 0 12px;padding-left:20px}
#pc-aviso li{margin:4px 0}
#pc-aviso svg{width:18px;height:18px;vertical-align:-3px}
#pc-aviso button{appearance:none;cursor:pointer;width:100%;height:42px;border:2px solid #4a2e14;border-radius:10px;background:#d9552b;color:#fff;font:600 15px system-ui,sans-serif;box-shadow:0 3px 0 #4a2e14}