:root { color-scheme: light; --ink:#182634; --muted:#526171; --line:#dce3ea; --blue:#1753a5; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#f5f7fa; color:var(--ink); font:17px/1.8 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; overflow-wrap:anywhere; }
a { color:var(--blue); text-underline-offset:3px; }
a:hover { color:#10366b; }
a:focus-visible,summary:focus-visible { outline:3px solid #6398df; outline-offset:5px; border-radius:3px; }
.skip { position:absolute; left:16px; top:-100px; background:#fff; padding:10px; z-index:2; }
.skip:focus { top:10px; }
.bar { background:#fff; border-bottom:1px solid var(--line); }
.bar-inner { max-width:1040px; margin:auto; padding:20px 28px; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.brand { color:var(--ink); font-size:19px; font-weight:750; text-decoration:none; }
.brand span { color:var(--muted); font-size:13px; font-weight:500; margin-left:12px; }
.nav { display:flex; flex-wrap:wrap; gap:18px; font-size:14px; }
.nav a[aria-current=page] { color:var(--ink); font-weight:700; }
main { width:min(100% - 40px,880px); margin:42px auto 64px; }
.paper { padding:40px 48px; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 8px 26px #10203a04; }
h1,h2,h3 { line-height:1.35; letter-spacing:-.02em; }
h1 { margin:0 0 22px; font-size:clamp(28px,5vw,38px); }
h2 { margin:38px 0 14px; font-size:23px; padding-top:8px; scroll-margin-top:24px; }
h3 { margin:0 0 8px; font-size:20px; }
p { margin:0 0 18px; }
ul { padding-left:24px; margin:0 0 20px; }
li { margin:7px 0; }
.eyebrow { color:var(--muted); font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:14px; }
.lead { color:var(--muted); font-size:18px; }
.toc { padding:15px 20px; border:1px solid var(--line); border-radius:10px; background:#f8fafc; margin:26px 0 30px; font-size:15px; }
.toc summary { cursor:pointer; font-weight:650; }
.toc ol { padding-left:22px; margin-bottom:4px; }
.cards { display:grid; gap:14px; margin-top:28px; }
.card { display:block; border:1px solid var(--line); border-radius:10px; padding:20px 24px; text-decoration:none; background:#fff; }
.card:hover { border-color:#9ab5d8; background:#f9fbff; }
.card p { color:var(--muted); margin:0; font-size:15px; }
.email { display:inline-block; padding:11px 18px; background:#edf4ff; border:1px solid #c8d9f3; border-radius:8px; font-weight:650; }
.rule { border:0; border-top:1px solid var(--line); margin:32px 0; }
footer { width:min(100% - 40px,880px); margin:0 auto 30px; color:var(--muted); font-size:13px; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; }
@media(max-width:600px) { .bar-inner { padding:16px 20px; } .brand span { display:none; } main { margin-top:24px; width:calc(100% - 24px); } .paper { padding:26px 22px; border-radius:12px; } .nav { gap:14px; font-size:13px; } h2 { font-size:21px; } .card { padding:18px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }