.api-page .api-hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:48px;align-items:center}
.api-page h1{max-width:17ch;margin:16px 0 24px;font-size:clamp(38px,5vw,66px)}
.api-page .hero-lead{max-width:58ch}
.api-page .api-note{margin-top:20px;color:var(--color-muted);font-size:14px;max-width:65ch}
.api-page .api-map{border:2px solid var(--color-ink);border-radius:20px;background:var(--color-primary-soft);padding:28px;box-shadow:7px 7px 0 var(--color-ink)}
.api-page .api-map__node{background:var(--color-surface);border:2px solid var(--color-ink);border-radius:12px;padding:16px 20px}
.api-page .api-map__node strong{display:block;font-size:20px;margin-bottom:4px}
.api-page .api-map__node span{font-size:14px;line-height:1.5;display:block}
.api-page .api-map__arrow{padding:10px 16px;font-family:var(--font-mono);font-size:12px}
.api-page .api-map__node:last-child{background:var(--color-mint)}
.api-page .api-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.api-page .api-card{border:2px solid var(--color-ink);border-radius:16px;padding:28px;background:var(--color-surface)}
.api-page .api-card h3{font-size:24px;margin:12px 0}
.api-page .api-card p+p{margin-top:16px}
.api-page .api-example{padding-top:16px;border-top:1px solid var(--color-line);font-size:15px;margin-top:20px}
.api-page .api-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.api-page .api-step{display:inline-block;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:var(--color-primary)}
.api-page .api-card ol,.api-page .api-card ul{padding-left:22px;margin-top:20px}
.api-page li+li{margin-top:12px}
.api-page pre{background:var(--color-ink);color:var(--color-white);padding:20px;border-radius:10px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.7;margin:20px 0}
.api-page code{font-family:var(--font-mono);font-size:.88em;overflow-wrap:anywhere}
.api-page .api-address{display:block;padding:14px 16px;background:var(--color-primary-soft);border-radius:8px;margin:16px 0;user-select:all}
.api-page .api-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:flow}
.api-page .api-flow li{list-style:none;margin:0;padding:24px;background:var(--color-surface);border:2px solid var(--color-ink);border-radius:12px;counter-increment:flow}
.api-page .api-flow li::before{content:"0" counter(flow);display:block;font-family:var(--font-mono);color:var(--color-primary);margin-bottom:16px}
.api-page .api-flow strong{display:block;font-size:19px;margin-bottom:10px}
.api-page .api-flow p{font-size:15px}
.api-page .api-flow{padding:0}
.api-page .api-callout{padding:24px 28px;background:var(--color-yellow);border:2px solid var(--color-ink);border-radius:12px;margin-top:24px}
.api-page .api-faq{max-width:900px}
.api-page details{border-bottom:1px solid var(--color-line);padding:22px 0}
.api-page summary{cursor:pointer;font-size:20px;font-weight:600;line-height:1.4}
.api-page details p{padding-top:16px;max-width:78ch}
.api-page .api-cta{background:var(--color-primary-soft);border:2px solid var(--color-ink);border-radius:20px;padding:40px}
.api-page .api-cta h2{max-width:22ch;margin-bottom:20px}
.api-page a:not(.btn):not(.brand):not(.nav-cabinet-link){text-underline-offset:4px}
.api-page :focus-visible{outline:3px solid var(--color-primary);outline-offset:4px}
@media(max-width:900px){.api-page .api-hero-grid{grid-template-columns:1fr;gap:32px}.api-page .api-map{max-width:600px}.api-page .api-grid{grid-template-columns:1fr}.api-page .api-flow{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.api-page .api-pair,.api-page .api-flow{grid-template-columns:1fr}.api-page .api-card,.api-page .api-cta{padding:24px}.api-page .api-map{padding:18px;box-shadow:4px 4px 0 var(--color-ink)}.api-page .hero-actions .btn{width:100%}}
