/* /developer-api — composição própria. Conceito: uma interface previsível para trabalhar com a plataforma.
   Linguagem: documentação dentro da AGGU. Fundo branco contínuo com seções separadas por fio, prosa à esquerda e
   código/tabelas à direita, cabeçalhos com "#", blocos de código escuros que rolam só por dentro.
   Ritmo: hero claro com resumo e índice → seções de documentação (branco) → segurança (escuro) → exemplos → OpenAPI → fechamento.
   Nenhum motion narrativo: só interações exploráveis (escopos, idempotência, linguagens). */

.dv-mono,code,.dv-pre{font-family:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace}
code{font-size:.88em;letter-spacing:0}
.dv-prose code,.dv-list code,.dv-callout code,.dv-legend code,.dv-fields code,.dv-table code{padding:1px 6px;border-radius:6px;background:var(--wash)}

/* ---------- Hero ---------- */
.dv-hero{padding-block:clamp(32px,4vw,64px) clamp(64px,7vw,112px);border-bottom:1px solid var(--line-2)}
.dv-crumb{display:flex;gap:10px;font-family:var(--f-ui);font-size:12.5px;color:var(--ink-3);margin-bottom:clamp(28px,4vw,56px)}
.dv-crumb span:last-child{color:var(--ink)}
.dv-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:40px clamp(40px,6vw,96px);align-items:start}
.dv-hero-main{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.dv-h1{font-size:clamp(2.2rem,1.15rem + 2.9vw,4rem);line-height:1.06;max-width:20ch}
.dv-lead{max-width:56ch}
.dv-hero-main .btn-row{margin-top:8px}
.dv-meta{display:flex;flex-direction:column;gap:20px;padding:22px;border-radius:18px;background:var(--white);box-shadow:0 0 0 1px var(--line);font-family:var(--f-ui)}
.dv-meta dl{margin:0;display:flex;flex-direction:column}
.dv-meta dl div{display:grid;grid-template-columns:104px minmax(0,1fr);gap:10px;padding:9px 0;border-bottom:1px solid var(--line);align-items:center}
.dv-meta dt{font-size:12px;color:var(--ink-3)}
.dv-meta dd{margin:0;font-size:12.5px}
.dv-toc p{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px}
.dv-toc ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 12px}
.dv-toc a{display:flex;align-items:center;min-height:36px;font-size:13px;text-decoration:none;color:var(--ink-2);border-radius:6px;transition:color .2s}
.dv-toc a:hover{color:var(--blue-text)}
@media (max-width:980px){.dv-hero-grid{grid-template-columns:minmax(0,1fr)}.dv-meta{max-width:560px}}

