/* Won Tech 全局页头（各产品官网共用同一份样式，每个站点各拷一份，兼容严格 CSP）
   五个官网里的位置、字体、字号、间距完全一致：固定 64px 高，内容区 1080px 居中，
   Logo 在左、产品导航在正中、语言 / 主题在右。背景透明，直接用所在页面的底色。
   各站只允许改两个变量：--wb-ink（文字颜色，深色模式下自动变浅）与 --wb-acc（当前项小圆点）。
   页头在页面顶部显示；向下滚动离开后，才出现各站自己的导航（html.wb-top 由 wonbar.js 维护）。 */
.wonbar { --wb-h: 64px; position: relative; z-index: 80; height: var(--wb-h); background: transparent; color: var(--wb-ink, #1d1d1f); }
.wonbar, .wonbar * { box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans CJK SC", Roboto, "Helvetica Neue", Arial, sans-serif !important; letter-spacing: normal !important; text-transform: none !important; }
.wonbar { font-size: 13.5px !important; font-weight: 500 !important; line-height: 1 !important; -webkit-font-smoothing: antialiased; }
.wonbar a { color: inherit; text-decoration: none; background: none; }
.wonbar ul, .wonbar li { margin: 0; padding: 0; list-style: none; }
.wonbar.over { position: absolute; top: 0; left: 0; right: 0; }
.wonbar-in { width: min(1080px, 100% - 48px); height: 100%; margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; }
.wonbar .wb-logo { justify-self: start; display: inline-flex; align-items: center; height: 100%; color: var(--wb-ink, #1d1d1f); transition: opacity .15s; }
.wonbar .wb-logo:hover { opacity: .7; }
.wonbar .wb-word { display: block; height: 24px; width: auto; }
.wonbar .wb-list { display: flex; align-items: center; justify-content: center; gap: 0; min-width: 0; }
.wonbar .wb-it { position: relative; display: inline-flex; align-items: center; height: 32px; padding: 0 9px; border-radius: 999px; white-space: nowrap; font-size: 13.5px !important; font-weight: 500 !important; color: var(--wb-ink, #1d1d1f); transition: background .15s; }
.wonbar .wb-it:hover { background: color-mix(in srgb, var(--wb-ink, #1d1d1f) 8%, transparent); }
.wonbar .wb-it[aria-current="page"] { -webkit-text-stroke: .5px currentColor; }
.wonbar .wb-it[aria-current="page"]::after { content: ""; position: absolute; left: 50%; bottom: 1px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: var(--wb-acc, #2563eb); }
.wonbar .wb-end { justify-self: end; display: flex; flex-direction: row-reverse; align-items: center; gap: 2px; }
.wonbar .wb-lang { display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 9px; border-radius: 999px; color: var(--wb-ink, #1d1d1f); font-size: 12.5px !important; font-weight: 600 !important; transition: background .15s; }
.wonbar .wb-lang[hidden] { display: none; }
.wonbar .wb-lang svg, .wonbar .wb-theme svg { width: 17px; height: 17px; display: block; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.wonbar .wb-theme { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; padding: 0; border: 0; background: none; color: var(--wb-ink, #1d1d1f); cursor: pointer; transition: background .15s; }
.wonbar .wb-theme svg { width: 18px; height: 18px; }
.wonbar .wb-lang:hover, .wonbar .wb-theme:hover { background: color-mix(in srgb, var(--wb-ink, #1d1d1f) 8%, transparent); }
.wonbar .wb-logo:focus-visible, .wonbar .wb-it:focus-visible, .wonbar .wb-theme:focus-visible, .wonbar .wb-lang:focus-visible { outline: 2px solid var(--wb-acc, #2563eb); outline-offset: 2px; }
@media (max-width: 900px) {
  .wonbar { --wb-h: 56px; }
  .wonbar-in { width: calc(100% - 32px); display: flex; }
  .wonbar .wb-word { height: 21px; }
  .wonbar .wb-list { flex: 1; justify-content: flex-start; margin-left: 10px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 10px, #000 calc(100% - 22px), transparent); mask-image: linear-gradient(90deg, transparent 0, #000 10px, #000 calc(100% - 22px), transparent); padding: 0 16px 0 6px; }
  .wonbar .wb-list::-webkit-scrollbar { display: none; }
  .wonbar .wb-end { padding-left: 2px; }
}
@media (max-width: 560px) {
  .wonbar .wb-it { padding: 0 8px; }
  .wonbar .wb-lang { padding: 0 8px; } .wonbar .wb-lang span { display: none; }
}
