/* Trailmark mobile interface overrides — v3.0.6 */
:root{
  --tm-mobile-title-size:1.65rem;
  --tm-mobile-subtitle-size:1.12rem;
  --tm-mobile-menu-size:1.12rem;
  --tm-mobile-toast-size:1.18rem;
  --tm-mobile-popup-size:1.2rem;
  /* Increase this value to lift the menu; reduce it to move the menu down. */
  --tm-bottom-menu-offset:.45rem;
}
.topbar{
  left:50%;
  right:auto;
  width:min(96vw,820px);
  min-height:96px;
  padding:calc(.82rem + var(--safe-top)) 1rem .82rem;
  grid-template-columns:70px minmax(0,1fr) 66px;
  gap:.85rem;
  transform:translateX(-50%);
  border-radius:0 0 20px 20px;
}
.org-button,.info-button{width:64px;height:64px;font-size:1.55rem}
.org-button img{width:60px;height:60px}
.trail-title strong{font-size:var(--tm-mobile-title-size)}
.trail-title span{margin-top:.25rem;font-size:var(--tm-mobile-subtitle-size)}

.controls{
  grid-template-columns:repeat(3,minmax(0,1fr));
  width:min(94vw,760px);
  gap:.5rem;
  padding:.58rem;
  border-radius:21px;
}
.control{
  min-height:70px;
  padding:.55rem .3rem;
  border-radius:14px;
  font-size:var(--tm-mobile-menu-size);
  line-height:1.15;
  text-transform:uppercase;
}
.control[disabled]{opacity:.48}
.control[aria-pressed=true]{box-shadow:inset 0 0 0 3px rgba(0,0,0,.22)}
.map-tools{bottom:calc(176px + var(--safe-bottom))}
.map-tool{width:54px;height:54px;font-size:1.35rem}
.route-status{top:calc(110px + var(--safe-top));max-width:92vw;padding:.85rem 1.2rem;font-size:var(--tm-mobile-toast-size);line-height:1.25}

/* Story, information, organisation, scanner and hint dialogs. */
.sheet-card{
  top:50%;
  bottom:auto;
  left:50%;
  right:auto;
  width:min(92vw,680px);
  max-height:min(82dvh,780px);
  padding:1.35rem 1.35rem calc(1.45rem + var(--safe-bottom));
  transform:translate(-50%,-50%);
  border-radius:24px;
  font-size:var(--tm-mobile-popup-size);
}
.sheet-head{align-items:center}
.sheet-head h2{font-size:clamp(1.45rem,5vw,1.9rem);line-height:1.2}
.sheet-head small{font-size:.9rem;font-weight:800}
.sheet-close{
  width:58px;
  height:58px;
  font-size:1.75rem;
  line-height:1;
}
.sheet p{font-size:var(--tm-mobile-popup-size);line-height:1.65}
.media-item figcaption{font-size:1.05rem}
.switch-camera{min-height:54px;font-size:1rem}

/* Map marker popups. */
.mapboxgl-popup{max-width:min(82vw,330px)!important}
.mapboxgl-popup-content{
  min-width:190px;
  padding:1.2rem 1.15rem 1rem!important;
  border-radius:15px!important;
  font-size:var(--tm-mobile-popup-size);
  box-shadow:0 12px 35px rgba(0,0,0,.28)!important;
}
.mapboxgl-popup-close-button{
  width:44px;
  height:44px;
  font-size:1.7rem;
  line-height:1;
  color:var(--tm-text);
}
.stop-popup{display:grid;gap:.72rem;min-width:185px;padding-top:.35rem;font-size:var(--tm-mobile-popup-size)}
.stop-popup strong{padding-right:1.5rem;font-size:1.32rem;line-height:1.25}
.popup-hint{min-height:48px;padding:.65rem;border:0;border-radius:10px;background:var(--tm-menu);color:var(--tm-text);font-size:.95rem;font-weight:800;text-transform:uppercase;cursor:pointer}
.hint-image{display:block;width:100%;max-height:62vh;margin-top:1rem;object-fit:contain;border-radius:14px;background:#101718}

@media(max-width:520px){
  .topbar{width:100%;min-height:82px;border-radius:0 0 18px 18px}
  .controls{bottom:calc(.45rem + var(--safe-bottom));gap:.38rem;padding:.48rem}
  .control{min-height:66px;font-size:var(--tm-mobile-menu-size)}
  .map-tools{bottom:calc(166px + var(--safe-bottom))}
  .sheet-card{width:calc(100vw - 1rem);max-height:84dvh;padding:1.2rem}
}

@media(max-width:390px){
  .topbar{grid-template-columns:58px minmax(0,1fr) 54px;padding-left:.65rem;padding-right:.65rem}
  .org-button,.info-button{width:52px;height:52px}
  .org-button img{width:48px;height:48px}
  .controls{width:calc(100vw - .7rem)}
  .control{min-height:64px;padding:.45rem .12rem;font-size:var(--tm-mobile-menu-size)}
}

/* Some Android browsers expose a wide layout viewport despite being touch devices. */
@media(pointer:coarse){
  .topbar{width:min(96vw,860px)}
  .controls{bottom:calc(var(--tm-bottom-menu-offset) + var(--safe-bottom));width:min(94vw,800px)}
  .control{min-height:70px;font-size:var(--tm-mobile-menu-size)}
  .map-tools{bottom:calc(var(--tm-bottom-menu-offset) + 10.75rem + var(--safe-bottom))}
  .sheet-close{width:60px;height:60px;font-size:1.85rem}
}
.model-launch{display:grid;gap:.75rem}.model-launch img,.spur-map-image{display:block;width:100%;max-height:45vh;object-fit:contain;border-radius:12px}.model-viewer{display:block;width:100%;height:min(60vh,520px);background:#eef1f1;border-radius:12px}.spur-sheet .action-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-top:1rem}