/* ---------- Seções de documentação ---------- */
.dv-sec{background:var(--white);padding-block:clamp(56px,6vw,96px);border-bottom:1px solid var(--line)}
.dv-doc{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:32px clamp(32px,5vw,80px);align-items:start}
.dv-prose{display:flex;flex-direction:column;gap:16px;color:var(--ink-2);min-width:0}
.dv-prose > p{max-width:52ch}
.dv-prose-wide{margin-bottom:32px}
.dv-h2{display:flex;align-items:baseline;gap:12px;font-size:clamp(1.6rem,1.2rem + 1.2vw,2.3rem);line-height:1.15;letter-spacing:-.025em;color:var(--ink)}
.dv-hash{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.7em;color:var(--blue-text)}
.dark .dv-h2{color:var(--paper)}
.dark .dv-hash{color:#8FC3FF}
.dv-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.dv-list li{position:relative;padding-left:18px;max-width:54ch}
.dv-list li::before{content:"";position:absolute;left:0;top:.68em;width:6px;height:6px;border-radius:50%;background:var(--neutral)}
.dv-list b{font-weight:500;color:var(--ink)}
.dv-ill{font-family:var(--f-ui);font-size:12px;color:var(--ink-2);padding-left:12px;border-left:2px solid var(--blue)}
.dv-side{display:flex;flex-direction:column;gap:16px;min-width:0}
@media (max-width:980px){.dv-doc{grid-template-columns:minmax(0,1fr)}}

/* Tabela de documentação */
.dv-table{display:flex;flex-direction:column;border-radius:14px;box-shadow:0 0 0 1px var(--line-2);overflow:hidden;font-family:var(--f-ui);font-size:13px;background:var(--white)}
.dv-tr{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,.8fr) minmax(0,1.3fr);gap:12px;padding:12px 16px;border-top:1px solid var(--line);align-items:center}
.dv-th{border-top:0;background:var(--paper);font-size:11.5px;color:var(--ink-2);font-weight:500}
.dv-deliv{margin-top:8px}
.dv-deliv .dv-tr{grid-template-columns:72px minmax(0,1fr) minmax(0,1.2fr)}
.dv-callout{padding:14px 16px;border-radius:12px;background:var(--paper);font-size:.93rem;color:var(--ink-2)}
.dv-callout b{font-weight:500;color:var(--ink)}
@media (max-width:520px){
  .dv-tr{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:4px}
  .dv-tr > span:last-child{grid-column:1 / -1;color:var(--ink-2)}
  .dv-th > span:last-child{display:none}
  .dv-deliv .dv-tr{grid-template-columns:72px minmax(0,1fr)}
}

