/* The icon column stays fixed in collapsed, hover and pinned states. */
.desktop-sidebar-rail {
  --sidebar-expanded-width: 272px;
  display: none;
  position: relative;
  /* Root-level navigation sits above page headers, floating tools and dialogs. */
  z-index: 20000;
  flex: 0 0 64px;
  width: 64px;
  height: 100%;
  transition: flex-basis 220ms cubic-bezier(.2,.8,.2,1), width 220ms cubic-bezier(.2,.8,.2,1);
}
.desktop-sidebar-rail[data-pinned='true'] { flex-basis: var(--sidebar-expanded-width); width: var(--sidebar-expanded-width); }
@media (min-width: 1280px) { .desktop-sidebar-rail { display: block; } }
.desktop-sidebar-panel {
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 64px;
  overflow: hidden;
  color: #344f45;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: rgb(242 250 246 / 78%);
  border-right: 1px solid rgb(126 163 145 / 13%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
  backdrop-filter: blur(18px) saturate(125%);
  box-shadow: 2px 0 12px rgb(20 60 43 / 3%);
  transition: width 220ms cubic-bezier(.2,.8,.2,1), background-color 220ms ease, box-shadow 220ms ease;
}
.desktop-sidebar-panel[data-expanded='true'] {
  width: var(--sidebar-expanded-width);
  background: rgb(241 250 245 / 68%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
  backdrop-filter: blur(18px) saturate(125%);
  border-right-color: rgb(255 255 255 / 58%);
  box-shadow: 14px 0 38px -18px rgb(22 63 45 / 24%), inset -1px 0 rgb(255 255 255 / 38%);
}
.desktop-sidebar-panel button:focus-visible { outline: 2px solid #229b73; outline-offset: -2px; }
/* Absolute offsets keep the click target still when the brand appears. */
.desktop-sidebar-panel .sidebar-header { position: relative; flex-shrink: 0; height: 58px; min-height: 58px; padding: 0; }
.desktop-sidebar-panel .sidebar-pin-button {
  position: absolute; left: 14px; top: 11px;
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; padding: 8px; border-radius: 10px;
  color: #567467; background: transparent;
  transition: background-color 140ms ease, color 140ms ease;
}
.desktop-sidebar-panel .sidebar-pin-button:hover { background: rgb(255 255 255 / 65%); color: #177755; }
.desktop-sidebar-panel[data-pinned='true'] .sidebar-pin-button { background: rgb(186 229 207 / 48%); color: #177755; }
.desktop-sidebar-panel .sidebar-brand {
  position: absolute; left: 64px; top: 0; height: 58px;
  display: flex; align-items: center; gap: 8px; padding: 0; white-space: nowrap;
}
.desktop-sidebar-panel .sidebar-brand > span { font-size: 18px; font-weight: 600; letter-spacing: -.6px; color: #275744; }
.desktop-sidebar-panel > .soft-scrollbar { min-height: 0; padding: 4px 8px 8px; }
.desktop-sidebar-panel .sidebar-user-chip { justify-content: flex-start; padding: 6px 14px; margin: 0 0 10px; border-radius: 10px; }
.desktop-sidebar-panel .sidebar-user-chip > div:first-child { flex-shrink: 0; background: #d7eee2 !important; color: #267354 !important; }
.desktop-sidebar-panel .sidebar-nav-item {
  display: grid; grid-template-columns: 20px minmax(0, 1fr) auto;
  align-items: center; justify-content: start; column-gap: 12px;
  min-height: 40px; margin: 2px 0; padding: 9px 14px; border-radius: 10px;
  background: transparent; color: #415e51;
  transition: background-color 140ms ease, box-shadow 140ms ease;
}
.desktop-sidebar-panel[data-expanded='false'] .sidebar-nav-item { grid-template-columns: 20px; column-gap: 0; }
.desktop-sidebar-panel .sidebar-nav-icon { margin: 0; width: 20px; height: 20px; color: #678375; }
.desktop-sidebar-panel .sidebar-nav-icon svg { width: 20px; height: 20px; stroke-width: 1.65; }
.desktop-sidebar-panel .sidebar-nav-label { margin: 0; text-align: left; color: #395548; font-size: 14px; font-weight: 400; line-height: 20px; letter-spacing: 0; white-space: nowrap; }
.desktop-sidebar-panel .sidebar-nav-item:hover { background: rgb(255 255 255 / 55%); }
.desktop-sidebar-panel .sidebar-nav-item:hover :is(.sidebar-nav-icon, .sidebar-nav-label) { color: #187957; }
.desktop-sidebar-panel .sidebar-nav-item[aria-current='page'] { background: rgb(179 229 201 / 42%); box-shadow: inset 0 0 0 1px rgb(69 150 111 / 7%); }
.desktop-sidebar-panel .sidebar-nav-item[aria-current='page'] :is(.sidebar-nav-icon, .sidebar-nav-label) { color: #116c4b; }
.desktop-sidebar-panel .sidebar-nav-item[aria-current='page'] .sidebar-nav-label { font-weight: 500; }
.desktop-sidebar-panel .sidebar-nav-item > div.absolute { display: none; }
.desktop-sidebar-panel .sidebar-footer { flex-shrink: 0; padding: 10px 8px; border-color: rgb(113 157 134 / 12%); background: rgb(226 242 232 / 22%); backdrop-filter: none; }
.desktop-sidebar-panel .sidebar-footer > div { gap: 4px; }
.desktop-sidebar-panel .sidebar-footer > div > * { margin-top: 0; }
.desktop-sidebar-panel .sidebar-footer button { border-radius: 10px; }
.desktop-sidebar-panel .sidebar-footer > div > div.relative > button { justify-content: flex-start; padding-left: 14px; min-height: 36px; white-space: nowrap; }
.desktop-sidebar-panel .sidebar-footer > div > div.relative > button > svg { width: 20px; height: 20px; flex-shrink: 0; stroke-width: 1.65; }
/* Keep the native gutter stable as the scrollbar appears. */
.desktop-sidebar-panel .soft-scrollbar, html.dark .desktop-sidebar-panel .soft-scrollbar { --scroll-thumb: transparent; --scroll-thumb-hover: transparent; }
.desktop-sidebar-panel:hover .soft-scrollbar, .desktop-sidebar-panel:has(:focus-visible) .soft-scrollbar { --scroll-thumb: rgb(92 120 105 / 38%); --scroll-thumb-hover: rgb(92 120 105 / 55%); }
html.dark .desktop-sidebar-panel:hover .soft-scrollbar, html.dark .desktop-sidebar-panel:has(:focus-visible) .soft-scrollbar { --scroll-thumb: rgb(173 201 185 / 38%); --scroll-thumb-hover: rgb(173 201 185 / 55%); }
html.dark .desktop-sidebar-panel { background: rgb(19 37 29 / 82%); border-color: rgb(166 198 182 / 12%); }
html.dark .desktop-sidebar-panel[data-expanded='true'] { background: rgb(19 37 29 / 76%); box-shadow: 14px 0 38px -18px rgb(0 0 0 / 45%); }
html.dark .desktop-sidebar-panel .sidebar-brand > span { color: #d4e9de; }
html.dark .desktop-sidebar-panel .sidebar-nav-label { color: #d0e1d7; }
html.dark .desktop-sidebar-panel .sidebar-nav-icon, html.dark .desktop-sidebar-panel .sidebar-pin-button { color: #a3c1af; }
html.dark .desktop-sidebar-panel .sidebar-pin-button:hover, html.dark .desktop-sidebar-panel .sidebar-nav-item:hover { background: rgb(184 221 201 / 10%); }
html.dark .desktop-sidebar-panel[data-pinned='true'] .sidebar-pin-button, html.dark .desktop-sidebar-panel .sidebar-nav-item[aria-current='page'] { background: rgb(70 157 113 / 24%); }
html.dark .desktop-sidebar-panel .sidebar-nav-item:is(:hover, [aria-current='page']) :is(.sidebar-nav-label, .sidebar-nav-icon), html.dark .desktop-sidebar-panel[data-pinned='true'] .sidebar-pin-button { color: #90e2b9; }
html.dark .desktop-sidebar-panel .sidebar-footer { background: rgb(10 23 16 / 18%); border-color: rgb(166 198 182 / 12%); }
@supports not (backdrop-filter: blur(1px)) {
  .desktop-sidebar-panel, .desktop-sidebar-panel[data-expanded='true'] { background: #f0f8f3; }
  html.dark .desktop-sidebar-panel, html.dark .desktop-sidebar-panel[data-expanded='true'] { background: #172c21; }
}
@media (hover: none), (forced-colors: active) {
  .desktop-sidebar-panel .soft-scrollbar, html.dark .desktop-sidebar-panel .soft-scrollbar { --scroll-thumb: #728e7e; --scroll-thumb-hover: #728e7e; }
}
@media (prefers-reduced-motion: reduce) {
  .desktop-sidebar-rail, .desktop-sidebar-panel, .desktop-sidebar-panel .sidebar-nav-item, .desktop-sidebar-panel .sidebar-pin-button { transition: none; }
}
@media (forced-colors: active) {
  .desktop-sidebar-panel, .desktop-sidebar-panel[data-expanded='true'] { background: Canvas; border-right: 1px solid CanvasText; }
  .desktop-sidebar-panel .sidebar-nav-item[aria-current='page'], .desktop-sidebar-panel .sidebar-pin-button[aria-pressed='true'] { outline: 1px solid Highlight; }
}