/* Shared sidebar geometry. The desktop rail and the content use the same width. */
body { --sidebar-expanded-width: 288px; --sidebar-rail-width: 52px; --sidebar-width: var(--sidebar-expanded-width); }
.sidebar { width: var(--sidebar-width); height: 100dvh; min-height: 0; }
.shell { margin-left: var(--sidebar-width); min-width: 0; }
.sidebar-brand-row { position: relative; flex: 0 0 88px; display: flex; align-items: center; border-bottom: 1px solid var(--line); }
.brand { width: 100%; min-height: 0; height: 88px; padding: 18px 16px; border: 0; }
.brand-full { display: block; width: 100%; height: auto; max-height: 55px; }
.brand-symbol-only { display: none; width: 36px; height: 36px; }
.sidebar-mobile-close { display: none; }
.sidebar #navigation { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-bottom: 10px; scrollbar-width: thin; }
.sidebar nav a { min-height: 58px; gap: 12px; padding: 10px 12px; }
.sidebar nav a > svg { width: 22px; height: 22px; }
.sidebar nav a .sidebar-label { min-width: 0; }
.sidebar nav a b { font-size:var(--font-sm); }
.sidebar nav a small { font-size:var(--font-xs); }
.sidebar .nav-group { padding: 18px 24px 7px; }
.sidebar-bottom { flex: 0 0 auto; padding: 12px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 3px; }
.sidebar-utility { display: flex; position: relative; align-items: center; justify-content: flex-start; gap: 12px; width: 100%; height: 40px; min-height: 40px; padding: 0 12px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--color-muted); font-size:var(--font-sm); text-align: left; }
.sidebar-utility > svg { width: 20px; height: 20px; flex: 0 0 20px; }
.sidebar-utility:hover,.sidebar-utility[aria-expanded=true]:not(.sidebar-toggle) { background: var(--blue-light); color: var(--blue); }
.sidebar-utility .sidebar-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar .notification-count { position: static; flex: 0 0 auto; margin-left: auto; min-width: 21px; height: 21px; border-color: var(--color-surface); }
.sidebar-prototype { display: block; align-self: flex-start; margin: 6px 12px 0; min-height: 25px; font-size:var(--font-xs); padding: 4px 6px; }
.prototype-short { display: none; }
.profile { padding: 12px 8px 2px; font-size:var(--font-xs); min-width: 0; }
.profile .avatar { flex: 0 0 34px; }
.profile .sidebar-label { min-width: 0; }
.profile b { font-size:var(--font-xs); }
.profile small { font-size:var(--font-xs); }
.sidebar-backdrop[hidden] { display: none; }
.sidebar-backdrop { position: fixed; inset: 0; z-index: 24; padding: 0; border: 0; background: var(--color-overlay); }
.mobile-menu { flex: 0 0 44px; width: 44px; height: 44px; padding: 10px; border: 1px solid var(--line); background: var(--color-surface); }
.mobile-menu > svg { width: 22px; height: 22px; }
.library-heading { display: flex; align-items: center; gap: 12px; }
.page-title-copy { flex: 1 1 auto; min-width: 0; }

/* Notifications open beside the sidebar instead of being clipped by the rail. */
.sidebar .notification-popover { position: fixed; left: calc(var(--sidebar-width) + 12px); right: auto; top: auto; bottom: 16px; width: min(420px,calc(100vw - var(--sidebar-width) - 28px)); max-width: none; max-height: min(640px,calc(100dvh - 32px)); z-index: 70; }

/* Collection-level actions form one visible group, anchored to the content edge. */
.collection-title-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; column-gap: 24px; row-gap: 14px; }
.collection-title-row > .mobile-menu { display: none; }
.collection-title-row h1 { line-height: 1.3; }
.collection-service-actions { margin-left: auto; gap: 8px; white-space: nowrap; }
.collection-service-actions > .collection-consultant { height: 44px; min-height: 44px; padding: 0 16px; }
.collection-service-actions > .service-icon,.collection-service-actions > .overflow-action { width: 44px; min-width: 44px; height: 44px; min-height: 44px; border: 1px solid var(--color-accent-line); background: var(--color-surface); color: var(--color-muted); }
.collection-service-actions > .service-icon:hover,.collection-service-actions > .overflow-action:hover { background: var(--blue-light); border-color: var(--color-accent-line); color: var(--blue); }
.collection-service-actions > .service-icon.is-active { background: var(--blue-light); border-color: var(--color-accent-line); color: var(--blue); }
.collection-service-actions .action-state-mark { border-color: var(--color-surface); }
.collection-heading > .subtitle { margin-top: 10px; }

