/* Desktop navigation: a floating vertical panel on the left. Below 981px the top pill and bottom dock stay as they are. */
.sidebar { display: none; }
@media (min-width: 981px) {
  :root { --sb-w: 272px; --sb-wc: 76px; --sb-gap: 28px; }
  .hud-top, .dock { display: none !important; }
  .sidebar {
    display: flex; flex-direction: column; gap: 10px; position: fixed; z-index: var(--z-top, 50); top: 14px; left: 14px; bottom: 14px; width: var(--sb-w);
    padding: 12px; border-radius: 22px; background: var(--glass, var(--panel)); border: 1px solid var(--glass-line, var(--line-soft));
    -webkit-backdrop-filter: blur(22px) saturate(160%); backdrop-filter: blur(22px) saturate(160%); box-shadow: var(--lift, 0 24px 50px -28px rgba(0, 0, 0, .6));
    transition: width .22s var(--ease-out, ease); overflow: hidden;
  }
  .sidebar.collapsed { width: var(--sb-wc); }
  .main-col { margin-left: calc(var(--sb-w) + var(--sb-gap) + 14px); padding-top: 28px; transition: margin-left .22s var(--ease-out, ease); }
  .sb-collapsed .main-col { margin-left: calc(var(--sb-wc) + var(--sb-gap) + 14px); }
  main { padding-left: 0; padding-right: 28px; }
  .crumbs { padding-left: 0; }

  .sb-head { display: flex; align-items: center; gap: 8px; min-height: 44px; }
  .sb-brand { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; color: inherit; text-decoration: none; }
  .sb-brand .wm { display: flex; flex-direction: column; line-height: 1.05; } .sb-brand .wm b { letter-spacing: .2em; font-size: 14px; } .sb-brand .wm small { letter-spacing: .3em; font-size: 8.5px; color: var(--text-3); }
  .sb-icon { width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 11px; background: transparent; color: var(--text-2); }
  .sb-icon:hover, .sb-search:hover { background: var(--panel-2); color: var(--text); }
  .sb-search { height: 38px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border-radius: 12px; background: var(--panel-2); border: 1px solid var(--line-soft); color: var(--text-2); font: 500 13px var(--f-body); }
  .sb-search kbd { margin-left: auto; font: 500 11px var(--f-mono); color: var(--text-3); border: 1px solid var(--line-soft); border-radius: 6px; padding: 1px 6px; }
  .sb-cta { height: 40px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 12px; background: linear-gradient(135deg, var(--accent), var(--accent-3)); color: var(--accent-ink); font: 600 13px var(--f-body); }
  .sb-cta:hover { filter: brightness(1.08); }

  .sb-tree { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; margin: 0 -6px; padding: 0 6px 6px; scrollbar-width: thin; scrollbar-color: var(--line-soft) transparent; }
  .sb-title { padding: 14px 10px 6px; font: 600 10.5px var(--f-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--text-3); }
  .sb-row { display: flex; align-items: center; border-radius: 12px; position: relative; transition: background .15s; }
  .sb-row:hover { background: var(--panel-2); }
  .sb-btn { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; height: 38px; padding: 0 10px; border: 0; background: transparent; color: var(--text-2); font: 500 13.5px var(--f-body); border-radius: 12px; text-align: left; }
  .sb-btn:hover, .sb-row.in .sb-btn { color: var(--text); }
  .sb-lb { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sb-row.on { background: linear-gradient(135deg, rgba(182, 156, 255, .30), rgba(124, 58, 237, .24)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); }
  .sb-row.on .sb-btn { color: var(--text); }
  .sb-chev { width: 28px; height: 28px; margin-right: 4px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: var(--text-3); }
  .sb-chev:hover { background: var(--raise); color: var(--text); }
  .sb-chev svg { transition: transform .2s; } .sb-chev.open svg { transform: rotate(90deg); }
  .sb-sub { margin: 2px 0 6px 20px; padding-left: 8px; border-left: 1px solid var(--line-soft); }
  .sb-row.d1 .sb-btn, .sb-row.d2 .sb-btn { height: 32px; font-size: 13px; }
  .sb-row.d2 .sb-btn { font-size: 12.5px; color: var(--text-3); }
  .sb-sub .sb-sub { margin-left: 14px; }
  .sb-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--text-3); flex: none; margin: 0 4px; }
  .sb-row.on .sb-dot { background: var(--accent); }
  .sb-btn .orb { width: 9px; height: 9px; margin: 0 3px; }
  .sb-btn .pip { position: static; margin-left: auto; }

  .sb-foot { display: flex; align-items: center; gap: 6px; padding-top: 10px; border-top: 1px solid var(--line-soft); }
  .sidebar .live { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; font: 500 11.5px var(--f-body); color: var(--text-3); }
  .sidebar .live span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sidebar .live i { width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--ok); box-shadow: 0 0 10px var(--ok); }
  .sidebar .live.stale i { background: var(--warn); box-shadow: 0 0 10px var(--warn); } .sidebar .live.dead i { background: var(--bad); box-shadow: 0 0 10px var(--bad); }
  .sb-tools { display: flex; gap: 2px; }

  /* shrunk: icons only */
  .sidebar.collapsed .sb-lb, .sidebar.collapsed .sb-chev, .sidebar.collapsed .sb-sub, .sidebar.collapsed .sb-title, .sidebar.collapsed .live span, .sidebar.collapsed .sb-search kbd { display: none; }
  .sidebar.collapsed .sb-head { flex-direction: column; } .sidebar.collapsed .sb-brand { flex: none; justify-content: center; }
  .sidebar.collapsed .sb-btn, .sidebar.collapsed .sb-search, .sidebar.collapsed .sb-cta { justify-content: center; padding: 0; }
  .sidebar.collapsed .sb-sec + .sb-sec { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); }
  .sidebar.collapsed .sb-foot { flex-direction: column; } .sidebar.collapsed .sb-tools { flex-direction: column; }
  .sidebar.collapsed .sb-btn .pip { position: absolute; top: 2px; right: 6px; margin: 0; }
}
@media (prefers-reduced-motion: reduce) { .sidebar, .main-col, .sb-chev svg { transition: none; } }
