.sdk-main { --bg:var(--page); --panel:var(--surface-soft); --text:var(--ink); --accent:var(--ink); }

.sdk-main { width: min(900px, calc(100% - 32px)); margin: 0 auto; padding: 64px 0 80px; }
.sdk-main .eyebrow { color: var(--accent); font-size: .82rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.sdk-main h1 { margin: .2em 0; font-size: clamp(2.4rem, 8vw, 4.7rem); line-height: 1.04; letter-spacing: -.045em; }
.sdk-main h2 { margin-top: 2.4em; font-size: 1.5rem; }
.sdk-main p { color: var(--muted); max-width: 70ch; }
.sdk-main .lead { font-size: 1.17rem; }
.sdk-main .accent { color: var(--accent); }
.sdk-main .card { margin-top: 32px; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--panel); }
.sdk-main .card-title { margin-top: 0; }
.sdk-main code, .sdk-main pre { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.sdk-main code { color: var(--accent); overflow-wrap: anywhere; }
.sdk-main pre { margin: 14px 0 0; padding: 18px; overflow: auto; border: 1px solid var(--line); border-radius: 12px; background: #0b100d; color: #eaf3e8; }
.sdk-main .actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.sdk-main a.button { display: inline-block; padding: 11px 17px; border-radius: 10px; background: var(--accent); color: #142015; font-weight: 750; text-decoration: none; }
.sdk-main a.secondary { background: transparent; border: 1px solid var(--line); color: var(--text); }
.sdk-main ul { padding-left: 1.25rem; color: var(--muted); }
.sdk-main li { padding: .22rem 0; }
.sdk-main footer { margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: .9rem; }
@media (max-width: 540px) { .sdk-main { padding-top: 40px; } .sdk-main pre { font-size: .82rem; } }

.sdk-main pre code { color:inherit; }
.sdk-main a.button { color:var(--page); }
.sdk-main a.secondary { color:var(--ink); }
.sdk-main footer { overflow-wrap:anywhere; }
.sdk-main a.button:not(.secondary) { background:var(--primary); color:var(--primary-ink); }
