/* escopo-modal.css - estilos do modal "Configuracoes" (fonte unica, v749).
   Carregado pelo dashboard SPA (dashboard.html) E pelas telas admin (base.html);
   o JS correspondente e static/escopo-modal.js. Tokens de tema dos dois lados. */
.cfgesc-overlay { position:fixed; inset:0; z-index:220; background:rgba(15,20,30,.45); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); display:flex; align-items:flex-start; justify-content:center; padding:calc(var(--vh-tela) * .09) 16px 16px; }
/* caixa OPACA (--panel-solid): o --panel translucido deixava o conteudo atras vazar */
.cfgesc-modal { width:min(560px,100%); max-height:calc(var(--vh-tela) * .82); display:flex; flex-direction:column; background:var(--panel-solid, var(--panel)); color:var(--text); border:1px solid var(--border); border-radius:18px; box-shadow:0 24px 64px rgba(0,0,0,.28); overflow:hidden; }
.cfgesc-head { display:flex; align-items:center; gap:10px; padding:16px 18px 8px; }
.cfgesc-head h3 { font-family:'Fraunces',serif; font-size:18px; font-weight:600; margin:0 auto 0 0; }
.cfgesc-esc { font-family:'JetBrains Mono',monospace; font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-faint); border:1px solid var(--border); border-bottom-width:2px; border-radius:5px; padding:2px 7px; }
.cfgesc-x { appearance:none; border:0; background:none; color:var(--text-dim); font-size:15px; cursor:pointer; padding:4px 8px; border-radius:8px; }
.cfgesc-x:hover { background:var(--panel-2); color:var(--text); }
.cfgesc-busca { margin:4px 16px 2px; border:1px solid var(--border); border-radius:10px; background:var(--panel-2,var(--panel)); color:var(--text); padding:9px 13px; font:500 13.5px 'Hanken Grotesk',sans-serif; }
.cfgesc-busca:focus { outline:none; border-color:var(--good); box-shadow:0 0 0 3px rgba(31,58,104,.14); }
.cfgesc-busca::placeholder { color:var(--text-faint); }
.cfgesc-body { overflow-y:auto; padding:0 14px 16px; }
.cfgesc-sec { font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--text-faint); padding:14px 6px 7px; }
.cfgesc-mono { width:34px; height:34px; border-radius:10px; border:1px solid var(--border); background:var(--panel-2,var(--panel)); display:grid; place-items:center; font-family:'Fraunces',serif; font-size:13.5px; font-weight:600; flex:none; }
.cfgesc-mono.g { width:42px; height:42px; border-radius:13px; font-size:16px; border-color:color-mix(in srgb,var(--good) 45%,var(--border)); color:var(--good-ink); box-shadow:0 0 0 2px color-mix(in srgb,var(--good) 22%,transparent); }
.cfgesc-tx { display:flex; flex-direction:column; gap:2px; min-width:0; }
.cfgesc-tx b { font-size:13.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cfgesc-tx small { font-size:11.5px; color:var(--text-dim); }
/* cartao do escopo atual: o caminho de 1 clique, em destaque no topo */
.cfgesc-atualcard { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:13px 14px; border:1px solid color-mix(in srgb,var(--good) 35%,var(--border)); border-radius:14px; background:color-mix(in srgb,var(--good) 6%,transparent); }
.cfgesc-atualcard .cfgesc-tx { flex:1; min-width:120px; }
.cfgesc-acts { display:flex; gap:8px; flex-wrap:wrap; }
.cfgesc-btn { font:600 12.5px 'Hanken Grotesk',sans-serif; text-decoration:none; color:var(--text); border:1px solid var(--border); border-radius:9px; padding:8px 13px; background:var(--panel-2,var(--panel)); white-space:nowrap; }
.cfgesc-btn:hover, .cfgesc-btn:focus-visible { border-color:var(--text-faint); outline:none; }
.cfgesc-btn.on { border-color:color-mix(in srgb,var(--good) 55%,var(--border)); color:var(--good-ink); background:color-mix(in srgb,var(--good) 12%,transparent); }
/* bloco por projeto: a linha do projeto + as squads como chips aninhados */
.cfgesc-proj { border:1px solid transparent; border-radius:12px; margin-bottom:2px; }
.cfgesc-proj.atual { border-color:var(--border); background:color-mix(in srgb,var(--good) 3%,transparent); }
.cfgesc-projrow { display:flex; align-items:center; gap:11px; padding:9px 10px; border:1px solid transparent; border-radius:11px; text-decoration:none; color:var(--text); }
.cfgesc-projrow:hover, .cfgesc-projrow:focus-visible { background:var(--panel-2); border-color:var(--border); outline:none; }
.cfgesc-projrow.on { border-color:color-mix(in srgb,var(--good) 45%,var(--border)); background:color-mix(in srgb,var(--good) 8%,transparent); }
.cfgesc-projrow .cfgesc-tx { flex:1; }
.cfgesc-atual { font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:var(--good-ink); border:1px solid color-mix(in srgb,var(--good) 40%,var(--border)); border-radius:6px; padding:2px 7px; white-space:nowrap; }
.cfgesc-go { color:var(--text-faint); font-size:16px; }
.cfgesc-sqrow { display:flex; align-items:center; gap:10px; margin:0 6px 2px 42px; padding:7px 10px; border:1px solid transparent; border-radius:10px; text-decoration:none; color:var(--text); }
.cfgesc-sqrow:hover, .cfgesc-sqrow:focus-visible { background:var(--panel-2); border-color:var(--border); outline:none; }
.cfgesc-sqrow.on { border-color:color-mix(in srgb,var(--good) 45%,var(--border)); background:color-mix(in srgb,var(--good) 8%,transparent); }
.cfgesc-sqrow .cfgesc-tx { flex:1; }
.cfgesc-sqic { width:24px; height:24px; border-radius:7px; border:1px solid var(--border); background:var(--panel-2,var(--panel)); display:grid; place-items:center; font-size:11px; color:var(--text-dim); flex:none; }
.cfgesc-vazio { padding:14px 10px; font-size:12.5px; color:var(--text-dim); }

/* v754: o BOTAO que abre este modal, identico nos dois shells (dashboard e admin).
   O desenho de referencia e o .strip-link da faixa de marca do dashboard; aqui ele
   vira classe propria para o admin herdar o MESMO visual, em vez de um btn-sec. */
.cfg-topo{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.04em;
  color:var(--dim-on-dark);text-decoration:none;padding:0 13px;height:38px;
  display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border-on-dark);
  border-radius:8px;background:none;cursor:pointer;white-space:nowrap;
  transition:transform .15s,box-shadow .15s,border-color .15s,color .15s}
.cfg-topo:hover{color:var(--text-on-dark);border-color:var(--faint-on-dark);
  text-decoration:none;transform:translateY(-1px)}
.cfg-topo:focus-visible{outline:2px solid var(--accent);outline-offset:2px}