:root {
  --c-bg:#FBF6EE;
  --c-panel:#FFFDF9;
  --c-panel-2:#FDE7CF;
  --c-border:#E6DACB;
  --c-accent:#E4572E;
  --c-accent-dark:#B23F1C;
  --c-text:#231A14;
  --c-muted:#6E6258;
  --c-success:#2F8F5B;
  --c-warn:#C98A12;
  --c-error:#C8362B;
  --c-ink:#1E1611;
  --c-white:#FFFFFF;
  --c-on-accent:#FFFFFF;
  --c-almond-top:#FDEBD6;
  --c-almond-bottom:#FBDFC2;
  --c-almond-deep:#F6C996;
  --c-almond-edge:#F1CFA8;
  --c-lavender:#F3ECFA;
  --c-lavender-edge:#DDD0EE;
  --c-chrome-top:#FFFFFF;
  --c-chrome-bottom:#F6EFE6;
  --c-hairline:rgb(35 26 20 / 0.12);
  --c-accent-12:rgb(228 87 46 / 0.12);
  --c-success-18:rgb(47 143 91 / 0.18);
  --c-ink-12:rgb(30 22 17 / 0.12);
  --c-veil:rgb(30 22 17 / 0.35);
  --c-transparent:transparent;
  --c-flag-red:#D52B1E;
  --c-flag-blue:#2A3B78;
  --c-flag-white:#FFFFFF;
  --c-flag-edge:rgb(35 26 20 / 0.2);
  --f-display:"Inter","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --f-body:"Inter","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --r-focus:4px;
  --r-xs:5px;
  --r-sm:8px;
  --r-md:12px;
  --r-chip:7px;
  --r-card:10px;
  --r-dot:2px;
  --r-round:50%;
  --r-pill:999px;
  --sh-warm:0 30px 72px 4px var(--c-accent-12),0 10px 24px -8px var(--c-accent-12);
  --sh-float:4px 4px 0 var(--c-ink),0 18px 40px -8px var(--c-accent-12);
  --sh-float-sm:3px 3px 0 var(--c-ink),0 12px 28px -8px var(--c-accent-12);
  --sh-button:0 12px 26px -12px var(--c-accent-12);
  --gutter:24px;
  --content-width:1248px;
  --reading-width:800px;
  --header-height:104px;
  --toc-offset:16px;
  --anchor-offset:96px;
  --fs-body:16px;
  --fs-small:14px;
  --fs-caption:12px;
  --fs-lede:20px;
  --fs-h1:68px;
  --fs-h2:36px;
  --fs-h3:24px;
  --ease-ui:150ms ease;
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html {
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-padding-top:var(--anchor-offset);
  scroll-behavior:smooth;
}
body {
  background:var(--c-bg);
  color:var(--c-text);
  font-family:var(--f-body);
  font-size:var(--fs-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a { color:inherit; text-decoration:none; }
ul,ol { list-style:none; }
img { max-width:100%; height:auto; display:block; }
svg { display:block; flex-shrink:0; }
button,input,select,textarea { font:inherit; color:inherit; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed; }
button,a { -webkit-tap-highlight-color:var(--c-transparent); }
[hidden] { display:none !important; }
:focus-visible {
  outline:2px solid var(--c-accent-dark);
  outline-offset:3px;
  border-radius:var(--r-focus);
}
::selection { background:var(--c-panel-2); color:var(--c-ink); }
h1,h2,h3 { font-family:var(--f-display); text-wrap:balance; overflow-wrap:break-word; }
h1 { font-size:var(--fs-h1); font-weight:900; line-height:1.1; letter-spacing:-0.02em; }
h2 { font-size:var(--fs-h2); font-weight:800; line-height:1.2; letter-spacing:-0.02em; }
h3 { font-size:var(--fs-h3); font-weight:800; line-height:1.3; letter-spacing:-0.01em; }
p { overflow-wrap:break-word; }
code { font-family:var(--f-mono); overflow-wrap:anywhere; }
pre { max-width:100%; overflow-x:auto; padding:20px; background:var(--c-panel); border:1px solid var(--c-border); border-radius:var(--r-sm); }
pre code { white-space:pre; overflow-wrap:normal; }
hr { border:0; border-top:1px solid var(--c-border); }
.wrap { width:100%; max-width:var(--content-width); margin-inline:auto; padding-inline:var(--gutter); }
.reading-wrap { width:100%; max-width:var(--reading-width); margin-inline:auto; padding-inline:var(--gutter); }
.section { padding-top:72px; padding-bottom:80px; }
.section-head { margin-bottom:32px; }
.section-head p { margin-top:12px; max-width:65ch; color:var(--c-muted); }
.grid { display:grid; gap:24px; }
.grid > *, .hero-copy > *, .win-body > *, .doc > *, .footer-grid > * { min-width:0; }
.grid-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid-five { grid-template-columns:repeat(5,minmax(0,1fr)); }
.stack { display:grid; gap:20px; min-width:0; }
.no-break { white-space:nowrap; }
.muted { color:var(--c-muted); }
.mono { font-family:var(--f-mono); font-variant-numeric:tabular-nums; }
.panel { background:var(--c-panel); border:1px solid var(--c-border); border-radius:var(--r-md); padding:24px; min-width:0; }
.paper-card { background:var(--c-white); border:1.5px solid var(--c-ink); border-radius:var(--r-md); padding:24px; box-shadow:var(--sh-float-sm); min-width:0; }
.decorated-section { position:relative; overflow-x:clip; max-width:100%; }
.i { fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.icon { width:20px; height:20px; flex-shrink:0; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:48px; padding:0 22px; border-radius:var(--r-sm);
  border:1.5px solid var(--c-ink); font-size:var(--fs-body);
  font-weight:600; line-height:1.2; flex-shrink:0; white-space:nowrap;
  transition:transform var(--ease-ui),box-shadow var(--ease-ui);
}
.btn svg { width:16px; height:16px; }
.btn-primary { background:var(--c-ink); color:var(--c-white); box-shadow:var(--sh-button); }
.btn-primary:hover { transform:translateY(-1px); }
.btn-ghost,.btn-secondary { background:var(--c-white); color:var(--c-ink); }
.btn-ghost:hover,.btn-secondary:hover { box-shadow:3px 3px 0 var(--c-ink); transform:translate(-1px,-1px); }
.btn:active { transform:translateY(1px); box-shadow:none; }
.btn:disabled,.btn[aria-disabled="true"] { opacity:.5; box-shadow:none; transform:none; }
.btn-small { min-height:40px; padding-inline:16px; font-size:var(--fs-small); }
.cta-row { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.text-link { color:var(--c-accent-dark); text-decoration:underline; text-underline-offset:4px; }
.notice { background:var(--c-accent); color:var(--c-on-accent); }
.notice .wrap { min-height:40px; display:flex; align-items:center; }
.notice-link { display:inline-flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:var(--fs-small); font-weight:600; line-height:1.4; letter-spacing:.005em; padding-block:8px; }
.notice-go { display:inline-flex; align-items:center; gap:6px; padding-left:10px; border-left:1px solid currentColor; }
.notice-link:hover .notice-go { text-decoration:underline; text-underline-offset:3px; }
#site-header { position:relative; z-index:50; }
.masthead { position:relative; z-index:53; background:var(--c-bg); border-bottom:1px solid var(--c-border); }
.mast-row { min-height:64px; display:flex; flex-wrap:nowrap; align-items:center; gap:28px; }
.brand { display:flex; align-items:center; gap:10px; flex-shrink:0; min-height:44px; }
.brand-mark { width:30px; height:30px; flex-shrink:0; }
.brand-word { font-family:var(--f-display); font-weight:800; font-size:19px; letter-spacing:-.02em; line-height:1; white-space:nowrap; }
.brand-zh { color:var(--c-muted); font-weight:500; font-size:var(--fs-small); white-space:nowrap; }
.topnav { flex:1; min-width:0; }
.topnav ul { display:flex; align-items:center; list-style:none; margin:0; padding:0; gap:22px; }
.topnav a { display:inline-flex; align-items:center; min-height:64px; font-size:15px; font-weight:500; color:var(--c-muted); white-space:nowrap; transition:color var(--ease-ui); }
.topnav a:hover { color:var(--c-text); }
.topnav a[aria-current="page"] { color:var(--c-text); font-weight:700; }
.mast-tools { display:flex; align-items:center; gap:18px; flex-shrink:0; margin-left:auto; }
.lang-picker { position:relative; }
.lang { display:inline-flex; justify-content:center; align-items:center; gap:6px; width:auto; min-width:44px; min-height:44px; background:none; border:0; font-size:var(--fs-small); font-weight:500; color:var(--c-text); white-space:nowrap; }
.lang span { white-space:nowrap; }
.lang svg { width:16px; height:16px; }
.lang-panel { position:absolute; z-index:60; top:calc(100% + 8px); right:0; width:180px; background:var(--c-panel); padding:6px; border:1.5px solid var(--c-ink); border-radius:var(--r-sm); box-shadow:var(--sh-float-sm); }
.lang-panel a { display:flex; align-items:center; width:100%; min-height:44px; padding:8px 12px; border-radius:var(--r-xs); font-size:var(--fs-small); }
.lang-panel a:hover,.lang-panel a[aria-current="true"] { background:var(--c-panel-2); }
.btn-login { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 18px; border-radius:var(--r-sm); background:var(--c-ink); color:var(--c-white); font-size:var(--fs-small); font-weight:600; border:1.5px solid var(--c-ink); white-space:nowrap; transition:transform var(--ease-ui); }
.btn-login:hover { transform:translateY(-1px); }
.menu-toggle { display:none; align-items:center; justify-content:center; flex-direction:column; gap:4px; min-width:44px; min-height:44px; background:var(--c-transparent); border:1px solid var(--c-border); border-radius:var(--r-sm); }
.menu-line { display:block; width:20px; height:2px; background:currentColor; }
.menu-toggle[aria-expanded="true"] .menu-line:first-child { transform:translateY(6px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-line:nth-child(2) { opacity:0; }
.menu-toggle[aria-expanded="true"] .menu-line:last-child { transform:translateY(-6px) rotate(-45deg); }
.mobile-drawer { position:fixed; z-index:52; top:var(--header-height); right:0; left:0; height:calc(100dvh - var(--header-height)); max-height:calc(100dvh - var(--header-height)); overflow-y:auto; overscroll-behavior:contain; background:var(--c-panel); padding:16px var(--gutter) 32px; }
.mobile-drawer a { display:flex; align-items:center; width:100%; min-height:48px; padding:12px 16px; border-bottom:1px solid var(--c-border); }
.mobile-drawer a[aria-current] { background:var(--c-panel-2); font-weight:700; }
.drawer-languages { margin-top:24px; border-top:2px solid var(--c-ink); }
.nav-veil { position:fixed; z-index:51; top:var(--header-height); right:0; bottom:0; left:0; border:0; background:var(--c-veil); }
html.nav-open { overflow:hidden; }
.site-footer { background:var(--c-panel); border-top:1px solid var(--c-ink); padding-top:56px; padding-bottom:24px; }
.footer-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:48px; }
.footer-brand p { max-width:34ch; margin-top:16px; color:var(--c-muted); font-size:var(--fs-small); }
.footer-heading { font-size:var(--fs-small); font-weight:800; margin-bottom:12px; }
.footer-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 16px; }
.footer-links a,.footer-languages a,.footer-legal a { display:inline-flex; align-items:center; min-height:32px; font-size:var(--fs-small); }
.footer-links a:hover,.footer-languages a:hover,.footer-legal a:hover { color:var(--c-accent-dark); text-decoration:underline; text-underline-offset:3px; }
.footer-languages { display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:40px; padding-block:16px; border-top:1px solid var(--c-border); }
.footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 24px; align-items:center; padding-top:16px; border-top:1px solid var(--c-border); font-size:var(--fs-caption); color:var(--c-muted); }
.footer-legal { display:flex; flex-wrap:wrap; gap:24px; }
.prose { min-width:0; }
.prose p,.prose ul,.prose ol,.prose pre,.prose blockquote { margin-block:18px; }
.prose h2 { margin-top:48px; margin-bottom:20px; }
.prose h3 { margin-top:32px; margin-bottom:14px; }
.prose ul { list-style:disc; padding-left:24px; }
.prose ol { list-style:decimal; padding-left:24px; }
.prose li + li { margin-top:8px; }
.prose a { color:var(--c-accent-dark); text-decoration:underline; text-underline-offset:3px; }
.prose code { background:var(--c-panel-2); padding:2px 5px; border-radius:var(--r-focus); font-size:.9em; }
.prose pre code { background:none; padding:0; }
.reveal { transition:opacity .35s ease,transform .35s ease; }
.reveal.pending { opacity:0; transform:translateY(16px); }
.reveal.shown { opacity:1; transform:none; }
#server-status { position:static; display:block; min-height:48px; max-width:100%; overflow:hidden; margin:0 0 24px; }
#server-status + * { margin-top:24px; }
@media (max-width:1180px) {
  .topnav { display:none; }
  .menu-toggle { display:flex; }
  .mast-tools { margin-left:auto; }
}
@media (min-width:1181px) {
  .mobile-drawer,.nav-veil { display:none !important; }
}
@media (max-width:900px) {
  .grid-three { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grid-five { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .footer-brand { grid-column:1/-1; }
}
@media (max-width:768px) {
  h1 { font-size:clamp(28px,7vw,40px); }
}
@media (max-width:640px) {
  :root { --gutter:16px; --fs-h2:28px; --fs-h3:21px; }
  .no-break { white-space:normal; }
  .wrap,.reading-wrap { padding-inline:var(--gutter); }
  .section { padding-top:48px; padding-bottom:56px; }
  .grid-three,.grid-five,.footer-grid { grid-template-columns:minmax(0,1fr); }
  .mast-row { gap:8px; }
  .mast-tools { gap:8px; margin-left:auto; }
  .brand { gap:7px; }
  .brand-word { font-size:17px; }
  .brand-mark { width:26px; height:26px; }
  .brand-zh { display:none; }
  .lang { font-size:var(--fs-caption); gap:3px; }
  .lang svg { display:none; }
  .btn-login { padding-inline:10px; font-size:var(--fs-caption); }
  .notice-link { font-size:13px; row-gap:2px; }
  .panel,.paper-card { padding:20px; }
  .tilt,.note-signup { transform:none; }
  .decorated-section { max-width:100%; overflow-x:clip; }
  .footer-links { gap:6px 12px; }
  .footer-grid { gap:28px; }
}
@media (max-width:359px) {
  .mast-tools { gap:4px; }
  .brand-word { font-size:15px; }
  .brand-mark { width:24px; height:24px; }
  .lang { font-size:11px; }
  .btn-login { padding-inline:8px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none !important; animation:none !important; }
  .reveal,.reveal.pending { opacity:1; transform:none; }
}