.dev-steps{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 24px}
.dev-steps div{flex:1;min-width:180px;background:#f4f8ff;border:1px solid #d5e4f7;border-radius:12px;padding:12px 14px;font-size:13px;color:#345}
.dev-steps b{display:inline-block;width:22px;height:22px;line-height:22px;text-align:center;border-radius:50%;background:#1a7adf;color:#fff;margin-right:6px;font-size:12px}
.dev-h{font-size:16px;margin:20px 0 10px}
.app-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:12px 0 24px}
.app-card{display:block;border:1px solid #d5e4f7;border-radius:14px;padding:14px;text-decoration:none;color:#123;background:#fff}
.app-card:hover{border-color:#1a7adf;box-shadow:0 6px 18px rgba(26,122,223,.08)}
.app-card strong{display:block;margin-bottom:8px}
.app-card code{display:block;font-size:12px;color:#1a7adf;margin:8px 0 4px}
.app-card small{color:#889}
.pill{float:right;font-size:11px;border:1px solid #b7d4f5;color:#1a7adf;border-radius:999px;padding:1px 8px}
.key-box{display:grid;gap:10px;margin:16px 0}
.key-box input{width:100%;padding:10px 12px;border:1px solid #cfe0f4;border-radius:10px;font-family:Consolas,monospace}
.dev-row{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.reg-submit.ghost{background:#fff;color:#1a7adf;border:1px solid #1a7adf}
.docs-page pre{background:#0f1b2a;color:#d6e8ff;padding:14px 16px;border-radius:12px;overflow:auto;white-space:pre-wrap;font-size:13px}
.docs-page .toc{line-height:1.9}
.docs-page h2{margin-top:28px}
@media(max-width:720px){.dev-steps{flex-direction:column}}