.page-shell {
  width: min(1120px, calc(100% - var(--space-gutter) * 2));
  margin: 0 auto;
  padding: clamp(32px, 4.5vw, 64px) 0 clamp(40px, 5.5vw, 80px);
  position: relative;
}
.library-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 28px; margin-bottom: clamp(28px, 3.2vw, 46px);
}
.library-header__copy { min-width: 0; }
.library-header h1 {
  margin: 0;
  font-family: var(--font-display); font-size: var(--type-title); font-weight: 500;
  font-optical-sizing: auto; line-height: 1.06; letter-spacing: -.045em;
}
.library-header p {
  max-width: 66ch; margin: 18px 0 0;
  color: var(--muted-text); font-size: var(--type-sm); line-height: 1.7;
  text-wrap: pretty;
}
.header-controls { display: flex; align-items: center; gap: 14px; flex: 0 0 auto; padding-top: 3px; }
.language-switcher { display: inline-flex; align-items: center; gap: 0; color: var(--control-muted); font-family: var(--font-mono); font-size: var(--type-xs); }
.language-switcher > span { font-size: .65rem; }
.language-switcher__button {
  min-width: 44px; min-height: 44px; padding: 6px;
  position: relative; border: 0; color: inherit; background: transparent;
  cursor: pointer; font-family: var(--font-mono); font-size: .75rem;
  letter-spacing: .035em;
}
.language-switcher__button::after {
  content: ""; position: absolute; left: 10px; right: 10px; bottom: 5px;
  height: 1px; background: var(--brass); opacity: 0;
  transform: scaleX(.7);
  transition: transform var(--duration-quick) var(--ease-press), opacity var(--duration-quick) var(--ease-press);
}
.language-switcher__button:hover, .language-switcher__button.is-active { color: var(--control-active); }
.language-switcher__button.is-active::after, .language-switcher__button:hover::after { opacity: 1; transform: scaleX(1); }
.theme-toggle {
  min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 8px 12px;
  border: 1px solid var(--theme-control-border); border-radius: 2px;
  color: var(--control-active); background: var(--theme-control-bg); cursor: pointer;
  font-family: var(--font-mono); font-size: .75rem; font-weight: 400; line-height: 1.3;
  transition: transform var(--duration-quick) var(--ease-press);
}
.theme-toggle:hover { transform: translateY(-1px); }
.theme-toggle:active { transform: translateY(1px); }
.theme-toggle__mark { width: 12px; height: 12px; flex: 0 0 12px; border: 1px solid currentColor; border-radius: 50%; }
.theme-toggle[data-next-theme="light"] .theme-toggle__mark { background: var(--brass); border-color: var(--brass); }
.theme-toggle[data-next-theme="dark"] .theme-toggle__mark { box-shadow: inset -4px -1px 0 0 currentColor; }
@media (prefers-reduced-motion: reduce) {
  .theme-toggle, .language-switcher__button::after { transition: none; }
  .theme-toggle:hover, .theme-toggle:active { transform: none; }
}
