:root {
  --bg:#F8F2E8;
  --bg-top:#FCF8F1;
  --bg-bottom:#F3EBDE;
  --panel:#FFFDF8;
  --panel-2:#EFE7DA;
  --panel-2-deep:#EBE2D3;
  --groove:#E4D9C6;
  --border:#E3D8C6;
  --border-ink:rgba(43,33,24,.16);
  --accent:#CF4A26;
  --accent-dark:#A63817;
  --text:#2B2118;
  --text-muted:#75685A;
  --text-soft:#9C8E7D;
  --success:#2F8A5B;
  --warn:#C98A12;
  --error:#A82A3A;
  --on-accent:#FFFDF8;
  --hi:rgba(255,253,248,.95);
  --hi-soft:rgba(255,253,248,.5);
  --hi-none:rgba(255,253,248,0);
  --accent-glow:rgba(207,74,38,.07);
  --accent-glow-none:rgba(207,74,38,0);
  --topbar-bg:rgba(252,248,241,.88);
  --veil:rgba(43,33,24,.28);
  --flag-red:#BE4E34;
  --flag-blue:#2F3D66;
  --flag-white:#FFFDF8;
  --flag-edge:rgba(43,33,24,.16);
  --scene-apricot:#EBD1B6;
  --scene-sage:#CDD2C3;
  --chrome-red:#BB6355;
  --chrome-yellow:#BA974F;
  --chrome-green:#648570;
  --shadow-tray:inset 0 1px 0 var(--hi),0 48px 96px -40px rgba(207,74,38,.22),0 18px 40px -28px rgba(43,33,24,.16);
  --shadow-card:inset 0 1px 0 var(--hi),0 8px 18px -12px rgba(207,74,38,.24),0 1px 2px rgba(43,33,24,.05);
  --shadow-note:0 18px 36px -16px rgba(207,74,38,.30),0 2px 6px rgba(43,33,24,.07);
  --shadow-seg:0 1px 2px rgba(43,33,24,.08),0 6px 12px -8px rgba(207,74,38,.30);
  --shadow-btn:inset 0 1px 0 rgba(255,253,248,.22),0 12px 24px -14px rgba(207,74,38,.65);
  --shadow-groove:inset 0 1px 2px rgba(43,33,24,.07);
  --r-dot:1px;
  --r-line:2px;
  --r-sm:6px;
  --r-md:8px;
  --r-lg:18px;
  --r-pill:999px;
  --font-display:"Inter","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --font-body:"Inter","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --font-serif:"Songti SC","STSong","Noto Serif SC","Source Han Serif SC","SimSun",Georgia,serif;
  --weight-regular:400;
  --weight-medium:500;
  --weight-strong:600;
  --size-body:16px;
  --size-small:14px;
  --size-caption:12px;
  --size-h1:clamp(52px,4.31vw,62px);
  --size-h2:clamp(28px,3vw,40px);
  --size-h3:26px;
  --gutter:32px;
  --wrap-width:1264px;
  --header-height:64px;
  --toc-height:64px;
  --anchor-offset:144px;
  --ease:cubic-bezier(.2,.7,.3,1);
  --time-fast:.18s;
  --time-reveal:.35s;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .17 0 0 0 0 .13 0 0 0 0 .09 0 0 0 .03 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
}
*,*::before,*::after { box-sizing:border-box }
html { -webkit-text-size-adjust:100%;scroll-padding-top:80px;scroll-behavior:smooth }
body {
  margin:0;min-height:100vh;font-family:var(--font-body);font-size:var(--size-body);
  line-height:1.6;color:var(--text);
  background:linear-gradient(180deg,var(--bg-top) 0%,var(--bg) 46%,var(--bg-bottom) 100%);
  -webkit-font-smoothing:antialiased;position:relative;
}
body::before {
  content:"";position:fixed;inset:0;background-image:var(--grain);background-size:180px 180px;
  pointer-events:none;z-index:0;
}
main,footer { position:relative;z-index:1 }
a { color:inherit;text-decoration:none }
button,input,select,textarea { font:inherit;color:inherit }
button { cursor:pointer }
button:disabled { cursor:not-allowed }
img { display:block;max-width:100%;height:auto }
svg { flex-shrink:0 }
ul,ol { list-style:none;margin:0;padding:0 }
p,h1,h2,h3,h4,figure,blockquote { margin:0 }
h1,h2,h3 { overflow-wrap:break-word;text-wrap:balance }
h1 { font:var(--weight-medium) var(--size-h1)/1.12 var(--font-display);letter-spacing:-.02em }
h2 { font:var(--weight-regular) var(--size-h2)/1.3 var(--font-serif) }
h3 { font:var(--weight-regular) var(--size-h3)/1.35 var(--font-serif) }
strong { font-weight:var(--weight-strong) }
code { font-family:var(--font-mono);overflow-wrap:anywhere }
pre { max-width:100%;overflow-x:auto;padding:20px;background:var(--panel-2);border:1px solid var(--border);border-radius:var(--r-sm) }
pre code { white-space:pre;overflow-wrap:normal }
[hidden] { display:none!important }
:focus-visible { outline:2px solid var(--accent);outline-offset:3px }
::selection { background:var(--accent);color:var(--on-accent) }
.no-break { white-space:nowrap }
.hl { color:var(--accent) }
.muted { color:var(--text-muted) }
.mono { font-family:var(--font-mono);font-variant-numeric:tabular-nums }
.wrap { width:100%;max-width:var(--wrap-width);margin-inline:auto;padding-inline:var(--gutter) }
.section { padding-top:72px;padding-bottom:72px }
.section-heading { max-width:880px;margin:0 auto 36px;text-align:center }
.section-heading p { margin-top:16px;color:var(--text-muted) }
.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)) }
.grid-two > *,.grid-three > *,[role="tabpanel"] { min-width:0 }
.panel,.card { padding:24px;border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-card) }
.panel { background:var(--panel-2) }
.card { background:var(--panel) }
.card p + p { margin-top:16px }
.prose { max-width:860px;min-width:0;overflow-wrap:break-word }
.prose p,.prose ul,.prose ol,.prose blockquote,.prose pre { margin-block:20px }
.prose h2 { margin-top:48px;margin-bottom:20px }
.prose h3 { margin-top:32px;margin-bottom:16px }
.prose ul { list-style:square;padding-left:24px }
.prose ol { list-style:decimal;padding-left:24px }
.prose li + li { margin-top:8px }
.prose a { color:var(--accent-dark);text-decoration:underline;text-underline-offset:3px }
.btn {
  display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 32px;
  border-radius:var(--r-sm);font-family:var(--font-body);font-size:17px;font-weight:var(--weight-strong);
  letter-spacing:.02em;white-space:nowrap;flex-shrink:0;gap:8px;
  transition:background var(--time-fast),color var(--time-fast),border-color var(--time-fast);
}
.btn--primary,.btn-primary { background:var(--accent);color:var(--on-accent);border:1px solid var(--accent);box-shadow:var(--shadow-btn) }
.btn--primary:hover,.btn--primary.is-hover,.btn-primary:hover { background:var(--accent-dark);border-color:var(--accent-dark) }
.btn--primary:active { box-shadow:var(--shadow-groove) }
.btn--ghost { background:var(--panel);color:var(--text);border:1px solid var(--text) }
.btn--ghost:hover,.btn--ghost.is-hover { background:var(--panel-2) }
.btn:disabled { background:var(--panel-2);color:var(--text-muted);border:1px solid var(--border);box-shadow:none }
.btn.is-focus { outline:2px solid var(--accent);outline-offset:3px }
.btn--small { height:40px;padding-inline:18px;font-size:var(--size-small) }
.text-link { display:inline-flex;align-items:center;min-height:28px;color:var(--accent-dark);text-decoration:underline;text-underline-offset:4px }
.topbar { position:relative;z-index:50;background:var(--topbar-bg);border-bottom:1px solid var(--border) }
.topbar__inner { max-width:1280px;margin:0 auto;padding:0 32px;height:var(--header-height);display:flex;align-items:center;gap:36px;flex-wrap:nowrap }
.brand { display:flex;align-items:center;gap:10px;flex-shrink:0;min-width:0 }
.brand__mark { width:32px;height:32px;display:block;flex-shrink:0 }
.brand__en { font-family:var(--font-display);font-weight:var(--weight-strong);font-size:17px;letter-spacing:-.01em;white-space:nowrap }
.brand__zh { font-size:15px;font-weight:var(--weight-regular);color:var(--text-muted);white-space:nowrap }
.tabs { display:flex;align-items:stretch;height:100%;gap:2px;flex:1;min-width:0 }
.tabs ul { display:flex;align-items:center;list-style:none;margin:0;padding:0;gap:2px;height:100% }
.tabs li { height:100% }
.tab { position:relative;display:flex;align-items:center;height:100%;padding:0 13px;font-size:15px;color:var(--text-muted);white-space:nowrap }
.tab:hover { color:var(--text) }
.tab[aria-current="page"] { color:var(--text);font-weight:var(--weight-medium) }
.tab[aria-current="page"]::after { content:"";position:absolute;left:13px;right:13px;bottom:-1px;height:2px;border-radius:var(--r-line);background:var(--accent) }
.topbar__end { margin-left:auto;display:flex;align-items:center;gap:18px;flex-shrink:0 }
.language { position:relative }
.lang { display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 4px;min-height:32px;min-width:44px;width:auto;border:0;background:none;font:inherit;font-size:14px;color:var(--text-muted);cursor:pointer;white-space:nowrap }
.lang svg { width:16px;height:16px;display:block }
.lang__name { white-space:nowrap }
.lang-panel { position:absolute;right:0;top:calc(100% + 10px);z-index:80;min-width:170px;padding:8px;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-note) }
.lang-panel a { display:flex;align-items:center;min-height:44px;padding:8px 12px;border-radius:var(--r-sm);white-space:nowrap }
.lang-panel a:hover,.lang-panel a[aria-current="true"] { background:var(--panel-2) }
.btn-login { display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 18px;border:1px solid var(--text);border-radius:var(--r-sm);background:var(--panel);font-size:14px;font-weight:var(--weight-strong);color:var(--text);white-space:nowrap }
.btn-login:hover { background:var(--text);color:var(--panel) }
.menu-toggle { display:none;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--panel) }
.menu-toggle svg { display:block;width:20px;height:20px }
.menu-drawer { display:none }
.menu-veil { display:none }
html.nav-open { overflow:hidden }
.static-language { position:relative }
.static-language > summary { list-style:none }
.static-language > summary::-webkit-details-marker { display:none }
.static-language[open] .lang-panel { display:block }
.site-footer { margin-top:48px;padding-top:48px;padding-bottom:24px;background:var(--panel-2);border-top:1px solid var(--border) }
.footer-grid { display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:48px }
.footer-grid > * { min-width:0 }
.footer-brand p { max-width:360px;margin-top:20px;color:var(--text-muted) }
.footer-title { font-family:var(--font-body);font-size:var(--size-small);font-weight:var(--weight-strong);margin-bottom:14px }
.footer-links { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 16px }
.footer-links a,.footer-languages a,.footer-legal a { display:inline-flex;align-items:center;min-height:28px;font-size:var(--size-small) }
.footer-links a:hover,.footer-languages a:hover,.footer-legal a:hover { color:var(--accent-dark);text-decoration:underline }
.footer-languages { display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:32px;padding-top:24px;border-top:1px solid var(--border) }
.footer-bottom { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-top:20px;color:var(--text-muted);font-size:var(--size-caption) }
.footer-legal { display:flex;gap:20px }
.reveal { transition:opacity var(--time-reveal) var(--ease),transform var(--time-reveal) var(--ease) }
.reveal.pending { opacity:0;transform:translateY(16px) }
.reveal.shown { opacity:1;transform:none }
#server-status { position:relative;display:block;min-height:80px;max-width:100%;overflow:hidden;margin-block:24px }
#server-status + * { margin-top:24px }
.decor-zone { position:relative;overflow-x:clip }
.decor-layer { position:absolute;inset:12% 8%;max-width:100%;pointer-events:none;background:radial-gradient(ellipse,var(--accent-glow),var(--accent-glow-none)) }
.decor-lines { display:block;width:100%;height:80px;color:var(--text-soft);overflow:hidden }
.decor-lines path { fill:none;stroke:currentColor;stroke-width:1.5 }
@media (max-width:1270px) {
  .topbar__inner { gap:20px;padding-inline:24px }
  .tab { padding-inline:9px;font-size:14px }
  .tabs ul { gap:3px }
  .topbar__end { gap:12px }
}
@media (max-width:1160px) {
  .tabs { display:none }
  .topbar__inner { gap:16px }
  .topbar__end { margin-left:auto }
  .menu-toggle { display:inline-flex }
  .menu-veil:not([hidden]) { display:block;position:fixed;inset:var(--header-height) 0 0;z-index:30;background:var(--veil) }
  .menu-drawer:not([hidden]) {
    display:block;position:fixed;top:var(--header-height);right:0;left:0;z-index:40;
    height:calc(100dvh - var(--header-height));max-height:calc(100dvh - var(--header-height));
    overflow-y:auto;overscroll-behavior:contain;padding:16px var(--gutter) 32px;background:var(--panel);
    border-bottom:1px solid var(--border);
  }
  .menu-drawer a { display:flex;align-items:center;width:100%;min-height:48px;padding:12px 16px;border-bottom:1px solid var(--border) }
  .menu-drawer a[aria-current] { color:var(--accent-dark);background:var(--panel-2) }
  .drawer-languages { margin-top:24px;border-top:1px solid var(--border) }
  .drawer-caption { padding:16px;font-size:var(--size-caption);color:var(--text-muted) }
}
@media (min-width:1161px) { html.nav-open { overflow:auto } }
@media (max-width:768px) {
  :root { --gutter:24px;--size-h1:38px;--size-h3:23px }
  .grid-three { grid-template-columns:1fr }
  .section { padding-top:48px;padding-bottom:48px }
  .footer-grid { grid-template-columns:1fr 1fr;gap:32px }
  .footer-brand { grid-column:1 / -1 }
}
@media (max-width:640px) {
  :root { --gutter:16px;--size-h1:36px }
  .no-break { white-space:normal }
  .grid-two { grid-template-columns:1fr }
  .topbar__inner { padding-inline:16px;gap:8px }
  .brand { gap:6px }
  .brand__en { font-size:14px }
  .brand__zh { display:none }
  .brand__mark { width:26px;height:26px }
  .topbar__end { margin-left:auto;gap:6px }
  .btn-login { padding-inline:10px;font-size:13px }
  .lang { padding-inline:2px;font-size:12px;gap:3px }
  .lang svg { display:none }
  .menu-toggle { padding:8px }
  .panel,.card { padding:20px }
  .footer-grid { grid-template-columns:1fr;gap:28px }
  .footer-brand { grid-column:auto }
  .footer-bottom { align-items:flex-start;flex-direction:column }
  .tilt,.note--tl,.note--br { transform:none }
  .decor-layer { max-width:100% }
  .btn { padding-inline:20px;font-size:16px }
}
@media (max-width:359px) {
  .topbar__inner { padding-inline:12px }
  .brand__en { font-size:12px }
  .brand__mark { width:24px;height:24px }
  .topbar__end { gap:4px }
  .btn-login { padding-inline:8px }
  .lang { font-size:11px }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto }
  *,*::before,*::after { animation:none!important;transition:none!important }
  .reveal,.reveal.pending { opacity:1;transform:none }
}