/* Home header must size to its controls, including the injected view toolbar. */
.df-home .df-app > .df-topbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 20px;
  height: auto;
  min-height: 56px;
  /* MOBIL AUDIT 24.9. kolo 3b: 0,3,0 prebijal mobilny safe-area padding zo styles.css -> logo +
     ONLINE pod status barom / vyrezom kamery. Desktop: vsetky insety 0 = bez zmeny. */
  padding: max(8px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 8px max(16px, env(safe-area-inset-left));
  overflow: visible;
}
.df-home .df-topbar .df-topbar-left {
  flex: 0 0 auto;
  min-width: 0;
}
.df-home .df-topbar .df-topbar-center {
  display: flex;
  flex: 1 0 220px;
  min-width: 0;
}
.df-home .df-topbar .df-wordmark { white-space: nowrap; }
.df-home .df-topbar .df-wordmark-sep { flex: 0 1 30px; }
.df-home .df-topbar .df-topbar-right {
  flex: 0 1 auto;
  margin-left: auto;
  max-width: 100%;
  min-width: 0;
  flex-wrap: wrap;
  gap: 8px;
}
.df-home .df-topbar .df-topbar-right > * { flex-shrink: 0; }
.df-home .df-topbar .home-tools { flex-wrap: wrap; gap: 6px; min-width: 0; max-width: 100%; }
.df-home .df-topbar .home-tool { font-size: 10px; padding: 6px 9px; }
.df-home .df-topbar .df-cmd-btn { white-space: nowrap; }
.df-home .df-topbar #weather { flex-shrink: 1; }
/* Let a wrapped header reserve its own space instead of covering the cockpit. */
.df-home .df-app { grid-template-rows: auto 84px minmax(0, 1fr) 26px; }
.df-home .df-app.gridded { grid-template-rows: auto minmax(0, 1fr) 26px; }
.df-home[data-cockpit="next"] .df-app.gridded { grid-template-rows: auto 84px minmax(0, 1fr) 28px; }
.df-home[data-bridge="bridge"] .df-app.gridded { grid-template-rows: auto minmax(0, 1fr) 28px; }
@media (max-width: 768px), (pointer: coarse) {
  .df-home .df-topbar .df-topbar-center { display: none; }
  .df-home .df-topbar .df-topbar-left { flex: 1 1 100%; justify-content: space-between; }
  .df-home .df-topbar .df-topbar-right { flex: 1 1 100%; margin: 0; justify-content: flex-start; }
}
/* Dotyk (24.9.2026): Mostik/Kokpit select, Najst, Povodny vzhlad boli 10px (home-cockpit @1100
   az 8px/5px) = ~22px hitbox -> na Folde mis-tapy. Min 44px ako .df-cmd-btn touch blok. */
@media (pointer: coarse) {
  .df-home .df-topbar .home-tool { min-height: 44px; font-size: 12px; padding: 8px 12px; }
}

/* web-other i3 (25.9.): index ma viewport-fit=cover + priehladny status bar, ale .df-topbar nie je
   sticky -> jej safe-area padding odscrolluje a situacie / orb / cisla jazdili pod hodinami a baterkou
   (svetla tema: tmavy orb pod tmavymi ikonami). Fixny scrim ako band stranky (fuego-shell) a wiki:
   inherit = aktualne pozadie body (bridge/cockpit/light), podla neho SYSTEM_BARS_SYNC voli farbu ikon.
   z 45: nad obsahom, pod dialogmi/loginom/voice widgetom (50+). Desktop: inset 0 = nic. */
.df-home body::before {
  content: "";
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  height: env(safe-area-inset-top, 0px);
  background: inherit;
  z-index: 45;
  pointer-events: none;
}