/* Shared sidebar geometry: appearance changes colors, never spacing or sizing. */
html[data-theme] #drawer {
  padding:18px 12px calc(18px + env(safe-area-inset-bottom,0px));
  gap:2px;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:var(--line) transparent;
}
html[data-theme] #drawer .drawer-head {
  flex-shrink:0;
  min-height:44px;
  padding:2px 4px 14px;
}
html[data-theme] #drawer .drawer-brand {gap:7px}
html[data-theme] #drawer .brand-name {
  font-family:var(--display);
  font-size:20px;
  font-weight:400;
  line-height:28px;
  letter-spacing:-.055em;
}
html[data-theme] #drawer .brand-mark {width:20px;height:20px}
html[data-theme] #drawer .drawer-item {
  position:relative;
  flex-shrink:0;
  min-height:44px;
  padding:10px 11px;
  margin-bottom:2px;
  gap:11px;
  border-radius:12px;
}
html[data-theme] #drawer .drawer-item b {
  font-size:14px;
  line-height:22px;
  font-weight:500;
  letter-spacing:0;
}
html[data-theme] #drawer .drawer-foot {
  flex-shrink:0;
  font-size:10px;
  line-height:16px;
}
@media(min-width:1080px) {
  body.rail-collapsed {--rail:56px}
  html[data-theme] body.rail-collapsed #drawer {padding-left:5px;padding-right:5px}
  html[data-theme] body.rail-collapsed #drawer .drawer-head {padding-left:0;padding-right:0}
  html[data-theme] body.rail-collapsed #drawer .drawer-item {
    justify-content:center;
    padding-left:0;
    padding-right:0;
    gap:0;
  }
  /* The lock is a badge, so it never pushes the navigation icon off center. */
  html[data-theme] body.rail-collapsed #drawer .feature-lock-icon {
    position:absolute;
    right:2px;
    bottom:4px;
    width:9px;
    height:9px;
    margin:0;
  }
}