/* Developer docs. */
.dev-content { max-width: 56rem; margin: 0 auto; padding: 1.5rem; line-height: 1.6; }
.code-block { position: relative; margin: 1rem 0; }
.code-block__title { font: 600 0.8rem/1.4 system-ui; opacity: .7; margin-bottom: .25rem; }
.code-block__pre { background: #0f172a; color: #e2e8f0; padding: 1rem; border-radius: 8px; overflow-x: auto; }
.code-block__copy { position: absolute; top: .35rem; right: .35rem; font-size: .72rem; padding: .2rem .5rem;
    border: 1px solid #334155; border-radius: 6px; background: #1e293b; color: #e2e8f0; cursor: pointer; }

.lang-selector { display: inline-flex; gap: 2px; }
.lang-selector__btn { font: 600 .72rem/1 system-ui; padding: .3rem .5rem; border: 1px solid var(--cs-border, #cbd5e1);
    background: transparent; color: inherit; cursor: pointer; border-radius: 6px; }
.lang-selector__btn.is-active { background: var(--cs-accent, #2563eb); color: #fff; border-color: transparent; }

.dev-public-header { display: flex; align-items: center; justify-content: space-between;
    padding: .6rem 1rem; border-bottom: 1px solid var(--cs-border, #e2e8f0); }
.dev-public-header__brand { display: inline-flex; gap: .5rem; align-items: center; font-weight: 700;
    text-decoration: none; color: inherit; }
.dev-public-header__brand img { height: 24px; }
.dev-public-header__right { display: inline-flex; gap: .75rem; align-items: center; }
.dev-nav { display: flex; gap: .25rem; padding: .5rem 1rem; position: sticky; top: 0;
    background: var(--cs-bg, #fff); border-bottom: 1px solid var(--cs-border, #e2e8f0); z-index: 5; }
.dev-nav__tab { padding: .4rem .8rem; border-radius: 6px; text-decoration: none; color: inherit; font-weight: 600; }
.dev-nav__tab.active { background: var(--cs-accent, #2563eb); color: #fff; }