html, body { height: 100%; }
.bo-file-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bo-clima { font-variant-emoji: text; }
.bo-clima-glifo {
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols 2", "Noto Sans Symbols", var(--font-sans);
  font-variant-emoji: text;
  font-style: normal;
  font-weight: 400;
  font-synthesis: none;
}
.app-shell { min-height: 100dvh; }
button.bo-btn,
a.bo-btn {
  box-sizing: border-box;
  flex-shrink: 0;
  border-radius: var(--radius-pill);
  font-family: var(--font-sans);
  font-weight: var(--weight-semi);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  cursor: pointer;
  text-decoration: none;
}
button.bo-btn[disabled] { opacity: 0.45; cursor: default; }
button.bo-btn-block,
a.bo-btn-block { width: 100%; }
button.bo-chip { appearance: none; border-radius: var(--radius-pill); font-family: var(--font-sans); cursor: pointer; }
.bo-card { box-sizing: border-box; width: 100%; border-radius: var(--radius-card); }
.bo-sheet-scrim { position: fixed; inset: 0; z-index: 30; background: color-mix(in srgb, var(--surface-dark) 40%, transparent); display: flex; align-items: flex-end; overflow: hidden; }
.bo-sheet { background: var(--surface-card); border-radius: var(--radius-card) var(--radius-card) 0 0; width: 100%; max-height: min(660px, 85dvh); min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
.bo-sheet-etapa { border-radius: var(--radius-sheet) var(--radius-sheet) 0 0; }
.bo-sheet-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: var(--space-4); padding-bottom: max(var(--space-4), env(safe-area-inset-bottom)); }
.bo-sheet-etapa .bo-sheet-body,
.bo-sheet-pad .bo-sheet-body { padding: var(--pad-sheet); padding-bottom: max(26px, env(safe-area-inset-bottom)); }
.bo-sheet-handle { display: flex; justify-content: center; padding: 4px 0 12px; cursor: grab; touch-action: none; }
.bo-sheet-handle::after { content: ""; width: 44px; height: 4px; border-radius: var(--radius-pill); background: var(--border-hairline); }
.bo-toast { position: fixed; left: var(--space-4); right: var(--space-4); background: var(--surface-dark); color: var(--text-on-dark); border-radius: var(--radius-pill); padding: var(--space-3); text-align: center; }
.bo-map { min-height: 240px; border-radius: var(--radius-card); position: relative; z-index: 0; isolation: isolate; overflow: hidden; }
.bo-map-chrome { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); background: var(--surface-card); z-index: 1; }
.bo-map-chrome-overlay { background: transparent; pointer-events: none; align-items: flex-end; padding: 8px 14px 10px; }
.bo-map-chrome-overlay .bo-map-action { pointer-events: auto; margin-left: auto; }
.bo-map-caption { flex: 1; font: var(--type-meta); color: var(--text-muted); }
.bo-map-chrome-overlay .bo-map-caption { color: var(--text-on-dark); text-shadow: 0 1px 2px rgba(28, 25, 23, .55); padding-bottom: 2px; }
.bo-map-chrome-overlay .bo-btn { height: 26px !important; min-height: 26px !important; padding: 0 12px !important; font-size: var(--text-small) !important; }
.leaflet-div-icon.bo-map-pin { background: transparent !important; border: 0 !important; width: 0 !important; height: 0 !important; margin: 0 !important; overflow: visible !important; }
.leaflet-div-icon.bo-map-live { background: transparent !important; border: 0 !important; width: 14px !important; height: 14px !important; margin: 0 !important; }
.bo-map-live-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--bo-terracotta); box-shadow: 0 0 0 2px var(--surface-card), var(--shadow-float); pointer-events: none; }
.leaflet-div-icon.bo-map-peer { background: transparent !important; border: 0 !important; width: 0 !important; height: 0 !important; margin: 0 !important; overflow: visible !important; }
.bo-map-peer-chip { position: absolute; left: 0; top: 0; transform: translate(-50%, calc(-100% - 8px)); box-sizing: border-box; background: var(--surface-card); color: var(--text-body); border-radius: var(--radius-pill); padding: 6px 10px; font: var(--weight-semi) var(--text-small)/1 var(--font-sans); box-shadow: var(--shadow-float); white-space: nowrap; pointer-events: none; }
.bo-map-pin-chip { position: absolute; left: 0; top: 0; transform: translate(-50%, calc(-100% - 4px)); display: flex; align-items: center; gap: 8px; box-sizing: border-box; border: 0; background: var(--surface-card); color: var(--text-body); border-radius: var(--radius-pill); padding: 8px 14px 8px 10px; font: var(--weight-semi) var(--text-small)/1 var(--font-sans); box-shadow: var(--shadow-float); white-space: nowrap; pointer-events: auto; }
.bo-map-pin-chip.bo-map-pin-active { background: var(--surface-dark); color: var(--text-on-dark); }
.bo-map-pin-n { width: 20px; height: 20px; flex: 0 0 20px; border-radius: var(--radius-pill); background: var(--surface-dark); color: var(--text-on-dark); display: flex; align-items: center; justify-content: center; font: 400 12px/1 var(--font-sans); }
.bo-map-pin-active .bo-map-pin-n { background: var(--accent-highlight); color: var(--accent-highlight-text); }
.bo-map-pin-time { background: none; padding: 0; color: inherit; font: inherit; }
.bo-stay-pin { position: absolute; left: 0; top: 0; transform: translate(-50%, -100%); display: flex; align-items: center; gap: 8px; box-sizing: border-box; border: 1px solid var(--action-primary); background: light-dark(#F8E6DC, #2E1E17); color: var(--text-body); border-radius: var(--radius-pill); padding: 7px 13px 7px 9px; font: var(--weight-semi) var(--text-small)/1 var(--font-sans); box-shadow: var(--shadow-float); white-space: nowrap; pointer-events: auto; cursor: pointer; }
.bo-stay-pin-mark { width: 20px; height: 20px; flex: 0 0 20px; border-radius: var(--radius-pill); background: var(--action-primary); color: var(--text-on-dark); display: flex; align-items: center; justify-content: center; font: 400 12px/1 var(--font-sans); }
.bo-progress { overflow: hidden; }
.bo-progress-indet > div { animation: bo-indet 1.1s ease-in-out infinite; }
@keyframes bo-indet {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(280%); }
}