.public-developers-v3 {
    background: #08090b;
    color: #f3f4f6;
}

.developers-v3,
.developers-v3 button,
.developers-v3 input,
.developers-v3 textarea,
.developers-v3 select {
    font-family: "Onest", sans-serif;
}

.developers-v3 {
    overflow: visible;
}

.developers-v3-main {
    padding: 126px 0 112px;
    background: #08090b;
}

.developers-v3 main.developers-v3-main {
    padding-top: 144px;
}

.developers-v3-intro {
    max-width: 760px;
    padding-bottom: 48px;
}

.developers-v3-intro h1 {
    max-width: 680px;
    margin: 0;
    color: #f7f7f8;
    font-size: clamp(38px, 4.2vw, 52px);
    font-weight: 600;
    letter-spacing: -.04em;
    line-height: 1.04;
}

.developers-v3-intro__lead {
    max-width: 650px;
    margin: 20px 0 0;
    color: #9da2af;
    font-size: 16px;
    line-height: 1.7;
}

.developers-v3-notice {
    max-width: 680px;
    margin: 24px 0 0;
    padding: 2px 0 2px 14px;
    border: 0;
    border-left: 1px solid #333640;
    border-radius: 0;
    background: transparent;
    color: #7f8593;
    font-size: 13px;
    line-height: 1.65;
}

.developers-v3-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 210px;
    gap: 64px;
    align-items: start;
    border-top: 1px solid #24262c;
    padding-top: 40px;
}

.developers-v3-nav {
    position: sticky;
    align-self: start;
    top: calc(72px + clamp(18px, 4vh, 36px));
    width: auto;
    max-height: calc(100vh - 108px - clamp(24px, 5vh, 48px));
    grid-column: 2;
    grid-row: 1;
    display: grid;
    gap: 0;
    padding-left: 14px;
    border-left: 1px solid #292c33;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #30333b transparent;
}

.developers-v3-nav strong {
    margin-bottom: 8px;
    color: #777d89;
    font-size: 12px;
    font-weight: 500;
}

.developers-v3-nav a {
    position: relative;
    display: flex;
    min-height: 31px;
    align-items: center;
    padding: 0;
    border-radius: 0;
    color: #737986;
    font-size: 13px;
    text-decoration: none;
    transition: color .16s ease;
}

.developers-v3-nav a::before {
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: -15px;
    width: 1px;
    background: transparent;
    content: "";
}

.developers-v3-nav a:hover,
.developers-v3-nav a:focus-visible {
    background: transparent;
    color: #d9dbe0;
    outline: none;
}

.developers-v3-nav a.is-active {
    color: #f1f2f4;
}

.developers-v3-nav a.is-active::before {
    background: #f1f2f4;
}

.developers-v3-docs {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    max-width: 920px;
}

.developers-v3-doc {
    scroll-margin-top: 116px;
    padding: 0 0 64px;
}

.developers-v3-doc + .developers-v3-doc {
    padding-top: 64px;
    border-top: 1px solid #24262c;
}

.developers-v3-doc h2 {
    max-width: 760px;
    margin: 0 0 16px;
    color: #f3f4f6;
    font-size: clamp(25px, 2.5vw, 31px);
    font-weight: 600;
    letter-spacing: -.025em;
    line-height: 1.18;
}

.developers-v3-doc > p {
    max-width: 720px;
    margin: 0 0 28px;
    color: #8e94a1;
    font-size: 15px;
    line-height: 1.72;
}

.developers-v3-doc h3 {
    margin: 0 0 18px;
    color: #f0f1f3;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -.02em;
}

.developers-v3-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border: 1px solid #292c33;
    border-radius: 12px;
    overflow: hidden;
    background: #0e0f13;
}

.developers-v3-meta > div {
    display: grid;
    min-height: 92px;
    align-content: center;
    gap: 9px;
    padding: 18px 20px;
    border-right: 1px solid #252830;
    border-bottom: 1px solid #252830;
}

