/* The shared header is independent of each lesson's existing styles. */
html { scrollbar-gutter: stable; scroll-padding-top: calc(var(--pc-header-height, 180px) + 12px); }
#pc-header, #pc-header * { box-sizing: border-box; }
#pc-header { position: sticky; top: 0; z-index: 100; width: 100%; margin: 0; padding: 0; border: 0; border-bottom: 1px solid #e5e7eb; background: #fff; color: #111827; box-shadow: 0 10px 25px rgb(15 23 42 / 6%); font: 16px/1.6 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; text-align: left; }
#pc-header .pc-header-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; width: 100%; max-width: 960px; margin: 0 auto; padding: 12px 20px; }
#pc-header a { text-decoration: none; }
#pc-header .pc-logo { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; color: #111827; background: transparent; border: 0; }
#pc-header .pc-logo-main { display: flex; align-items: center; gap: 7px; font-size: 20px; font-weight: 700; line-height: 1.6; }
#pc-header .pc-brand-image { display: block; flex: 0 0 36px; width: 36px; height: 36px; max-width: none; object-fit: contain; border: 0; border-radius: 6px; background: transparent; }
#pc-header .pc-tagline { color: #6b7280; font-size: 12px; font-weight: 400; line-height: 1.6; }
#pc-header #pc-menu { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; width: 100%; background: transparent; border: 0; }
#pc-header #pc-menu a { display: inline-flex; align-items: center; margin: 0; padding: 6px 14px; border: 1px solid transparent; border-radius: 999px; color: #4b5563; background: transparent; font-size: 14px; font-weight: 400; line-height: 1.6; }
#pc-header #pc-menu a:hover { color: #1d4ed8; border-color: #bfdbfe; background: #eff6ff; }
#pc-header #pc-menu a[aria-current="page"] { color: #fff; background: #2563eb; border-color: #2563eb; }
#pc-header #pc-menu-toggle { display: none; margin: 0; padding: 8px 14px; width: auto; min-height: 44px; border: 1px solid #d1d5db; border-radius: 999px; background: #fff; color: #111827; font: inherit; cursor: pointer; }
#pc-header a:focus-visible, #pc-header button:focus-visible { outline: 3px solid #1d4ed8; outline-offset: 3px; }
#pc-navigation-status { position: fixed; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 640px) {
  #pc-header .pc-header-inner { gap: 10px; }
  #pc-header .pc-tagline { max-width: 230px; }
  #pc-header #pc-menu-toggle:not([hidden]) { display: inline-block; }
  #pc-header[data-enhanced] #pc-menu { display: none; }
  #pc-header[data-enhanced][data-open] #pc-menu { display: flex; }
  #pc-header #pc-menu a { min-height: 44px; }
}