/* GRiT iNFOCENTER: estilo "placar".
   Bricolage Grotesque para todo o texto, incluindo etiquetas, botões e cabeçalhos de tabela
   (pequeno, peso 600, sem maiúsculas). JetBrains Mono só para números: o placar é a peça forte. */
:root {
  --bg: #161616;
  --panel: #1d1c1c;
  --panel-2: #252323;
  --line: #332f2e;
  --line-soft: #292625;
  --text: #fbf6f2;
  --muted: #a8a09a;
  --faint: #928a84;           /* >= 4,5:1 sobre --panel e --panel-2 (texto real) */
  --accent: #ff4438;
  --accent-strong: #d92c20;   /* fundo de botoes/estados com texto branco: 4,8:1 */
  --accent-soft: rgba(255, 68, 56, .13);
  --up: #4fd18b;
  --down: #ff6b61;
  --warn: #ffb547;
  /* status do Open Needs (Enviado, QUALIF, A analisar, Sem perfis, HOLD) */
  --st-e: #4fd18b;
  --st-q: #b794ff;
  --st-a: #6aa9ff;
  --st-n: #ff6b61;
  --st-h: #d9a441;
  --track: #121212;
  --display: "Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --radius: 10px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background:
    radial-gradient(1100px 620px at -8% -12%, rgba(255, 68, 56, .24), rgba(255, 68, 56, 0) 62%),
    radial-gradient(700px 420px at 108% -10%, rgba(255, 68, 56, .07), rgba(255, 68, 56, 0) 60%),
    var(--bg);
  background-attachment: fixed;
  color: var(--text);
  font-family: var(--display);
  font-size: 15px;
  line-height: 1.5;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--text); text-decoration-color: rgba(251, 246, 242, .35); text-underline-offset: 3px; }
a:hover { color: var(--accent); text-decoration-color: currentColor; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--accent); color: #fff; }
.wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* topo */
.top { border-bottom: 1px solid var(--line); background: rgba(22, 22, 22, .78); backdrop-filter: blur(10px); position: sticky; top: 0; z-index: 10; }
.top .wrap { display: flex; align-items: center; gap: 22px; height: 60px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 17px; letter-spacing: -.01em; text-decoration: none; white-space: nowrap; color: var(--text); }
.brand:hover { color: var(--text); }
.brand .logo { display: block; height: 22px; width: auto; }
.brand span { padding-left: 10px; border-left: 1px solid var(--line); line-height: 22px; }
.nav { display: flex; gap: 2px; flex: 1; overflow: visible; }
.nav a { text-decoration: none; color: var(--muted); font-size: 14px; padding: 6px 11px; border-radius: 8px; white-space: nowrap; position: relative; }
.nav a:hover { color: var(--text); background: var(--panel-2); }
.nav a.on { color: var(--text); }
.nav a.on::after { content: ""; position: absolute; left: 11px; right: 11px; bottom: -13px; height: 2px; background: var(--accent); }
.navdrop { position: relative; }
.navdrop summary { list-style: none; cursor: pointer; color: var(--muted); font-size: 14px; padding: 6px 11px; border-radius: 8px; white-space: nowrap; display: inline-flex; align-items: center; gap: 3px; }
.navdrop summary::-webkit-details-marker { display: none; }
.navdrop summary::before, .navdrop summary::marker { content: none; display: none; }
.navdrop summary:hover { color: var(--text); background: var(--panel-2); }
.navdrop[open] summary, .navdrop.on summary { color: var(--text); }
.navdrop.on summary::after { content: ""; position: absolute; left: 11px; right: 11px; bottom: -13px; height: 2px; background: var(--accent); }
.navdrop .chev { font-size: 10px; transition: transform .15s; }
.navdrop[open] .chev { transform: rotate(180deg); }
.navdrop-menu { position: absolute; top: calc(100% + 8px); left: 0; min-width: 160px; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 6px; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); z-index: 20; display: flex; flex-direction: column; gap: 2px; }
.navdrop-menu a { text-decoration: none; color: var(--muted); font-size: 14px; padding: 7px 10px; border-radius: 7px; white-space: nowrap; }
.navdrop-menu a:hover { color: var(--text); background: var(--panel-2); }
.navdrop-menu a.on { color: var(--text); background: var(--accent-soft); }
.me { display: flex; align-items: center; gap: 12px; font-size: 14px; color: var(--muted); white-space: nowrap; }
.me form { margin: 0; }
.me .who { text-decoration: none; }
td.who { white-space: nowrap; }
.seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 999px; background: var(--track); border: 1px solid var(--line); }
.seg button { font: 600 12.5px/1 var(--display); color: var(--muted); background: transparent; border: 0; border-radius: 999px; padding: 7px 12px; cursor: pointer; transition: color .15s, background .2s var(--ease); }
.seg button:hover { color: var(--text); }
.seg button[aria-pressed="true"] { color: #fff; background: var(--accent-strong); cursor: default; }
.seg button svg { display: none; width: 15px; height: 15px; }
.seg button:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.linkbtn { background: none; border: 0; color: var(--muted); font: inherit; cursor: pointer; padding: 0; text-decoration: underline; text-underline-offset: 3px; }
.linkbtn:hover { color: var(--accent); }

main { padding: 40px 0 72px; }

/* movimento: um so momento ao carregar (os numeros do placar contam, ver center.js);
   o resto so mexe em resposta a uma accao. Entre paginas, transicao nativa do browser. */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .16s; }
.top { view-transition-name: top; }
.tabs a.on { view-transition-name: tab-on; }
/* separador ativo e cartoes do Vagas·fit (view-transition-name no template) deslizam do sitio antigo para o novo */
::view-transition-group(*) { animation-duration: .3s; animation-timing-function: var(--ease); }

/* tipografia */
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-weight: 600; font-size: 14px;
}
.eyebrow a { color: inherit; text-decoration: none; }
.eyebrow a:hover { color: var(--text); text-decoration: underline; }
h1 { margin: 10px 0 8px; font-size: clamp(30px, 4.4vw, 50px); font-weight: 800; letter-spacing: -.025em; line-height: 1.02; }
h2 {
  display: flex; align-items: baseline; gap: 10px; margin: 44px 0 14px; padding-top: 14px; border-top: 1px solid var(--line);
  font-size: 19px; font-weight: 700; letter-spacing: -.01em;
}
h2 .faint, h2 .aside { font-size: 13px; font-weight: 400; letter-spacing: 0; }
h2 .aside { margin-left: auto; color: var(--muted); }
h2 .aside a { color: inherit; }
.lead { color: var(--muted); margin: 0 0 28px; max-width: 70ch; font-size: 16px; }
.muted { color: var(--muted); }
.faint { color: var(--faint); }
.small { font-size: 13px; }
.mono { font-family: var(--mono); }