@media (min-width: 651px) {
  body.sidebar-collapsed { --sidebar-width: var(--sidebar-rail-width); }
  .sidebar-collapsed .brand { justify-content: center; padding: 18px 0; }
  .sidebar-collapsed .brand-full { display: none; }
  .sidebar-collapsed .brand-symbol-only { display: block; }
  .sidebar-collapsed .sidebar-label { display: none; }
  .sidebar-collapsed .sidebar nav a { width: 44px; height: 48px; min-height: 48px; margin: 3px auto; padding: 0; justify-content: center; }
  .sidebar-collapsed .sidebar .nav-group { font-size: 0; height: 19px; padding: 0; margin: 0 14px; border-bottom: 1px solid var(--color-border); }
  .sidebar-collapsed .sidebar-bottom { padding: 12px; gap: 4px; }
  .sidebar-collapsed .sidebar-utility { width: 44px; height: 44px; min-height: 44px; padding: 0; justify-content: center; }
  .sidebar-collapsed .sidebar .notification-count { position: absolute; right: 0; top: 0; margin: 0; min-width: 18px; height: 18px; font-size:var(--font-xs); }
  .sidebar-collapsed .sidebar-prototype { margin: 3px auto 0; width: 24px; height: 24px; padding: 0; text-align: center; border-radius: 50%; }
  .sidebar-collapsed .prototype-short { display: inline; font-size:var(--font-xs); font-weight: 600; text-transform: none; }
  .sidebar-collapsed .profile { justify-content: center; padding: 10px 0 2px; }
}
@media (min-width: 651px) and (max-width: 1200px) {

  .brand { padding-left: 14px; padding-right: 14px; }
}
@media (min-width: 651px) and (max-width: 1000px) {
  .collection-title-row { grid-template-columns: minmax(0,1fr); }
  .collection-service-actions { justify-self: end; }
}
@media (max-width: 650px) {
  body { --sidebar-width: 260px; }
  body.mobile-menu-open { overflow: hidden; }
  .shell { margin-left: 0; }
  .sidebar { width: 260px; z-index: 60; transform: translateX(-100%); visibility: hidden; }
  .sidebar.open { transform: none; visibility: visible; }
  .sidebar-backdrop { z-index: 59; }
  .brand { padding: 18px 40px 18px 14px; }
  .sidebar-mobile-close { display: inline-flex; position: absolute; right: 6px; top: 24px; width: 36px; height: 40px; font-size:var(--font-xl); }
  .sidebar-toggle { display: none; }
  .sidebar .sidebar-label { display: inline; }
  .sidebar .brand-full { display: block; }
  .sidebar .brand-symbol-only,.sidebar .prototype-short { display: none; }
  .sidebar .notification-popover { left: 12px; right: 12px; bottom: 12px; top: auto; width: auto; max-height: calc(100dvh - 24px); }
  .sidebar .sidebar-utility { min-height: 44px; height: 44px; }
  .page-heading > .mobile-menu { display: inline-flex; grid-column: 1; grid-row: 1; }
.page-heading > .page-title-copy{   align-self: center; }
  .page-heading > .button-row:empty { display: none; }
  .page-heading h1,.library-heading h1 { margin-bottom: 0; }
  .collection-title-row { grid-template-columns: 44px minmax(0,1fr); gap: 12px; align-items: start; }
  .collection-title-row > .mobile-menu { display: inline-flex; grid-column: 1; grid-row: 1; }
  .collection-title-row h1 { grid-column: 2; grid-row: 1; align-self: center; }
  .collection-service-actions { grid-column: 1 / -1; justify-self: end; }
}

/* Persistent reset action; destructive confirmation remains in the existing modal. */
.sidebar .sidebar-reset{margin-top:10px;background:var(--color-danger);border-color:var(--color-danger);color:var(--color-surface);justify-content:center;font-weight:500}
.sidebar .sidebar-reset:hover,.sidebar .sidebar-reset:active{background:var(--color-danger);border-color:var(--color-danger);color:var(--color-surface);filter:brightness(.9)}
.sidebar .sidebar-reset:focus-visible{outline:2px solid var(--color-danger);outline-offset:3px}