/* ---------- Bloco de código: rola só por dentro ---------- */
.dv-code{margin:0;border-radius:16px;background:var(--ink);color:var(--paper);overflow:hidden;min-width:0;box-shadow:0 0 0 1px rgba(29,29,31,.2)}
.dv-code-h{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:0 8px 0 16px;border-bottom:1px solid var(--line-d);font-family:var(--f-ui);font-size:12px;color:var(--paper-2)}
.dv-tag{flex:none;display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;background:rgba(245,245,247,.08);font-size:11px;color:var(--paper-2);margin-right:4px}
.dv-pre{position:relative;margin:0;padding:18px 18px 20px;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;font-size:13px;line-height:1.7;white-space:pre;tab-size:2;color:var(--paper)}
.dv-pre:focus-visible{outline-offset:-3px}
.dv-pre code{font-size:inherit;padding:0;background:none}
.dv-pre .kw{font-weight:600;color:#fff}
.dv-pre .hd,.dv-pre .k{font-style:normal;color:#8FC3FF}
.dv-pre .s{text-decoration:none;color:#B9E4C4}
.dv-pre .c{font-style:normal;color:var(--paper-3)}
.dv-pre .mk{display:inline-block;width:2ch;margin-right:1ch;color:var(--ink);background:var(--paper);border-radius:4px;text-align:center;font-weight:600;line-height:1.35}
.dv-code-f{padding:10px 16px 12px;border-top:1px solid var(--line-d);font-family:var(--f-ui);font-size:11.5px;color:var(--paper-2)}
/* indicação de rolagem horizontal (as barras nativas estão ocultas no site) */
.dv-scrollwrap{position:relative}
.dv-scrollwrap::after{content:"";position:absolute;top:0;right:0;bottom:0;width:40px;background:linear-gradient(90deg,rgba(29,29,31,0),var(--ink));pointer-events:none;opacity:0;transition:opacity .2s}
.dv-scrollwrap.more::after{opacity:1}
.dv-scrollhint{display:none;padding:0 16px 10px;font-family:var(--f-ui);font-size:11px;color:var(--paper-3)}
.dv-scrollwrap.more + .dv-scrollhint,.dv-scrollwrap.was + .dv-scrollhint{display:block}
@media (max-width:520px){.dv-pre{font-size:12.5px;padding:16px 16px 18px}}

/* ---------- Escopos ---------- */
.dv-scopes{padding:22px;border-radius:18px;background:var(--paper)}
.dv-scopes .explore{margin-bottom:6px}
.dv-chips{display:flex;flex-wrap:wrap;gap:8px}
.dv-chip{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 12px;border-radius:10px;border:0;background:var(--white);box-shadow:0 0 0 1px var(--line-2);cursor:pointer;color:var(--ink-2);transition:background .2s,color .2s,box-shadow .2s}
.dv-chip code{background:none;padding:0;font-size:12.5px}
.dv-chip::before{content:"";width:14px;height:14px;border-radius:4px;box-shadow:inset 0 0 0 1.5px var(--line-2);background:var(--white) no-repeat center/10px 10px}
.dv-chip:hover{color:var(--ink)}
.dv-chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);box-shadow:none}
.dv-chip[aria-pressed="true"]::before{box-shadow:none;background-color:var(--paper);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 5.2l2 2 4-4.4' fill='none' stroke='%231D1D1F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.dv-ops{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;font-family:var(--f-ui)}
.dv-ops li{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:46px;padding:8px 12px;border-radius:10px;background:var(--white);transition:opacity .25s}
.dv-ops li code{font-size:12.5px;overflow-wrap:anywhere}
.dv-m{display:inline-flex;align-items:center;justify-content:center;height:22px;border-radius:6px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:10.5px;font-weight:600}
.dv-m.get{background:var(--blue-wash);color:var(--blue-text)}
.dv-m.post{background:rgba(52,199,89,.13);color:var(--ok-text)}
.dv-ops em{font-style:normal;display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;font-size:11.5px;font-weight:500;white-space:nowrap}
.dv-ops li.ok em{background:rgba(52,199,89,.13);color:var(--ok-text)}
.dv-ops li.no{color:var(--ink-3)}
.dv-ops li.no em{background:rgba(255,59,48,.1);color:var(--alert-text)}
@media (max-width:430px){
  .dv-ops li{grid-template-columns:52px minmax(0,1fr)}
  .dv-ops em{grid-column:2;justify-self:start}
}

/* ---------- Requisições ---------- */
.dv-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.dv-legend li{display:flex;align-items:baseline;gap:12px}
.dv-legend li > span:first-child{flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;background:var(--ink);color:var(--paper);font-family:var(--f-ui);font-size:11px;font-weight:600;transform:translateY(-1px)}

/* ---------- Idempotência ---------- */
.dv-idem{padding:22px;border-radius:18px;background:var(--paper)}
.dv-idem-top{display:flex;flex-direction:column;align-items:flex-start}
.dv-seq{list-style:none;margin:6px 0 0;padding:0;position:relative;display:flex;flex-direction:column;gap:6px;font-family:var(--f-ui)}
.dv-seq li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;min-height:50px;padding:8px 12px;border-radius:10px;background:var(--white)}
.dv-lane{font-size:11.5px;color:var(--ink-3)}
.dv-ev{display:flex;flex-direction:column;gap:1px;min-width:0}
.dv-ev b{font-weight:500;font-size:13px}
.dv-ev code{font-size:12.5px}
.dv-ev small{font-size:12px;color:var(--ink-2);overflow-wrap:anywhere}
.dv-seq li.dv-lost{background:transparent;border:1.5px dashed var(--neutral)}
.dv-seq li.dv-out{box-shadow:0 0 0 1.5px var(--ok)}
[data-mode="nokey"] .dv-seq li.dv-out{box-shadow:0 0 0 1.5px var(--alert)}
[data-mode="nokey"] .dv-ev small[data-i="k1"],[data-mode="nokey"] .dv-ev small[data-i="k2"]{color:var(--alert-text)}
.dv-idem .dv-ill{margin-top:16px}
@media (max-width:430px){.dv-seq li{grid-template-columns:minmax(0,1fr);gap:2px}}

/* ---------- Limites ---------- */
.dv-backoff{padding:20px 22px;border-radius:16px;background:var(--paper);font-family:var(--f-ui)}
.dv-bk-k{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin-bottom:16px}
.dv-bk-line{display:flex;align-items:center}
.dv-bk-try{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--white);box-shadow:inset 0 0 0 1.5px var(--line-2);font-size:12px;font-weight:600}
.dv-bk-try.ok{background:var(--ink);color:var(--paper);box-shadow:none}
.dv-bk-gap{flex-basis:0;height:2px;margin:0 4px;background:repeating-linear-gradient(90deg,var(--neutral) 0 5px,transparent 5px 9px)}
.dv-bk-cap{margin-top:12px;font-size:12px;color:var(--ink-2)}

