* { box-sizing: border-box; }
:root { color-scheme: light; --ink: #182431; --muted: #526476; --line: #dce4ea; --accent: #09665d; }
body { margin: 0; color: var(--ink); background: #f8fafb; font: 16px/1.65 "Inter", "PingFang SC", sans-serif; }
a { color: var(--accent); text-underline-offset: 3px; }
a:focus-visible, summary:focus-visible, input:focus-visible { outline: 3px solid #36a99c; outline-offset: 4px; }
header { background: white; border-bottom: 1px solid var(--line); padding: 20px max(24px, calc((100vw - 1180px) / 2)); }
header a { color: var(--ink); text-decoration: none; font-size: 19px; font-weight: 750; }
nav { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 10px; }
nav a { font-size: 14px; font-weight: 500; }
main { max-width: 1180px; margin: auto; padding: 44px 24px 80px; }
h1 { font-size: clamp(30px, 4vw, 48px); line-height: 1.2; letter-spacing: -.035em; margin: 0 0 20px; }
h2 { font-size: 24px; margin: 36px 0 14px; }
h3 { margin-top: 26px; }
p { max-width: 900px; }
.intro { font-size: 18px; color: var(--muted); }
.meta { color: var(--muted); font-size: 14px; }
.services { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 30px 0; }
.card { background: white; border: 1px solid var(--line); border-radius: 10px; padding: 24px; }
.card h2 { margin: 0 0 10px; }
.card p { color: var(--muted); font-size: 15px; }
.card a { display: inline-block; margin-right: 15px; }
code, pre { font-family: "IBM Plex Mono", "SFMono-Regular", monospace; font-size: 13px; }
code { overflow-wrap: anywhere; }
pre { background: #edf2f5; padding: 18px; border-radius: 6px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
input { width: 100%; max-width: 660px; padding: 13px 16px; border: 1px solid #aebfca; border-radius: 6px; font: inherit; background: white; }
label { display: block; font-weight: 600; margin: 24px 0 8px; }
details.operation { background: white; border: 1px solid var(--line); border-radius: 7px; margin: 12px 0; }
summary { cursor: pointer; padding: 16px; }
summary code { margin-right: 14px; }
.method { display: inline-block; width: 65px; color: var(--accent); font-weight: 800; font-size: 12px; }
.detail { border-top: 1px solid var(--line); padding: 10px 22px 22px; }
.description { white-space: pre-wrap; }
.notice { background: #fff4dd; border-left: 3px solid #b77b1e; padding: 14px 18px; }
.toc { display: flex; flex-wrap: wrap; gap: 10px 20px; }
.count { margin: 12px 0 22px; color: var(--muted); }
table { border-collapse: collapse; width: 100%; background: white; }
th, td { padding: 12px; text-align: left; border-bottom: 1px solid var(--line); }
[hidden] { display: none !important; }
@media (max-width: 740px) { .services { grid-template-columns: 1fr; } main { padding-top: 28px; } summary code { display: block; margin: 5px 0; } }