*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:16px;line-height:1.6;color:#1f2328;background:#fff}
a{color:var(--marca)}
img{max-width:100%;height:auto}
.topo{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:16px;padding:10px 20px;background:#fff;border-bottom:1px solid #e5e7eb;border-top:4px solid var(--marca)}
.marca{display:flex;align-items:center;gap:10px;color:#111827;text-decoration:none;font-weight:700;font-size:1.05rem;min-width:0}
.marca img{max-height:36px;width:auto}
.marca-nome{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.busca{position:relative;margin-left:auto;width:min(420px,45vw)}
.busca input{width:100%;padding:8px 12px;border:1px solid #d0d7de;border-radius:8px;font:inherit;font-size:.95rem}
.busca input:focus{outline:2px solid var(--marca);outline-offset:1px;border-color:transparent}
.busca-resultados{position:absolute;left:0;right:0;top:calc(100% + 6px);margin:0;padding:6px;list-style:none;background:#fff;border:1px solid #d0d7de;border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.12);max-height:70vh;overflow:auto}
.busca-resultados li a{display:block;padding:8px 10px;border-radius:6px;text-decoration:none;color:#1f2328}
.busca-resultados li a:hover,.busca-resultados li a:focus{background:#f3f4f6}
.busca-resultados li small{display:block;color:#6b7280;font-size:.8rem;margin-top:2px}
.busca-resultados .vazio{padding:8px 10px;color:#6b7280}
.menu-abrir{position:absolute;opacity:0;pointer-events:none}
.menu-botao{display:none;flex-direction:column;justify-content:center;gap:4px;width:36px;height:36px;cursor:pointer;flex-shrink:0}
.menu-botao span{display:block;height:2px;background:#374151;border-radius:2px}
.corpo{display:flex;max-width:1360px;margin:0 auto}
.lateral{width:300px;flex-shrink:0;position:sticky;top:60px;align-self:flex-start;max-height:calc(100vh - 60px);overflow:auto;padding:16px 12px 40px;border-right:1px solid #eef0f2}
.menu ul{list-style:none;margin:0;padding:0}
.menu ul ul{padding-left:12px;border-left:1px solid #eef0f2;margin-left:8px}
.menu li{margin:1px 0}
.menu a,.menu span{display:block;padding:4px 8px;border-radius:6px;color:#374151;text-decoration:none;font-size:.9rem}
.menu a:hover{background:#f3f4f6}
.menu a.atual{background:color-mix(in srgb,var(--marca) 12%,#fff);color:var(--marca);font-weight:600}
.menu .grupo>details>summary>a,.menu .grupo>details>summary>span,.menu .grupo>a,.menu .grupo>span{font-weight:700;color:#111827;font-size:.92rem}
.menu summary{cursor:pointer;list-style:none;display:flex;align-items:center}
.menu summary::-webkit-details-marker{display:none}
.menu summary::before{content:"";flex-shrink:0;width:6px;height:6px;margin:0 4px 0 2px;border-right:1.5px solid #9ca3af;border-bottom:1.5px solid #9ca3af;transform:rotate(-45deg);transition:transform .15s}
.menu details[open]>summary::before{transform:rotate(45deg)}
.menu summary>a,.menu summary>span{flex:1}
.menu .grupo{margin-top:10px}
.conteudo{flex:1;min-width:0;padding:28px 40px 60px;max-width:900px}
.conteudo h1{font-size:2rem;line-height:1.25;margin:0 0 8px}
.conteudo h2{font-size:1.45rem;margin:2em 0 .6em;padding-top:.4em;border-top:1px solid #eef0f2}
.conteudo h3{font-size:1.2rem;margin:1.6em 0 .5em}
.conteudo h4{font-size:1.05rem;margin:1.4em 0 .4em}
.resumo{font-size:1.1rem;color:#4b5563;margin:0 0 1.5em}
.trilha{font-size:.85rem;color:#6b7280;margin:0 0 6px}
.conteudo figure{margin:1.2em 0;text-align:center}
.conteudo figure img{border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.06)}
.conteudo figcaption{font-size:.85rem;color:#6b7280;margin-top:6px}
.conteudo table{border-collapse:collapse;width:100%;margin:1em 0;font-size:.92rem;display:block;overflow-x:auto}
.conteudo th,.conteudo td{border:1px solid #e5e7eb;padding:8px 10px;text-align:left;vertical-align:top}
.conteudo th{background:#f9fafb}
.conteudo code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.88em;background:#f3f4f6;padding:.15em .35em;border-radius:4px}
.conteudo pre{background:#111827;color:#e5e7eb;padding:14px 16px;border-radius:8px;overflow-x:auto;font-size:.85rem;line-height:1.5}
.conteudo pre code{background:none;padding:0;color:inherit;font-size:inherit}
.conteudo blockquote{margin:1em 0;padding:.4em 1em;border-left:4px solid #d0d7de;color:#4b5563}
.conteudo mark{background:color-mix(in srgb,var(--marca) 14%,#fff);color:inherit;padding:0 .2em;border-radius:3px}
.hint{margin:1.2em 0;padding:12px 16px;border-radius:8px;border-left:4px solid}
.hint>:first-child{margin-top:0}.hint>:last-child{margin-bottom:0}
.hint-info{background:#eff6ff;border-color:#3b82f6}
.hint-warning{background:#fffbeb;border-color:#f59e0b}
.hint-danger{background:#fef2f2;border-color:#ef4444}
.hint-success{background:#f0fdf4;border-color:#22c55e}
.ref{margin:.6em 0}
.ref p{margin:0}
.ref a{display:block;padding:12px 16px;border:1px solid #e5e7eb;border-radius:8px;text-decoration:none;font-weight:600}
.ref a:hover{border-color:var(--marca)}
.paginacao{display:flex;justify-content:space-between;gap:16px;margin-top:3em;padding-top:1.5em;border-top:1px solid #eef0f2}
.paginacao a{flex:1;max-width:48%;padding:12px 16px;border:1px solid #e5e7eb;border-radius:8px;text-decoration:none}
.paginacao a:hover{border-color:var(--marca)}
.paginacao small{display:block;color:#6b7280}
.paginacao .proxima{text-align:right;margin-left:auto}
.cartoes{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-top:2em}
.cartao{border:1px solid #e5e7eb;border-radius:10px;padding:16px 18px}
.cartao h2{font-size:1.05rem;margin:0 0 .5em;padding:0;border:0}
.cartao ul{margin:0;padding-left:18px;font-size:.92rem}
.destaque img{border:1px solid #e5e7eb;border-radius:10px;max-width:520px}
.erro{margin:60px auto;text-align:center}
@media (max-width:900px){
.menu-botao{display:flex}
.lateral{position:fixed;top:57px;left:0;bottom:0;z-index:15;width:min(320px,85vw);max-height:none;background:#fff;box-shadow:4px 0 24px rgba(0,0,0,.12);transform:translateX(-105%);transition:transform .2s}
body:has(.menu-abrir:checked) .lateral{transform:none}
.conteudo{padding:20px 16px 48px}
.conteudo h1{font-size:1.6rem}
.busca{width:auto;flex:1;min-width:0}
.marca-nome{max-width:38vw;font-size:.95rem}
.marca:has(img) .marca-nome{display:none}
.paginacao{flex-direction:column}
.paginacao a{max-width:none}
}
