/* A janela de configuracoes: moldura, menu lateral e pagina. */

/* janela de configuracoes */
.cfgFundo{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:24px;
          background:hsl(var(--scrimRaw)/.7);backdrop-filter:blur(calc(var(--vidro) * .2))}
.cfgCaixa{width:min(720px,100%);max-height:min(620px,100%);display:flex;flex-direction:column;
          border-radius:var(--rlg);background:var(--surface);
          box-shadow:0 0 0 1px var(--linha2),var(--sombra3)}
.cfgTopo{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--linha)}
.cfgTit{flex:1;font-size:15px;font-weight:500}
.cfgCorpo{flex:1;min-height:0;display:grid;grid-template-columns:172px minmax(0,1fr)}
.cfgMenu{display:flex;flex-direction:column;gap:2px;padding:12px 8px;border-right:1px solid var(--linha)}
.cfgMenu button{justify-content:flex-start;border:0;background:transparent;color:var(--tx2);
                font-size:13px;padding:8px 10px;border-radius:var(--r)}
.cfgMenu button:hover{background:var(--sup2);color:var(--tx)}
.cfgMenu button.at{background:hsl(var(--acRaw)/.18);color:var(--ac2)}
.cfgPag{overflow-y:auto;padding:16px}
@media (max-width:620px){ .cfgCorpo{grid-template-columns:1fr}
  .cfgMenu{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--linha)} }