/* Etapa 7, Parte 8 — o Maestro: as páginas de Conhecimento, Skills e Evolução (maestro_cs.js). Só as peças novas: cartões, tabelas, botões,
   selos, abas, chips e formulários vêm de base.css, app.css e tessa.css (o tema da Tessa, que o Maestro reaproveita). Tudo com o prefixo
   mc- para não cruzar com maestro.css (a moldura e as páginas principais). As tabelas largas rolam dentro do cartão, nunca a página. */
.mc{min-width:0}
.mc-abas{margin:0 0 12px}
.mc-sub{margin:0 0 10px}
.mc-sub .aba{font-size:13px;padding:4px 12px}
.mc .cartao{min-width:0}
.mc .cartao p{line-height:1.5}
.mc a:not(.btn):not(.aba){color:var(--cor-txt,var(--cor));font-weight:650}
.mc-cinza{color:var(--cinza);font-size:12.5px}
.mc-linha{margin:0 0 6px;line-height:1.5}
.mc-intro{margin:0 0 4px;line-height:1.5}
.mc-pe{margin:0 0 4px}
.mc-nota-top{margin:-4px 2px 14px}
.mc .chip.zero{opacity:.55}
.mc-chips{margin:0 0 10px}
.mc-chips .chip{font-size:12.5px;padding:4px 10px}

/* a tabela larga rola dentro do cartão (1366 px com a IA aberta, e o celular) */
.mc-rola{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.mc-rola+.nota{margin-top:8px}
.mc-motivo{max-width:340px;overflow-wrap:anywhere}
.mc-url{max-width:420px;overflow-wrap:anywhere}
.mc-marca{width:34px}
.mc .t input[type=checkbox]{accent-color:var(--cor2,var(--cor));width:16px;height:16px;cursor:pointer}
.mc .t tr.mc-apagada td{opacity:.55}
/* o histórico longo rola por dentro */
.mc-hist{max-height:420px;overflow:auto}
.mc-hist .mc-rola{overflow:visible}
.mc-det{margin-top:6px}
.mc-det summary{cursor:pointer;color:var(--cor-txt,var(--cor));font-size:12.5px}
.mc-texto{margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5}

/* Legislação: o aviso em vermelho da fonte fora há mais de 2 dias (caixa e5q), as fontes, a norma */
.mc-fora{display:flex;gap:10px;align-items:flex-start;margin:0 0 12px;padding:10px 13px;border-radius:10px;font-weight:600;line-height:1.45;
  color:#fff;background:color-mix(in srgb,var(--perigo) 78%,#000);border:1px solid var(--perigo)}
.mc-fora svg{width:19px;height:19px;flex:none;margin-top:1px}
.mc-leg-bt{margin:6px 0 2px}
.mc-leg-topo{margin-top:12px;align-items:start}
.mc-fontes{list-style:none;margin:0;padding:0}
.mc-fontes li{padding:7px 0;border-bottom:1px solid var(--linha2);line-height:1.45;overflow-wrap:anywhere}
.mc-fontes li:last-child{border-bottom:0}
.mc-fontes small{display:block;color:var(--cinza);font-size:12px}
.mc-fontes small.mc-perigo-txt{display:inline}
.selo.mc-perigo{background:color-mix(in srgb,var(--perigo) 18%,transparent);color:var(--perigo)}
.mc-perigo-txt{color:var(--perigo);font-weight:600}
.mc-normas td:nth-child(5){max-width:280px}
.mc-lista-res{margin:0 0 6px;padding-left:18px;line-height:1.65}

/* Interruptores: a grade escritório × chave */
.mc-grade th{white-space:normal;min-width:96px;vertical-align:bottom}
.mc-grade th small{color:var(--cinza);font-weight:500}
.mc-cel{text-align:center;white-space:nowrap}
.mc-chave{width:38px;height:22px;border-radius:11px;background:#8f969d;position:relative;cursor:pointer;border:0;padding:0;display:block;margin:0 auto}
.mc-chave::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .15s}
.mc-chave.sim{background:var(--cor2,var(--cor))}
.mc-chave.sim::after{left:19px}
.mc-chave:focus-visible{outline:2px solid var(--cor2,var(--cor));outline-offset:2px}
.mc-origem{display:block;margin-top:4px;font-size:11px;color:var(--cinza)}

/* Versões: o tipo, os números, a diferença */
.mc-tipo{margin:0 0 12px}
.mc-tipo label{color:var(--cinza);font-size:13px}
.mc-tipo select{font:inherit;padding:6px 9px;border:1px solid var(--linha);border-radius:8px;background:var(--campo);color:var(--tinta);max-width:240px}
.mc-nums{margin:4px 0 0;padding-left:18px;line-height:1.6}
.mc-lote{margin:4px 0 10px;padding-left:18px;line-height:1.55;max-height:220px;overflow:auto}
.modal-caixa.mc-largo{width:min(1100px,100%)}
pre.mc-pre{max-height:56vh;overflow:auto;margin:6px 0 0;padding:10px 12px;border:1px solid var(--linha);border-radius:9px;background:var(--campo);color:var(--tinta);
  font:12.5px/1.5 "Cascadia Mono",Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
pre.mc-dif .mc-mais{color:var(--ok)}
pre.mc-dif .mc-menos{color:var(--perigo)}
pre.mc-dif .mc-arroba{color:var(--cinza)}
.mc-form-col{grid-template-columns:1fr;max-width:none;margin-top:6px}
.mc-form-col textarea{height:96px}
.mc-form-col .linha-botoes{margin-top:2px}

/* Candidatas e Evolução: um cartão por candidata ou ideia (o desenho «ideia» da maquete) */
.mc-cands{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(460px,100%),1fr));gap:14px;margin-bottom:14px;align-items:start}
.mc-cands .cartao{margin:0}
.mc-ideia{border-left:3px solid var(--cor2,var(--cor))}
.mc-ideia h4{margin:0 0 6px;font-size:15px;line-height:1.35}
.mc-cand-topo{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.mc-cand-topo h4{flex:1;min-width:0}
.mc-cand-topo h4 small{color:var(--cinza);font-weight:500;font-size:12px}
.mc-meta{display:block;margin:0 0 4px;color:var(--cinza);font-size:12.5px;line-height:1.45}
.mc-cruz{margin:6px 0 2px;line-height:1.45}
.mc-ideia .linha-botoes .btn svg,.mc-leg-bt .btn svg{width:15px;height:15px}
.mc-evo{align-items:start}
.mc-cerebro{display:inline-block;border:1px solid var(--linha);border-radius:14px;padding:3px 11px;font-size:12.5px;color:var(--cinza)}
.mc-cerebro b{color:var(--cor-txt,var(--cor))}
.mc-ul{margin:0;padding-left:18px;line-height:1.6}
.mc-sec{margin:6px 0 10px}
.mc-padroes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(440px,100%),1fr));gap:14px;margin-bottom:6px;align-items:start}
.mc-padroes .cartao{margin:0}

@media (max-width:760px){
  .mc .t{display:table;overflow:visible}         /* quem rola é o .mc-rola, não a tabela (base.css faz a tabela rolar no celular) */
  .mc-motivo,.mc-url,.mc-normas td:nth-child(5){max-width:none}
  .mc-cands,.mc-padroes{grid-template-columns:1fr}
  .mc-hist{max-height:360px}
  .mc-tipo select{max-width:none;flex:1}
}