/* Shared sidebar/title glass; only their geometry and content differ. */
:root {
  --glass-blur: 24px;
  --glass-saturation: 1.32;
  --glass-sheen-alpha: .30;
  --glass-reflection: linear-gradient(116deg, rgba(255, 255, 255, var(--glass-sheen-alpha)) 0%, rgba(255, 255, 255, .08) 26%, transparent 42%, transparent 62%, rgba(255, 255, 255, .065) 100%);
  --header-glass-fill: var(--glass-fill);
  --header-edge: var(--glass-inner);
  --header-sheen-alpha: var(--glass-sheen-alpha);
  --header-ink: var(--glass-ink);
  --header-muted: var(--glass-muted);
}
:root[data-theme="graphite"] {
  --glass-sheen-alpha: .06;
  --glass-reflection: linear-gradient(116deg, rgba(255, 255, 255, var(--glass-sheen-alpha)) 0%, rgba(255, 255, 255, .015) 26%, transparent 45%, transparent 65%, rgba(255, 255, 255, .025) 100%);
}
.side-rail,
.page-header {
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
  box-shadow: 0 16px 42px -24px var(--glass-shadow);
}
.side-rail::before,
.page-header::before,
:root[data-theme="graphite"] .side-rail::before {
  background: var(--glass-reflection);
}
.page-header {
  position: sticky;
  top: 16px;
  z-index: 25;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  padding: 20px 24px;
  margin-top: 16px;
  margin-bottom: 20px;
  border: 1px solid var(--header-edge);
  border-radius: 18px;
  color: var(--header-ink);
  background: var(--header-glass-fill);
  background-clip: padding-box;
  overflow: hidden;
  isolation: isolate;
}
.page-header::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  border-radius: inherit;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  -webkit-mask-image: none;
  mask-image: none;
}
.page-heading {
  position: static;
  top: auto;
  z-index: auto;
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  padding: 0;
  background: transparent;
  isolation: auto;
}
.page-heading h1 { color: var(--header-ink); font-size: 26px; font-weight: 600; line-height: 1.3; }
.page-description { color: var(--header-muted); font-size: 13px; line-height: 1.6; margin-top: 7px; }
.header-utilities { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 10px; }
.topbar {
  position: static;
  top: auto;
  z-index: auto;
  width: auto;
  min-height: 34px;
  justify-content: flex-end;
  gap: 0;
  border: 0;
  background: transparent;
  isolation: auto;
}
.topbar::before,
.page-heading::before { content: none; }
.page-header .preview-mark,
.page-header .demo-clock { display: none; }
.heading-status { display: flex; align-items: center; gap: 10px; color: var(--header-muted); font-size: 11px; }
.heading-status small { margin: 0; font-size: inherit; }
.page-header .admin-profile { color: var(--header-ink); }
.page-header .admin-profile small { color: var(--header-muted); }
.page-header .icon-button { color: var(--header-ink); border-color: var(--header-edge); }
.main-content { scroll-padding-top: 165px; }

@media (min-width: 1900px) {
  .page-header { top: 20px; margin-top: 20px; padding: 24px 28px; }
  .page-heading h1 { font-size: 28px; }
}
@media (max-width: 650px) {
  :root { --glass-blur: 28px; --glass-saturation: 1.3; }
  .page-header { top: 8px; gap: 12px; align-items: flex-start; padding: 16px; margin-top: 8px; margin-bottom: 16px; border-radius: 16px; }
  .page-heading h1 { font-size: 22px; }
  .page-description { font-size: 12px; margin-top: 6px; }
  .header-utilities { gap: 0; }
  .heading-status { display: none; }
  .topbar { min-height: 44px; }
  .topbar-actions { gap: 0; }
  .topbar .icon-button { width: 44px; height: 44px; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .side-rail,
  .page-header { background: var(--raised); border-color: var(--line); }
  .page-header::before { content: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .side-rail,
  .page-header { background: var(--raised); border-color: var(--line); box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .page-header::before { content: none; }
}