/* cores do Monday no tema escuro (padrão); o claro fica em data-tema="claro" */
:root { --fundo:#181b34; --cartao:#292f4c; --celula:#30324e; --texto:#d5d8df; --suave:#9699a6; --linha:#4b4e69; --campo:#5f6380;
  --azul:#0073ea; --azul-esc:#0060b9; --hover:#3b3e5c; --sel:#133774; --leve:#26294a; --marcada:#1c3a73; --mencao:#1b3561; --aviso:#000;
  --feito:#00c875; --andamento:#fdab3d; --parado:#e2445c; --cancelado:#6b7088; --fazer:#797e93; --vermelho:#e2445c;
  --pr-critica:#333333; --pr-alta:#401694; --pr-media:#5559df; --pr-baixa:#579bfc; --pr-sem:#797e93; color-scheme:dark; }
:root[data-tema="claro"] { --fundo:#f6f7fb; --cartao:#fff; --celula:#fff; --texto:#323338; --suave:#676879; --linha:#e6e9ef; --campo:#c3c6d4;
  --hover:#f5f6f8; --sel:#cce5ff; --leve:#fafbfd; --marcada:#e5f0ff; --mencao:#e5f1ff; --aviso:#323338; --fazer:#c4c4c4; --pr-sem:#c4c4c4; color-scheme:light; }
* { box-sizing:border-box; }
body { margin:0; font:14px/1.4 Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; background:var(--fundo); color:var(--texto); }
#app { display:flex; min-height:100vh; }
input, select, textarea, button { font:inherit; color:inherit; }
input, select, textarea { background:var(--cartao); border:1px solid var(--campo); border-radius:4px; padding:6px 8px; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--azul); }
.bt { border:1px solid var(--campo); background:var(--cartao); border-radius:4px; padding:6px 12px; cursor:pointer; }
.bt:hover { background:var(--hover); }
.bt.pri, .bt.azul { background:var(--azul); color:#fff; border-color:var(--azul); }
.bt.pri:hover, .bt.azul:hover { background:var(--azul-esc); }
.bt.fino { padding:4px 10px; font-size:13px; }
.bt.perigo { color:var(--vermelho); margin-top:24px; }

/* menu lateral */
aside { width:256px; flex:none; background:var(--cartao); border-right:1px solid var(--linha); padding:12px 10px; display:flex; flex-direction:column; gap:2px; position:sticky; top:0; height:100vh; overflow:auto; }
aside svg { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; color:var(--suave); }
aside a { display:flex; align-items:center; gap:10px; padding:7px 10px; border-radius:6px; cursor:pointer; color:var(--texto); text-decoration:none; min-height:34px; }
aside a span { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
aside a:hover { background:var(--hover); }
aside a.on { background:var(--sel); }
aside a.on svg { color:var(--azul); }
aside a b { font-weight:500; font-size:12px; color:#fff; background:var(--vermelho); border-radius:10px; padding:0 7px; }
aside nav { display:flex; flex-direction:column; gap:2px; padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid var(--linha); }
.espaco { display:flex; align-items:center; gap:10px; padding:6px 10px 10px; font-size:15px; }
.logo { width:24px; height:24px; object-fit:contain; }
.topo-logo { display:flex; align-items:flex-end; gap:8px; padding:6px 10px 16px; }
.topo-logo img { height:26px; }
.topo-logo span { color:var(--suave); font-size:13px; padding-bottom:2px; }
.busca-q { display:flex; align-items:center; gap:6px; margin:0 4px 8px; padding:0 8px; border:1px solid var(--linha); border-radius:6px; }
.busca-q:focus-within { border-color:var(--azul); }
.busca-q input { border:0; padding:7px 0; width:100%; background:transparent; }
.quadros { flex:1; }
aside a.area { color:var(--suave); font-size:13px; min-height:30px; gap:6px; }
aside a.area .seta { flex:none; width:12px; font-size:11px; transition:transform .15s; }
.pasta.fechada .seta { transform:rotate(-90deg); }
.pasta.fechada .lista { display:none; }
.lista a { padding-left:28px; }
aside a.novo { color:var(--azul); margin-top:8px; }
.eu { display:flex; align-items:center; gap:8px; font-size:13px; padding:12px 6px 0; margin-top:8px; border-top:1px solid var(--linha); }
.eu span:nth-child(2) { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.eu .bol { margin:0; border:0; }
.eu a { padding:0; min-height:0; color:var(--suave); }
.eu a:hover { background:none; color:var(--texto); }

/* topo */
main { flex:1; min-width:0; }
header { background:var(--cartao); padding:18px 32px 0; border-bottom:1px solid var(--linha); position:sticky; top:0; z-index:2; }
header h2 { margin:0 0 12px; font-size:24px; font-weight:600; }
.barra { display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding-bottom:12px; }
.barra input, .barra select { border-color:transparent; background:transparent; }
.barra input:hover, .barra select:hover { background:var(--hover); }
.barra input:focus { border-color:var(--azul); background:var(--cartao); }
.modos { display:flex; gap:2px; margin-left:auto; }
.modos button { border:0; background:none; padding:6px 10px; cursor:pointer; border-radius:4px; color:var(--suave); }
.modos button:hover { background:var(--hover); }
.modos button.on { color:var(--texto); background:var(--sel); }

/* tabela no estilo de quadro */
#conteudo { padding:24px 32px 80px; }
.grupo { margin-bottom:36px; }
.grupo h3 { color:var(--cor); font-size:17px; font-weight:600; margin:0 0 8px; cursor:pointer; display:flex; align-items:baseline; gap:8px; user-select:none; }
.grupo h3 small { color:var(--suave); font-size:13px; font-weight:400; opacity:0; transition:opacity .15s; }
.grupo h3:hover small, .grupo.fechado h3 small { opacity:1; }
.seta { font-size:13px; display:inline-block; transition:transform .15s; }
.grupo.fechado .seta { transform:rotate(-90deg); }
.grupo.fechado table { display:none; }
table { width:100%; border-collapse:collapse; background:var(--cartao); border-left:6px solid var(--cor, var(--azul)); border-radius:6px 0 0 6px; table-layout:fixed; }
th { text-align:center; font-weight:400; font-size:13px; color:var(--suave); padding:8px; border:1px solid var(--linha); border-left:0; }
th:first-child { text-align:left; }
td { padding:0 8px; height:38px; border:1px solid var(--linha); border-left:0; vertical-align:middle; }
tbody tr:hover td { background:var(--hover); }
td.tit { cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
td.tit:hover { color:var(--azul); }
tr.feito td.tit { color:var(--suave); }
.c-dono { width:120px; text-align:center; }
.c-st { width:150px; }
.c-prazo, .c-ini { width:130px; }
td.c-st { padding:0; text-align:center; }
td.c-st select { width:100%; height:38px; border:0; border-radius:0; background:transparent; color:#fff; text-align:center; text-align-last:center; cursor:pointer; appearance:none; font-weight:500; }
td.c-st select option, td.c-pr select option { color:var(--texto); background:var(--cartao); }
.bg-concluido { background:var(--feito) !important; color:#fff; }
.bg-andamento { background:var(--andamento) !important; color:#fff; }
.bg-parado { background:var(--parado) !important; color:#fff; }
.bg-cancelado { background:var(--cancelado) !important; color:#fff; }
.bg-a_fazer { background:var(--fazer) !important; color:#fff; }
td.c-prazo input, td.c-ini input { width:100%; border:0; background:transparent; text-align:center; padding:0; }
.venc { color:var(--vermelho); }
tr.add td { color:var(--suave); cursor:pointer; }
tr.add td:hover { color:var(--azul); }
.donos { cursor:pointer; white-space:nowrap; text-align:center; }
.bol { display:inline-grid; place-items:center; width:28px; height:28px; border-radius:50%; color:#fff; font-size:11px; font-weight:600; margin-left:-6px; border:2px solid var(--celula); }
.bol:first-child { margin-left:0; }
.sem { display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%; border:1px dashed var(--campo); color:var(--suave); }

/* kanban */
.kanban { display:grid; grid-template-columns:repeat(4, minmax(240px,1fr)); gap:16px; overflow-x:auto; }
.col { background:var(--cartao); border-radius:8px; min-height:200px; overflow:hidden; }
.col h3 { font-size:14px; font-weight:500; margin:0 0 8px; padding:10px 12px; }
.col h3 b { font-weight:400; opacity:.85; }
.cartao { background:var(--cartao); border:1px solid var(--linha); border-radius:6px; padding:10px 12px; margin:0 8px 8px; cursor:pointer; box-shadow:0 1px 2px rgba(0,0,0,.04); }
.cartao:hover { box-shadow:0 4px 12px rgba(0,0,0,.08); }
.cartao .rodape { display:flex; justify-content:space-between; align-items:center; margin-top:10px; font-size:12px; color:var(--suave); }

.resumo { border-left:0; border-radius:6px; }
.resumo td, .resumo th { text-align:left; }
.resumo tr[data-p] { cursor:pointer; }
.vazio, .dica, .mini { color:var(--suave); }
.mini { font-size:12px; }

/* ficha da tarefa */
.gaveta { position:fixed; top:0; right:0; width:min(560px,100%); height:100vh; overflow:auto; background:var(--cartao); padding:20px 28px 40px; transform:translateX(105%); transition:transform .2s; z-index:5; box-shadow:-6px 0 24px rgba(0,0,0,.12); }
.gaveta.on { transform:none; }
.g-topo { display:flex; justify-content:space-between; align-items:center; color:var(--suave); font-size:13px; margin-bottom:10px; }
.g-tit { width:100%; font-size:22px; font-weight:600; border-color:transparent; resize:none; padding:4px 0; }
.g-tit:hover { border-color:var(--linha); }
.g-campos { display:grid; grid-template-columns:120px 1fr; gap:6px 12px; margin:12px 0 20px; align-items:center; }
.g-campos label { display:contents; font-size:13px; color:var(--suave); }
.g-campos label > * { color:var(--texto); font-size:14px; border-color:transparent; }
.g-campos label > *:hover { background:var(--hover); }
.g-desc { display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--suave); }
.g-desc textarea, #g-com textarea { width:100%; color:var(--texto); }
.gaveta h4 { margin:24px 0 8px; font-size:15px; font-weight:600; }
.com { border:1px solid var(--linha); border-radius:6px; padding:10px 12px; margin-bottom:8px; }
.com span { color:var(--suave); font-size:12px; }
.com p { margin:6px 0 0; white-space:pre-wrap; }
#g-com { display:flex; flex-direction:column; gap:6px; align-items:flex-end; margin-top:8px; }
.hist { font-size:12px; color:var(--suave); display:flex; flex-direction:column; gap:3px; }
.pop { position:absolute; z-index:9; background:var(--cartao); border-radius:8px; padding:8px; width:240px; max-height:320px; overflow:auto; display:flex; flex-direction:column; gap:2px; box-shadow:0 8px 28px rgba(0,0,0,.18); }
.pop label { padding:5px 6px; border-radius:4px; cursor:pointer; }
.pop label:hover { background:var(--hover); }

/* login */
.login { margin:auto; width:100%; max-width:380px; padding:16px; }
.login form { background:var(--cartao); border-radius:10px; padding:32px 28px; display:flex; flex-direction:column; gap:14px; box-shadow:0 6px 24px rgba(0,0,0,.08); }
.login h1 { margin:0; font-size:22px; }
.logo-login { height:40px; align-self:flex-start; margin-bottom:6px; } .login .sub { margin:0; color:var(--suave); }
.login label { display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--suave); }
.login a { font-size:13px; color:var(--azul); text-align:center; text-decoration:none; }
.msg { color:var(--vermelho); min-height:1em; margin:0; font-size:13px; }
.aviso { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:var(--aviso); color:#fff; padding:10px 16px; border-radius:6px; opacity:0; pointer-events:none; transition:opacity .2s; z-index:10; }
.aviso.on { opacity:1; } .aviso.erro { background:var(--vermelho); }
.so-cel { display:none; }

@media (max-width: 760px) {
  aside { position:fixed; left:0; z-index:6; transform:translateX(-100%); transition:transform .18s; box-shadow:4px 0 20px rgba(0,0,0,.12); }
  body.menu aside { transform:none; }
  .so-cel { display:inline-block; margin-bottom:8px; }
  header { padding:14px 16px 0; } #conteudo { padding:16px 16px 60px; }
  header h2 { font-size:20px; }
  table { table-layout:auto; }
  table thead { display:none; }
  table tr { display:grid; grid-template-columns:auto 1fr 1fr; border-bottom:1px solid var(--linha); }
  table td { border:0; } td.tit { grid-column:1 / -1; white-space:normal; padding:8px; height:auto; }
  .c-dono, .c-st, .c-prazo, .c-ini { width:auto; }
  .kanban { grid-template-columns:repeat(4, 80vw); }
  .g-campos { grid-template-columns:100px 1fr; }
}
.g-campos .donos { text-align:left; padding:4px 8px; }

/* notificações */
aside a b.azul { background:var(--azul); }
.notif-barra { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px; max-width:820px; }
.abas { display:flex; gap:4px; background:var(--cartao); border:1px solid var(--linha); border-radius:8px; padding:3px; }
.abas button { border:0; background:none; padding:6px 14px; border-radius:6px; cursor:pointer; color:var(--suave); }
.abas button.on { background:var(--sel); color:var(--texto); font-weight:500; }
.abas b { font-size:11px; color:#fff; background:var(--azul); border-radius:10px; padding:0 6px; margin-left:4px; }
.notifs { max-width:820px; background:var(--cartao); border:1px solid var(--linha); border-radius:8px; overflow:hidden; }
.notif { display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-bottom:1px solid var(--linha); cursor:pointer; }
.notif:last-child { border-bottom:0; }
.notif:hover { background:var(--hover); }
.notif.nova { background:var(--leve); }
.notif.nova:hover { background:var(--mencao); }
.notif .bol { margin:0; flex:none; border:0; }
.n-corpo { flex:1; min-width:0; }
.n-texto { margin-top:6px; padding:8px 10px; background:var(--fundo); border-radius:6px; color:var(--texto); white-space:pre-wrap; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.n-pe { font-size:12px; color:var(--suave); margin-top:4px; }
.ponto { width:10px; height:10px; border-radius:50%; background:var(--azul); flex:none; margin-top:6px; }
.tag-mencao { font-size:11px; color:var(--azul); background:var(--sel); border-radius:10px; padding:1px 8px; white-space:nowrap; }
.mencao { color:var(--azul); background:var(--mencao); border-radius:4px; padding:0 3px; font-weight:500; }
.com-topo { display:flex; align-items:center; gap:8px; }
.com-topo .bol { margin:0; width:26px; height:26px; border:0; }
.com-topo span:last-child { color:var(--suave); font-size:12px; }
.curtir { border:0; background:none; color:var(--suave); cursor:pointer; padding:4px 0 0; font-size:13px; }
.curtir:hover, .curtir.on { color:var(--azul); }
.pop-mencao label { display:flex; align-items:center; gap:8px; }
.pop-mencao .bol { margin:0; width:22px; height:22px; border:0; font-size:9px; }

/* subtarefas */
.subs { border:1px solid var(--linha); border-radius:6px; overflow:hidden; }
.sub { display:flex; align-items:center; gap:10px; padding:8px 10px; border-bottom:1px solid var(--linha); cursor:pointer; }
.sub:hover { background:var(--hover); }
.sub span:nth-child(2) { flex:1; }
.sub .feito { color:var(--suave); text-decoration:line-through; }
.sub .bol { width:22px; height:22px; font-size:9px; }
.ponto-st { width:10px; height:10px; border-radius:3px; flex:none; }
.add-sub { display:block; padding:8px 10px; cursor:pointer; }
.add-sub:hover { color:var(--azul); }
.n-sub { font-size:11px; color:var(--suave); border:1px solid var(--linha); border-radius:10px; padding:0 6px; margin-left:6px; }
#g-pai { cursor:pointer; display:block; margin-bottom:10px; }

/* acesso por quadro */
aside a i.cad { display:flex; font-style:normal; }
aside a i.cad svg { width:14px; height:14px; }
.tag-restrito { display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:500; color:var(--suave); background:var(--hover); border-radius:12px; padding:2px 10px; vertical-align:middle; }
.tag-restrito svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.6; }
.ac-tit { margin:4px 0 16px; font-size:20px; }
.ac-op { display:flex; gap:10px; align-items:flex-start; padding:12px; border:1px solid var(--linha); border-radius:8px; margin-bottom:8px; cursor:pointer; }
.ac-op small { color:var(--suave); }
.ac-pessoas { display:flex; flex-direction:column; gap:2px; margin:12px 0 20px; border:1px solid var(--linha); border-radius:8px; padding:6px; max-height:50vh; overflow:auto; }
.ac-pessoas.off { opacity:.4; pointer-events:none; }
.ac-pessoas label { display:flex; align-items:center; gap:8px; padding:6px; border-radius:4px; cursor:pointer; }
.ac-pessoas label:hover { background:var(--hover); }
.ac-pessoas .bol { margin:0; width:24px; height:24px; border:0; font-size:9px; }

.carregando { padding: 48px; text-align: center; color: var(--suave); width: 100%; }
.lapis { display: none; margin-left: 6px; cursor: pointer; font-style: normal; }
.lapis svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.5; vertical-align: -2px; }
.area:hover .lapis, h3[data-g]:hover .lapis { display: inline-block; }
.anexo { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.anexo a { cursor: pointer; color: var(--pr-baixa); flex: 1; overflow-wrap: anywhere; }
.subir { display: inline-block; cursor: pointer; color: var(--pr-baixa); font-size: 13px; padding: 4px 0; }
.chave-nova { background: var(--leve); border: 1px solid #fdab3d; border-radius: 6px; padding: 12px; margin: 10px 0; }
.chave-nova code { display: block; margin-top: 6px; overflow-wrap: anywhere; user-select: all; }
.api-doc { background: var(--fundo); border-radius: 6px; padding: 12px; overflow-x: auto; font-size: 12px; }

/* área de trabalho */
.rot-espaco { padding:0 10px 4px; }
.espaco-linha { position:relative; display:flex; gap:6px; padding:0 4px 10px; }
.espaco-bt { flex:1; display:flex; align-items:center; gap:8px; min-width:0; padding:6px 8px; border:1px solid var(--linha); border-radius:6px; background:var(--cartao); cursor:pointer; font-size:15px; text-align:left; }
.espaco-bt:hover, .espaco-bt.on { border-color:var(--azul); }
.espaco-bt strong { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.espaco-bt .seta-e { color:var(--suave); font-size:12px; }
.espaco-mais { flex:none; width:36px; border:1px solid var(--linha); border-radius:6px; background:var(--cartao); cursor:pointer; font-size:20px; color:var(--suave); }
.espaco-mais:hover { border-color:var(--azul); color:var(--azul); }
.selo { flex:none; width:24px; height:24px; border-radius:6px; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:13px; font-weight:600; object-fit:contain; }
.espaco-menu { position:absolute; top:calc(100% - 6px); left:4px; right:4px; z-index:8; background:var(--cartao); border-radius:8px; padding:6px; box-shadow:0 8px 28px rgba(0,0,0,.18); display:flex; flex-direction:column; gap:2px; }
.espaco-menu a small { color:var(--suave); font-size:12px; }
.espaco-menu hr { border:0; border-top:1px solid var(--linha); margin:4px 0; width:100%; }
aside .espaco-menu a { min-height:36px; }

/* seleção, alça de arrastar, subtarefas e balão de comentários */
.c-sel { width:46px; padding:0 4px; text-align:center; white-space:nowrap; }
.c-sel input { margin:0; cursor:pointer; vertical-align:middle; }
.alca { display:inline-block; width:12px; margin-right:2px; color:var(--suave); cursor:grab; letter-spacing:-3px; font-size:12px; opacity:0; user-select:none; vertical-align:middle; }
tr:hover .alca { opacity:1; }
tr.arrastando { opacity:.4; }
tr.alvo td { box-shadow:inset 0 2px 0 var(--azul); }
tr.marcada td { background:var(--marcada); }
.abre { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; margin-right:6px; border-radius:4px; color:var(--suave); font-size:16px; transition:transform .15s; vertical-align:middle; }
.abre:hover { background:var(--linha); color:var(--texto); }
.abre.on { transform:rotate(90deg); }
.abre.vazio { visibility:hidden; }
tr.sub-linha td { background:var(--leve); }
tr.sub-linha td.tit, tr.sub-linha td[data-nova-sub] { padding-left:40px; }
tr.sub-linha td[data-nova-sub] { color:var(--suave); cursor:pointer; }
th.c-com, td.c-com { width:52px; text-align:center; padding:0; cursor:pointer; position:relative; }
td.c-com svg { width:20px; height:20px; fill:none; stroke:var(--suave); stroke-width:1.5; stroke-linejoin:round; vertical-align:middle; }
td.c-com:hover svg { stroke:var(--azul); }
td.c-com b { position:absolute; top:6px; left:calc(50% + 4px); min-width:15px; height:15px; padding:0 3px; border-radius:8px; background:var(--azul); color:#fff; font-size:10px; font-weight:600; line-height:15px; }
td.c-com i { position:absolute; top:8px; left:calc(50% + 5px); font-style:normal; font-size:11px; color:var(--suave); opacity:0; }
td.c-com:hover i { opacity:1; }
.barra-sel { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:9; display:flex; align-items:center; gap:10px; background:var(--cartao); padding:10px 14px; border-radius:10px; box-shadow:0 8px 32px rgba(0,0,0,.2); }
.barra-sel b { background:var(--azul); color:#fff; border-radius:6px; padding:4px 10px; font-size:15px; }
.barra-sel .perigo-sel { color:var(--vermelho); }

/* atualizações e respostas */
.g-com { margin:0 0 14px; }
.com-bloco { border:1px solid var(--linha); border-radius:8px; margin-bottom:12px; overflow:hidden; }
.com-bloco > .com { border:0; margin:0; padding:12px 14px; }
.com-acoes { display:flex; gap:18px; margin-top:8px; padding-top:6px; border-top:1px solid var(--linha); }
.respostas { background:var(--fundo); padding:6px 14px 0 34px; }
.respostas .com { background:var(--cartao); }
.g-resp { display:flex; align-items:flex-start; gap:8px; padding:10px 14px; background:var(--fundo); }
.g-resp .bol { flex:none; margin:4px 0 0; border:0; }
.g-resp textarea { flex:1; resize:vertical; }

/* fotos de perfil */
img.bol.foto { object-fit:cover; padding:0; background:var(--linha); }
.trocar-foto { cursor:pointer; display:inline-flex; position:relative; }
.trocar-foto:hover::after { content:'📷'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:11px; background:rgba(0,0,0,.45); border-radius:50%; }
.c-foto { width:60px; text-align:center; }
@media (max-width: 760px) {
  table tr { grid-template-columns:auto auto 1fr 1fr; }
  td.c-sel { grid-row:1; } td.tit { grid-column:2 / -1; }
  .barra-sel { left:12px; right:12px; transform:none; flex-wrap:wrap; }
}
th.c-sel { text-align:center; }
th.c-sel + th { text-align:left; }
img.bol.foto { display:inline-block; vertical-align:middle; }

/* tabela no tom do Monday escuro, prioridade e botão de tema */
table { background:var(--celula); }
th, td { border-color:var(--linha); }
tbody tr:hover td { background:var(--hover); }
.grupo h3 { font-size:18px; }
.c-pr { width:130px; }
td.c-pr { padding:0; text-align:center; }
td.c-pr select { width:100%; height:38px; border:0; border-radius:0; background:transparent; color:#fff; text-align:center; text-align-last:center; cursor:pointer; appearance:none; font-weight:500; }
.pr-critica { background:var(--pr-critica) !important; } .pr-alta { background:var(--pr-alta) !important; }
.pr-media { background:var(--pr-media) !important; } .pr-baixa { background:var(--pr-baixa) !important; }
.pr-sem { background:var(--pr-sem) !important; }
.tema { padding:0; min-height:0; color:var(--suave); font-size:15px; }
.mencao, a.mini, .curtir:hover, .curtir.on { color:var(--pr-baixa); }
/* logo e selo da Alto são pretos: no escuro ficam brancos */
:root:not([data-tema="claro"]) :root:not([data-tema="claro"]) img.selo, :root:not([data-tema="claro"]) .espaco .logo { filter:invert(1); }

/* colunas do Monday: a tabela cresce para o lado e rola */
.grupo:has(table.larga) { overflow-x:auto; }
table.larga { table-layout:auto; width:max-content; min-width:100%; }
table.larga th:nth-child(2), table.larga td.tit { min-width:300px; max-width:420px; }
th.c-x { min-width:150px; max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
td.c-x { min-width:150px; max-width:220px; padding:0 6px; }
td.c-x .inp-x { width:100%; border:0; background:transparent; color:var(--texto); text-align:center; padding:0; font:inherit; text-overflow:ellipsis; }
td.c-x .inp-x:focus { outline:1px solid var(--azul); background:var(--campo); text-align:left; }
td.c-x .lk-x { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--azul); text-align:center; }

/* arrastar grupo inteiro e linha por qualquer ponto */
.alca { opacity:.35; }
.alca-g { color:var(--suave); cursor:grab; letter-spacing:-3px; font-size:13px; margin-right:4px; opacity:.35; user-select:none; }
.grupo h3:hover .alca-g { opacity:1; }
.grupo.arrastando { opacity:.4; }
.grupo.alvo-g { box-shadow:0 -3px 0 var(--azul); }

/* ---------- Sunday: visual mais leve e arredondado ---------- */
:root { --raio:12px; --raio-p:8px; --linha-suave:color-mix(in srgb, var(--linha) 55%, transparent); }
input, select, textarea, .bt { border-radius:var(--raio-p); }
.bt { padding:7px 14px; transition:background .15s; }
.bt.pri, .bt.azul { box-shadow:0 2px 8px color-mix(in srgb, var(--azul) 35%, transparent); }
aside { border-right:0; padding:14px 12px; }
aside a { border-radius:var(--raio-p); }
.busca-q, .espaco-bt, .espaco-mais { border-radius:var(--raio-p); }
.topo-logo .marca { font-size:20px; font-weight:700; letter-spacing:-.3px; color:var(--texto); padding-bottom:0; }
.login .slogan { margin:-6px 0 14px; color:var(--suave); text-align:center; }
.login form { border-radius:18px; }

/* tabela: cartão arredondado, só linhas horizontais suaves */
table { border-collapse:separate; border-spacing:0; border-radius:var(--raio); border-left:4px solid var(--cor, var(--azul)); overflow:hidden; box-shadow:0 1px 3px rgba(0,0,0,.12); }
.grupo:has(table.larga) { border-radius:var(--raio); }
th { border:0; border-bottom:1px solid var(--linha-suave); font-size:12px; letter-spacing:.2px; }
td { border:0; border-bottom:1px solid var(--linha-suave); height:42px; }
tbody tr:last-child td { border-bottom:0; }
.grupo h3 { font-size:16px; }
.grupo h3 small { font-weight:400; }

/* status e prioridade em pílula */
td.c-st, td.c-pr { padding:5px 8px; }
td.c-st select, td.c-pr select { height:30px; border-radius:999px; font-size:13px; transition:filter .15s; }
td.c-st select:hover, td.c-pr select:hover { filter:brightness(1.08); }
td.c-st.bg-concluido, td.c-st.bg-andamento, td.c-st.bg-parado, td.c-st.bg-cancelado, td.c-st.bg-a_fazer { background:transparent !important; }

/* coluna nova (+) e cabeçalho clicável */
th.c-mais, td.c-mais { width:44px; min-width:44px; text-align:center; }
th.c-mais { cursor:pointer; font-size:18px; color:var(--suave); }
th.c-mais:hover { color:var(--azul); }
th[data-col] { cursor:pointer; }
th[data-col]:hover { color:var(--texto); }
td.tem-link { position:relative; }
td.tem-link .ed-x { position:absolute; right:4px; top:50%; transform:translateY(-50%); opacity:0; cursor:pointer; }
td.tem-link:hover .ed-x { opacity:.7; }
.ed-x svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.5; }
.pop { border-radius:var(--raio); padding:10px; }
.pop-tit { font-size:13px; padding:2px 4px 6px; }
.pop-nome { margin-bottom:8px; }
.pop-tipos { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.pop a { display:flex; align-items:center; gap:8px; padding:7px 8px; border-radius:var(--raio-p); cursor:pointer; }
.pop a:hover { background:var(--hover); }
.pop a.perigo { color:var(--vermelho); }
.pop a svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.5; }

/* gaveta, cartões do kanban, barra de seleção */
.gaveta { border-radius:18px 0 0 18px; }
.cartao, .kanban .col { border-radius:var(--raio); }
.barra-sel { border-radius:999px; }
.bol { border-width:2px; }

/* data de criação e origem */
.c-cri { width:96px; text-align:center; font-size:12px; color:var(--suave); white-space:nowrap; }
.cri-nova { color:var(--feito); font-weight:600; }
.cri-mon { opacity:.7; }
.cri-api { font-size:10px; padding:1px 5px; border-radius:999px; background:var(--sel); color:var(--texto); }
.origem { font-size:12px; color:var(--suave); margin:10px 0 0; }
.quadros [data-q].arrastando { opacity:.4; }
.quadros .alvo-q { box-shadow:inset 0 2px 0 var(--azul); }
.quadros .area.alvo-q { background:var(--sel); box-shadow:none; }

/* histórico: desfazer e restaurar */
.bt.perigo-topo { color:var(--vermelho); }
.notif.hist { cursor:default; align-items:center; }
.notif.hist .n-corpo { flex:1; min-width:0; }
.notif.hist .bt { flex-shrink:0; }
.aviso.clicavel { pointer-events:auto; display:flex; align-items:center; gap:12px; }
.aviso.clicavel .bt { background:rgba(255,255,255,.15); color:#fff; border-color:rgba(255,255,255,.3); }
#h-quadro { max-width:260px; }

/* ordenar por coluna */
th.ord { cursor:pointer; user-select:none; }
th.ord:hover { color:var(--texto, inherit); }
.seta-ord { margin-left:4px; font-size:9px; opacity:.8; }

/* janela no lugar do prompt() */
.modal-fundo { position:fixed; inset:0; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; z-index:50; padding:16px; }
.modal { background:var(--cartao); color:var(--texto); border:1px solid var(--linha); border-radius:14px; padding:22px; width:min(420px,100%); box-shadow:0 20px 60px rgba(0,0,0,.45); display:flex; flex-direction:column; gap:12px; }
.modal h3 { margin:0; font-size:18px; }
.modal p { margin:0; }
.modal label { display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--suave); }
.modal input { height:40px; padding:0 12px; font-size:15px; border-radius:8px; }
.modal-bts { display:flex; justify-content:flex-end; gap:8px; margin-top:4px; }
/* menu dos três pontinhos e filtros */
.menu-t { background:none; border:0; color:var(--suave); font-size:18px; line-height:1; width:24px; height:28px; cursor:pointer; border-radius:6px; padding:0; }
.menu-t:hover, .menu-t:focus-visible { background:var(--hover); color:var(--texto); }
.pop.menu-op { width:220px; padding:6px; }
.menu-op button { display:block; width:100%; text-align:left; background:none; border:0; padding:8px 10px; color:var(--texto); font-size:14px; cursor:pointer; border-radius:6px; }
.menu-op button:hover { background:var(--hover); }
.menu-op .perigo-t { color:var(--vermelho); }
.filtro-bt.ativo { border-color:var(--azul); }
.filtro-bt b { background:var(--azul); color:#fff; border-radius:999px; padding:0 6px; font-size:11px; margin-left:2px; }
.pop.filtro { width:260px; }
.filtro-lista { display:flex; flex-direction:column; gap:2px; max-height:240px; overflow:auto; }
.filtro-busca { margin-bottom:6px; }