/* ---------- Erros ---------- */
.dv-fields{margin:0;display:flex;flex-direction:column;border-top:1px solid var(--line)}
.dv-fields div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.dv-fields dd{margin:0;font-size:.95rem}
@media (max-width:430px){.dv-fields div{grid-template-columns:minmax(0,1fr);gap:4px}}

/* ---------- Auditoria ---------- */
.dv-audit{overflow:hidden}
.dv-ar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr) minmax(0,.9fr) 90px;gap:14px;align-items:center;padding:13px 18px;border-bottom:1px solid var(--line)}
.dv-ar code{font-size:12px}
.dv-ah{background:var(--paper);font-size:11.5px;color:var(--ink-2);font-weight:500}
.dv-audit-f{padding:10px 18px;font-size:11.5px;color:var(--ink-2)}
@media (max-width:900px){
  .dv-ah{display:none}
  .dv-ar{grid-template-columns:minmax(0,1fr) auto;row-gap:4px}
  .dv-ar > span:nth-child(1){grid-column:1}
  .dv-ar > span:nth-child(5){grid-column:2;grid-row:1}
  .dv-ar > span:nth-child(2),.dv-ar > span:nth-child(3),.dv-ar > span:nth-child(4){grid-column:1 / -1;font-size:12.5px;color:var(--ink-2)}
  .dv-ar > span:nth-child(2)::before{content:"Actor · ";color:var(--ink-3)}
  .dv-ar > span:nth-child(3)::before{content:"Scope · ";color:var(--ink-3);font-family:var(--f-ui)}
  .dv-ar > span:nth-child(4)::before{content:"Timestamp · ";color:var(--ink-3)}
}

/* ---------- Segurança (escuro) ---------- */
.dv-secu{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:32px clamp(32px,5vw,80px);align-items:start}
.dv-secu .body{margin-top:16px;max-width:36ch;font-size:var(--fs-lead);line-height:1.5}
.dv-check{list-style:none;margin:0;padding:0;counter-reset:c;border-top:1px solid var(--line-d)}
.dv-check li{counter-increment:c;display:grid;grid-template-columns:36px minmax(0,1fr);gap:4px 12px;padding:16px 0;border-bottom:1px solid var(--line-d);color:var(--paper-2)}
.dv-check li::before{content:counter(c,decimal-leading-zero);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;color:var(--paper-3);padding-top:3px}
.dv-check b{font-weight:500;color:var(--paper)}
@media (max-width:980px){.dv-secu{grid-template-columns:minmax(0,1fr)}}

/* ---------- Exemplos (abas de linguagem) ---------- */
.dv-side > .explore{margin-bottom:-4px}
.dv-langs{display:flex;gap:2px;min-width:0;overflow-x:auto}
.dv-lang{flex:none;height:36px;padding:0 12px;border:0;border-radius:8px;background:none;color:var(--paper-2);font-family:var(--f-ui);font-size:12.5px;cursor:pointer;transition:background .2s,color .2s}
.dv-lang:hover{color:var(--paper);background:rgba(245,245,247,.08)}
.dv-lang[aria-selected="true"]{background:var(--paper);color:var(--ink);font-weight:500;cursor:default}
.dv-code-tabs .dv-code-h{padding-left:6px}
@media (max-width:430px){.dv-code-tabs .dv-tag{display:none}}

