:root {
  --bg: #E7ECFA;
  --bg-panel: #F8FAFF;
  --bg-panel-2: #D9E0F3;
  --border: #C9D1E8;
  --accent: #E9552F;
  --accent-dark: #B53A1A;
  --text: #131626;
  --text-muted: #596079;
  --success: #1E9A6A;
  --warn: #C98410;
  --error: #D2373F;
  --hero-top: #F1F4FD;
  --hero-bottom: #E2E8F7;
  --white: #FFFFFF;
  --ink-2: #343C6A;
  --text-soft: #8A90A9;
  --clear: transparent;
  --accent-a10: rgba(233,85,47,.10);
  --accent-dark-a40: rgba(181,58,26,.40);
  --ink-a06: rgba(19,22,38,.06);
  --ink-a10: rgba(19,22,38,.10);
  --ink-a16: rgba(19,22,38,.16);
  --ink-a28: rgba(19,22,38,.28);
  --hl: rgba(255,255,255,.80);
  --white-a24: rgba(255,255,255,.24);
  --spec-hi: rgba(255,255,255,.64);
  --glass: rgba(248,250,255,.62);
  --panel-lift: rgba(248,250,255,.66);
  --halo: rgba(118,98,232,.06);
  --flag-red: #D2373F;
  --flag-blue: #2B3A7A;
  --orb-jp-1: #CDEFE8;
  --orb-jp-2: #9FD8D1;
  --orb-jp-3: #E4F3FB;
  --orb-jp-4: #84C7CF;
  --orb-jp-shadow: rgba(132,199,207,.55);
  --orb-hk-1: #B7A3F4;
  --orb-hk-2: #F2A6D3;
  --orb-hk-3: #FBE0F1;
  --orb-hk-4: #8EA3F8;
  --orb-hk-shadow: rgba(183,163,244,.60);
  --orb-sg-2: #FF8B63;
  --orb-sg-3: #FFC4A0;
  --orb-sg-shadow: rgba(233,85,47,.38);
  --orb-us-1: #7A8DC2;
  --orb-us-2: #3A4485;
  --orb-us-3: #B3C0E6;
  --orb-us-4: #1E2356;
  --orb-us-shadow: rgba(58,68,133,.42);
  --orb-ca-1: #EAE1F7;
  --orb-ca-2: #D7CDF0;
  --orb-ca-3: #F8F0F8;
  --orb-ca-4: #C8BEEA;
  --orb-ca-shadow: rgba(200,190,234,.60);
  --rim-shade: rgba(19,22,38,.16);
  --rim-soft: rgba(19,22,38,.06);
  --font-display: "Inter", "Noto Sans SC", "PingFang SC", "Hiragino Sans", "Apple SD Gothic Neo", "Malgun Gothic", "Microsoft YaHei", system-ui, sans-serif;
  --font-body: "Inter", "Noto Sans SC", "PingFang SC", "Hiragino Sans", "Apple SD Gothic Neo", "Malgun Gothic", "Microsoft YaHei", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --r-pill: 999px;
  --r-round: 50%;
  --r-xl: 32px;
  --r-card: 18px;
  --r-icon: 10px;
  --wrap: 1248px;
  --gutter: 32px;
  --header-height: 68px;
  --anchor-offset: 84px;
  --toc-offset: 144px;
  --shadow-panel: inset 0 0 0 1px var(--hl), 0 32px 80px -32px var(--accent-a10);
  --shadow-button: 0 10px 24px -12px var(--ink-a28), inset 0 1px 0 var(--white-a24);
  --focus-ring: 2px solid var(--accent-dark);
  --time-reveal: .35s;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--anchor-offset); }
