:root {
  --c-bg:#F7FCFF;
  --c-panel:#FFFFFF;
  --c-panel-2:#EEF5FA;
  --c-border:#E1E9EF;
  --c-border-strong:#CFD9E1;
  --c-accent:#5B48D6;
  --c-accent-dark:#3D2EAE;
  --c-text:#15161C;
  --c-muted:#5D6672;
  --c-faint:#8C95A0;
  --c-success:#2E9E68;
  --c-warn:#F08A24;
  --c-error:#D6453B;
  --c-white:#FFFFFF;
  --c-clear:transparent;
  --c-accent-tint:rgba(91,72,214,.10);
  --c-accent-ring:rgba(91,72,214,.22);
  --c-accent-wash:rgba(91,72,214,.17);
  --c-warn-ring:rgba(240,138,36,.18);
  --c-chrome:#F4F7FA;
  --c-chrome-2:#FAFCFD;
  --c-skeleton:#E6ECF1;
  --c-skeleton-2:#F0F4F7;
  --c-track-off:#D3DBE2;
  --c-dot-idle:#CDD5DC;
  --c-alu-hi:#F0F3F6;
  --c-alu:#D8DDE2;
  --c-alu-lo:#B5BCC4;
  --c-alu-edge:#A3ABB4;
  --c-bezel:#16171D;
  --c-bezel-hi:#30323B;
  --c-wall-a:#E7EFF6;
  --c-wall-b:#ECE9F8;
  --c-screen-edge:rgba(21,22,28,.16);
  --c-home:rgba(21,22,28,.26);
  --c-wave:rgba(255,255,255,.82);
  --c-wave-soft:rgba(255,255,255,.58);
  --c-floor:rgba(21,22,28,.24);
  --c-tray-hi:rgba(255,255,255,.9);
  --c-veil:rgba(21,22,28,.28);
  --shadow-btn:0 1px 1px rgba(21,22,28,.18),0 10px 22px -8px rgba(21,22,28,.48),inset 0 1px 0 rgba(255,255,255,.10);
  --shadow-btn-hover:0 1px 1px rgba(21,22,28,.18),0 14px 26px -8px rgba(21,22,28,.50),inset 0 1px 0 rgba(255,255,255,.10);
  --shadow-ghost:0 1px 2px rgba(21,22,28,.05),0 8px 18px -10px rgba(21,22,28,.20);
  --shadow-chip:0 1px 2px rgba(21,22,28,.06);
  --shadow-screen:0 1px 2px rgba(21,22,28,.10),0 24px 46px -24px rgba(21,22,28,.32);
  --shadow-window:0 1px 2px rgba(21,22,28,.08),0 12px 26px -14px rgba(21,22,28,.26);
  --shadow-base-near:0 3px 4px -1px rgba(21,22,28,.32);
  --shadow-base-far:0 30px 46px -8px rgba(21,22,28,.20);
  --shadow-phone:0 1px 2px rgba(21,22,28,.32),0 10px 18px -6px rgba(21,22,28,.40),0 36px 56px -18px rgba(21,22,28,.36);
  --shadow-knob:0 1px 2px rgba(21,22,28,.28);
  --shadow-fab:0 2px 4px rgba(61,46,174,.30),0 10px 18px -6px rgba(61,46,174,.46);
  --shadow-panel:0 2px 4px rgba(21,22,28,.04),0 24px 48px -24px rgba(21,22,28,.22);
  --r-pill:999px;
  --r-circle:50%;
  --r-tray:44px;
  --r-card:26px;
  --r-lid:18px;
  --r-win:8px;
  --r-small:3px;
  --r-screen:9px;
  --r-phone:30px;
  --r-phone-screen:24px;
  --r-deck:2px 2px 12px 12px / 2px 2px 10px 10px;
  --r-notch:0 0 6px 6px;
  --r-phone-key:0 2px 2px 0;
  --f-display:"Inter","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --f-body:"Inter","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --fs-body:16px;
  --fs-small:14px;
  --fs-caption:12px;
  --fs-h1:clamp(34px,3.4vw,48px);
  --fs-h2:clamp(26px,2.6vw,38px);
  --fs-h3:22px;
  --weight-body:400;
  --weight-medium:500;
  --weight-strong:600;
  --weight-bold:700;
  --weight-heavy:800;
  --weight-display:900;
  --leading-body:1.8;
  --leading-title:1.14;
  --tracking-title:-.02em;
  --tracking-hero:-.035em;
  --nav-h:76px;
  --gutter:80px;
  --reading-width:1120px;
  --header-width:1280px;
  --section-space:100px;
  --rig-scale:1;
  --ease-out:cubic-bezier(.2,.65,.25,1);
  --duration-fast:200ms;
  --duration-reveal:650ms;
}
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:28px; }
html.nav-open { overflow:hidden; }
body {
  margin:0;
  position:relative;
  background:var(--c-bg);
  color:var(--c-text);
  font:var(--weight-body) var(--fs-body)/var(--leading-body) var(--f-body);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
main,section,article,aside,header,footer,nav,div { min-width:0; }
img,svg,video { max-width:100%; }
img { height:auto; }
svg { vertical-align:middle; }
button,input,select,textarea { font:inherit; }
button,summary { cursor:pointer; }
button { color:var(--c-text); }
button:disabled { cursor:not-allowed; }
a { color:var(--c-accent-dark); text-underline-offset:.2em; }
a:hover { color:var(--c-accent); }
:focus-visible { outline:2px solid var(--c-accent); outline-offset:3px; }
[hidden] { display:none!important; }
h1,h2,h3,h4 { font-family:var(--f-display); color:var(--c-text); text-wrap:balance; }
h1 { margin:0 0 24px; font-size:var(--fs-h1); font-weight:var(--weight-display); line-height:var(--leading-title); letter-spacing:var(--tracking-title); }
h2 { margin:0 0 28px; font-size:var(--fs-h2); font-weight:var(--weight-display); line-height:1.2; letter-spacing:var(--tracking-title); }
h3 { margin:0 0 16px; font-size:var(--fs-h3); font-weight:var(--weight-bold); line-height:1.4; }
p { margin:0 0 1.25em; }
ul,ol { padding-inline-start:1.5em; }
li+li { margin-top:.35em; }
strong { font-weight:var(--weight-strong); }
code,kbd,pre { font-family:var(--f-mono); }
code { overflow-wrap:anywhere; font-size:.9em; }
pre {
  max-width:100%; min-width:0; overflow-x:auto; padding:24px;
  border:1px solid var(--c-border); border-radius:var(--r-win);
  background:var(--c-panel-2); color:var(--c-text);
  font-size:var(--fs-small); line-height:1.7; white-space:pre;
}
pre code { overflow-wrap:normal; word-break:normal; font-size:inherit; }
hr { border:0; border-top:1px solid var(--c-border); margin:40px 0; }
.wrap { width:100%; max-width:calc(var(--reading-width) + var(--gutter) * 2); margin-inline:auto; padding-inline:var(--gutter); }
.section { padding-top:var(--section-space); padding-bottom:var(--section-space); }
.prose { max-width:78ch; margin-inline:auto; min-width:0; }
.prose h2 { margin-top:2.3em; }
.prose h3 { margin-top:1.8em; }
.prose p,.prose li { overflow-wrap:break-word; }
.prose img { display:block; }
.prose :first-child { margin-top:0; }
.muted { color:var(--c-muted); }
.mono { font-family:var(--f-mono); }
.keep { white-space:nowrap; }
.sr-only {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;
}
.skip-link { position:absolute; z-index:100; top:8px; left:16px; padding:12px 20px; transform:translateY(-180%); background:var(--c-panel); color:var(--c-text); border-radius:var(--r-pill); }
.skip-link:focus { transform:none; }
.decorated { position:relative; overflow-x:clip; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.grid>* { min-width:0; }
.card,.panel {
  padding:32px; border:1px solid var(--c-border); border-radius:var(--r-card);
  background:var(--c-panel); color:var(--c-text);
}
.panel { box-shadow:var(--shadow-panel); }
.tray { padding:48px; border-radius:var(--r-tray); background:var(--c-panel-2); color:var(--c-text); }
.card p:last-child,.panel p:last-child { margin-bottom:0; }
.cta,.button-row { display:flex; flex-wrap:wrap; gap:14px; }
.cta { margin-top:34px; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:54px; padding:0 30px; border:1px solid var(--c-clear); border-radius:var(--r-pill);
  font:var(--weight-strong) 16px/1.3 var(--f-body); letter-spacing:-.005em;
  text-decoration:none; text-align:center;
  transition:transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);
}
.btn svg { width:18px; height:18px; flex-shrink:0; }
.btn-primary { background:var(--c-text); color:var(--c-white); box-shadow:var(--shadow-btn); }
.btn-primary:hover,.btn-primary.is-hover { transform:translateY(-1px); color:var(--c-white); box-shadow:var(--shadow-btn-hover); }
.btn-ghost { background:var(--c-panel); color:var(--c-text); border-color:var(--c-border); box-shadow:var(--shadow-ghost); }
.btn-ghost svg { color:var(--c-muted); }
.btn-ghost:hover { transform:translateY(-1px); color:var(--c-text); }
.btn:active,.btn.is-active { transform:translateY(1px); box-shadow:var(--shadow-chip); }
.btn:disabled,.btn[aria-disabled="true"] { background:var(--c-panel-2); color:var(--c-muted); border-color:var(--c-border); box-shadow:none; transform:none; }
.btn.is-focus { outline:2px solid var(--c-accent); outline-offset:3px; }
.btn-small { min-height:44px; padding-inline:22px; font-size:var(--fs-small); }
.topbar,#site-header { position:relative; z-index:30; min-height:var(--nav-h); }
.topbar-inner {
  position:relative; height:var(--nav-h); display:flex; align-items:center; gap:24px;
  width:100%; max-width:min(100%,calc(var(--header-width) + var(--gutter) * 2));
  margin-inline:auto; padding-inline:var(--gutter);
}
.brand {
  display:inline-flex; align-items:center; gap:10px; flex-shrink:0;
  font-family:var(--f-display); font-weight:var(--weight-heavy); font-size:19px;
  letter-spacing:-.02em; color:var(--c-text); text-decoration:none;
}
.brand:hover { color:var(--c-text); }
.brand-mark { width:30px; height:30px; display:block; flex-shrink:0; }
.nav { margin-left:auto; min-width:0; }
.nav-list { display:flex; align-items:center; gap:2px; list-style:none; margin:0; padding:0; }
.nav-list li { margin:0; }
.nav-link {
  display:block; padding:9px 15px; border-radius:var(--r-pill);
  font-size:15px; font-weight:var(--weight-medium); line-height:1.2; white-space:nowrap;
  color:var(--c-muted); text-decoration:none;
  transition:color var(--duration-fast),background-color var(--duration-fast);
}
.nav-link:hover { color:var(--c-text); }
.nav-link[aria-current="page"] { background:var(--c-accent-tint); color:var(--c-accent-dark); font-weight:var(--weight-strong); }
.header-tools { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.language { position:relative; }
.lang {
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  height:38px; padding:0 14px; border:1px solid var(--c-border); border-radius:var(--r-pill);
  background:var(--c-panel); color:var(--c-text);
  font:var(--weight-medium) 14px/1 var(--f-body); box-shadow:var(--shadow-chip); white-space:nowrap;
}
.lang svg { width:15px; height:15px; flex-shrink:0; color:var(--c-muted); }
.lang .caret { font-size:11px; color:var(--c-muted); }
.lang-short { display:none; }
.language-menu {
  position:absolute; top:calc(100% + 10px); right:0; z-index:3;
  width:190px; margin:0; padding:8px; list-style:none;
  border:1px solid var(--c-border); border-radius:var(--r-lid);
  background:var(--c-panel); color:var(--c-text); box-shadow:var(--shadow-panel);
}
.language-menu li { margin:0; }
.language-menu a { display:block; min-height:44px; padding:9px 14px; border-radius:var(--r-win); text-decoration:none; color:var(--c-muted); }
.language-menu a[aria-current="true"] { background:var(--c-accent-tint); color:var(--c-accent-dark); }
.menu-toggle {
  display:none; align-items:center; justify-content:center; min-width:44px; min-height:44px;
  border:1px solid var(--c-border); border-radius:var(--r-circle); background:var(--c-panel); color:var(--c-text);
}
.menu-toggle svg { width:20px; height:20px; flex-shrink:0; }
.mobile-drawer { display:none; }
.nav-veil { position:fixed; inset:var(--nav-h) 0 0; z-index:20; border:0; background:var(--c-veil); color:var(--c-text); }
.site-footer { padding-top:72px; padding-bottom:28px; border-top:1px solid var(--c-border); }
.footer-grid { display:grid; grid-template-columns:1.25fr .8fr 1.2fr .65fr; gap:40px; }
.footer-grid>* { min-width:0; }
.footer-brand p { margin-top:20px; max-width:29em; color:var(--c-muted); font-size:var(--fs-small); }
.footer-title { margin:0 0 18px; font-size:var(--fs-small); font-weight:var(--weight-bold); }
.footer-list { list-style:none; padding:0; margin:0; }
.footer-list li { margin:0 0 8px; }
.footer-list a { display:inline-block; padding-block:4px; color:var(--c-muted); text-decoration:none; font-size:var(--fs-small); overflow-wrap:anywhere; }
.footer-list a:hover { color:var(--c-accent-dark); }
.footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; margin-top:48px; padding-top:24px; border-top:1px solid var(--c-border); color:var(--c-muted); font-size:var(--fs-small); }
.footer-legal { display:flex; flex-wrap:wrap; gap:24px; }
.footer-legal a { color:var(--c-muted); }
.reveal { opacity:1; transform:none; }
html.reveal-ready .reveal:not(.shown) { opacity:0; transform:translateY(18px); }
.reveal { transition:opacity var(--duration-reveal) var(--ease-out),transform var(--duration-reveal) var(--ease-out); }
.reveal.shown { opacity:1; transform:none; }
@media (max-width:1320px) {
  :root { --gutter:56px; --rig-scale:.88; }
  .nav-link { padding:9px 12px; }
}
@media (max-width:1100px) {
  .topbar-inner { gap:16px; }
  .nav { display:none; }
  .header-tools { margin-left:auto; }
  .menu-toggle { display:inline-flex; }
  .mobile-drawer:not([hidden]) {
    display:block; position:absolute; top:100%; inset-inline:0; z-index:2;
    max-height:calc(100dvh - var(--nav-h)); overflow-y:auto; overscroll-behavior:contain;
    padding:20px var(--gutter) 28px; border-bottom:1px solid var(--c-border);
    background:var(--c-panel); color:var(--c-text); box-shadow:var(--shadow-panel);
  }
  .mobile-drawer ul { display:block; list-style:none; margin:0; padding:0; }
  .mobile-drawer li { margin:0; }
  .mobile-drawer a { display:block; width:100%; min-height:48px; padding:12px 16px; white-space:normal; line-height:1.5; }
  .drawer-languages { margin-top:20px; padding-top:16px; border-top:1px solid var(--c-border); }
  .drawer-label { margin:0 16px 8px; color:var(--c-muted); font-size:var(--fs-small); }
  .drawer-languages a { color:var(--c-muted); text-decoration:none; border-radius:var(--r-win); }
  .drawer-languages a[aria-current="true"] { background:var(--c-accent-tint); color:var(--c-accent-dark); }
}
@media (max-width:900px) {
  .footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:768px) {
  :root { --fs-h1:clamp(24px,4vw,30px); --section-space:64px; }
}
@media (max-width:640px) {
  :root { --gutter:20px; --r-tray:28px; --rig-scale:.44; }
  .wrap { width:100%; padding-inline:var(--gutter); }
  .topbar-inner { gap:8px; }
  .brand { font-size:16px; gap:7px; }
  .brand-mark { width:26px; height:26px; }
  .header-tools { gap:6px; margin-left:auto; }
  .lang { min-height:44px; padding-inline:11px; }
  .lang-full { display:none; }
  .lang-short { display:inline; }
  .grid,.footer-grid { grid-template-columns:minmax(0,1fr); }
  .card,.panel { padding:24px; }
  .tray { padding:24px; }
  .tilt,[data-tilt] { transform:none!important; }
  .footer-bottom { flex-direction:column; }
  .footer-grid { gap:28px; }
  pre { padding:18px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; animation:none!important; }
  html.reveal-ready .reveal:not(.shown) { opacity:1; transform:none; }
}