/* ---------- OpenAPI ---------- */
.dv-oa{display:flex;flex-direction:column;gap:16px;padding:clamp(24px,3vw,40px);border-radius:20px;background:var(--paper);box-shadow:inset 0 0 0 1px var(--line)}
.dv-oa-t{font-size:var(--fs-h3);line-height:1.3;letter-spacing:-.018em;max-width:36ch}
.dv-oa-s{color:var(--ink-2);max-width:60ch}

/* ---------- Fechamento ---------- */
.dv-close{display:flex;flex-direction:column;align-items:flex-start;gap:36px}
.dv-close .h2{max-width:20ch}

/* =====================================================================
   MOBILE (≤ 720px) — leitura técnica: navegação e código. Desktop/tablet ≥ 721 intocados.
   Índice vira faixa rolável compacta; blocos de código rolam só no eixo X (página nunca rola de lado), fonte ≥ 12px,
   botão Copiar de 44px em cada bloco (criado pelo JS; só aparece ≤ 720px). Conteúdo técnico integral.
   ===================================================================== */
.dv-copy{display:none}
@media (max-width:720px){
  .dv-hero{padding-bottom:56px}
  .dv-crumb{margin-bottom:22px}
  .dv-hero-main{gap:20px}
  .dv-hero-grid{gap:32px}
  .dv-meta{padding:18px;gap:16px}
  .dv-meta dl div{grid-template-columns:96px minmax(0,1fr);padding:8px 0}

  /* índice: faixa rolável de capítulos (ativo/alvo sempre alcançável por toque) */
  .dv-toc ol{display:flex;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;
    margin-inline:-18px;padding:2px 18px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent)}
  .dv-toc ol::-webkit-scrollbar{display:none}
  .dv-toc li{flex:none;scroll-snap-align:start;scroll-margin-inline:18px}
  .dv-toc a{min-height:44px;padding:0 14px;border-radius:999px;background:var(--paper);color:var(--ink);font-size:13.5px;white-space:nowrap}

  .dv-sec{padding-block:56px}
  .dv-doc{gap:24px}
  .dv-prose{gap:14px}
  .dv-h2{gap:10px;font-size:var(--fs-h2)}

  /* tabelas/listas */
  .dv-table code{font-size:12px}
  .dv-chip{height:44px}
  .dv-m{font-size:12px}
  .dv-scopes,.dv-idem{padding:18px 16px}
  .dv-idem .seg{max-width:100%}
  .dv-idem .seg button{height:44px;padding:0 12px;font-size:13px}

  /* código: rola por dentro, Copiar acessível */
  .dv-code{position:relative}
  .dv-code-h{min-height:56px;padding-right:94px}
  .dv-code-tabs .dv-code-h{padding-right:94px}
  .dv-pre{font-size:12.5px}
  .dv-copy{position:absolute;top:6px;right:6px;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;height:44px;padding:0 14px;border:0;border-radius:10px;
    background:rgba(245,245,247,.1);color:var(--paper);font-family:var(--f-ui);font-size:13px;font-weight:500;cursor:pointer;transition:background .2s}
  .dv-copy:active{background:rgba(245,245,247,.2)}
  .dv-copy:focus-visible{outline:2px solid #8FC3FF;outline-offset:-2px}
  .dv-copy.ok{background:rgba(52,199,89,.22);color:#7BE495}
  .dv-lang{height:44px;padding:0 12px;font-size:13px}

  .dv-backoff{padding:18px}
  .dv-oa{padding:22px 20px}
  .dv-close{gap:28px}
}
@media (max-width:430px){
  .dv-hero-main .btn-row,.dv-close .btn-row{flex-direction:column;align-items:stretch;width:100%}
  .dv-hero-main .btn-row .btn,.dv-close .btn-row .btn{width:100%;justify-content:center}
  .dv-code-h .dv-tag{display:none}
  .dv-code-h,.dv-code-tabs .dv-code-h{padding-right:86px}
}