html, body { margin: 0; }
body {
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  color: var(--text);
  background: var(--bg);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
[hidden] { display: none !important; }
a { color: inherit; text-underline-offset: .2em; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
button, a { -webkit-tap-highlight-color: var(--ink-a06); }
button:disabled, [aria-disabled="true"] { cursor: not-allowed; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: var(--focus-ring);
  outline-offset: 3px;
}
img { display: block; max-width: 100%; height: auto; }
svg { flex-shrink: 0; }
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: var(--weight-regular); overflow-wrap: break-word; }
h1 { font-size: clamp(52px, 5vw, 68px); line-height: 1.12; letter-spacing: -.02em; }
h2 { margin: 0 0 24px; font-size: clamp(30px, 3.4vw, 44px); line-height: 1.22; letter-spacing: -.02em; }
h3 { margin: 0 0 12px; font-size: 23px; line-height: 1.4; }
p { margin: 0 0 20px; }
strong { font-weight: var(--weight-semibold); }
code, pre { font-family: var(--font-mono); }
code { overflow-wrap: anywhere; background: var(--ink-a06); border-radius: var(--r-icon); padding: .1em .3em; font-size: .9em; }
pre { max-width: 100%; overflow-x: auto; padding: 24px; border: 1px solid var(--border); border-radius: var(--r-card); background: var(--bg-panel); }
pre code { padding: 0; background: var(--clear); overflow-wrap: normal; white-space: pre; }
:where(main, section, article, aside, nav, div, li) { min-width: 0; }
.no-break { white-space: nowrap; }
.wrap { width: 100%; max-width: calc(var(--wrap) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-top: 80px; padding-bottom: 80px; }
.section--compact { padding-top: 40px; padding-bottom: 40px; }
.prose { max-width: 800px; margin-inline: auto; overflow-wrap: break-word; }
.prose h2 { margin-top: 56px; }
.prose h3 { margin-top: 32px; }
.prose li { margin-block: 8px; }
.muted { color: var(--text-muted); }
.mono { font-family: var(--font-mono); }
.card, .panel { background: var(--bg-panel); border: 1px solid var(--border); border-radius: var(--r-card); padding: 28px; box-shadow: var(--shadow-panel); }
.panel { border-radius: var(--r-xl); }
.grid-two, .grid-three { display: grid; gap: 24px; }
.grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 24px; border: 0; border-radius: var(--r-pill);
  font-size: 16px; font-weight: var(--weight-medium); line-height: 1.3;
  text-decoration: none; white-space: nowrap; flex-shrink: 0;
}
.btn svg { width: 16px; height: 16px; }
.btn--ink, .btn-primary { background: var(--text); color: var(--white); box-shadow: var(--shadow-button); }
.btn--line, .btn-secondary { background: var(--bg-panel); color: var(--text); box-shadow: inset 0 0 0 1px var(--border); }
.btn--ink:hover, .btn-primary:hover, .btn--ink:active, .btn-primary:active, .btn--hover { background: var(--ink-2); }
.btn--line:hover, .btn-secondary:hover { background: var(--white); }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .5; }
.btn--focus { outline: var(--focus-ring); outline-offset: 3px; }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.ico-line { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.svg-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.masthead, #site-header { position: relative; z-index: 40; }
.masthead__bar { display: flex; align-items: center; flex-wrap: nowrap; height: var(--header-height); gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; flex: 0 0 auto; }
.brand__mark { width: 32px; height: 32px; display: block; }
.brand__en { font-size: 17px; font-weight: var(--weight-semibold); letter-spacing: -.01em; }
.brand__zh { font-size: 13px; font-weight: var(--weight-regular); color: var(--text-muted); }
.mainnav { flex: 1 1 auto; min-width: 0; }
.mainnav__list { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.mainnav__link { display: flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 12px; border-radius: var(--r-pill); font-size: 14.5px; line-height: 1.4; color: var(--text-muted); text-decoration: none; white-space: nowrap; }
.mainnav__link svg { width: 16px; height: 16px; flex: 0 0 16px; }
.mainnav__link:hover { color: var(--text); background: var(--panel-lift); }
.mainnav__link[aria-current="page"] { color: var(--text); background: var(--bg-panel); box-shadow: inset 0 0 0 1px var(--border); }
.masthead__tools { display: flex; align-items: center; gap: 8px; flex-shrink: 0; margin-left: auto; }
.language { position: relative; }
.lang { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 36px; min-width: 44px; width: auto; padding: 0 10px; border: 0; border-radius: var(--r-pill); background: var(--clear); font-size: 13px; color: var(--text-muted); white-space: nowrap; list-style: none; }
.lang span { white-space: nowrap; }
.lang svg { width: 16px; height: 16px; }
.language__panel { position: absolute; right: 0; top: calc(100% + 8px); width: 180px; padding: 8px; margin: 0; list-style: none; z-index: 80; border: 1px solid var(--border); border-radius: var(--r-card); background: var(--bg-panel); box-shadow: var(--shadow-panel); }
.language__link { display: flex; align-items: center; min-height: 40px; padding: 8px 12px; border-radius: var(--r-icon); text-decoration: none; font-size: 14px; }
.language__link:hover, .language__link[aria-current] { background: var(--bg-panel-2); }
.login { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 0 18px 0 14px; border-radius: var(--r-pill); background: var(--bg-panel); box-shadow: inset 0 0 0 1px var(--border), 0 6px 16px -10px var(--ink-a28); font-size: 14px; font-weight: var(--weight-medium); text-decoration: none; white-space: nowrap; }
.login svg { width: 16px; height: 16px; }
.menu-toggle { display: none; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border: 1px solid var(--border); border-radius: var(--r-pill); color: var(--text); background: var(--bg-panel); }
.menu-toggle svg { width: 20px; height: 20px; }
.drawer { position: fixed; top: var(--header-height); right: 0; left: 0; height: calc(100dvh - var(--header-height)); max-height: calc(100dvh - var(--header-height)); padding: 16px var(--gutter) 40px; background: var(--bg-panel); overflow-y: auto; overscroll-behavior: contain; z-index: 39; }
.drawer a { display: flex; width: 100%; min-height: 44px; padding: 12px 16px; }
.drawer__languages { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--border); }
.drawer__title { margin: 0 16px 8px; font-size: 13px; color: var(--text-muted); }
html.nav-open { overflow: hidden; }
.site-footer { margin-top: 48px; padding-top: 56px; padding-bottom: 24px; border-top: 1px solid var(--border); background: var(--bg-panel-2); }
.footer-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 48px; }
.footer-brand p { max-width: 340px; margin-top: 20px; color: var(--text-muted); font-size: 14px; }
.footer-heading { margin: 0 0 16px; font-size: 15px; font-weight: var(--weight-medium); }
.footer-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; list-style: none; margin: 0; padding: 0; }
.footer-links a, .footer-languages a, .footer-bottom a { display: inline-flex; align-items: center; min-height: 28px; text-decoration: none; font-size: 13px; color: var(--text-muted); }
.footer-links a:hover, .footer-languages a:hover, .footer-bottom a:hover { color: var(--text); text-decoration: underline; }
.footer-languages { display: flex; flex-wrap: wrap; gap: 8px 20px; padding-block: 24px; border-bottom: 1px solid var(--border); margin-top: 24px; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 20px; font-size: 12px; color: var(--text-muted); }
.footer-legal { display: flex; flex-wrap: wrap; gap: 20px; }
.reveal { transition: opacity var(--time-reveal) ease, transform var(--time-reveal) ease; }
.reveal.pending { opacity: 0; transform: translateY(16px); }
.reveal.shown { opacity: 1; transform: none; }
.counter-value, [data-counter] { display: inline-block; min-width: 3ch; font-variant-numeric: tabular-nums; font-family: var(--font-mono); }
#server-status { position: static; display: flow-root; width: 100%; max-width: 100%; overflow: hidden; margin-top: 24px; margin-bottom: 24px; }
#server-status + * { margin-top: 24px; }
.decorated, .stripe-halo { position: relative; max-width: 100%; overflow-x: clip; }
@media (max-width: 1320px) { .wrap { max-width: var(--wrap); } }
@media (max-width: 1100px) {
  .masthead__bar { gap: 16px; }
  .mainnav__link { padding-inline: 10px; }
  .mainnav__link span { display: none; }
}
@media (max-width: 768px) {
  h1 { font-size: 36px; }
  .mainnav { display: none; }
  .masthead__tools { margin-left: auto; gap: 4px; }
  .menu-toggle { display: inline-flex; }
  .masthead__bar { gap: 8px; }
  .grid-three { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  :root { --gutter: 16px; }
  .no-break { white-space: normal; }
  .wrap { padding-inline: var(--gutter); }
  .section { padding-top: 48px; padding-bottom: 48px; }
  .section--compact { padding-top: 28px; padding-bottom: 28px; }
  .grid-two { grid-template-columns: 1fr; }
  .card, .panel { padding: 22px; }
  .brand { gap: 7px; }
  .brand__mark { width: 28px; height: 28px; }
  .brand__en { font-size: 14px; }
  .brand__zh { display: none; }
  .lang { font-size: 12px; padding-inline: 6px; }
  .lang svg { display: none; }
  .login { min-height: 36px; padding-inline: 10px; font-size: 12px; }
  .login svg { display: none; }
  .tilt, .lockcard { transform: none; }
  .decorated, .stripe-halo { max-width: 100%; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-brand { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal, .reveal.pending, .reveal.shown { opacity: 1; transform: none; transition: none; }
}