/* Top navigation: on desktop the former side menu becomes a bar across the top.
   Tablet and phone keep the slide-in drawer from polish.css. */
@media (min-width: 1051px) {
  body, body.nav-collapsed { --sidebar: 0px !important; --sidebar-w: 0px !important; --topnav: 58px; padding-top: var(--topnav); }
  body.presentation, body.stream-view { padding-top: 0; }
  body.presentation #sidebar, body.stream-view #sidebar { display: none; }

  #sidebar {
    inset: 0 0 auto 0; width: auto; height: var(--topnav);
    flex-direction: row; align-items: center; gap: 4px;
    padding: 0 22px; overflow: visible;
    background: linear-gradient(90deg, var(--side-a), var(--side-b));
    border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    box-shadow: 0 6px 24px -14px rgba(0, 0, 0, 0.5);
  }
  #sidebar .sidebar-top { min-height: 0; margin-right: 14px; flex: none; }
  #sidebar .brand { font-size: 26px; padding: 0; }
  #sidebar .brand-mark { width: 34px; height: 34px; font-size: 22px; border-radius: 11px; }

  /* Things that only make sense in a tall column */
  #sidebar .workspace-label, #sidebar .nav-label, #sidebar .side-wheels-wrap,
  #sidebar .tip-card, #sidebar .sidebar-status, #sidebar .nav-tag,
  .nav-edge, .nav-toggle { display: none !important; }

  #sidebar .side-nav { display: flex; flex-direction: row; align-items: center; gap: 2px; margin: 0; flex: none; }
  #sidebar .side-nav button {
    min-height: 38px; padding: 8px 13px; border-radius: 10px;
    animation: none; overflow: visible;
  }
  #sidebar .side-nav button:hover { transform: none; }
  #sidebar .side-nav button .nav-text { padding-left: 9px; max-width: none; }
  #sidebar .side-nav button.selected { background: rgba(255, 255, 255, 0.1); box-shadow: none; }
  #sidebar .side-nav button.selected::before { left: 12px; right: 12px; top: auto; bottom: 0; width: auto; height: 2px; border-radius: 2px; }

  /* Quick tools: icons only (names show as tooltips), set apart from the main menu */
  #sidebar nav.side-nav { margin-right: 10px; padding-right: 12px; border-right: 1px solid rgba(255, 255, 255, 0.12); }
  #sidebar div.side-nav button .nav-text { display: none; }
  #sidebar div.side-nav button { padding: 8px 10px; }
  #sidebar div.side-nav #all-tools .nav-text { display: inline; font-size: 13px; }
  #sidebar div.side-nav #all-tools .tool-count { display: none; }

  #sidebar .sidebar-bottom { display: flex; align-items: center; gap: 4px; margin: 0 0 0 auto; padding: 0; }
  #sidebar .help-link { width: auto; min-height: 38px; padding: 8px 12px; }
  #sidebar .help-link .nav-text, #sidebar .help-link kbd { display: none; }

  body header.app-header { top: var(--topnav); margin-left: 0; }
  body main { margin-left: 0; padding-top: 14px; }
  .intro:empty { display: none; }
  .app-header .cloud-toolbar { margin: 0 auto 0 14px; min-height: 0; flex: none; }
  .app-header .cloud-toolbar #db-status { padding: 6px 12px; }
  .app-header .cloud-toolbar > button { padding: 6px 12px; }
}

/* Narrower desktops: keep the bar on one line */
@media (min-width: 1051px) and (max-width: 1280px) {
  #sidebar nav.side-nav button .nav-text { font-size: 13px; }
  #sidebar nav.side-nav button { padding: 8px 10px; }
  #sidebar div.side-nav #all-tools .nav-text { display: none; }
}