:root {
  color-scheme: light;
  --paper: #fcfafb;
  --ink: #172331;
  --muted: #6d7483;
  --pink: #e8255c;
  --pink-dark: #b81748;
  --pink-soft: #f7becb;
  --line: #e9e4e7;
  --mono: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
}
.shell { width: min(1180px, calc(100% - 64px)); margin-inline: auto; }
.skip-link { position: fixed; top: -100px; left: 16px; z-index: 100; background: white; padding: 12px; }
.skip-link:focus { top: 12px; }
.site-header { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid #e7e2e5b3; background: #fcfafbea; backdrop-filter: blur(16px); }
.header-inner { height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 14px; flex-shrink: 0; }
.brand img { display: block; height: auto; }
.brand-mark { width: 58px; }
.brand-wordmark { width: 150px; }
.header-inner nav { display: flex; align-items: center; gap: 38px; font-weight: 600; }
.header-inner nav a { display: flex; align-items: center; gap: 9px; font-size: 16px; transition: color .2s; }
.header-inner nav a:hover { color: var(--pink); }
.site-footer { display: flex; justify-content: space-between; align-items: center; padding-block: 27px; gap: 25px; }
.site-footer .brand-wordmark { width: 105px; }
.site-footer p { font-size: 11px; color: #8d7c92; margin-right: auto; }
.site-footer > div { display: flex; gap: 24px; font-size: 11px; color: #85788d; }
.site-footer a:hover { color: var(--pink); }
.header-inner nav { align-self: stretch; }
.header-inner nav a { text-decoration: none; padding-top: 3px; border-bottom: 3px solid transparent; }
.header-inner nav a[aria-current="page"] { color: var(--pink); border-bottom-color: var(--pink); }
.site-footer a { text-decoration: none; }
.site-footer p { margin-block: 0; }
@media (max-width: 780px) {
  .shell { width: calc(100% - 40px); }
  .header-inner { height: 72px; }
  .brand-mark { width: 40px; }
  .brand-wordmark { width: 116px; }
  .brand { gap: 10px; }
  .header-inner nav { gap: 25px; }
  .header-inner nav a { font-size: 13px; }
  .site-footer { flex-wrap: wrap; gap: 12px 22px; }
}
@media (max-width: 480px) {
  .shell { width: calc(100% - 36px); }
  .header-inner { gap: 12px; height: 68px; }
  .brand { gap: 6px; }
  .brand-mark { width: 30px; }
  .brand-wordmark { width: 91px; }
  .header-inner nav { gap: 16px; }
  .header-inner nav a { font-size: 12px; }
  .site-footer .brand-wordmark { width: 95px; }
  .site-footer p { font-size: 9px; }
  .site-footer > div { margin-left: auto; font-size: 10px; }
}
@media (max-width: 350px) {
  .shell { width: calc(100% - 28px); }
  .brand-wordmark { width: 78px; }
  .header-inner nav { gap: 12px; }
  .header-inner nav a { font-size: 11px; }
}
@media (max-width: 480px) { .header-inner .external { display: none; } }
