.composicao-editor{--comp-line:var(--bb-line,#37302A35);color:var(--bb-ink,#37302A)}
.comp-toolbar{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:16px 0;border-top:2px solid currentColor;border-bottom:1px solid var(--comp-line);flex-wrap:wrap}.comp-toolbar>div{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.comp-toolbar strong{font-size:20px}.comp-toolbar span{font-size:11px}.comp-toolbar button{font-size:11px;padding:9px 12px}.comp-toolbar button:disabled{opacity:.35;cursor:default}.comp-layout{display:grid;grid-template-columns:210px minmax(0,1fr) 230px;min-height:580px}.comp-biblioteca,.comp-propriedades{padding:22px 16px;border-right:1px solid var(--comp-line);min-width:0}.comp-propriedades{border-right:0;border-left:1px solid var(--comp-line)}.composicao-editor h3{font-size:22px;margin:22px 0 14px}.composicao-editor aside h3:first-child{margin-top:0}.composicao-editor label{font-size:11px;margin:0 0 12px}.composicao-editor select,.composicao-editor input{width:100%;min-width:0;margin-top:6px;padding:9px 7px;color:inherit;background:transparent;border:1px solid var(--comp-line);border-radius:0;font:inherit}.composicao-editor input:focus-visible,.composicao-editor select:focus-visible,.comp-viewport canvas:focus-visible{outline:3px solid #885AA5;outline-offset:3px}.comp-campos{display:grid;grid-template-columns:1fr 1fr;gap:8px}.comp-span{grid-column:1/-1}.comp-proporcao{font-size:10px;align-self:center}.comp-biblioteca>button{width:100%;font-size:12px}.comp-biblioteca>p,.comp-propriedades>p{font-size:11px;line-height:1.5}.comp-lista{display:flex;flex-direction:column;gap:4px;max-height:360px;overflow:auto}.comp-lista button{text-align:left;display:flex;gap:8px;align-items:start;font-size:11px;padding:11px 8px;border:1px solid transparent;overflow-wrap:anywhere}.comp-lista button span{font-size:9px;opacity:.6}.comp-lista button[aria-pressed=true]{border-color:currentColor;background:var(--bb-ink,#37302A);color:var(--bb-paper,#F9F7F5)}.comp-centro{min-width:0;padding:0 14px}.comp-dica,.comp-limite{font-size:11px;line-height:1.5;padding:12px 0;margin:0}.comp-viewport{overflow:auto;background:#77736D;max-height:760px;min-height:400px}.comp-viewport canvas{display:block;touch-action:none;cursor:crosshair;max-width:none}.comp-acoes-camada{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:18px}.comp-acoes-camada button{font-size:11px;padding:9px 6px}.comp-protegida{border-left:3px solid #E8E114;padding-left:10px}.comp-layout button:focus-visible{outline:3px solid #885AA5;outline-offset:2px}html[data-bb-tema=noite] .composicao-editor select,html[data-bb-tema=noite] .composicao-editor input{background:#2B2723}html[data-bb-tema=noite] .composicao-editor :focus-visible{outline-color:#E8E114}
@media(max-width:1150px){.comp-layout{grid-template-columns:180px minmax(0,1fr)}.comp-propriedades{grid-column:1/-1;border-left:0;border-top:1px solid var(--comp-line)}.comp-propriedades .comp-campos{grid-template-columns:repeat(3,1fr)}.comp-acoes-camada{grid-template-columns:repeat(4,1fr)}}
@media(max-width:720px){.comp-layout{display:flex;flex-direction:column}.comp-centro{order:0;padding:0}.comp-biblioteca{order:1;border-right:0;border-top:1px solid var(--comp-line);padding:20px 0}.comp-propriedades{order:2;padding:20px 0}.comp-toolbar{gap:12px}.comp-toolbar>div:last-child{width:100%}.comp-toolbar button{padding:9px}.comp-toolbar [data-exportar]{margin-left:auto}.comp-viewport{min-height:400px;max-height:570px}.comp-biblioteca .comp-campos{grid-template-columns:1fr 1fr}.comp-lista{max-height:200px}.comp-propriedades .comp-campos{grid-template-columns:1fr 1fr}.comp-acoes-camada{grid-template-columns:1fr 1fr}}

.comp-exportacao{border-bottom:1px solid var(--comp-line);padding:16px 0;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.comp-exportacao[hidden]{display:none}.comp-exportacao>a{display:inline-block;padding:11px 15px;background:var(--bb-ink,#37302A);color:var(--bb-paper,#F9F7F5);font-size:13px}.comp-exportacao>span{font-size:11px}.comp-exportacao details{width:100%;padding:8px 0;border:0}.comp-exportacao summary{font-size:12px}.comp-exportacao img{display:block;max-width:240px;max-height:320px;width:auto;height:auto;margin-top:12px;border:1px solid var(--comp-line)}