.developers-v3-meta > div:nth-child(2n) { border-right: 0; }
.developers-v3-meta > div:last-child { grid-column: 1 / -1; border-right: 0; border-bottom: 0; }
.developers-v3-meta small { color: #767d8f; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.developers-v3-meta code { overflow-wrap: anywhere; color: #d8daff; font-size: 13px; }

.developers-v3-endpoints {
    margin-top: 34px;
    border: 1px solid #292c33;
    border-radius: 12px;
    overflow: hidden;
    background: #0d0e12;
}

.developers-v3-endpoints h3 {
    margin: 0;
    padding: 18px 20px;
    border-bottom: 1px solid #292c33;
}

.developers-v3-endpoint {
    display: grid;
    grid-template-columns: minmax(290px, .9fr) minmax(220px, 1fr);
    gap: 24px;
    align-items: center;
    min-height: 58px;
    padding: 12px 20px;
    border-bottom: 1px solid #22252b;
}

.developers-v3-endpoint:last-child { border-bottom: 0; }
.developers-v3-endpoint code { color: #d7d9e0; font-size: 13px; }
.developers-v3-endpoint code b { display: inline-block; width: 58px; color: #83dfbc; font-size: 10px; letter-spacing: .06em; }
.developers-v3-endpoint code b.is-patch { color: #9ca5ff; }
.developers-v3-endpoint span { color: #8d93a1; font-size: 13px; line-height: 1.5; }

.developers-v3-code {
    max-width: 100%;
    margin: 22px 0 36px;
    padding: 22px 24px;
    border: 1px solid #292c33;
    border-radius: 12px;
    overflow-x: auto;
    background: #0d0e12;
    color: #cfd3f8;
    font-size: 12px;
    line-height: 1.75;
    white-space: pre;
}

.developers-v3-reference-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 36px 0 42px;
}

.developers-v3-reference-grid > div {
    padding: 24px;
    border: 1px solid #292c33;
    border-radius: 12px;
    background: #0d0e12;
}

.developers-v3-rows > div {
    display: grid;
    gap: 7px;
    padding: 13px 0;
    border-top: 1px solid #24272e;
}

.developers-v3-rows code { color: #cfd3f8; font-size: 12px; }
.developers-v3-rows span { color: #858b9a; font-size: 12px; line-height: 1.5; }

.developers-v3-headers {
    display: grid;
    gap: 8px;
}

.developers-v3-headers code {
    padding: 10px 12px;
    border: 1px solid #262932;
    border-radius: 7px;
    background: #111218;
    color: #bfc4e8;
    font-size: 11px;
}

.developers-v3-caption {
    margin: 18px 0 0;
    color: #777e8f;
    font-size: 12px;
    line-height: 1.6;
}

.developers-v3-rules {
    margin-top: 34px;
    border-top: 1px solid #292c33;
}

.developers-v3-rules > div,
.developers-v3-steps li {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 18px;
    padding: 24px 0;
    border-bottom: 1px solid #292c33;
}

.developers-v3-rules span,
.developers-v3-steps > li > span {
    color: #7785ff;
    font-size: 11px;
    font-weight: 600;
}

.developers-v3-rules h3,
.developers-v3-steps h3 { margin-bottom: 7px; }
.developers-v3-rules p,
.developers-v3-steps p { max-width: 680px; margin: 0; color: #858b9a; font-size: 14px; line-height: 1.65; }

.developers-v3-steps {
    margin: 34px 0 0;
    padding: 0;
    border-top: 1px solid #292c33;
    list-style: none;
}

@media (max-width: 900px) {
    .developers-v3-main { padding: 116px 0 88px; }
    .developers-v3 main.developers-v3-main { padding-top: 128px; }
    .developers-v3-intro { padding-bottom: 40px; }
    .developers-v3-layout { grid-template-columns: 1fr; gap: 40px; padding-top: 30px; }
    .developers-v3-nav {
        position: static;
        top: auto;
        right: auto;
        width: auto;
        max-height: none;
        grid-column: auto;
        grid-row: auto;
        display: flex;
        gap: 5px;
        overflow-x: auto;
        overflow-y: visible;
        padding: 0 0 8px;
        border-left: 0;
        scrollbar-width: thin;
    }
    .developers-v3-nav strong { display: none; }
    .developers-v3-nav a { flex: 0 0 auto; min-height: 32px; padding: 0 11px; border: 1px solid #282b32; border-radius: 7px; }
    .developers-v3-nav a::before { display: none; }
    .developers-v3-docs { grid-column: auto; grid-row: auto; }
}

@media (max-width: 640px) {
    .developers-v3-main { padding: 104px 0 72px; }
    .developers-v3 main.developers-v3-main { padding-top: 108px; }
    .developers-v3-intro h1 { font-size: clamp(35px, 10.5vw, 42px); }
    .developers-v3-intro__lead { margin-top: 18px; font-size: 15px; }
    .developers-v3-notice { margin-top: 20px; }
    .developers-v3-doc { padding-bottom: 52px; }
    .developers-v3-doc + .developers-v3-doc { padding-top: 52px; }
    .developers-v3-doc h2 { font-size: 25px; }
    .developers-v3-meta,
    .developers-v3-reference-grid { grid-template-columns: 1fr; }
    .developers-v3-meta > div,
    .developers-v3-meta > div:nth-child(2n) { grid-column: auto; border-right: 0; border-bottom: 1px solid #252830; }
    .developers-v3-meta > div:last-child { border-bottom: 0; }
    .developers-v3-endpoint { grid-template-columns: 1fr; gap: 6px; align-items: start; }
    .developers-v3-endpoint code { overflow-wrap: anywhere; }
    .developers-v3-reference-grid > div { padding: 20px; }
    .developers-v3-code { padding: 18px; font-size: 11px; }
}