:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; color: #1f2023; background: #f7f8fa; font-size: 16px; }
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.8; }
a { color: #2e4b75; text-underline-offset: .25em; }
a:hover { color: #1f2023; }
a:focus-visible { outline: 3px solid #a6a7ff; outline-offset: 5px; border-radius: 3px; }
.skip { position: absolute; top: -80px; left: 16px; padding: 8px 16px; background: white; z-index: 2; }
.skip:focus { top: 8px; }
header, main, footer { width: min(100% - 48px, 960px); margin: auto; }
header { min-height: 96px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #e5e7eb; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #1f2023; font-weight: 600; font-size: 1.125rem; }
.brand img { width: 32px; height: 32px; }
nav { display: flex; flex-wrap: wrap; gap: 12px 24px; font-size: .875rem; }
nav a { white-space: nowrap; }
nav a[aria-current="page"] { color: #1f2023; font-weight: 600; }
main { padding: 56px 0 64px; }
.eyebrow { color: #5f6269; font-size: .875rem; margin: 0 0 16px; }
h1 { font-size: clamp(1.75rem, 4vw, 2.5rem); font-weight: 600; line-height: 1.4; margin: 0 0 20px; letter-spacing: -.02em; }
h2 { font-size: 1.25rem; font-weight: 600; line-height: 1.6; margin: 0 0 12px; }
p { margin: 0 0 16px; }
code { font-size: .875em; overflow-wrap: anywhere; }
.intro { max-width: 680px; font-size: 1.125rem; color: #5f6269; }
.steps { list-style: none; padding: 0; margin: 40px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.steps li { background: white; border: 1px solid #e5e7eb; border-radius: 12px; padding: 24px; }
.step-number { display: block; color: #5f6269; font-size: .875rem; margin-bottom: 20px; }
.steps p { color: #5f6269; margin: 0; }
.scope { background: #f1f2f4; border-radius: 12px; padding: 28px; }
.scope p:last-child { margin-bottom: 0; }
.policy { max-width: 720px; margin-left: 0; }
.policy section { margin-top: 32px; }
.policy ul { padding-left: 24px; }
.policy li { margin-bottom: 8px; }
.date { font-size: .875rem; color: #5f6269; }
footer { padding: 24px 0 32px; border-top: 1px solid #e5e7eb; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; font-size: .875rem; color: #5f6269; overflow-wrap: anywhere; }
footer p { margin: 0; }
@media (max-width: 650px) { header, main, footer { width: calc(100% - 32px); } header { align-items: flex-start; flex-direction: column; gap: 16px; padding: 24px 0; } main { padding: 36px 0 48px; } .steps { grid-template-columns: 1fr; gap: 12px; margin: 28px 0; } .steps li, .scope { padding: 22px; } .step-number { margin-bottom: 12px; } }
