/* One header and page frame for public HTML and the browser account workspace. */
.website-shell, .app-shell.website-shell, .sw-editorial main.website-shell {
  width: 100%; max-width: 1600px; margin-inline: auto;
  padding: 0 clamp(16px, 3.2vw, 44px) 32px;
}
.website-shell .website-header {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center; gap: 24px 40px; padding-block: 24px;
  border: 0; margin: 0 0 28px;
}
.website-shell .website-wordmark {
  display: inline-flex; align-items: center; min-height: 44px;
  font: 900 23px/1 Arial, "Helvetica Neue", sans-serif;
  letter-spacing: -.055em; text-decoration: none; white-space: nowrap;
}
.website-shell .website-nav {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 26px;
  margin: 0; min-width: 0;
}
.website-shell .website-nav a {
  display: inline-flex; align-items: center; min-height: 44px;
  border: 0; padding: 8px 0; border-radius: 0; background: transparent;
  font: 400 13px/1.45 Arial, "Helvetica Neue", sans-serif;
  text-decoration: none; overflow-wrap: anywhere;
}
.website-shell .website-nav a:is(:hover, :focus-visible) { text-decoration: underline; text-underline-offset: 5px; }
.website-shell .website-nav a[aria-current="page"] { box-shadow: inset 0 -2px var(--sw-ink); }
.website-shell .website-controls { display: flex; align-items: center; gap: 12px; margin: 0; min-width: 0; }
.app-shell--website { background: transparent; }
body:has(.app-shell--website) { background: radial-gradient(ellipse at 80% 0%, #f6f8fa 0, transparent 55%), var(--sw-paper); }
@media (max-width: 1000px) {
  .website-shell .website-header { grid-template-columns: minmax(0, 1fr) auto; gap: 12px 16px; }
  .website-shell .website-nav { grid-row: 2; grid-column: 1 / -1; gap: 0 24px; }
  .website-shell .website-controls, .website-header > .language-switcher { grid-row: 1; grid-column: 2; }
}
@media (max-width: 540px) {
  .website-shell .website-wordmark { font-size: 20px; }
  .website-shell .website-header { padding-block: 16px; margin-bottom: 16px; gap: 10px 12px; }
  .website-shell .website-nav { gap: 0 18px; }
  .website-shell .website-nav a { font-size: 12px; }
  .website-shell .website-controls { gap: 8px; }
  .website-shell .language-switcher__trigger { max-width: min(48vw, 180px); }
  .website-shell .website-controls:has(.toolbar-manage) .language-switcher__trigger { max-width: min(36vw, 144px); }
}