/* paineis e cartoes */
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 22px; }
.grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.card {
  position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 8px; text-decoration: none;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; min-height: 176px;
  transition: border-color .2s, background .2s;
}
.card:hover { border-color: #4a4140; background: #211f1f; color: var(--text); }
.card:hover h3 { color: var(--accent); }
.card .ico { width: 36px; height: 36px; border-radius: 8px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; }
.card h3 { margin: 6px 0 0; font-size: 19px; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; }
.card p { margin: 0; color: var(--muted); font-size: 14px; }
.card .go { margin-top: auto; padding-top: 6px; font-size: 14px; font-weight: 600; color: var(--accent); }
/* modulo principal: mais largo e com mais presenca */
.card.feature { grid-column: span 2; background: linear-gradient(135deg, rgba(255, 68, 56, .16), rgba(255, 68, 56, 0) 55%), var(--panel); }
.card.feature h3 { font-size: 26px; }
.card.feature p { max-width: 46ch; font-size: 15px; }
.card.quiet { background: transparent; border-style: dashed; }

/* placar (inicio) */
.board-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 30px 0 10px; }
.board-head h3 { margin: 0; font-size: 15px; font-weight: 700; }
.board-head .aside { font-size: 13px; color: var(--muted); }
.board-head .aside a { color: inherit; }
.board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); overflow: hidden; }
.tile { padding: 16px 18px 14px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tile + .tile { border-left: 1px solid var(--line); }
.tile .label { font-size: 13px; font-weight: 600; color: var(--muted); }
.tile .big { font-family: var(--mono); font-size: 44px; font-weight: 700; line-height: 1; letter-spacing: -.04em; margin: 6px 0 2px; font-variant-numeric: tabular-nums; }
.tile .big.hl { color: var(--accent); }
.tile .sub { font-size: 13px; color: var(--muted); display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; }
.tile .sub b { color: var(--text); font-family: var(--mono); font-weight: 500; }
.tile .sub > span:first-child { white-space: nowrap; }
.tile .spark { min-width: 0; }
.tile .bar { margin: 8px 0 0; height: 4px; }

/* graficos de tendencia */
.spark { display: block; width: 100%; max-width: 110px; height: 28px; overflow: visible; }
.spark .ln { fill: none; stroke: var(--muted); stroke-width: 1.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
.spark .ar { fill: rgba(255, 68, 56, .12); stroke: none; }
.spark .pt { fill: var(--accent); }

/* links uteis */
.links { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.link { display: flex; gap: 12px; align-items: center; text-decoration: none; border: 1px solid var(--line); border-radius: var(--radius); padding: 11px 14px; transition: border-color .2s, background .2s; }
.link:hover { border-color: #4a4140; background: var(--panel); color: var(--text); }
.link .ico { flex: 0 0 32px; height: 32px; border-radius: 8px; background: var(--panel-2); color: var(--muted); display: grid; place-items: center; transition: color .2s; }
.link:hover .ico { color: var(--accent); }
.link .ico svg { width: 16px; height: 16px; }
.link .txt { display: flex; flex-direction: column; min-width: 0; }
.link .txt b { font-weight: 600; }
.link .txt span { color: var(--muted); font-size: 12.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* formularios */
label { display: block; font-size: 13px; font-weight: 600; color: var(--muted); margin: 0 0 7px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], select, textarea {
  width: 100%; background: #121212; color: var(--text); border: 1px solid var(--line); border-radius: 8px;
  padding: 11px 12px; font: inherit; font-size: 15px; transition: border-color .15s, box-shadow .15s;
}
input:hover, select:hover { border-color: #4a4140; }
input:focus, select:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; box-shadow: none; }
input::placeholder { color: var(--faint); }
.field { margin-bottom: 16px; }
.row { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); align-items: end; }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--display); font-size: 14px; font-weight: 600; letter-spacing: 0;
  border-radius: 8px; cursor: pointer; padding: 10px 18px; border: 1px solid var(--accent-strong); background: var(--accent-strong); color: #fff; text-decoration: none;
  transition: filter .15s, border-color .15s, background .15s;
}
.btn:hover { filter: brightness(1.1); color: #fff; }
.btn:active { transform: translateY(1px); }
.btn.ghost { background: none; color: var(--text); border-color: var(--line); }
.btn.ghost:hover { border-color: var(--text); filter: none; }
.btn.danger { background: none; color: var(--down); border-color: rgba(255, 107, 97, .5); }
.btn.danger:hover { border-color: var(--down); }
.btn.small { padding: 6px 12px; font-size: 13px; }
.check { display: flex; gap: 8px; align-items: center; font-family: var(--display); font-size: 14px; color: var(--text); text-transform: none; letter-spacing: 0; margin: 0; }
input[type=checkbox] { accent-color: var(--accent); width: 16px; height: 16px; }
.actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.inline { display: inline; margin: 0; }

/* separadores (admin) */
.tabs { display: flex; gap: 2px; margin: 12px 0 26px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.tabs a { text-decoration: none; color: var(--muted); padding: 9px 14px; font-size: 14px; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.tabs a:hover { color: var(--text); }
.tabs a.on { color: var(--text); border-bottom-color: var(--accent); }
/* separadores com botoes (static/pace_tabs.js), mesmo aspeto dos de links */
.tabs button { all: unset; cursor: pointer; color: var(--muted); padding: 9px 14px; font-size: 14px; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.tabs button:hover { color: var(--text); }
.tabs button.on { color: var(--text); border-bottom-color: var(--accent); }
.tabs button:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.pace-tabs { margin-top: 34px; }
.pace-tabs > .tabs { margin: 0 0 16px; }
.pace-sub { font-size: 15px; margin: 18px 0 10px; }
.pace-sub:first-child { margin-top: 0; }

.alert { border-radius: 8px; padding: 12px 14px; margin: 0 0 18px; font-size: 14px; border-left-width: 3px !important; }
.alert.err { background: rgba(255, 68, 56, .10); border: 1px solid rgba(255, 68, 56, .5); border-left-color: var(--accent); }
.alert.ok { background: rgba(79, 209, 139, .08); border: 1px solid rgba(79, 209, 139, .4); border-left-color: var(--up); }
.alert.warn { background: rgba(255, 181, 71, .08); border: 1px solid rgba(255, 181, 71, .4); border-left-color: var(--warn); }
.secret { font-family: var(--mono); font-size: 13.5px; background: #111; border: 1px dashed var(--accent); border-radius: 8px; padding: 12px 14px; word-break: break-all; margin: 8px 0; user-select: all; }

/* auth (login, convite) */
.auth { min-height: 100vh; display: grid; grid-template-columns: 1.1fr 1fr; }
.auth-hero {
  position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 40px 48px;
  border-right: 1px solid var(--line);
  background: radial-gradient(900px 600px at 0% 100%, rgba(255, 68, 56, .35), rgba(255, 68, 56, 0) 65%), #141313;
}
.auth-hero .logo-xl { display: block; width: min(78%, 440px); height: auto; }
.auth-hero .word { font-weight: 800; font-size: clamp(56px, 7vw, 104px); line-height: .9; letter-spacing: -.05em; margin: 22px 0 0; }
.auth-hero .tag-line { font-size: 20px; max-width: 26ch; color: var(--muted); margin: 18px 0 0; line-height: 1.35; }
.auth-hero .tag-line strong { color: var(--text); font-weight: 600; }
.auth-hero .meta { font-family: var(--mono); font-size: 12px; letter-spacing: .04em; color: var(--faint); }
.auth .side { display: grid; place-items: center; padding: 32px 20px; }
.auth .box { width: 100%; max-width: 400px; }
.auth .box h1 { font-size: 34px; }
.auth .box .brand { display: none; margin-bottom: 22px; }
.auth .panel { padding: 24px; }
.auth .foot { margin-top: 16px; font-size: 13px; color: var(--muted); display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }

/* tabelas */
.table-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.scroll { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; }
th, td { padding: 11px 12px; text-align: left; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
th { background: var(--panel-2); color: var(--muted); font-size: 13px; font-weight: 600; white-space: nowrap; border-bottom-color: var(--line); }
tbody tr { transition: background .12s; }
tbody tr:hover { background: #262222; }
tbody tr:last-child td { border-bottom: 0; }
td.num, th.num { text-align: right; }
td.num { font-family: var(--mono); font-size: 14px; }
tr.current td { background: var(--accent-soft); font-weight: 700; }

.tag { display: inline-block; font-size: 12px; font-weight: 600; line-height: 1.5; padding: 1px 8px; border-radius: 5px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; vertical-align: 1px; }
.tag.admin { color: var(--accent); border-color: rgba(255, 68, 56, .6); }
.tag.manager { color: var(--warn); border-color: rgba(255, 181, 71, .5); }
.tag.active { color: var(--up); border-color: rgba(79, 209, 139, .45); }
.tag.invited { color: var(--warn); border-color: rgba(255, 181, 71, .45); }
.tag.suspended { color: var(--down); border-color: var(--down); }
.dots { display: flex; gap: 4px; flex-wrap: wrap; }
.dot { font-size: 12px; padding: 2px 8px; border-radius: 5px; background: var(--panel-2); color: var(--muted); white-space: nowrap; }

/* metricas pessoais */
.metrics { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.metric { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; }
.metric .head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.metric .label { font-size: 13px; font-weight: 600; color: var(--muted); }
.metric .spark { max-width: 96px; height: 24px; }
.metric .vals { display: grid; grid-template-columns: 1.3fr 1fr 1fr; margin-top: 10px; align-items: end; }
/* Eu: Hoje · Semana · Sem. passada ("Ontem" saiu a 19/10/2026) */
.metric .vals.v3 .s { white-space: nowrap; }
.metric .vals.v3 .s .d { display: block; margin: 2px 0 0; }  /* o ± sempre na linha de baixo: as colunas ficam iguais */
.metric .vals > div + div { border-left: 1px solid var(--line); padding-left: 12px; }
.metric .n { font-family: var(--mono); font-size: 26px; font-weight: 700; line-height: 1.05; letter-spacing: -.03em; }
.metric .n.hl { color: var(--accent); font-size: 40px; }
.metric .s { font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.d { font-family: var(--mono); font-size: 11px; font-weight: 500; margin-left: 3px; text-transform: none; letter-spacing: 0; }
.d.up { color: var(--up); } .d.down { color: var(--down); } .d.flat { color: var(--faint); }
.bar { height: 6px; border-radius: 999px; background: #121212; overflow: hidden; margin: 14px 0 6px; }
.bar i { display: block; height: 100%; background: var(--accent); border-radius: 999px; transform-origin: left; animation: grow .9s var(--ease) .2s both; }
.bar i.done { background: var(--up); }
@keyframes grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.metric .foot { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; font-size: 13px; color: var(--muted); margin-top: 8px; }
.metric .foot span { white-space: nowrap; }
.metric .foot b { color: var(--text); font-family: var(--mono); font-weight: 500; }
.trend-up { color: var(--up); } .trend-down { color: var(--down); } .trend-flat { color: var(--faint); }

/* clientes */
.client { background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--line); border-radius: var(--radius); padding: 16px 18px; margin-bottom: 8px; }
.client.prio { border-left-color: var(--accent); }
.client h3 { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -.01em; }
.client .meta { color: var(--muted); font-size: 13px; margin: 4px 0 8px; }
.client .notes { color: #d8d0c9; font-size: 14px; white-space: pre-line; }
.search { max-width: 420px; margin-bottom: 8px; }
details summary { list-style: none; }
details summary::-webkit-details-marker { display: none; }
details summary::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 9px 2px 1px; border: solid var(--accent); border-width: 0 2px 2px 0; transform: rotate(-45deg); transition: transform .15s var(--ease); }
details[open] summary::before { transform: rotate(45deg); }

@media (max-width: 900px) {
  .auth { grid-template-columns: 1fr; }
  .auth-hero { display: none; }
  .auth .box .brand { display: inline-flex; }
  .board { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tile:nth-child(3) { border-left: 0; }
  .tile:nth-child(n+3) { border-top: 1px solid var(--line); }
}
@media (max-width: 640px) {
  .wrap { padding: 0 16px; }
  .top .wrap { gap: 12px; }
  .me .who { display: none; }
  .nav a.on::after { bottom: -13px; }
  main { padding-top: 26px; }
  .card.feature { grid-column: auto; }
  .card.feature h3 { font-size: 22px; }
  .tile { padding: 14px; }
  .tile .big { font-size: 34px; }
  .metric .n.hl { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  @view-transition { navigation: none; }
}

/* ranking */
table.rank td.pos { color: var(--muted); width: 44px; }
table.rank tr.current td.pos { color: var(--accent); }
table.rank td.best { color: var(--accent); font-weight: 700; }

/* equipas (admin) */
.team { margin-bottom: 10px; }
.team-head { display: flex; gap: 16px; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; margin-bottom: 12px; }
.team-toggle { background: none; border: 0; padding: 0; margin-top: 14px; font: inherit; font-size: 13px; font-weight: 600; color: var(--muted); cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.team-toggle:hover { color: var(--text); }
.team-toggle .chev { font-size: 10px; transition: transform .15s; }
.team-toggle.open .chev { transform: rotate(180deg); }
.people { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 2px 18px; margin-top: 10px; }
.person { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line-soft); }
.person .check:first-child { flex: 1; min-width: 0; }
.person .dots { flex-wrap: nowrap; }
.person .lead { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.profiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px 18px; }

/* editor de relatorios */
.block { margin-bottom: 10px; }
.block-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.block-head .n { font-family: var(--mono); font-size: 12px; width: 24px; height: 24px; border-radius: 6px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; }
.block-head b { font-size: 16px; }
.block-head .hint { flex: 1; min-width: 200px; }
.block-head .tools { display: flex; gap: 4px; margin-left: auto; }
.icon { font: inherit; width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--line); background: none; color: var(--muted); cursor: pointer; }
.icon:hover:not(:disabled) { color: var(--text); border-color: var(--text); }
.icon:disabled { opacity: .35; cursor: default; }
.block .row .field { margin-bottom: 10px; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { position: relative; display: inline-flex; align-items: center; margin: 0; cursor: pointer; font-family: var(--display); font-size: 13px; text-transform: none; letter-spacing: 0;
  padding: 5px 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); user-select: none; }
.chip input { position: absolute; opacity: 0; pointer-events: none; }
.chip:hover { border-color: #4a4140; color: var(--text); }
.chip.on { border-color: var(--accent); color: var(--text); background: var(--accent-soft); }
.chip:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.sch[hidden] { display: none; }

/* administracao: roda dentada no topo */
.gear { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; color: var(--muted); border: 1px solid transparent; transition: color .15s, background .15s, border-color .15s; }
.gear svg { width: 18px; height: 18px; transition: transform .4s var(--ease); }
.gear:hover { color: var(--text); background: var(--panel-2); }
.gear:hover svg { transform: rotate(60deg); }
.gear.on { color: var(--accent); border-color: rgba(255, 68, 56, .45); background: var(--accent-soft); }

/* pessoas: titulo com accao e edicao em bloco */
.title-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.title-row h1 { margin-bottom: 8px; }
table.bulk td { vertical-align: middle; padding: 8px 10px; }
table.bulk input[type=text] { padding: 7px 9px; font-size: 14px; min-width: 190px; margin-bottom: 3px; }
table.bulk select { padding: 7px 9px; font-size: 14px; min-width: 150px; }
table.bulk td:nth-child(4) select { min-width: 220px; }
table.bulk tr.changed td { background: rgba(255, 181, 71, .06); }
table.bulk tr.changed td:first-child { box-shadow: inset 3px 0 0 var(--warn); }
select.suggested { border-color: rgba(255, 181, 71, .7); color: var(--warn); }
.chips.compact { gap: 4px; flex-wrap: nowrap; }
.chips.compact .chip { padding: 3px 8px; font-size: 12px; white-space: nowrap; }
.savebar { position: sticky; bottom: 0; z-index: 5; display: flex; justify-content: flex-end; align-items: center; gap: 14px; margin-top: 12px;
  padding: 12px 0; background: linear-gradient(to top, var(--bg) 70%, rgba(22, 22, 22, 0)); }

/* clientes */
.tabs .count { font-family: var(--mono); font-size: 11px; color: var(--faint); margin-left: 4px; }
.tabs a.on .count { color: var(--accent); }
.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.toolbar .search { margin: 0; flex: 1 1 280px; max-width: 420px; }
.toolbar select { width: auto; min-width: 180px; }
.client-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.client h3 a { text-decoration: none; }
.client h3 a:hover { text-decoration: underline; }
.client .notes.clamp { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin-top: 6px; }
.client .warn, b.warn { color: var(--warn); font-weight: 600; }
.hist { margin-top: 8px; }
.hist .h { border-left: 2px solid var(--line); padding: 4px 0 4px 12px; margin: 8px 0; }
.hist .notes { font-size: 13px; }
table.clients td { vertical-align: top; }
table.clients a { text-decoration: none; }
table.clients a:hover { text-decoration: underline; }
[data-item][hidden] { display: none !important; }
.btn[hidden] { display: none; }

/* it jobs */
.joblist { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.joblist li { font-size: 13.5px; }
.joblist a { color: var(--text); text-decoration: none; }
.joblist a:hover { text-decoration: underline; }
.joblist .when { color: var(--faint); font-size: 12px; }
.toggle { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); cursor: pointer; user-select: none; }
.company-toggle { background: none; border: 0; padding: 0; font: inherit; font-size: 18px; font-weight: 700; letter-spacing: -.01em; color: var(--text); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.company-toggle:hover { color: var(--accent); }
.company-toggle .chev { font-size: 11px; color: var(--muted); transition: transform .15s; }
.company-toggle.open .chev { transform: rotate(180deg); }
.joblist[hidden] { display: none; }
.company-card .client-head { cursor: pointer; }
.company-card { padding: 10px 16px; }
.company-card:hover { border-color: var(--accent); }
.company-card .company-toggle { font-size: 16px; }
.company-card .njobs { font-weight: 700; color: var(--text); font-size: 14px; }
.toggle input { margin: 0; }

/* Sugestoes */
.sug-new summary { cursor: pointer; }
.sug-grid { grid-template-columns: 3fr minmax(170px, 1fr); }
.sug-row { display: flex; gap: 14px; align-items: flex-start; }
.sug-main { flex: 1; min-width: 0; }
.sug .meta, .sug-head .meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.sug h3 a { text-decoration: none; }
.client.sug.st-nova { border-left-color: var(--warn); }
.client.sug.st-desenvolvimento { border-left-color: var(--accent); }
.client.sug.st-concluida { border-left-color: var(--up); }
.client.sug.st-recusada { opacity: .7; }
.vote-form { margin: 0; }
.vote { display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 46px; padding: 6px 8px; cursor: pointer;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px; color: var(--muted); font-family: var(--mono); }
.vote .up { font-size: 11px; }
.vote .n { font-size: 15px; font-weight: 600; color: var(--text); }
.vote:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.vote.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.vote:disabled { cursor: default; opacity: .6; }
.sug-head h1 { margin-top: 0; font-size: clamp(26px, 3.4vw, 40px); }
.sug-head { margin: 10px 0 18px; }
.sug-body { white-space: pre-line; margin-bottom: 10px; }
.sug-edit { margin-bottom: 8px; }
.sug-edit summary { cursor: pointer; }
.thread { display: flex; flex-direction: column; gap: 8px; }
.thread .msg { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 16px; }
.thread .msg.admin { border-left: 3px solid var(--accent); }
.thread .msg .who { display: flex; gap: 6px; align-items: baseline; flex-wrap: wrap; margin-bottom: 4px; }
.thread .msg .del { margin-left: auto; }
.thread .notes { white-space: pre-line; color: #d8d0c9; font-size: 14px; }
.thread .ev { padding: 6px 4px 6px 16px; border-left: 2px dashed var(--line); }
.thread .ev .notes { margin-top: 4px; }
@media (max-width: 640px) { .sug-grid { grid-template-columns: 1fr; } }
.seg-drawer { display: none; }
@media (max-width: 640px) {
  .me .seg { display: none; }
  .seg-drawer { display: flex; align-self: flex-start; margin: 0 0 12px; }
  .seg-drawer button { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; padding: 10px 16px; }
  .seg-drawer button svg { display: block; }
}

/* ---------- mobile ----------
   Menu em gaveta, campos a 16px (sem zoom no iOS), alvos de toque >= 44px,
   efeitos pesados desligados e tabelas .stack em cartoes. */
.burger { display: none; }
.desktop-hint { display: none; }
@media (max-width: 960px) {
  .top { background: rgba(22, 22, 22, .97); backdrop-filter: none; padding-top: env(safe-area-inset-top); }
  .top .wrap { gap: 10px; height: 56px; }
  .me .who { display: none; }
  .me { gap: 4px; }
  .seg button { padding: 7px 9px; font-size: 12px; }
  .me .linkbtn { padding: 10px 6px; }
  .gear { width: 44px; height: 44px; }

  .burger { display: grid; place-items: center; width: 44px; height: 44px; margin-left: -10px; background: none; border: 0; cursor: pointer; flex: none; }
  .burger span, .burger span::before, .burger span::after { display: block; width: 20px; height: 2px; background: var(--text); border-radius: 2px; transition: transform .2s var(--ease), background .2s; }
  .burger span { position: relative; }
  .burger span::before, .burger span::after { content: ""; position: absolute; left: 0; }
  .burger span::before { top: -6px; }
  .burger span::after { top: 6px; }
  .nav-open .burger span { background: transparent; }
  .nav-open .burger span::before { transform: translateY(6px) rotate(45deg); }
  .nav-open .burger span::after { transform: translateY(-6px) rotate(-45deg); }
  .brand { margin-right: auto; }

  .nav { display: none; position: fixed; left: 0; right: 0; bottom: 0; top: calc(56px + env(safe-area-inset-top)); z-index: 30;
    flex-direction: column; gap: 2px; overflow-y: auto; overscroll-behavior: contain; background: var(--bg);
    padding: 12px max(16px, env(safe-area-inset-left)) calc(24px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); }
  .nav-open .nav { display: flex; }
  .nav-open { overflow: hidden; }
  .nav a, .navdrop-menu a { font-size: 17px; padding: 12px 12px; border-radius: 10px; color: var(--text); }
  .nav a.on, .navdrop-menu a.on { background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }
  .nav a.on::after, .navdrop.on summary::after { display: none; }
  .navdrop { margin-top: 10px; }
  .navdrop summary { pointer-events: none; font-size: 13px; font-weight: 600; color: var(--faint); padding: 6px 12px; }
  .navdrop summary .chev { display: none; }
  .navdrop-menu { position: static; min-width: 0; padding: 0; background: none; border: 0; box-shadow: none; }

  .talent-search { top: calc(56px + env(safe-area-inset-top)); }
}
@media (max-width: 760px) {
  .wrap { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
  body { background-attachment: scroll; }
  main { padding: 24px 0 calc(56px + env(safe-area-inset-bottom)); }
  h2 { margin-top: 32px; }
  .lead { font-size: 15px; }

  input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], select, textarea,
  table.bulk input[type=text], table.bulk select { font-size: 16px; }
  .btn { min-height: 44px; }
  .btn.small { min-height: 38px; }
  .icon { width: 40px; height: 40px; }
  input[type=checkbox] { width: 20px; height: 20px; }
  .chip { padding: 8px 13px; }
  .tabs a { padding: 12px 14px; }
  .toolbar select { flex: 1 1 160px; min-width: 0; }
  .people { grid-template-columns: 1fr; }
  .person .dots { flex-wrap: wrap; }
  .savebar { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
  .desktop-hint { display: block; }
}
@media (max-width: 760px) {
  th, td { padding: 10px 9px; }
  table.stack thead { display: none; }
  table.stack, table.stack tbody, table.stack tr, table.stack td { display: block; width: 100%; }
  table.stack tr { padding: 12px 14px; border-bottom: 1px solid var(--line-soft); }
  table.stack tbody tr:last-child { border-bottom: 0; }
  table.stack td { border: 0; padding: 3px 0; text-align: left; }
  table.stack td[data-label] { position: relative; padding-left: calc(38% + 10px); min-height: 26px; }
  table.stack td[data-label]::before { content: attr(data-label); position: absolute; left: 0; top: 6px; width: 38%; font-size: 12.5px; font-weight: 600; line-height: 1.3; color: var(--muted); }
  table.stack td:first-child, table.stack td[data-label]:first-child { display: block; padding-left: 0; font-size: 16px; padding-bottom: 6px; }
  table.stack td:first-child::before { display: none; }
  table.stack td:empty { display: none; }
  table.stack td.num { font-family: var(--display); font-size: 14px; }
  .table-card table:not(.stack):not(.bulk) td { white-space: nowrap; }
}

/* clientes: valor, ficha */
.tier { display: inline-block; font-size: 12px; font-weight: 600; line-height: 1.5; padding: 1px 8px; border-radius: 5px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; vertical-align: 1px; }
.tier-alto { color: var(--accent); border-color: rgba(255, 68, 56, .6); }
.tier-medio { color: var(--warn); border-color: rgba(255, 181, 71, .5); }
.client h3 .tier { margin-left: 6px; }
.client .next-step { color: var(--muted); font-style: italic; margin: 2px 0 6px; }
.cl-meta { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 4px 0 18px; }
.cl-kpis { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); margin-bottom: 12px; }
.cl-kpis .panel { padding: 14px 16px; }
.cl-kpis .v, .cl-next .v { font-size: 26px; font-weight: 700; letter-spacing: -.02em; margin-top: 2px; }
.cl-kpis .v.small-v { font-size: 18px; padding: 5px 0 3px; }
.cl-kpis .v .faint { font-size: 14px; font-weight: 400; }
.k { font-size: 12.5px; font-weight: 600; color: var(--faint); }
.cl-next { margin-bottom: 12px; }
.cl-next p { margin: 6px 0 0; }
.cl-actions { margin-bottom: 8px; }
.cl-actions summary { cursor: pointer; }
.cl-action-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-top: 14px; }
.cl-action-grid form { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.cl-action-grid p { margin: 0; }
.cl-action-grid .row { display: flex; gap: 6px; flex-wrap: wrap; width: 100%; }
.cl-action-grid input[type=text] { width: 100%; }
.cl-action-grid input[type=date] { width: auto; color-scheme: dark; }
.cl-cols { display: grid; gap: 28px; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.cl-person { border-left: 2px solid var(--line); padding: 4px 0 4px 12px; margin: 8px 0; }
@media (max-width: 800px) { .cl-cols { grid-template-columns: 1fr; } }
.more-row[hidden] { display: none !important; }

/* Talento: pesquisa de candidatos */
.talent-search { position: sticky; top: 61px; z-index: 6; margin: 4px 0 6px; padding: 10px 0 8px; background: linear-gradient(var(--bg) 85%, rgba(22, 22, 22, 0)); }
.tq { position: relative; }
.tq svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.tq input[type=search] { width: 100%; background: #121212; color: var(--text); border: 1px solid var(--line); border-radius: 12px;
  padding: 14px 14px 14px 44px; font: inherit; font-size: 17px; transition: border-color .15s, box-shadow .15s; -webkit-appearance: none; appearance: none; }
.tq input[type=search]:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.tq input[type=search]:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; box-shadow: none; }
.tq input[type=search]::placeholder { color: var(--faint); }
.tq.busy svg { color: var(--accent); animation: tpulse .8s ease-in-out infinite alternate; }
@keyframes tpulse { to { opacity: .35; } }
/* resultados antigos esbatem enquanto chegam os novos (com atraso, para respostas rapidas nao piscarem) */
#tres { transition: opacity .2s; }
#tres[aria-busy=true] { opacity: .45; transition-delay: .25s; }
.tfilters { margin-top: 8px; }
.tfilters summary { cursor: pointer; font-size: 14px; font-weight: 600; color: var(--muted); padding: 6px 0; }
.tfilters summary .count { background: var(--accent-strong); color: #fff; border-radius: 999px; padding: 0 7px; margin-left: 4px; }
.tgroups { display: grid; gap: 12px 22px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); padding: 8px 0 4px; }
.tgroups fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.tgroups legend { font-size: 13px; font-weight: 600; color: var(--faint); margin-bottom: 6px; padding: 0; }
.thint { margin: 0 0 14px; }
.thint code { font-family: var(--mono); font-size: 12px; background: var(--panel-2); padding: 1px 5px; border-radius: 4px; color: var(--text); }
.tsummary { margin: 0 0 10px; }
.tsummary b { color: var(--text); font-family: var(--mono); }
.tlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
.tcard { display: flex; flex-direction: column; gap: 6px; height: 100%; text-decoration: none; color: var(--text); background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; transition: border-color .15s, background .15s; }
.tcard:hover { border-color: #4a4140; background: #211f1f; color: var(--text); }
.tcard:active { background: #262222; }
.th { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.tn { font-size: 16.5px; font-weight: 700; letter-spacing: -.01em; line-height: 1.25; }
.tago { flex: none; font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.tago.fresh { color: var(--up); }
.tago.old { color: var(--faint); }
.tm { display: flex; flex-wrap: wrap; gap: 2px 0; color: var(--muted); font-size: 13.5px; }
.tm span + span::before { content: "·"; margin: 0 7px; color: var(--faint); }
.tm-lg { font-size: 15px; margin: -2px 0 16px; }
.tstack { display: flex; flex-wrap: wrap; gap: 4px; }
.tstack .dot { font-size: 12px; }
.tstack.big .dot { font-size: 13.5px; padding: 4px 10px; }
.dot.on { background: var(--accent-soft); color: var(--text); }
.tf { display: flex; flex-wrap: wrap; gap: 4px 14px; color: #d8d0c9; margin-top: auto; padding-top: 2px; }
.tf i, .tfacts .k { font-style: normal; font-size: 12.5px; font-weight: 600; color: var(--faint); margin-right: 4px; }
.tmore { justify-content: center; margin: 16px 0 0; }
.tcontact { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.tcontact .btn { font-size: 14px; }
.talent-search:has(details[open]) { position: static; }
.tfacts { display: grid; gap: 1px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.tfacts > div { background: var(--panel); padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tfacts > div.wide { grid-column: 1 / -1; }
.tfacts b { font-weight: 600; overflow-wrap: anywhere; }
.tskills { list-style: none; margin: 12px 0; padding: 0; display: grid; gap: 4px 18px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.tskills li { padding: 5px 0 5px 10px; border-left: 2px solid var(--line); display: flex; flex-direction: column; }
.tskills li.conf-high { border-left-color: var(--accent); }
.tskills li.conf-medium { border-left-color: rgba(255, 68, 56, .45); }
.tcareer { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.tcareer li { border-left: 2px solid var(--line); padding: 2px 0 2px 12px; }
.thread details.msg summary { cursor: pointer; }
@media (max-width: 760px) {
  .talent-search { top: calc(56px + env(safe-area-inset-top)); margin-left: -16px; margin-right: -16px; padding-left: 16px; padding-right: 16px; }
  .tlist { grid-template-columns: 1fr; }
  .tgroups { grid-template-columns: 1fr; }
  .tcontact .btn { flex: 1 1 100%; }
  .tfacts { grid-template-columns: 1fr 1fr; }
  .thint { display: none; }
}

/* Talento > Mapa: heat map perfil x regiao e mapas com bolhas */
.mapf { align-items: center; margin: 0 0 6px; }
.mapf .k, .mapfam .k { font-size: 12.5px; font-weight: 600; color: var(--faint); margin-right: 4px; }
.mapf .chip { text-decoration: none; }
.heat-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); -webkit-overflow-scrolling: touch; }
table.heat { border-collapse: separate; border-spacing: 2px; width: 100%; font-variant-numeric: tabular-nums; }
table.heat th, table.heat td { border: 0; padding: 0; background: none; vertical-align: middle; }
table.heat thead th { font-size: 12px; font-weight: 600; color: var(--muted); padding: 10px 6px 6px; white-space: nowrap; text-align: center; }
table.heat thead th:first-child { text-align: left; }
table.heat thead th.soft { color: var(--faint); }
table.heat tbody th, table.heat tfoot th { position: sticky; left: 0; z-index: 1; background: var(--panel); text-align: left; font-family: var(--display); text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 13.5px; color: var(--text); padding: 0 12px 0 10px; white-space: nowrap; }
table.heat tfoot th { color: var(--muted); font-weight: 400; }
/* colunas/linha sem sitio ou sem stack: mesma escala, mais apagada */
table.heat td.soft { filter: saturate(.25) brightness(.85); }
table.heat tbody th a { text-decoration: none; }
table.heat td { min-width: 54px; height: 34px; border-radius: 5px; text-align: center; font-family: var(--mono); font-size: 12.5px; }
table.heat td a { display: flex; align-items: center; justify-content: center; height: 100%; min-height: 34px; color: inherit; text-decoration: none; border-radius: 5px; }
table.heat td a:hover, table.heat td a:focus-visible { outline: 2px solid var(--text); outline-offset: -2px; }
table.heat td.tot, table.heat th.tot { color: var(--muted); }
table.heat tfoot th, table.heat tfoot td { color: var(--muted); height: 30px; }
table.heat td.h0, .heat-legend i.h0 { background: transparent; }
table.heat td.h1, .heat-legend i.h1 { background: #38211f; color: var(--text); }
table.heat td.h2, .heat-legend i.h2 { background: #532623; color: var(--text); }
table.heat td.h3, .heat-legend i.h3 { background: #732b27; color: var(--text); }
table.heat td.h4, .heat-legend i.h4 { background: #97322b; color: var(--text); }
table.heat td.h5, .heat-legend i.h5 { background: #c03930; color: #fff; }
table.heat td.h6, .heat-legend i.h6 { background: #ed4136; color: #161616; font-weight: 700; }
.heat-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; margin: 10px 0 0; }
.heat-legend i { display: inline-block; width: 22px; height: 12px; border-radius: 3px; }
.heat-legend span:first-child { margin-right: 4px; }
.heat-legend span:nth-last-child(2) { margin: 0 8px 0 4px; }
.mapfam { margin: 0 0 12px; max-width: 320px; }
.where { display: grid; grid-template-columns: minmax(220px, 300px) 1fr; gap: 16px 28px; align-items: start;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; }
.ptmap { margin: 0; position: sticky; top: 76px; }
.ptmap svg { display: block; width: 100%; height: auto; max-height: 460px; }
.ptmap .land { fill: #2b2827; stroke: #4a4442; stroke-width: .8; stroke-linejoin: round; }
.ptmap .ctx { fill: #1f1d1d; stroke: #2e2a29; stroke-width: .6; }
.ptmap .bub { fill: rgba(255, 68, 56, .5); stroke: var(--panel); stroke-width: 1.5; transition: fill .12s, stroke .12s; }
.ptmap a:hover .bub, .ptmap .bub.hl { fill: var(--accent); stroke: var(--text); }
.ptmap .blab { font-family: var(--display); font-weight: 600; font-size: 11px; fill: var(--text); paint-order: stroke; stroke: #2b2827; stroke-width: 3px; stroke-linejoin: round; pointer-events: none; }
.rank-h { display: flex; align-items: baseline; gap: 8px; margin: 0 0 8px; }
.rank-h.br { margin-top: 18px; }
.bars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.bars a { display: grid; grid-template-columns: minmax(110px, 38%) 1fr 56px; align-items: center; gap: 10px; padding: 5px 6px; border-radius: 6px; text-decoration: none; color: var(--text); }
.bars a:hover, .bars a.hl { background: var(--panel-2); }
.bars .nm { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bars .bar { height: 10px; background: #121212; border-radius: 3px; overflow: hidden; }
.bars .bar i { display: block; height: 100%; min-width: 2px; background: var(--accent); border-radius: 0 3px 3px 0; opacity: .8; }
.bars a:hover .bar i, .bars a.hl .bar i { opacity: 1; }
.bars b { font-family: var(--mono); font-weight: 500; font-size: 13px; text-align: right; }
.more-cities { margin-top: 4px; }
.more-cities summary { cursor: pointer; font-size: 13px; color: var(--muted); padding: 6px; }
.brcities .chip { text-decoration: none; gap: 6px; }
.brcities .chip b { font-family: var(--mono); font-weight: 500; font-size: 12px; color: var(--text); }
a.dot { text-decoration: none; }
a.dot:hover { color: var(--text); }
.tcity { margin-top: 8px; }
.tcity .chip { text-decoration: none; }
/* LEGADO: template talent_map.html do processo anterior; apagar depois do restart */
.maps { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; align-items: start; }
.map { margin: 0; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 14px; }
.map figcaption { font-weight: 600; margin-bottom: 6px; }
.map svg { display: block; width: 100%; height: auto; max-height: 560px; }
.map .land { fill: #2b2827; stroke: #4a4442; stroke-width: .8; stroke-linejoin: round; }
.map .ctx { fill: #211f1f; stroke: #332f2e; stroke-width: .6; }
.map .bub { fill: rgba(255, 68, 56, .55); stroke: var(--panel); stroke-width: 2; transition: fill .15s; }
.map a:hover .bub, .map a:focus-visible .bub { fill: var(--accent); }
.map .blab { font-family: var(--mono); font-size: 9.5px; fill: var(--text); paint-order: stroke; stroke: var(--panel); stroke-width: 3px; stroke-linejoin: round; pointer-events: none; }
.mapother { margin-top: 10px; }
.mapother b { color: var(--text); font-family: var(--mono); font-weight: 500; margin-left: 4px; }
@media (max-width: 760px) {
  .maps { grid-template-columns: 1fr; }
  .where { grid-template-columns: 1fr; padding: 14px; }
  .ptmap { position: static; max-width: 260px; margin: 0 auto; }
  .bars a { grid-template-columns: minmax(96px, 40%) 1fr 48px; padding: 7px 4px; }
  table.heat td { min-width: 46px; font-size: 12px; }
  table.heat tbody th, table.heat tfoot th { font-size: 12.5px; padding-right: 8px; }
}

/* Talento > Vagas (fit check) */
.vgm { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 10px; }
.vgm select { width: auto; min-width: 0; padding: 5px 10px; font-size: 13px; }
.vlist .tcard { gap: 4px; }
.fitmeta { margin: 0 0 16px; }
@media (max-width: 640px) { .fitmeta { margin-top: 10px; } }
.fitfil { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 28px; padding: 14px 16px; margin: 0 0 12px; }
.fitfil fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.fitfil legend { font-size: 13px; font-weight: 600; color: var(--faint); margin-bottom: 7px; padding: 0; }
.fitfil a.chip { text-decoration: none; }
.fitfil .chip small { color: var(--faint); font-size: 11.5px; margin-left: 6px; }
.fitfil .chip.on small { color: var(--muted); }
.fitother { display: contents; }
.fitother select { background: transparent; color: var(--muted); border: 1px dashed var(--line); border-radius: 999px; padding: 4px 10px; font: inherit; font-size: 13px; cursor: pointer; width: auto; }
.fitsal { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.fitmoney { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 999px; background: var(--panel); padding: 0 12px 0 4px; }
.fitmoney:focus-within { border-color: var(--accent); }
.fitmoney input { width: 96px; background: transparent; border: 0; color: var(--text); font: inherit; font-size: 13.5px; padding: 5px 8px; -moz-appearance: textfield; }
.fitmoney input::-webkit-outer-spin-button, .fitmoney input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.fitmoney:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 1px; }
.fitmoney input:focus, .fitmoney input:focus-visible { outline: none; }
.fitmoney span { color: var(--faint); font-size: 12.5px; white-space: nowrap; text-transform: none; letter-spacing: 0; font-family: var(--display); }
.fitsal button.chip { font-family: var(--display); font-size: 13px; background: transparent; color: var(--muted); text-transform: none; letter-spacing: 0; box-shadow: none; }
.fitsal button.chip:hover { color: var(--text); background: transparent; }
.fitmoney { text-transform: none; letter-spacing: 0; margin: 0; }
@media (max-width: 760px) { .fitfil { grid-template-columns: 1fr; } }
.fitmore { margin: 14px 0; text-align: center; }
.fitreq { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 12px; }
.fitreq .k { font-size: 12.5px; font-weight: 600; color: var(--faint); margin-right: 4px; }
.fitreq .dot { color: var(--text); }
.fitreq .dot.nice { color: var(--muted); border: 1px dashed var(--line); background: none; }
.fitsum { margin: 0 0 12px; }
.fitsum b { color: var(--text); font-family: var(--mono); }
.fitcard { cursor: default; }
.fitcard:hover { background: var(--panel); }
.fitcard .tn { color: var(--text); text-decoration: none; }
.fitcard .tn:hover { color: var(--accent); }
.fitcard.recomendar { box-shadow: inset 3px 0 0 var(--up); }
.fitcard.validar { box-shadow: inset 3px 0 0 var(--warn); }
.fitg { flex: none; font-size: 13px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fitg.recomendar { color: var(--up); }
.fitg.validar { color: var(--warn); }
.fitskills { display: flex; flex-wrap: wrap; gap: 4px; }
.fs { font-size: 11.5px; padding: 1px 7px; border-radius: 5px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; }
.fs.confirmado { color: var(--up); border-color: rgba(79, 209, 139, .45); }
.fs.provavel, .fs.por_validar { color: var(--warn); border-color: rgba(255, 181, 71, .4); }
.fs.nao_tem { color: var(--faint); text-decoration: line-through; }
.tag.warn { color: var(--warn); border-color: rgba(255, 181, 71, .5); }
.tf .warnt { color: var(--warn); }
.fitload { position: fixed; inset: 0; background: rgba(22, 22, 22, .72); display: grid; place-items: center; z-index: 50; padding: 16px; }
.fitload[hidden] { display: none; }
.fitload .panel { max-width: 420px; text-align: center; position: relative; overflow: hidden; }
/* barra indeterminada: a avaliacao pode levar ate 30 s */
.fitload .panel::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: 35%; background: var(--accent); animation: fitbar 1.4s var(--ease) infinite; }
@keyframes fitbar { from { transform: translateX(-100%); } to { transform: translateX(300%); } }
.fitprompt { margin: 0 0 18px; }
.fpprev { margin-top: 10px; }
.fpprev summary { cursor: pointer; color: var(--muted); }
.fpprev pre { white-space: pre-wrap; font-family: var(--mono); font-size: 12px; line-height: 1.5; color: #d8d0c9; background: var(--panel-2); padding: 12px; border-radius: 8px; margin: 8px 0 0; max-height: 420px; overflow: auto; }
.fpick { flex: none; display: flex; align-items: center; margin-right: 2px; }
.fpick input { width: 18px; height: 18px; accent-color: var(--accent); margin: 2px 0 0; cursor: pointer; }
.fitcard .th { align-items: flex-start; gap: 8px; }
.fitcard .tn { flex: 1; }

/* "Ver como" (admin a ver o Center como outra pessoa) */
.viewas { background: var(--warn); color: #161616; font-size: 13.5px; }
.viewas .wrap { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 7px; padding-bottom: 7px; flex-wrap: wrap; }
.viewas span { display: inline-flex; align-items: center; gap: 8px; }
.viewas svg { width: 16px; height: 16px; }
.viewas .btn { padding: 6px 12px; font-size: 13px; background: #161616; border-color: #161616; color: var(--warn); }
.viewas form { margin: 0; }

/* Pop-up do candidato (Talento: pesquisa e Vagas·fit). Painel à direita; ecrã inteiro no telemóvel. */
.cdlg { position: fixed; inset: 0 0 0 auto; margin: 0; width: min(760px, 100vw); max-width: none; height: 100dvh; max-height: none;
  padding: 0; border: 0; border-left: 1px solid var(--line); background: var(--bg); color: var(--text); overflow: hidden; }
.cdlg[open] { display: flex; flex-direction: column; animation: cdlgin .22s var(--ease); }
.cdlg::backdrop { background: rgba(0, 0, 0, .55); }
@keyframes cdlgin { from { transform: translateX(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.cdlg-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 22px 12px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap; }
.cdlg-name { margin: 0; padding: 0; border: 0; font-size: 22px; }
.cdlg-actions { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.cdlg-body { flex: 1; overflow-y: auto; padding: 14px 22px 32px; overscroll-behavior: contain; }
.cdlg-msg { padding: 40px 22px; color: var(--muted); }
.cdlg[aria-busy="true"] .cdlg-msg::after { content: ""; display: block; margin-top: 14px; height: 2px; width: 35%; background: var(--accent); animation: fitbar 1.4s var(--ease) infinite; }
.tconsult { margin: 6px 0 10px; }
.tdocs a.dot { text-decoration: none; cursor: pointer; }
.tdocview { margin-top: 12px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--panel); }
.tdocbar { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap; }
.tdocbar b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tdocview iframe { display: block; width: 100%; height: 75vh; border: 0; background: #fff; }
body.cdlg-on { overflow: hidden; }
@media (max-width: 640px) {
  .cdlg { width: 100vw; border-left: 0; }
  .cdlg-head, .cdlg-body { padding-left: 16px; padding-right: 16px; }
}
@media (prefers-reduced-motion: reduce) { .cdlg[open] { animation: none; } }

/* Open Needs */
.nd-warn { color: var(--warn); }
.nd-hint { text-decoration: underline dotted; text-underline-offset: 2px; cursor: help; }
.nd-views { margin: 6px 0 16px; }
/* filtros de escolha multipla (Open Needs): menu com caixas de selecao */
.nd-ms { position: relative; }
.nd-ms summary { cursor: pointer; min-width: 180px; background: #121212; color: var(--muted); border: 1px solid var(--line); border-radius: 8px; padding: 11px 12px; font-size: 15px; white-space: nowrap; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.nd-ms summary::before { content: none; display: none; }
.nd-ms summary::after { content: "▾"; font-size: 11px; color: var(--faint); }
.nd-ms summary:hover { border-color: #4a4140; }
.nd-ms summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.nd-ms.on summary { color: var(--text); border-color: var(--accent); background: var(--accent-soft); }
.nd-ms-menu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 20; min-width: 100%; max-width: 360px; max-height: 340px; overflow-y: auto; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 6px; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); display: flex; flex-direction: column; gap: 1px; }
.nd-ms-menu label { display: flex; align-items: center; gap: 9px; margin: 0; padding: 6px 8px; border-radius: 7px; cursor: pointer; color: var(--text); font-size: 14px; text-transform: none; letter-spacing: 0; white-space: nowrap; }
.nd-ms-menu label:hover { background: var(--panel-2); }
.nd-ms-menu input { flex: none; }
.nd-ms-menu label.nd-ms-sub { padding: 3px 8px 3px 40px; font-size: 12.5px; color: var(--muted); }
.nd-ms-menu label.nd-ms-sub:has(input:checked) { color: var(--text); }
.nd-ms-none { align-self: flex-start; margin: 0 0 4px; padding: 4px 8px; font-size: 12.5px; background: none; color: var(--muted); border: 0; box-shadow: none; text-transform: none; letter-spacing: 0; }
.nd-ms-none:hover { color: var(--text); background: var(--panel-2); }
@media (max-width: 760px) { .nd-ms { flex: 1 1 160px; } .nd-ms summary { min-width: 0; } .nd-ms-menu { max-width: calc(100vw - 32px); } }
.nd-kpis { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); overflow: hidden; margin-bottom: 14px; }
.nd-kpi { font: inherit; color: inherit; text-align: left; background: none; border: 0; border-left: 1px solid var(--line); cursor: pointer; transition: background .15s; }
.nd-kpi:first-child { border-left: 0; }
.nd-kpi:hover { background: var(--panel-2); }
.nd-kpi.on { background: var(--accent-soft); box-shadow: inset 0 -3px 0 var(--accent); }
.nd-kpi .big { font-size: 36px; }
.nd-kpi.s-E .big { color: var(--st-e); } .nd-kpi.s-Q .big { color: var(--st-q); }
.nd-kpi.s-A .big { color: var(--st-a); } .nd-kpi.s-N .big { color: var(--st-n); }
.nd-kpi.stall .big { color: var(--down); }
.nd-panels { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 18px; }
.nd-panels .panel { padding: 16px 16px 12px; min-width: 0; }
.nd-panels h3 { margin: 0 0 10px; font-size: 15px; font-weight: 700; display: flex; justify-content: space-between; gap: 8px; }
.nd-panels h3 span { font-size: 12.5px; font-weight: 500; }
.nd-bars { display: flex; flex-direction: column; gap: 2px; }
.nd-bars button { font: inherit; color: var(--text); background: none; border: 0; cursor: pointer; text-align: left;
  display: grid; grid-template-columns: minmax(90px, 44%) 1fr 34px; align-items: center; gap: 10px; padding: 5px 6px; border-radius: 6px; }
.nd-bars button:hover, .nd-bars button.hl { background: var(--panel-2); }
.nd-bars button.hl { box-shadow: inset 3px 0 0 var(--accent); }
.nd-bars .nm { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nd-bars button.nd-bar-sub { padding-top: 3px; padding-bottom: 3px; }
.nd-bars button.nd-bar-sub .nm { padding-left: 26px; font-size: 12px; color: var(--muted); }
.nd-bars button.nd-bar-sub .nm::before { content: "•"; margin-right: 7px; color: var(--muted); font-size: 14px; }
.nd-bars button.nd-bar-sub.hl { box-shadow: none; }
.nd-bars button.nd-bar-sub.hl .nm::before { color: var(--accent); }
.nd-bars button.nd-bar-sub.hl .nm { color: var(--text); }
.nd-bars button.nd-bar-sub .bar { height: 6px; margin-left: 10px; }
.nd-bars button.nd-bar-sub b { font-size: 11.5px; color: var(--muted); }
.nd-bars .bar { height: 10px; margin: 0; background: var(--track); border-radius: 3px; }
.nd-bars .bar i { border-radius: 0 3px 3px 0; animation: none; opacity: .85; }
.nd-bars b { font-family: var(--mono); font-weight: 500; font-size: 13px; text-align: right; }
.nd-stack { display: flex; height: 14px; border-radius: 4px; overflow: hidden; background: var(--track); margin: 2px 0 10px; }
.nd-bars i.s-E, .nd-stack .s-E { background: var(--st-e); } .nd-bars i.s-Q, .nd-stack .s-Q { background: var(--st-q); }
.nd-bars i.s-A, .nd-stack .s-A { background: var(--st-a); } .nd-bars i.s-N, .nd-stack .s-N { background: var(--st-n); }
.nd-bars i.s-H, .nd-stack .s-H { background: var(--st-h); }
.nd-table th button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; display: inline-flex; gap: 4px; }
.nd-table th.sorted { color: var(--text); }
.nd-table th .arr { color: var(--faint); font-size: 11px; }
.nd-table th.sorted .arr { color: var(--accent); }
.nd-table th, .nd-table td { padding-left: 9px; padding-right: 9px; }
.nd-table td { vertical-align: top; font-size: 14px; }
.nd-profile a { font-weight: 600; text-decoration: none; }
.nd-profile a:hover { text-decoration: underline; color: var(--accent); }
.nd-profile .faint, .nd-sub, .nd-age { display: block; font-size: 12px; }
.nd-age { color: var(--muted); }
.nd-age.old { color: var(--st-n); font-weight: 600; }
.nd-idle { display: block; font-size: 12px; color: var(--muted); margin-top: 4px; }
.nd-idle.over { color: var(--down); font-weight: 600; }
.nd-pill { display: inline-block; font-size: 12px; font-weight: 600; line-height: 1.5; padding: 1px 9px; border-radius: 999px; border: 1px solid currentColor; white-space: nowrap; }
.nd-pill.s-E { color: var(--st-e); } .nd-pill.s-Q { color: var(--st-q); } .nd-pill.s-A { color: var(--st-a); }
.nd-pill.s-N { color: var(--st-n); } .nd-pill.s-H { color: var(--st-h); }
.nd-funnel { display: flex; gap: 3px; margin-top: 5px; }
.nd-funnel span { font-family: var(--mono); font-size: 11px; padding: 0 5px; border-radius: 4px; background: var(--panel-2); color: var(--text); }
.nd-funnel span.z { color: var(--faint); }
tr.nd-hold td { opacity: .55; }
.nd-note { margin-top: 14px; max-width: 110ch; }
@media (max-width: 1000px) {
  .nd-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nd-kpi:nth-child(3n+1) { border-left: 0; }
  .nd-kpi:nth-child(n+4) { border-top: 1px solid var(--line); }
  .nd-panels { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .nd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nd-kpi:nth-child(3n+1) { border-left: 1px solid var(--line); }
  .nd-kpi:nth-child(odd) { border-left: 0; }
  .nd-kpi:nth-child(n+3) { border-top: 1px solid var(--line); }
  .nd-kpi .big { font-size: 30px; }
  .nd-bars button { padding: 8px 4px; }
  /* cartao: o perfil (4.a coluna) passa para o topo */
  table.nd-table tr { display: flex; flex-direction: column; }
  table.nd-table td.nd-profile { order: -1; padding-left: 0; font-size: 16px; padding-bottom: 6px; }
  table.nd-table td.nd-profile::before { display: none; }
  table.nd-table td:first-child { font-size: 14px; padding-left: calc(38% + 10px); padding-bottom: 3px; }
  table.nd-table td:first-child::before { display: block; }
}

/* Open Needs: popup das Ongoing com slots livres */
.nd-ongoing-btn { border-color: var(--warn); color: var(--warn); }
.nd-dialog { background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: var(--radius);
  width: min(680px, calc(100% - 32px)); max-height: calc(100% - 48px); padding: 20px 22px; }
.nd-dialog::backdrop { background: rgba(0, 0, 0, .6); }
.nd-dialog h2 { margin: 0 0 8px; font-size: 20px; }
.nd-ongoing { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.nd-ongoing li { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-2); }
.nd-ongoing-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1 1 280px; }
.nd-ongoing-info a { text-decoration: none; }
.nd-ongoing-info a:hover { color: var(--accent); text-decoration: underline; }
.nd-ongoing-info .nd-funnel { display: inline-flex; margin: 0 0 0 4px; vertical-align: middle; }
.nd-ongoing-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.nd-dialog-foot { display: flex; justify-content: flex-end; margin-top: 14px; }
.nd-refresh { margin: 0 0 8px auto; }
.title-row > a.btn + .nd-refresh { margin-left: 0; }

/* pagina inicial: as needs do gestor e vagas paradas (Open Needs) */
.on-board a.tile { color: inherit; text-decoration: none; transition: background .15s; }
.on-board a.tile:hover { background: var(--panel-2); }
.on-board .s-E .big { color: var(--st-e); } .on-board .s-Q .big { color: var(--st-q); }
.on-board .s-A .big { color: var(--st-a); } .on-board .s-N .big { color: var(--st-n); }
.on-stalled { color: var(--down); font-weight: 600; }
a.on-stalled { text-decoration: none; }
a.on-stalled:hover { text-decoration: underline; }
.stall-note { display: flex; gap: 10px; align-items: baseline; margin: 26px 0 0; padding: 12px 16px; border: 1px solid var(--line); border-left: 3px solid var(--down); border-radius: var(--radius); background: var(--panel); font-size: 14px; }
.stall-note .ico { color: var(--down); }
.stall-note a { color: var(--accent); white-space: nowrap; }

/* Talento > Vagas > quadro da vaga (Suggested / Pre-Screen / Sent) */
.vboard { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: start; }
.bcol { background: var(--panel-2); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; min-width: 0; }
.bcol header { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; margin: 0 0 10px; }
.bcol h2 { font-size: 15px; margin: 0; }
.bcol .bn { font-family: var(--mono); font-size: 12.5px; color: var(--muted); margin-left: 4px; }
.bcol header .small:last-child { flex-basis: 100%; }
.blist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bcard { cursor: default; }
.bcard:hover { background: var(--panel); border-color: var(--line); }
.bcard .th { align-items: flex-start; gap: 8px; }
.bcard .tn { flex: 1; color: var(--text); text-decoration: none; }
.bcard .tn:hover { color: var(--accent); }
.bempty { margin: 6px 2px; }
.bref { font-family: var(--mono); }
@media (max-width: 900px) { .vboard { grid-template-columns: 1fr; } }

/* Open Needs: historico e analises */
button.chip:not(.on) { background: none; }
.nd-pill.o-placed { color: var(--st-e); } .nd-pill.o-closed { color: var(--muted); }
.nd-pill.o-canceled { color: var(--st-n); } .nd-pill.o-open { color: var(--st-a); }
.na-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.na-chart { margin-bottom: 14px; padding: 16px 18px 12px; }
.na-chart h3 { margin: 0 0 10px; font-size: 15px; font-weight: 700; display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.na-chart h3 > span { font-size: 12.5px; font-weight: 500; }
.na-plot { position: relative; }
.na-plot svg { display: block; width: 100%; height: auto; }
.na-grid { stroke: var(--line-soft); stroke-width: 1; }
.na-ax { fill: var(--faint); font-family: var(--mono); font-size: 11px; }
.na-line { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linejoin: round; }
.na-area { fill: var(--accent-soft); stroke: none; }
rect.na-in { fill: var(--st-a); } rect.na-out { fill: var(--st-e); }
.na-cross { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 3; }
.na-hit { fill: transparent; cursor: crosshair; }
.na-tip { position: absolute; top: 8px; min-width: 150px; padding: 8px 10px; background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px; font-size: 12.5px; display: flex; flex-direction: column; gap: 3px; pointer-events: none; }
.na-tip[hidden] { display: none; }
.na-legend { display: inline-flex; gap: 14px; color: var(--muted); }
.na-sw { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.na-sw.na-in { background: var(--st-a); } .na-sw.na-out { background: var(--st-e); } .na-sw.na-line { background: var(--accent); }
.na-table td, .na-table th { white-space: nowrap; }
.na-rate { display: inline-grid; grid-template-columns: 120px auto; gap: 8px; align-items: center; }
.na-rate .bar, .na-bar .bar { height: 8px; margin: 0; background: var(--track); border-radius: 3px; overflow: hidden; }
.na-rate .bar i, .na-bar .bar i { display: block; height: 100%; background: var(--st-e); border-radius: 0 3px 3px 0; }
.na-rate b, .na-bar b { font-family: var(--mono); font-weight: 500; font-size: 13px; }
.na-pivots { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 6px 0 0; }
.na-pivots h3 { font-size: 13.5px; }
.na-bar { display: grid; grid-template-columns: minmax(0, 180px) 1fr 40px; gap: 10px; align-items: center; padding: 3px 0; }
.na-bar .nm { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.na-bar .bar i { background: var(--st-a); }
.na-bar .bar i.s-E { background: var(--st-e); } .na-bar .bar i.s-Q { background: var(--st-q); } .na-bar .bar i.s-A { background: var(--st-a); }
.na-bar .bar i.s-N { background: var(--st-n); } .na-bar .bar i.s-H { background: var(--st-h); }
.na-bar b { text-align: right; }
.na-day { display: inline-flex; gap: 8px; align-items: center; }
.na-day input { margin: 0; padding: 4px 8px; width: auto; }
@media (max-width: 900px) {
  .na-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .na-pivots { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .na-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .na-bar { grid-template-columns: minmax(0, 110px) 1fr 34px; }
}

/* GRiT iDs (quadro da vaga e ficha do candidato) */
.gidpanel { margin: 0 0 18px; }
.gidpanel h2 { margin-top: 0; }
.gids { list-style: none; margin: 8px 0; padding: 0; display: grid; gap: 6px; }
.gid { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.gid.warn { box-shadow: inset 3px 0 0 var(--warn); }
.gid .gtitle { color: var(--text); text-decoration: none; }
.gid .gtitle:hover { color: var(--accent); }
.gid .warnt { color: var(--warn); }
a.tag { text-decoration: none; }
.title-row h1 small { display: block; font-size: .42em; font-weight: 600; letter-spacing: 0; margin-top: 2px; }
.gid.old { opacity: .6; }
.gid.old .tag { border-color: var(--line); color: var(--faint); }
.gidpanel > summary { cursor: pointer; list-style: none; }
.gidpanel > summary::-webkit-details-marker { display: none; }
.gidpanel > summary h2 { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0; }
.gidpanel[open] > summary h2 { margin-bottom: 8px; }
.gold, .gmore { margin-top: 6px; flex-basis: 100%; }
.gold summary, .gmore summary { cursor: pointer; color: var(--muted); }
.gold .gids { margin: 6px 0 0; }
.gold .gid { padding: 6px 10px; }
.gidpanel > summary { display: flex; align-items: baseline; gap: 8px; }
.gidpanel > summary h2 { flex: 1; border: 0; padding: 0; margin: 0; }
.gidpanel > summary h2::before { content: none; }

/* utilitarios (gerados a partir dos antigos style="" inline; !important mantem a precedencia do inline) */
.u-align-items-flex-end { align-items:flex-end !important; }
.u-background-fff-border-radius-8px-padding-10px-width-max-content-margin { background:#fff !important; border-radius:8px !important; padding:10px !important; width:max-content !important; margin:0 auto 10px !important; }
.u-color-inherit { color:inherit !important; }
.u-color-var-text { color:var(--text) !important; }
.u-color-var-warn { color:var(--warn) !important; }
.u-columns-2-text-align-center-line-height-1-9 { columns:2 !important; text-align:center !important; line-height:1.9 !important; }
.u-display-flex-justify-content-space-between-align-items-flex-end-gap-16 { display:flex !important; justify-content:space-between !important; align-items:flex-end !important; gap:16px !important; flex-wrap:wrap !important; }
.u-display-inline-padding-2px-8px-margin-0 { display:inline !important; padding:2px 8px !important; margin:0 !important; }
.u-grid-template-columns-2fr-3fr-3fr-1-3fr-8fr { grid-template-columns:2fr 3fr 3fr 1.3fr .8fr !important; }
.u-height-44px { height:44px !important; }
.u-line-height-1-7-margin-0-0-14px-padding-left-20px { line-height:1.7 !important; margin:0 0 14px !important; padding-left:20px !important; }
.u-line-height-1-8-margin-0-0-16px-padding-left-20px { line-height:1.8 !important; margin:0 0 16px !important; padding-left:20px !important; }
.u-margin-0 { margin:0 !important; }
.u-margin-0-0-18px { margin:0 0 18px !important; }
.u-margin-0-0-6px { margin:0 0 6px !important; }
.u-margin-0-flex-1-max-width-360px { margin:0 !important; flex:1 !important; max-width:360px !important; }
.u-margin-10px-0-0 { margin:10px 0 0 !important; }
.u-margin-12px-0-0 { margin:12px 0 0 !important; }
.u-margin-14px-0-0 { margin:14px 0 0 !important; }
.u-margin-14px-0-4px { margin:14px 0 4px !important; }
.u-margin-16px-0-0 { margin:16px 0 0 !important; }
.u-margin-6px-0-0 { margin:6px 0 0 !important; }
.u-margin-8px-0-0 { margin:8px 0 0 !important; }
.u-margin-bottom-0 { margin-bottom:0 !important; }
.u-margin-bottom-10px { margin-bottom:10px !important; }
.u-margin-bottom-14px { margin-bottom:14px !important; }
.u-margin-bottom-20px { margin-bottom:20px !important; }
.u-margin-top-0 { margin-top:0 !important; }
.u-margin-top-10px { margin-top:10px !important; }
.u-margin-top-12px { margin-top:12px !important; }
.u-margin-top-14px { margin-top:14px !important; }
.u-margin-top-16px { margin-top:16px !important; }
.u-margin-top-18px { margin-top:18px !important; }
.u-margin-top-22px { margin-top:22px !important; }
.u-margin-top-26px { margin-top:26px !important; }
.u-margin-top-4px { margin-top:4px !important; }
.u-margin-top-6px { margin-top:6px !important; }
.u-margin-top-8px { margin-top:8px !important; }
.u-max-width-280px { max-width:280px !important; }
.u-max-width-320px { max-width:320px !important; }
.u-max-width-520px { max-width:520px !important; }
.u-max-width-640px { max-width:640px !important; }
.u-max-width-680px { max-width:680px !important; }
.u-max-width-760px { max-width:760px !important; }
.u-min-width-190px { min-width:190px !important; }
.u-min-width-240px { min-width:240px !important; }
.u-text-align-center { text-align:center !important; }
.u-white-space-nowrap { white-space:nowrap !important; }
.u-white-space-pre-wrap { white-space:pre-wrap !important; }
.u-width-100 { width:100% !important; }
.u-width-100-margin-top-14px-text-align-center { width:100% !important; margin-top:14px !important; text-align:center !important; }
.u-width-220px-display-inline-block-padding-8px-10px { width:220px !important; display:inline-block !important; padding:8px 10px !important; }
.u-width-84px-text-align-right-padding-7px-8px { width:84px !important; text-align:right !important; padding:7px 8px !important; }
@media (max-width: 900px) { .panel .row { grid-template-columns: 1fr !important; } }
/* so para leitores de ecra */
.sr-only { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.alert.err .btn { margin-left: 8px; }
.flabel { display: block; font-size: 13px; font-weight: 600; color: var(--muted); margin: 0 0 7px; }
.u-margin-0-0-8px-auto { margin:0 0 8px auto !important; }
.u-margin-0-0-8px { margin:0 0 8px !important; }

/* Open Needs: urgentes (o amarelo do Excel OpenNeeds) */
.nd-table tr.nd-urgent td { background: rgba(255, 214, 10, .07); }
.nd-table tr.nd-urgent td:first-child { box-shadow: inset 3px 0 0 #ffd60a; }
.nd-star { font: inherit; font-size: 15px; line-height: 1; background: none; border: 0; padding: 0 6px 0 0; color: var(--faint); cursor: pointer; vertical-align: -1px; }
button.nd-star:hover { color: #ffd60a; }
.nd-star.on { color: #ffd60a; }
span.nd-star { cursor: default; }
.nd-urgent-chip.on { border-color: #ffd60a; background: rgba(255, 214, 10, .1); }
.on-urgent { color: #ffd60a; font-weight: 600; }
a.on-urgent { text-decoration: none; }
a.on-urgent:hover { text-decoration: underline; }
/* Open Needs: "Para fechar" (o gestor fecha no Keywork) */
.nd-closebtn { font: inherit; font-size: 14px; line-height: 1; background: none; border: 0; padding: 0 6px 0 0; color: var(--faint); cursor: pointer; vertical-align: -1px; }
.nd-closebtn:hover, .nd-closebtn.on { color: var(--accent); }
.nd-notebtn { font: inherit; font-size: 13px; line-height: 1; background: none; border: 0; padding: 0 6px 0 0; color: var(--faint); cursor: pointer; vertical-align: -1px; }
.nd-notebtn:hover, .nd-notebtn.on { color: var(--accent); }
.nd-profile .nd-note { display: block; margin: 3px 0 2px; padding: 2px 0 2px 8px; border-left: 2px solid var(--accent); font-size: 12.5px; line-height: 1.4; color: var(--text); text-align: left; white-space: normal; }
.nd-profile button.nd-note { width: 100%; cursor: pointer; }
.nd-profile button.nd-note:hover { color: var(--accent); }
.nd-toclose-tag { display: block; margin-top: 4px; font-size: 12px; font-weight: 600; color: var(--accent); }
.nd-toclose-tag.late { color: var(--down); }
.nd-toclose-tag.late::after { content: " ⚠"; }
.nd-close-chip.on { border-color: var(--accent); background: var(--accent-soft); }
#close-dialog textarea { width: 100%; margin: 6px 0 10px; background: var(--panel-2); color: var(--text); border: 1px solid var(--line); border-radius: 8px; padding: 8px; font: inherit; resize: vertical; }
.on-toclose { color: var(--accent); font-weight: 600; }
.on-toclose.late { color: var(--down); }
a.on-toclose { text-decoration: none; }
a.on-toclose:hover { text-decoration: underline; }
.on-close-list { margin: 8px 0 0; padding: 0; list-style: none; font-size: 13.5px; }
.on-close-list li { padding: 4px 0; border-top: 1px solid var(--line-soft); }
.on-close-list .faint { margin-left: 6px; }

/* Open Needs e Historico: pagina mais larga e texto das celulas a quebrar linha, para a tabela
   caber sem scroll lateral (pedido da Catarina, 13/10/2026) */
@media (min-width: 1001px) {
  main .wrap:has(.nd-table) { max-width: 1640px; }
  .nd-table td { white-space: normal; }
  .nd-table td:first-child .mono { white-space: nowrap; }
}

/* ---------------------------------------------------------------- Needs TPR (nt-, 19/10/2026)
   Uma linha por need (nome + cliente + bolinha do status), vistos S A R E em botoes, nota atras do lapis. */
.nt-head { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; justify-content: space-between; }
.nt-head h1 { margin: 0; }
.nt-weeks { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.nt-seg { display: flex; gap: 2px; background: var(--panel); border: 1px solid var(--line); border-radius: 9px; padding: 3px; }
.nt-seg a { font-size: 13.5px; color: var(--muted); text-decoration: none; border-radius: 6px; padding: 5px 11px; white-space: nowrap; }
.nt-seg a:hover { color: var(--text); }
.nt-seg a.on { background: var(--panel-2); color: var(--text); font-weight: 600; }
.nt-seg small { font-family: var(--mono); font-size: 11px; color: var(--faint); margin-left: 5px; }
.nt-past, .nt-add input[type=text], .nt-note input { font: inherit; font-size: 13px; background: var(--panel); color: var(--text); border: 1px solid var(--line); border-radius: 8px; padding: 5px 9px; }
.nt-ro { margin: 14px 0 0; font-size: 13.5px; color: var(--warn); }
.nt-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-top: 18px; }
.nt-stat { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 16px; display: flex; flex-direction: column; gap: 6px; }
.nt-stat b { font-family: var(--mono); font-size: 26px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.nt-stat span { color: var(--muted); font-size: 13px; }
.nt-stat.warn b { color: var(--warn); }
.nt-stat-btn { font: inherit; color: inherit; text-align: left; cursor: pointer; }
.nt-stat-btn:hover { border-color: var(--muted); }
.nt-stat-btn[aria-pressed="true"] { border-color: var(--warn); background: rgba(255, 181, 71, .08); }
.nt-row[hidden], .nt-card[hidden] { display: none; }
.nt-bar { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin: 18px 0 14px; }
.nt-legend { margin-left: auto; font-size: 12.5px; color: var(--faint); display: flex; gap: 10px; flex-wrap: wrap; }
.nt-legend b { font-family: var(--mono); color: var(--muted); }
.nt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 520px), 1fr)); gap: 14px; align-items: start; }
[data-pane][hidden] { display: none; }  /* .nt-grid (display: grid) ganhava ao hidden */
.nt-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.nt-card.nt-me { border-color: rgba(255, 68, 56, .55); }
.nt-home { max-width: 720px; }
.nt-card-h { display: flex; justify-content: space-between; align-items: baseline; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.nt-who { font-weight: 700; }
.nt-who em { font-style: normal; font-size: 12px; color: var(--accent); margin-left: 6px; }
.nt-cnt { font-family: var(--mono); font-size: 12px; color: var(--faint); }
.nt-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; align-items: center; padding: 8px 14px; border-bottom: 1px solid var(--line-soft); }
.nt-row:last-of-type { border-bottom: 0; }
.nt-name { min-width: 0; display: flex; gap: 8px; align-items: center; cursor: default; }
.nt-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nt-c { color: var(--faint); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nt-st { flex: none; display: inline-block; font-size: 11px; font-weight: 600; white-space: nowrap; border: 1px solid currentColor; border-radius: 99px; padding: 0 6px; color: var(--faint); }
.nt-tbl .nt-st { margin-right: 7px; }
a.nt-t { color: inherit; text-decoration: none; }
a.nt-t:hover { color: var(--accent); text-decoration: underline; }
.nt-urg { flex: none; color: var(--warn); font-size: 13px; }
.nt-tbl .nt-urg { margin-right: 5px; }
.nt-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.nt-chip { font: inherit; font-size: 13px; color: var(--muted); background: var(--panel); border: 1px solid var(--line); border-radius: 99px; padding: 4px 12px; cursor: pointer; }
.nt-chip:hover { color: var(--text); border-color: var(--muted); }
.nt-chip[aria-pressed="true"] { color: var(--text); border-color: var(--warn); background: rgba(255, 181, 71, .12); }
.nt-count { font-size: 12.5px; color: var(--faint); font-family: var(--mono); }
.nt-tbl tr[hidden] { display: none; }
.nt-sum { margin-top: 18px; }
.nt-sum h2 { font-size: 15px; margin: 0 0 10px; }
.nt-sum .nt-tbl { min-width: 520px; font-variant-numeric: tabular-nums; }
/* historico das alteracoes (fundo da pagina Needs TPR, so a Catarina) */
.nt-hist { margin-top: 28px; }
.nt-hist-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.nt-hist-h h2 { font-size: 15px; margin: 0; }
.nt-hist-h select { width: auto; font: inherit; font-size: 13px; color: var(--text); background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 3px 8px; }
.nt-hist-l { list-style: none; margin: 0; padding: 0; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; }
.nt-hist-l li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--line-soft); font-size: 13.5px; line-height: 1.4; }
.nt-hist-l li[hidden] { display: none; }
.nt-hist-l li:last-child { border-bottom: 0; }
.nt-hb { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; border: 1px solid var(--line); background: var(--panel-2); color: var(--faint); font: 700 11px var(--mono); }
.nt-hb.on { background: rgba(79, 209, 139, .16); border-color: rgba(79, 209, 139, .55); color: var(--up); }
.nt-hb.ic { font-size: 13px; color: var(--muted); }
.nt-ht { min-width: 0; }
.nt-ht b { font-weight: 600; }
.nt-hn { display: block; color: var(--muted); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nt-hn a { color: var(--text); }
.nt-hn .nt-tag { margin-right: 5px; }
.nt-hist-l time { font-family: var(--mono); font-size: 11.5px; color: var(--faint); white-space: nowrap; }
.nt-more { display: block; margin: 8px auto 0; font: inherit; font-size: 13px; color: var(--muted); background: none; border: 1px solid var(--line); border-radius: 99px; padding: 4px 14px; cursor: pointer; }
.nt-more:hover { color: var(--text); border-color: var(--muted); }
.nt-more[hidden] { display: none; }
.nt-tbl tfoot th { border-top: 1px solid var(--line); color: var(--text); padding: 9px 12px; }
.nt-st.s-E { color: var(--st-e); } .nt-st.s-Q { color: var(--st-q); } .nt-st.s-A { color: var(--st-a); }
.nt-st.s-N { color: var(--st-n); } .nt-st.s-H { color: var(--st-h); }
.nt-tag { flex: none; font-size: 11px; border: 1px solid var(--line); border-radius: 99px; padding: 0 6px; margin-right: 6px; }
.nt-name .nt-tag { margin-right: 0; }
.nt-tag.pro { color: var(--st-q); border-color: rgba(183, 148, 255, .45); }
.nt-tag.gone { color: var(--faint); }
.nt-also { flex: none; font-size: 11.5px; color: var(--warn); border: 1px solid rgba(255, 181, 71, .45); border-radius: 99px; padding: 0 6px; white-space: nowrap; }
.nt-w { color: var(--warn); font-weight: 600; }
.nt-acts { display: flex; gap: 3px; align-items: center; }
.nt-l { width: 26px; height: 26px; border-radius: 6px; border: 1px solid var(--line); background: var(--panel-2); color: var(--faint); font: 700 12px var(--mono); cursor: pointer; padding: 0; }
.nt-l:hover:not(:disabled) { border-color: var(--muted); color: var(--text); }
.nt-l.on { background: rgba(79, 209, 139, .16); border-color: rgba(79, 209, 139, .55); color: var(--up); }
.nt-l:disabled { cursor: default; }
.nt-l { position: relative; }
.nt-n { position: absolute; top: -6px; right: -5px; font: 700 9.5px var(--mono); color: var(--up); background: var(--panel); border-radius: 6px; padding: 0 2px; line-height: 1.2; }
.nt-ok { position: relative; }
.nt-ok .nt-n { top: -5px; right: -9px; }
.nt-l.rf { box-shadow: 0 0 0 2px var(--up); transition: box-shadow .2s; }  /* reforco registado (clique longo) */
.nt-nb { display: inline-block; width: 26px; height: 26px; border-radius: 6px; border: 0; background: none; color: var(--faint); cursor: pointer; padding: 0; margin-left: 4px; font-size: 15px; line-height: 1; }
.nt-nb.has { color: var(--text); }
button.nt-nb:hover { color: var(--accent); }
.nt-note { grid-column: 1 / -1; font-size: 13px; color: var(--muted); display: flex; gap: 8px; align-items: center; }
.nt-note[hidden] { display: none; }
.nt-nv { grid-column: 1 / -1; font-size: 12.5px; color: var(--muted); line-height: 1.35; overflow-wrap: anywhere; margin-top: -2px; }
.nt-nv[hidden] { display: none; }
.nt-note input, .nt-note-t { flex: 1; min-width: 0; }
.nt-note input.err { border-color: var(--down); }
.nt-rm { font: inherit; font-size: 12px; color: var(--faint); background: none; border: 0; cursor: pointer; padding: 0; white-space: nowrap; }
.nt-rm:hover { color: var(--accent); }
.nt-add { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--line); flex-wrap: wrap; align-items: center; }
.nt-add input[type=text] { flex: 1 1 240px; min-width: 0; }
.nt-add [hidden] { display: none; }
.nt-tog { font: inherit; font-size: 13px; color: var(--muted); background: none; border: 0; cursor: pointer; padding: 4px 0; }
.nt-tog:hover { color: var(--text); }
.nt-empty { padding: 12px 14px; color: var(--faint); font-size: 13px; }
.nt-fri { margin: 10px 0 0; max-width: 720px; font-size: 13.5px; color: var(--warn); border: 1px dashed rgba(255, 181, 71, .5); border-radius: 8px; padding: 8px 12px; }
.nt-fri a { color: var(--warn); }
.nt-tbl-wrap { overflow-x: auto; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); }
.nt-tbl { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 640px; }
.nt-tbl th { text-align: left; font-weight: 600; font-size: 12.5px; color: var(--muted); padding: 9px 12px; border-bottom: 1px solid var(--line); }
.nt-tbl td { padding: 8px 12px; border-bottom: 1px solid var(--line-soft); }
.nt-tbl tr:last-child td { border-bottom: 0; }
.nt-tbl .c { text-align: center; }
.nt-ok { color: var(--up); font-weight: 700; }
.nt-none { color: var(--faint); }
.nt-nobody { color: var(--warn); }
@media (max-width: 480px) { .nt-row { grid-template-columns: 1fr; } .nt-legend { margin-left: 0; } }

/* ---------- Anúncios (/m/anuncios/, Catarina e Carolina) ---------- */
.an-sub { color: var(--muted); font-size: 13.5px; margin: 4px 0 0; }
.an-sub b { color: var(--text); font-weight: 600; }
.an-small { font-size: 12px; }
.an-gap { margin-bottom: 14px; }
.an-gap-t { margin-top: 8px; }
.an-h2 { font-size: 16px; margin: 22px 0 8px; }
.an-tabs { margin: 22px 0 14px; display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; }
.an-tabs .seg { flex-wrap: wrap; border-radius: 18px; }
.an-tabs .seg button span { font-family: var(--mono); font-size: 11.5px; opacity: .75; margin-left: 5px; }
.an-search { background: var(--panel); border: 1px solid var(--line); color: var(--text); border-radius: 99px; padding: 7px 14px; font: inherit; font-size: 13.5px; min-width: 0; flex: 1 1 200px; max-width: 320px; }
.an-search:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.an-tbl td { vertical-align: middle; }
.an-sort { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.an-sort:hover { color: var(--text); }
.an-sort:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }
.an-sort::after { content: "↕"; opacity: .35; font-size: 11px; }
th[aria-sort="ascending"] .an-sort, th[aria-sort="descending"] .an-sort { color: var(--text); }
th[aria-sort="ascending"] .an-sort::after { content: "↑"; opacity: 1; color: var(--accent); }
th[aria-sort="descending"] .an-sort::after { content: "↓"; opacity: 1; color: var(--accent); }
.an-tbl tbody tr[data-i] { cursor: pointer; }
.an-tbl tbody tr[data-i]:hover td, .an-tbl tbody tr[data-i]:focus-visible td { background: var(--panel-2) !important; }
.an-tbl tbody tr[data-i]:focus-visible { outline: none; }
.an-tbl .t { font-weight: 600; }
.an-tbl .t small { display: block; color: var(--faint); font-weight: 400; font-size: 12px; margin-top: 2px; }
.an-tbl .t a { color: var(--text); }
.an-tbl .mono { font-family: var(--mono); font-size: 12px; font-variant-numeric: tabular-nums; color: var(--muted); white-space: nowrap; }
.an-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; white-space: nowrap; color: var(--text); }
.an-chip::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--an-c, var(--faint)); flex: none; }
/* pastilhas do estado com as cores do Excel Tracking_Anuncios (Catarina, 20/10/2026): lilas claro constante,
   lilas a rodar, verde-agua suspenso em rotacao, azul-ciano limbo, azul claro descontinuado; linhas sem fundo */
.an-e-constante { --an-c: #e5d6fe; } .an-e-rodar { --an-c: #cc99ff; } .an-e-suspenso { --an-c: #66ffcc; }
.an-e-limbo { --an-c: #00ccff; } .an-e-descontinuado { --an-c: #9dc3e6; }
.an-chip[class*="an-e-"] { background: var(--an-c); color: #161616; padding: 3px 9px; border-radius: 99px; }
.an-chip[class*="an-e-"]::before { display: none; }
.an-chip.none { color: var(--muted); }
.an-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0 0 10px; font-size: 12.5px; color: var(--muted); }
.an-legend span { display: inline-flex; align-items: center; gap: 6px; }
.an-legend span::before { content: ""; width: 12px; height: 12px; border-radius: 3px; background: var(--an-c); }
.an-chip.none::before { background: transparent; border: 1.5px dashed var(--faint); width: 6px; height: 6px; }
.an-ch { display: inline-flex; align-items: center; gap: 5px; font-family: var(--mono); font-size: 12px; white-space: nowrap; }
.an-ch i { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--faint); flex: none; }
.an-ch.on i { background: var(--up); border-color: var(--up); }
.an-ch.off { color: var(--faint); }
.an-ch.old { color: var(--warn); }
.an-flags { display: flex; gap: 4px; flex-wrap: wrap; }
.an-flag { font-size: 11.5px; padding: 2px 8px; border-radius: 99px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; }
.an-flag.w { border-color: rgba(255, 181, 71, .5); color: var(--warn); }
.an-flag.d { border-color: rgba(255, 107, 97, .5); color: var(--down); }
.an-flag.ok { border-color: rgba(79, 209, 139, .5); color: var(--up); }
.an-alerts { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 8px; margin-bottom: 14px; }
.an-alert { font: inherit; text-align: left; cursor: pointer; display: flex; gap: 10px; align-items: baseline; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 14px; color: var(--text); }
.an-alert b { font-family: var(--mono); font-size: 18px; min-width: 2ch; }
.an-alert span { font-size: 13px; color: var(--muted); }
.an-alert.w b { color: var(--warn); } .an-alert.d b { color: var(--down); }
.an-alert:hover { border-color: var(--muted); }
.an-alert[aria-pressed="true"] { border-color: var(--warn); background: rgba(255, 181, 71, .08); }
.an-revbar { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.an-revbar p { margin: 0; color: var(--muted); font-size: 13.5px; }
.an-revbar b { color: var(--text); }
.an-rev { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 16px; align-items: start; }
.an-rev h2 { font-size: 17px; margin: 0 0 4px; }
.an-rev .hint { color: var(--faint); font-size: 12.5px; margin: 0 0 10px; }
.an-list { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); }
.an-rv { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--line-soft); }
.an-rv:last-child { border-bottom: 0; }
.an-rv .t { font-weight: 600; font-size: 13.5px; min-width: 0; cursor: pointer; color: var(--text); }
.an-rv .t:hover { text-decoration: underline; }
.an-rv .m { grid-column: 1; color: var(--faint); font-size: 12px; display: flex; gap: 4px 12px; flex-wrap: wrap; }
.an-rv .m .n { color: var(--up); }
.an-rv .act { grid-row: 1 / span 2; grid-column: 2; display: flex; gap: 4px; }
.an-dec { font: 600 12px/1 var(--display); padding: 7px 11px; border-radius: 99px; border: 1px solid var(--line); background: transparent; color: var(--muted); cursor: pointer; }
.an-dec:hover:not(:disabled) { color: var(--text); border-color: var(--muted); }
.an-dec:disabled { cursor: default; opacity: .6; }
.an-dec[aria-pressed="true"].fica { background: rgba(79, 209, 139, .15); border-color: var(--up); color: var(--up); }
.an-dec[aria-pressed="true"].sai { background: rgba(255, 107, 97, .12); border-color: var(--down); color: var(--down); }
.an-dec[aria-pressed="true"].entra { background: rgba(106, 169, 255, .15); border-color: var(--st-a); color: var(--st-a); }
.an-dec:focus-visible, .an-alert:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.an-sug { display: flex; flex-wrap: wrap; gap: 4px; }
.an-sug button { font: inherit; font-size: 12px; background: none; border: 1px dashed var(--line); color: var(--muted); border-radius: 99px; padding: 2px 9px; cursor: pointer; }
.an-sug button:hover { color: var(--text); border-color: var(--muted); }
.an-empty { color: var(--faint); padding: 14px; font-size: 13px; }
.an-more { display: block; margin: 10px auto 0; }
/* o display destas classes ganha ao [hidden] do browser: sem isto o painel vazio tapava a direita da pagina */
.an-dlg[hidden], .an-more[hidden] { display: none; }
.an-dlg-bg { position: fixed; inset: 0; background: rgba(0, 0, 0, .55); z-index: 40; }
.an-dlg { position: fixed; top: 0; right: 0; bottom: 0; width: min(480px, 100%); background: var(--panel); border-left: 1px solid var(--line); z-index: 41; overflow-y: auto; padding: calc(20px + env(safe-area-inset-top, 0px)) max(22px, env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) 22px; display: flex; flex-direction: column; gap: 18px; }
.an-dlg h3 { font-size: 21px; margin: 0; text-wrap: balance; padding-right: 36px; }
.an-dlg .x { position: absolute; top: calc(14px + env(safe-area-inset-top, 0px)); right: max(14px, env(safe-area-inset-right, 0px)); background: none; border: 0; color: var(--muted); font-size: 22px; cursor: pointer; }
.an-sec h4 { margin: 0 0 8px; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); font-weight: 600; }
.an-dlg label { display: block; font-size: 12.5px; color: var(--muted); margin-bottom: 4px; }
.an-dlg select, .an-dlg textarea, .an-dlg input[type="date"] { width: 100%; background: var(--panel-2); border: 1px solid var(--line); color: var(--text); border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13.5px; }
.an-two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.an-three { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.an-cat { display: inline-block; font-size: 11.5px; font-weight: 600; letter-spacing: .02em; white-space: nowrap; color: var(--text);
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 6px; padding: 2px 8px; }
.an-cat.auto { color: var(--muted); font-weight: 400; font-style: italic; background: transparent; border-style: dashed; }
.an-cat.none { color: var(--faint); background: none; border: 0; padding: 0; }
.an-reg { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: 8px; align-items: end; }
.an-chan { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 6px 10px; font-size: 13.5px; align-items: baseline; margin: 0; }
.an-chan dt { color: var(--muted); }
.an-chan dd { margin: 0; }
.an-chan a, .an-nd a { color: var(--text); }
.an-tl { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 2px solid var(--line); display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.an-tl li { position: relative; }
.an-tl li::before { content: ""; position: absolute; left: -19px; top: 5px; width: 8px; height: 8px; border-radius: 50%; background: var(--st-a); }
.an-tl li.on::before { background: var(--up); }
.an-tl li.auto::before { background: var(--panel); border: 2px solid var(--muted); width: 6px; height: 6px; }
.an-tl .d { font-family: var(--mono); font-size: 12px; color: var(--muted); margin-right: 8px; }
.an-tl .who { color: var(--faint); }
.an-nd { font-size: 13px; padding: 6px 0; border-bottom: 1px solid var(--line-soft); }
.an-nd:last-child { border-bottom: 0; }
.an-nd small { color: var(--faint); display: block; }
.an-msg { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); background: var(--panel-2); border: 1px solid var(--line); color: var(--text); padding: 8px 14px; border-radius: 8px; font-size: 13px; z-index: 60; max-width: calc(100% - 32px); }
@media (max-width: 640px) { .an-tbl .hide-s { display: none; } .an-two { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .an-reg { grid-template-columns: 1fr 1fr; } }