/* A self-contained liquid glass treatment. All rules stay inside the top bar. */
:root .site-header.liquid-header {
  --header-ink: #20251f;
  --header-muted: #343b30;
  --header-glass: rgb(255 255 255 / .64);
  --header-glow: rgb(255 255 255 / .52);
  --header-rim: rgb(255 255 255 / .86);
  --header-shade: rgb(60 72 45 / .19);
  --header-control: rgb(255 255 255 / .30);
  --header-hover: rgb(255 255 255 / .58);
  --header-menu: rgb(245 247 239 / .84);
  --header-cta: #262c24;
  --header-cta-text: #f7f9f2;
  height: 92px;
  padding-block: 14px;
  position: sticky;
  top: 0;
  z-index: 10;
  border: 0;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  pointer-events: none;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
:root[data-theme="dark"] .site-header.liquid-header {
  --header-ink: #f4f6ef;
  --header-muted: #e2e7dc;
  --header-glass: rgb(29 34 28 / .74);
  --header-glow: rgb(219 233 204 / .07);
  --header-rim: rgb(244 255 229 / .27);
  --header-shade: rgb(0 0 0 / .45);
  --header-control: rgb(255 255 255 / .055);
  --header-hover: rgb(255 255 255 / .11);
  --header-menu: rgb(28 34 27 / .88);
  --header-cta: #e9eee2;
  --header-cta-text: #22291e;
}
.liquid-header .header-inner {
  position: relative;
  isolation: isolate;
  overflow: visible;
  width: min(1180px, calc(100% - 64px));
  height: 100%;
  padding: 8px 11px 8px 19px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--header-ink);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  pointer-events: auto;
}
/* Blur the material layer, so the mobile menu can sample the page separately. */
.liquid-header .header-inner::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: -1px;
  border-radius: inherit;
  border: 1px solid var(--header-rim);
  background: radial-gradient(ellipse at 22% 0%, var(--header-glow), transparent 65%), var(--header-glass);
  -webkit-backdrop-filter: blur(22px) saturate(180%);
  backdrop-filter: blur(22px) saturate(180%);
  box-shadow: 0 8px 28px -12px var(--header-shade), 0 2px 6px rgb(30 40 20 / .045), inset 0 1px 0 var(--header-rim), inset 0 -1px 0 rgb(80 95 60 / .12);
  pointer-events: none;
  transition: box-shadow .35s ease;
}
.liquid-header .header-inner::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -1px;
  padding: 1px;
  border-radius: inherit;
  background: linear-gradient(130deg, var(--header-rim) 0%, transparent 32%, var(--header-shade) 62%, var(--header-rim) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: .8;
  pointer-events: none;
  transition: opacity .35s ease;
}
.liquid-header .header-inner:hover::after { opacity: 1; }
.liquid-header .brand {
  gap: 8px;
  flex-shrink: 0;
  font-size: 23px;
  font-weight: 700;
  letter-spacing: -.95px;
  color: var(--header-ink);
  line-height: 1;
}
.liquid-header .brand img { width: 28px; height: 28px; filter: drop-shadow(0 1px 1px rgb(25 40 15 / .09)); }
.liquid-header .brand-dot { color: var(--accent); }
.liquid-header .site-navigation {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 0;
  margin-inline: auto;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: -.12px;
  color: var(--header-muted);
}
.liquid-header .site-navigation a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 10px 14px;
  border-radius: 100px;
  white-space: nowrap;
  transition: background .25s ease, color .25s ease, box-shadow .25s ease;
}
.liquid-header .site-navigation a::after { display: none; }
.liquid-header .site-navigation a:hover,
.liquid-header .site-navigation a:focus-visible { background: var(--header-hover); color: var(--header-ink); box-shadow: inset 0 1px 0 var(--header-rim), 0 2px 7px rgb(25 40 15 / .035); }
.liquid-header .nav-live-dot { width: 4px; height: 4px; margin: 0 6px 0 0; }
.liquid-header .header-actions { display: flex; align-items: center; flex-shrink: 0; gap: 7px; margin: 0; }
.liquid-header .theme-toggle,
.liquid-header .github-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 38px;
  min-width: 38px;
  height: 38px;
  min-height: 38px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: var(--header-control);
  color: var(--header-ink);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .09);
  transition: background .25s ease, box-shadow .25s ease, transform .25s ease;
}
.liquid-header .theme-toggle .icon { width: 17px; height: 17px; stroke-width: 1.65; }
.liquid-header .github-link .icon { width: 18px; height: 18px; stroke-width: 1.6; }
.liquid-header .theme-label { display: none; }
.liquid-header .theme-toggle:hover,
.liquid-header .github-link:hover { background: var(--header-hover); border-color: transparent; box-shadow: inset 0 1px 0 var(--header-rim), 0 2px 5px rgb(15 25 10 / .05); }
.liquid-header .header-actions .button-small {
  min-height: 40px;
  padding: 11px 18px;
  gap: 9px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: -.1px;
  border: 1px solid rgb(255 255 255 / .14);
  border-radius: 100px;
  background: var(--header-cta);
  color: var(--header-cta-text);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .14), 0 3px 7px rgb(10 20 5 / .10);
  transform: none;
  transition: filter .25s ease, box-shadow .25s ease, transform .25s ease;
}
.liquid-header .header-actions .button-small:hover { background: var(--header-cta); transform: none; filter: brightness(1.1); box-shadow: inset 0 1px 0 rgb(255 255 255 / .23), 0 4px 12px rgb(10 20 5 / .16); }
.liquid-header .header-actions .button-small .icon { display: block; width: 14px; height: 14px; stroke-width: 1.8; }
.liquid-header .header-download-short { display: none; }
.liquid-header .menu-toggle { display: none; }
.liquid-header a:focus-visible,
.liquid-header button:focus-visible { outline: 2px solid var(--header-ink); outline-offset: 3px; }
@media (prefers-reduced-motion: no-preference) {
  .liquid-header .theme-toggle:active,
  .liquid-header .github-link:active,
  .liquid-header .header-actions .button-small:active { transform: scale(.96); }
}
@media (max-width: 1150px) {
  .liquid-header .header-inner { width: calc(100% - 48px); gap: 17px; }
  .liquid-header .site-navigation a { padding-inline: 11px; }
  .liquid-header .header-actions { gap: 5px; }
}
@media (max-width: 900px) {
  :root .site-header.liquid-header { height: 78px; padding-block: 10px; }
  .liquid-header .header-inner { width: calc(100% - 36px); padding: 7px 9px 7px 15px; gap: 14px; }
  .liquid-header .brand { font-size: 22px; gap: 7px; }
  .liquid-header .brand img { width: 26px; height: 26px; }
  .liquid-header .site-navigation { font-size: 11px; gap: 0; }
  .liquid-header .site-navigation a { padding-inline: 10px; }
  .liquid-header .github-link { display: none; }
  .liquid-header .theme-toggle { width: 36px; min-width: 36px; height: 36px; min-height: 36px; }
  .liquid-header .header-actions .button-small { min-height: 38px; padding: 10px 15px; font-size: 10px; gap: 7px; }
}
@media (max-width: 700px) {
  :root .site-header.liquid-header { height: 74px; padding-block: 10px; }
  .liquid-header .header-inner { width: calc(100% - 24px); padding: 5px 7px 5px 12px; gap: 7px; }
  .liquid-header .brand { font-size: 22px; }
  .liquid-header .header-actions { gap: 5px; margin-left: auto; }
  .liquid-header .theme-toggle { width: 36px; min-width: 36px; height: 38px; min-height: 38px; }
  .liquid-header .header-actions .button-small { font-size: 10px; padding: 10px 13px; gap: 6px; }
  .liquid-header .menu-toggle:not([hidden]) {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    order: 3;
    flex-shrink: 0;
    gap: 5px;
    width: 36px;
    min-width: 36px;
    height: 38px;
    min-height: 38px;
    padding: 8px;
    border: 1px solid transparent;
    border-radius: 50%;
    background: var(--header-control);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .09);
    color: var(--header-ink);
    transition: background .25s ease;
  }
  .liquid-header .menu-toggle:hover { background: var(--header-hover); }
  .liquid-header .menu-toggle span { width: 15px; height: 1.5px; border-radius: 2px; background: var(--header-ink); transform-origin: center; }
  .liquid-header .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.25px) rotate(45deg); }
  .liquid-header .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.25px) rotate(-45deg); }
  .liquid-header .site-navigation {
    position: absolute;
    z-index: 2;
    top: calc(100% + 9px);
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
    padding: 9px;
    border: 1px solid var(--header-rim);
    border-radius: 25px;
    background: linear-gradient(145deg, var(--header-glow), transparent 65%), var(--header-menu);
    -webkit-backdrop-filter: blur(26px) saturate(180%);
    backdrop-filter: blur(26px) saturate(180%);
    box-shadow: 0 15px 35px -12px var(--header-shade), inset 0 1px 0 var(--header-rim);
    font-size: 14px;
    font-weight: 500;
  }
  .liquid-header .site-navigation a { min-height: 45px; justify-content: flex-start; padding: 12px 16px; border-radius: 16px; }
  .js .liquid-header .site-navigation { display: none; }
  .js .liquid-header .site-navigation.is-open { display: flex; }
  html:not(.js) .site-header.liquid-header { margin-bottom: 60px; }
  html:not(.js) .liquid-header .site-navigation { flex-direction: row; justify-content: space-around; gap: 0; padding: 5px; border-radius: 22px; font-size: 11px; }
  html:not(.js) .liquid-header .site-navigation a { min-height: 38px; padding: 8px; }
  @media (prefers-reduced-motion: no-preference) {
    .js .liquid-header .site-navigation.is-open { transform-origin: top center; animation: header-menu-appear .24s cubic-bezier(.2,.8,.2,1) both; }
  }
}
@media (max-width: 420px) {
  .liquid-header .header-inner { padding-inline: 9px 6px; gap: 5px; }
  .liquid-header .brand { font-size: 20px; letter-spacing: -.85px; gap: 6px; }
  .liquid-header .brand img { width: 24px; height: 24px; }
  .liquid-header .header-actions { gap: 4px; }
  .liquid-header .theme-toggle { width: 34px; min-width: 34px; }
  .liquid-header .header-download-label { display: none; }
  .liquid-header .header-download-short { display: inline; }
  .liquid-header .header-actions .button-small { font-size: 11px; padding: 10px 12px; gap: 6px; }
  .liquid-header .header-actions .button-small .icon { width: 12px; height: 12px; }
  .liquid-header .menu-toggle:not([hidden]) { width: 34px; min-width: 34px; }
}
@media (max-width: 350px) {
  .liquid-header .header-inner { width: calc(100% - 20px); gap: 4px; }
  .liquid-header .header-actions .button-small .icon { display: none; }
  .liquid-header .header-actions .button-small { padding-inline: 13px; }
}
@keyframes header-menu-appear {
  from { opacity: 0; transform: translateY(-5px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root .site-header.liquid-header { --header-glass: #edf0e6; --header-menu: #edf0e6; }
  :root[data-theme="dark"] .site-header.liquid-header { --header-glass: #282e25; --header-menu: #282e25; }
}
@supports not ((mask-composite: exclude) or (-webkit-mask-composite: xor)) {
  .liquid-header .header-inner::after { display: none; }
}