:root{
  --color-page:#F7F8FC;
  --color-panel:#FFFFFF;
  --color-storm:#101731;
  --color-storm-raised:#18213F;
  --color-storm-soft:#222D50;
  --color-line:#E2E6F0;
  --color-gold:#F5C518;
  --color-gold-deep:#B8900A;
  --color-gold-mid:#E0AE10;
  --color-ink:#171D33;
  --color-muted:#5C6478;
  --color-success:#2FA36B;
  --color-warning:#E08A00;
  --color-error:#D64545;
  --color-flag-red:#D0342C;
  --color-flag-blue:#2C3E8F;
  --color-flag-white:#FFFFFF;
  --color-flag-maple:#C9282D;
  --color-clear:transparent;
  --color-ink-04:rgba(23,29,51,.04);
  --color-ink-06:rgba(23,29,51,.06);
  --color-ink-10:rgba(23,29,51,.10);
  --color-ink-14:rgba(23,29,51,.14);
  --color-ink-16:rgba(16,23,49,.16);
  --color-ink-25:rgba(16,23,49,.25);
  --color-gold-10:rgba(245,197,24,.10);
  --color-gold-16:rgba(245,197,24,.16);
  --color-gold-26:rgba(245,197,24,.26);
  --color-gold-shadow:rgba(184,144,10,.28);
  --color-gold-shadow-strong:rgba(184,144,10,.34);
  --color-success-ring:rgba(47,163,107,.15);
  --color-storm-line:rgba(255,255,255,.12);
  --color-storm-muted:rgba(255,255,255,.68);
  --font-display:'Inter','Noto Sans SC',-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;
  --font-body:'Inter','Noto Sans SC',-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;
  --font-mono:'JetBrains Mono','SFMono-Regular',Consolas,'Courier New',monospace;
  --radius-xl:32px;
  --radius-lg:24px;
  --radius-md:14px;
  --radius-sm:8px;
  --radius-pill:999px;
  --shadow-card-near:0 6px 16px var(--color-ink-10);
  --shadow-card-far:0 36px 72px var(--color-ink-16);
  --shadow-button:0 8px 20px var(--color-gold-shadow);
  --shadow-soft:0 18px 48px var(--color-ink-10);
  --page-max:1320px;
  --reading-max:820px;
  --gutter:32px;
  --header-height:72px;
  --section-space:104px;
  --focus-ring:2px solid var(--color-gold-deep);
  --transition-fast:180ms ease;
}
*,
*::before,
*::after{box-sizing:border-box}
html{
  min-width:320px;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-height) + 16px);
}
html.nav-open{overflow:hidden}
body{
  min-width:320px;
  margin:0;
  overflow-x:clip;
  background:var(--color-page);
  color:var(--color-ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body,
button,
input,
select,
textarea{font:inherit}
img,
svg,
video{display:block;max-width:100%}
img{height:auto}
svg{flex-shrink:0}
button,
input,
select,
textarea{color:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
p,
h1,
h2,
h3,
h4,
ul,
ol,
blockquote,
figure{margin-top:0}
p:last-child{margin-bottom:0}
ul,
ol{padding-left:1.25rem}
h1,
h2,
h3,
h4{
  color:var(--color-ink);
  font-family:var(--font-display);
  line-height:1.18;
  text-wrap:balance;
}
h1{
  margin-bottom:24px;
  font-size:clamp(52px,5.1vw,72px);
  font-weight:800;
  letter-spacing:-.02em;
}
h2{
  margin-bottom:20px;
  font-size:clamp(34px,3.4vw,52px);
  font-weight:750;
  letter-spacing:-.015em;
}
h3{
  margin-bottom:14px;
  font-size:clamp(22px,2vw,30px);
  font-weight:700;
}
code,
kbd,
pre,
.mono{font-family:var(--font-mono)}
code{overflow-wrap:anywhere}
pre{
  max-width:100%;
  overflow-x:auto;
  padding:20px;
  border:1px solid var(--color-line);
  border-radius:var(--radius-md);
  background:var(--color-storm);
  color:var(--color-panel);
  white-space:pre;
  -webkit-overflow-scrolling:touch;
}
::selection{background:var(--color-gold);color:var(--color-ink)}
:focus-visible{
  outline:var(--focus-ring);
  outline-offset:3px;
}
.no-break{white-space:nowrap}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.wrap{
  width:100%;
  max-width:var(--page-max);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.reading-wrap{
  width:100%;
  max-width:calc(var(--reading-max) + (var(--gutter) * 2));
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.section{
  padding-top:var(--section-space);
  padding-bottom:var(--section-space);
}
.section-head{max-width:760px;margin-bottom:44px}
.eyebrow{
  display:inline-flex;
  min-height:30px;
  align-items:center;
  gap:8px;
  margin-bottom:18px;
  padding:3px 13px;
  border:1px solid var(--color-line);
  border-radius:var(--radius-pill);
  background:var(--color-panel);
  color:var(--color-muted);
  font-size:13px;
}
.eyebrow-dot{
  width:8px;
  height:8px;
  flex-shrink:0;
  border-radius:50%;
  background:var(--color-gold);
}
.lead{
  max-width:720px;
  color:var(--color-muted);
  font-size:clamp(17px,1.7vw,21px);
}
.text-muted{color:var(--color-muted)}
.text-accent{
  background:linear-gradient(160deg,var(--color-gold-mid),var(--color-gold-deep));
  background-clip:text;
  color:var(--color-clear);
  -webkit-background-clip:text;
}
.surface{
  border:1px solid var(--color-line);
  border-radius:var(--radius-lg);
  background:var(--color-panel);
  box-shadow:var(--shadow-soft);
}
.storm-section{
  overflow-x:clip;
  background:var(--color-storm);
  color:var(--color-panel);
}
.storm-section h1,
.storm-section h2,
.storm-section h3{color:var(--color-panel)}
.storm-section .text-muted{color:var(--color-storm-muted)}
.btn{
  display:inline-flex;
  min-height:48px;
  min-width:48px;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:10px 26px;
  border:1px solid var(--color-clear);
  border-radius:var(--radius-pill);
  font-weight:700;
  line-height:1.2;
  transition:transform var(--transition-fast),background var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast);
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{
  background:linear-gradient(135deg,var(--color-gold),var(--color-gold-mid));
  color:var(--color-ink);
  box-shadow:var(--shadow-button);
}
.btn-primary:hover{box-shadow:0 12px 26px var(--color-gold-shadow-strong)}
.btn-secondary{
  border-color:var(--color-ink);
  background:var(--color-clear);
  color:var(--color-ink);
}
.btn-secondary:hover{background:var(--color-ink);color:var(--color-panel)}
.btn-storm{
  border-color:var(--color-storm-line);
  background:var(--color-storm-raised);
  color:var(--color-panel);
}
.btn-small{min-height:42px;padding:8px 20px;font-size:14px}
.button-row{display:flex;flex-wrap:wrap;gap:14px}
.card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.card{
  min-width:0;
  padding:28px;
  border:1px solid var(--color-line);
  border-radius:var(--radius-lg);
  background:var(--color-panel);
  box-shadow:var(--shadow-card-near);
}
.badge,
.tag{
  display:inline-flex;
  min-height:28px;
  max-width:100%;
  align-items:center;
  gap:7px;
  padding:3px 11px;
  overflow:hidden;
  border:1px solid var(--color-line);
  border-radius:var(--radius-pill);
  background:var(--color-panel);
  color:var(--color-muted);
  font-size:12px;
  font-weight:650;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.badge-accent{
  border-color:var(--color-gold-deep);
  background:var(--color-gold-16);
  color:var(--color-ink);
}
.reveal{transition:opacity .55s ease,transform .55s ease}
.reveal.pending{opacity:0;transform:translateY(16px)}
.reveal.shown{opacity:1;transform:none}

/* Header */
.site-topbar{
  position:relative;
  z-index:100;
  height:var(--header-height);
  border-bottom:1px solid var(--color-line);
  background:var(--color-page);
}
.site-topbar-inner{
  width:100%;
  max-width:var(--page-max);
  height:100%;
  margin-inline:auto;
  padding-inline:var(--gutter);
  display:flex;
  align-items:center;
  gap:30px;
}
.site-brand{
  display:flex;
  min-width:fit-content;
  align-items:center;
  gap:9px;
}
.site-brand img{width:27px;height:27px}
.brand-word{font-weight:800;font-size:19px;letter-spacing:.02em}
.brand-local{color:var(--color-muted);font-size:14px;font-weight:500}
.desktop-nav{
  display:flex;
  min-width:0;
  flex:1;
  align-items:center;
}
.desktop-nav a{
  display:inline-flex;
  min-height:32px;
  align-items:center;
  color:var(--color-muted);
  font-size:13px;
  white-space:nowrap;
}
.desktop-nav a:hover,
.desktop-nav a.is-active{color:var(--color-ink)}
.desktop-nav a.is-active{font-weight:700}
.nav-separator{
  margin-inline:9px;
  color:var(--color-line);
  font-size:12px;
  user-select:none;
}
.header-tools{
  display:flex;
  flex-shrink:0;
  align-items:center;
  gap:12px;
}
.login-link{
  display:inline-flex;
  min-height:40px;
  align-items:center;
  padding:7px 20px;
  border:1px solid var(--color-ink);
  border-radius:var(--radius-pill);
  font-size:14px;
  font-weight:700;
}
.login-link:hover{background:var(--color-ink);color:var(--color-panel)}
.language-control{position:relative}
.language-button{
  display:inline-flex;
  min-width:44px;
  min-height:44px;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:0;
  background:var(--color-clear);
  color:var(--color-muted);
  font-size:13px;
}
.language-menu{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  width:164px;
  padding:8px;
  border:1px solid var(--color-line);
  border-radius:var(--radius-md);
  background:var(--color-panel);
  box-shadow:var(--shadow-soft);
}
.language-menu[hidden]{display:none}
.language-menu a{
  display:flex;
  min-height:42px;
  align-items:center;
  padding:8px 11px;
  border-radius:var(--radius-sm);
  color:var(--color-muted);
  font-size:13px;
}
.language-menu a:hover,
.language-menu a[aria-current="true"]{background:var(--color-page);color:var(--color-ink)}
.menu-toggle{
  display:none;
  min-width:44px;
  min-height:44px;
  padding:10px;
  border:0;
  border-radius:var(--radius-sm);
  background:var(--color-clear);
}
.menu-toggle-lines,
.menu-toggle-lines::before,
.menu-toggle-lines::after{
  display:block;
  width:21px;
  height:2px;
  border-radius:var(--radius-pill);
  background:var(--color-ink);
}
.menu-toggle-lines{position:relative}
.menu-toggle-lines::before,
.menu-toggle-lines::after{position:absolute;left:0;content:""}
.menu-toggle-lines::before{top:-6px}
.menu-toggle-lines::after{top:6px}
.mobile-nav{
  display:none;
  position:absolute;
  z-index:103;
  top:var(--header-height);
  right:0;
  left:0;
  max-height:calc(100dvh - var(--header-height));
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:12px var(--gutter) 24px;
  border-bottom:1px solid var(--color-line);
  background:var(--color-panel);
  box-shadow:var(--shadow-soft);
}
.mobile-nav.is-open{display:block}
.mobile-nav a{
  display:flex;
  width:100%;
  min-height:48px;
  align-items:center;
  padding:11px 6px;
  border-bottom:1px solid var(--color-line);
  color:var(--color-muted);
}
.mobile-nav a.is-active{color:var(--color-ink);font-weight:700}
.mobile-languages{padding-top:10px}
.mobile-languages strong{display:block;margin:8px 6px;color:var(--color-ink);font-size:13px}
.nav-veil{
  display:none;
  position:fixed;
  z-index:90;
  inset:var(--header-height) 0 0;
  border:0;
  background:var(--color-ink-25);
}
.nav-veil.is-open{display:block}

/* Footer */
.site-footer{
  overflow-x:clip;
  padding-top:64px;
  padding-bottom:26px;
  background:var(--color-storm);
  color:var(--color-storm-muted);
}
.footer-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr 1.2fr;
  gap:52px;
}
.footer-brand-row{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.footer-brand-row img{width:30px;height:30px}
.footer-brand-row strong{color:var(--color-panel);font-size:19px}
.footer-title{
  margin-bottom:15px;
  color:var(--color-panel);
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
}
.footer-links{display:flex;flex-wrap:wrap;gap:7px 16px}
.footer-links a{
  display:inline-flex;
  min-height:28px;
  align-items:center;
  color:var(--color-storm-muted);
  font-size:13px;
}
.footer-links a:hover{color:var(--color-gold)}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:24px;
  margin-top:44px;
  padding-top:22px;
  border-top:1px solid var(--color-storm-line);
  font-size:12px;
}
.footer-legal{display:flex;flex-wrap:wrap;gap:16px}

/* Prose */
.prose{min-width:0}
.prose h2{margin-top:2.5em}
.prose h3{margin-top:1.8em}
.prose p,
.prose li{color:var(--color-muted)}
.prose a:not(.btn){color:var(--color-gold-deep);text-decoration:underline;text-underline-offset:3px}
.prose img{border-radius:var(--radius-lg)}
.prose table{border-collapse:collapse}
.prose th,
.prose td{padding:13px 16px;border:1px solid var(--color-line);text-align:left}
.prose th{background:var(--color-page);color:var(--color-ink)}
.prose > .data-table{
  display:block;
  min-width:0;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

@media (max-width:1120px){
  .desktop-nav{display:none}
  .header-tools{margin-left:auto}
  .menu-toggle{display:inline-flex;align-items:center;justify-content:center}
  .card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:768px){
  :root{
    --gutter:20px;
    --section-space:76px;
  }
  h1{font-size:clamp(32px,9.8vw,40px);line-height:1.12}
  h2{font-size:clamp(28px,8vw,38px)}
  .site-topbar-inner{gap:12px}
  .brand-local{display:none}
  .language-control{display:none}
  .footer-grid{grid-template-columns:1fr;gap:34px}
  .footer-bottom{flex-direction:column}
}
@media (max-width:640px){
  :root{--gutter:16px}
  .card-grid{grid-template-columns:1fr}
  .card{padding:22px}
  .button-row{align-items:stretch}
  .button-row .btn{width:100%}
  .tilt,
  [class*="tilt"]{transform:none}
  .decor-orb,
  .decor-disc,
  .decor-watermark{display:none}
  .login-link{min-width:62px;padding-inline:14px;justify-content:center}
  .site-brand img{width:25px;height:25px}
  .brand-word{font-size:17px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,
  *::before,
  *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal,
  .reveal.pending{opacity:1;transform:none}
}