*{box-sizing:border-box;margin:0;padding:0}
:root{
  color-scheme:light;
  --bg:#FCFCFA;--bg-2:#F5F5F2;--surface:#FFFFFF;--surface-2:#F1F2ED;
  --ink:#242522;--ink-2:#50534D;--muted:#85867D;
  --line:rgba(36,37,34,.09);--line-strong:rgba(36,37,34,.19);
  --accent:#68786B;--accent-strong:#536457;--accent-soft:rgba(104,120,107,.13);
  --gold:#B38A60;--gold-soft:rgba(179,138,96,.13);
  --shadow:0 1px 2px rgba(36,37,34,.04),0 10px 30px rgba(36,37,34,.06);
  --shadow-lg:0 2px 8px rgba(36,37,34,.06),0 30px 70px rgba(36,37,34,.12);
  --radius:16px;
  --serif:"PingFang SC","HarmonyOS Sans SC","MiSans","Microsoft YaHei UI","Microsoft YaHei",-apple-system,"Segoe UI",system-ui,sans-serif;
  --sans:"PingFang SC","HarmonyOS Sans SC","MiSans","Microsoft YaHei UI","Microsoft YaHei",-apple-system,"Segoe UI",system-ui,sans-serif;
  --num:"SF Mono","JetBrains Mono","IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --ease:cubic-bezier(.22,.61,.36,1)
}
[data-theme=dark]{
  color-scheme:dark;
  --bg:#121512;--bg-2:#0F120F;--surface:#191D19;--surface-2:#222822;--ink:#E9EEE8;--ink-2:#B9C4B8;--muted:#889488;
  --line:rgba(233,238,232,.10);--line-strong:rgba(233,238,232,.22);
  --accent:#9CB09D;--accent-strong:#B1C6B2;--accent-soft:rgba(156,176,157,.16);
  --gold:#D0A676;--gold-soft:rgba(208,166,118,.14);
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px rgba(0,0,0,.35);
  --shadow-lg:0 2px 8px rgba(0,0,0,.5),0 30px 70px rgba(0,0,0,.5)
}
html{background:var(--bg)}
body{
  min-height:100vh;color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.7;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  background:var(--bg-2);
  background-attachment:fixed;
  transition:background .5s var(--ease),color .5s var(--ease)
}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
img,svg{display:block}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
::selection{background:var(--accent);color:var(--bg)}
mark{background:var(--gold-soft);color:inherit;padding:0 2px;border-radius:2px}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:999px;border:2px solid var(--surface)}
::-webkit-scrollbar-thumb:hover{background:var(--muted)}

/* 全屏内容列：居中、无边框盒子（DeepSeek/Claude 式全幅页面） */
.window{
  width:min(1120px,100%);margin:0 auto;min-height:100vh;
  display:flex;flex-direction:column
}
.window.narrow{width:min(1080px,100%)}

.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;height:66px;padding:0 clamp(20px,3.4vw,32px);border-bottom:1px solid var(--line);flex:none}
.mark{display:flex;align-items:center;gap:11px;font-family:var(--serif);font-size:16px;font-weight:600;letter-spacing:.03em}
.mark i{display:block;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.topnav{display:flex;align-items:center;gap:clamp(14px,2.4vw,28px);font-size:13px;color:var(--muted);letter-spacing:.04em}
.topnav a{position:relative;padding:4px 0;transition:color .25s var(--ease)}
.topnav a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1.5px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.topnav a:hover,.topnav a[aria-current=page]{color:var(--ink)}
.topnav a:hover::after,.topnav a[aria-current=page]::after{transform:scaleX(1)}
.theme-toggle{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line-strong);border-radius:999px;background:var(--surface);transition:border-color .25s var(--ease),transform .5s var(--ease),box-shadow .25s var(--ease)}
.theme-toggle:hover{border-color:var(--accent);transform:rotate(180deg);box-shadow:0 0 0 4px var(--accent-soft)}
.theme-toggle span{width:12px;height:12px;border-radius:50%;background:linear-gradient(90deg,var(--ink) 50%,transparent 50%);border:1px solid var(--ink)}

.content{flex:1;padding:clamp(28px,4.5vw,48px) clamp(20px,3.4vw,32px)}
.footer{display:flex;justify-content:space-between;gap:16px;padding:18px clamp(20px,3.4vw,32px);border-top:1px solid var(--line);font-size:12px;color:var(--muted);letter-spacing:.05em;flex:none}

.eyebrow{font-size:11px;letter-spacing:.26em;color:var(--muted);text-transform:uppercase}
.serif{font-family:var(--serif)}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;height:52px;padding:0 30px;border:1px solid var(--ink);border-radius:999px;
  background:var(--ink);color:var(--bg);font-size:15px;letter-spacing:.04em;box-shadow:var(--shadow);
  transition:background .3s var(--ease),color .3s var(--ease),gap .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)
}
.btn:hover{gap:18px;background:transparent;color:var(--ink);transform:translateY(-1px)}
.btn.ghost{background:var(--surface);color:var(--ink);border-color:var(--line-strong)}
.btn.ghost:hover{border-color:var(--ink);background:var(--ink);color:var(--bg)}
.btn.accent{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.accent:hover{background:var(--accent-strong);color:#fff}
.arrow{display:inline-block;width:18px;height:1px;background:currentColor;position:relative}
.arrow::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}

.rise{opacity:0;transform:translateY(14px);animation:rise .7s var(--ease) forwards;animation-delay:calc(var(--d,0) * 80ms)}
@keyframes rise{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rise{opacity:1;transform:none}}
