/* Shared typography and navigation for every public page. */
:root {
  --site-body-font: "Avenir Next", "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --site-heading-font: Georgia, "Times New Roman", "Songti SC", "Noto Serif CJK SC", serif;
}
html[lang|="zh"] {
  --site-body-font: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --site-heading-font: "Songti SC", "Noto Serif CJK SC", "STSong", serif;
}
html[lang] body { font-family: var(--site-body-font); }
html[lang] body h1, html[lang] body h2, html[lang] body h3 { font-family: var(--site-heading-font); }
html body:not(.site-home) { padding-top: 90px; }
html { scroll-padding-top: 106px; }
body h1, body h2, body h3 { overflow-wrap: break-word; }
.site-navigation, .site-navigation * { box-sizing: border-box; }
.site-navigation {
  position: fixed;
  inset: 16px 0 auto;
  z-index: 100;
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  color: #20221f;
  font: 500 14px/1.5 var(--site-body-font);
  letter-spacing: normal;
}
.site-navigation__bar {
  display: flex;
  align-items: center;
  gap: 20px;
  min-height: 64px;
  padding: 10px 12px;
  border: 1px solid rgba(32,34,31,.12);
  border-radius: 32px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 10px 32px rgba(32,34,31,.08);
  backdrop-filter: blur(16px);
}
.site-navigation a { color: inherit; text-decoration: none; }
.site-navigation .site-brand { display: flex; gap: 10px; align-items: center; flex: 0 0 auto; min-width: 0; }
.site-navigation .site-brand img { display: block; width: 36px; height: 36px; flex: 0 0 36px; border-radius: 50%; object-fit: cover; border: 1px solid #e9e4dc; }
.site-navigation .site-brand span { display: grid; min-width: 0; }
.site-navigation .site-brand strong { font: 650 14px/1.3 var(--site-body-font); font-size: 15px; white-space: nowrap; }
.site-navigation .site-brand small { display: block; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 14px/1.4 var(--site-body-font); font-size: 10px; color: #62665e; margin-top: 2px; }
.site-navigation__links { display: flex; align-items: center; justify-content: flex-end; gap: 2px; flex: 1 1 auto; margin: 0; }
.site-navigation__links > a, .site-navigation__group > summary {
  display: flex; align-items: center; min-height: 40px; padding: 9px 10px; border-radius: 20px;
  font: 600 14px/1.5 var(--site-body-font); font-size: 14px; white-space: nowrap; cursor: pointer; list-style: none;
}
.site-navigation__group { position: relative; margin: 0; border: 0; padding: 0; background: none; }
.site-navigation__group > summary::-webkit-details-marker { display: none; }
.site-navigation__group > summary::after { content: ""; width: 6px; height: 6px; margin-left: 8px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: rotate(45deg) translateY(-2px); }
.site-navigation__group[open] > summary::after { transform: rotate(225deg) translate(-2px,-1px); }
.site-navigation__links > a:hover, .site-navigation__group > summary:hover, .site-navigation__group[open] > summary { background: #eef3ef; color: #345c49; }
.site-navigation__submenu { position: absolute; top: calc(100% + 10px); left: 0; width: 242px; padding: 8px; background: #fff; border: 1px solid #e0e7df; border-radius: 16px; box-shadow: 0 12px 28px rgba(32,34,31,.12); }
.site-navigation__submenu a { display: block; padding: 11px 12px; border-radius: 9px; font: 500 14px/1.5 var(--site-body-font); font-size: 14px; }
.site-navigation__submenu a:hover { background: #eef3ef; }
.site-navigation .site-navigation__quote { color: #fff; background: #20221f; padding-inline: 16px; margin-left: 6px; }
.site-navigation .site-navigation__quote:hover { background: #345c49; color: #fff; }
.site-navigation__actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.site-navigation .site-language, .site-navigation .site-menu-toggle {
  display: inline-flex; justify-content: center; align-items: center; gap: 6px; min-height: 40px; padding: 8px 12px;
  border: 1px solid #dce5df; border-radius: 22px; background: #fff; color: #345c49;
  font: 600 14px/1.4 var(--site-body-font); font-size: 14px; white-space: nowrap; cursor: pointer;
}
.site-navigation .site-menu-toggle { display: none; }
.site-navigation :focus-visible { outline: 3px solid #a25a63; outline-offset: 3px; }
@media (max-width: 1100px) {
  .site-navigation__bar { justify-content: space-between; gap: 12px; }
  .site-navigation .site-menu-toggle { display: inline-flex; }
  .site-navigation__links {
    display: none; position: absolute; top: calc(100% + 8px); left: 0; right: 0; margin: 0;
    padding: 12px; border: 1px solid #e0e7df; border-radius: 20px; background: #fff;
    max-height: calc(100vh - 108px); max-height: calc(100dvh - 108px - env(safe-area-inset-bottom, 0px));
    overflow-y: auto; overscroll-behavior: contain; box-shadow: 0 14px 32px rgba(32,34,31,.12);
  }
  .site-navigation.is-menu-open .site-navigation__links { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 3px; }
  .site-navigation__links > a, .site-navigation__group > summary { min-height: 46px; padding: 12px 14px; font-size: 16px; border-radius: 10px; }
  .site-navigation__group > summary { justify-content: space-between; }
  .site-navigation__submenu { position: static; width: 100%; padding: 0 0 6px 14px; border: 0; border-radius: 0; box-shadow: none; }
  .site-navigation__submenu a { font-size: 15px; }
  .site-navigation .site-navigation__quote { margin: 6px 0 0; justify-content: center; }
}
@media (max-width: 600px) {
  .site-navigation { inset-block-start: 10px; width: calc(100% - 24px); }
  .site-navigation__bar { min-height: 60px; padding: 8px 10px; gap: 8px; }
  .site-navigation .site-brand { gap: 8px; flex: 1 1 auto; }
  .site-navigation .site-brand strong { font-size: 14px; }
  .site-navigation .site-brand small { display: none; }
  .site-navigation .site-brand img { width: 32px; height: 32px; flex-basis: 32px; }
  .site-navigation .site-language, .site-navigation .site-menu-toggle { min-height: 40px; padding: 8px 10px; font-size: 13px; }
  .site-navigation__actions { gap: 6px; }
  html body:not(.site-home) { padding-top: 78px; }
  html { scroll-padding-top: 90px; }
}
@media (max-width: 359px) {
  .site-navigation .site-menu-toggle > span:first-child { display: none; }
  .site-navigation .site-brand strong { font-size: 13px; }
  .site-navigation .site-brand img { width: 28px; height: 28px; flex-basis: 28px; }
  .site-navigation .site-language, .site-navigation .site-menu-toggle { padding-inline: 9px; }
}