/* Lumen — monitor de alocação de consultores.
   Linguagem v2: superfícies agrupadas (sem bordas nem sombras), títulos grandes em Sora, interface em Inter,
   um único acento (Azul Lumen) e sinais de status como ponto + texto. O amarelo Lume pertence só ao símbolo.
   Desktop: cabeçalho translúcido com navegação em pílula. Celular: barra de abas inferior, como um app. */

:root {
  /* Marca */
  --azul: #2F54EB; --azul-hover: #2343C7; --azul-tint: #EDF1FE; --lume: #FFC83D; --noite: #0A1429;
  /* Neutros */
  --ardosia: #5B6478; --bruma: #D5DBEA; --nevoa: #F4F6FB; --branco: #FFFFFF;
  /* Papéis */
  --ground: var(--nevoa); --surface: var(--branco); --surface-2: #F1F3F8; --fill: #EEF1F6;
  --ink: var(--noite); --ink-2: #2A3550; --muted: var(--ardosia);
  --line: #E3E7EF; --line-soft: #EDF0F5; --field: #C9D0DD; --input-bg: var(--branco);
  --accent: var(--azul); --accent-hover: var(--azul-hover); --on-accent: var(--branco);
  --link: var(--azul); --link-hover: var(--azul-hover); --focus: var(--azul);
  /* Sinais */
  --ok: #0E7A5F; --ok-bg: #E6F4EF; --ok-ink: #0B6650;
  --warn: #C2410C; --warn-bg: #FDF1E9; --warn-ink: #9A3412;
  --alert: #B42318; --alert-bg: #FDEEEC; --alert-ink: #8F1C13;
  /* Status do ALM */
  --prog-bg: #E3E9FD; --prog-ink: var(--azul-hover); --test-bg: var(--bruma); --test-ink: var(--noite); --neutral-ink: var(--ardosia);
  /* Escala da matriz */
  --h1: #E3E9FD; --h2: #A9B9F8; --h3: #5F7CF0; --h4: var(--azul); --h3-ink: var(--noite); --h4-ink: var(--branco);
  --none-ink: var(--ardosia); --selected: #EEF2FE;
  /* Área escura (login) */
  --dark-ink: #C9D2E6; --dark-ink-2: #A9B4CC; --dark-field: #12203F; --dark-border: #66718A; --dark-error: #FFB4A9;
  /* Tipografia e forma */
  --font-display: 'Sora', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-num: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius: 20px; --radius-md: 14px; --radius-sm: 10px;
  --tabbar: 0px;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--ground); color: var(--ink); font-family: var(--font-body); font-size: 15px; line-height: 1.47; -webkit-font-smoothing: antialiased; }
a { color: var(--link); text-underline-offset: 3px; text-decoration-thickness: 1px; } a:hover { color: var(--link-hover); }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; margin: 0; text-wrap: balance; letter-spacing: -0.02em; }
h1 { font-size: 32px; line-height: 1.15; letter-spacing: -0.03em; } h2 { font-size: 19px; line-height: 1.3; }
p { margin: 0; }
table, .kpi .value, .tile .value, .heat, .occ, .num { font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); } .small { font-size: 13px; } .right { text-align: right; } .center { text-align: center; } .strong { font-weight: 600; }
.sr-only { position: absolute; left: 0; top: 0; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.js .js-hide { display: none !important; }

/* ---------- Marca ---------- */
.symbol { display: block; flex: 0 0 auto; }
.brand { display: inline-flex; align-items: center; gap: 9px; color: var(--ink); text-decoration: none; }
.brand:hover { color: var(--ink); }
.wordmark { font-family: var(--font-display); font-weight: 600; font-size: 22px; line-height: 1; letter-spacing: -0.03em; }

/* ---------- Cabeçalho (desktop) ---------- */
.top { position: sticky; top: 0; z-index: 20; background: rgba(255, 255, 255, 0.92); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); border-bottom: 1px solid var(--line); padding: 0 28px; min-height: 64px; display: flex; align-items: center; gap: 0 28px; }
.top .brand { min-height: 64px; }
.mainnav { flex: 1 1 auto; display: flex; gap: 2px; font-size: 14px; font-weight: 500; }
.mainnav a { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border-radius: 999px; color: var(--ink-2); text-decoration: none; white-space: nowrap; }
.mainnav a:hover { color: var(--ink); background: var(--fill); }
.mainnav a[aria-current="page"] { color: var(--ink); background: var(--fill); font-weight: 600; }
.top-side { margin-left: auto; display: flex; align-items: center; gap: 4px 14px; font-size: 13px; color: var(--muted); }
.top-side a { color: var(--ink-2); text-decoration: none; }
.top-side a:hover { color: var(--azul); }
.sync-state { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--muted); text-decoration: none; }
.sync-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); display: inline-block; flex: 0 0 auto; }
.sync-dot.warn { background: var(--warn); } .sync-dot.off { background: var(--field); }
.linkbtn { background: none; border: 0; padding: 0; min-height: 44px; color: var(--ink-2); font: inherit; cursor: pointer; }
.linkbtn:hover { color: var(--azul); }
.avatar { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--noite); color: var(--branco); font-size: 12px; font-weight: 600; letter-spacing: 0.02em; }

/* ---------- Barra de abas (celular) ---------- */
.tabbar { display: none; }

/* ---------- Página ---------- */
main { max-width: 1240px; margin: 0 auto; padding: 36px 32px 64px; display: flex; flex-direction: column; gap: 28px; }
.narrow { max-width: 520px; }
.head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 24px; }
.head > div:first-child { max-width: 72ch; }
.head p { margin-top: 6px; color: var(--muted); font-size: 16px; }
.crumb { font-size: 14px; color: var(--muted); }
.crumb a { text-decoration: none; }
.back { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; font-size: 15px; font-weight: 500; text-decoration: none; }
.back::before { content: '‹'; font-size: 24px; line-height: 1; margin-top: -3px; }

.card { background: var(--surface); border-radius: var(--radius); padding: 22px 24px; min-width: 0; }
.card > h2 { margin-bottom: 14px; }
.card-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.card-head p { margin-top: 4px; }
.stack { display: flex; flex-direction: column; gap: 18px; }
.split { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.split > .main { flex: 999 1 620px; min-width: 0; }
.split > .side { flex: 1 1 340px; min-width: 0; }
.split > .list { flex: 1 1 440px; min-width: 0; }
.split > .form { flex: 999 1 520px; min-width: 0; }

/* ---------- Formulários ---------- */
.row { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; }
.field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 500; min-width: 0; color: var(--ink-2); }
.row > .field { flex: 1 1 200px; } .row > .field.wide { flex: 2 1 300px; } .row > .field.tight { flex: 0 1 150px; }
input[type=text], input[type=email], input[type=password], input[type=url], input[type=date], input[type=number], input[type=search], select {
  min-height: 44px; padding: 0 14px; border: 1px solid var(--field); border-radius: var(--radius-sm); background: var(--input-bg); color: var(--ink); font: inherit; font-size: 15px; font-weight: 400; width: 100%; }
select { appearance: none; -webkit-appearance: none; padding-right: 36px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235B6478' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
input:hover, select:hover { border-color: #AEB7C8; }
input:focus-visible, select:focus-visible { outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px rgba(47, 84, 235, 0.22); }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
fieldset { margin: 0; padding: 18px; border: 0; border-radius: var(--radius-md); background: var(--surface-2); display: flex; flex-direction: column; gap: 12px; min-width: 0; }
legend { float: left; width: 100%; padding: 0; margin-bottom: 4px; font-weight: 600; font-size: 15px; }
legend + * { clear: both; }
.inline-row { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
.inline-row > .label { flex: 0 0 130px; font-size: 13px; font-weight: 500; }
.inline-row > .grow { flex: 1 1 240px; min-width: 0; }
.inline-row > .fixed { flex: 0 0 150px; }
.radio { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; font-weight: 400; }
.radio input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--accent); }
.actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; align-items: center; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: 12px; border: 0; background: var(--azul-tint); color: var(--azul); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: none; transition: background-color 0.15s ease; }
.btn:hover { background: #DFE6FD; color: var(--azul-hover); }
.btn.primary { background: var(--accent); color: var(--on-accent); }
.btn.primary:hover { background: var(--accent-hover); color: var(--on-accent); }
.btn.small { min-height: 36px; padding: 0 14px; font-size: 14px; border-radius: 10px; }
.btn.warn { background: var(--alert-bg); color: var(--alert-ink); }
.btn.warn:hover { background: #FADAD5; color: var(--alert-ink); }
button:disabled { opacity: 0.5; cursor: not-allowed; }
input[type=file] { min-height: 44px; padding: 10px 0; font: inherit; color: var(--ink); }
input[type=file]::file-selector-button { margin-right: 12px; min-height: 36px; padding: 0 14px; border: 0; border-radius: 10px; background: var(--azul-tint); color: var(--azul); font: inherit; font-weight: 600; cursor: pointer; }

/* ---------- Filtros em linha (aplicam ao trocar a opção) ---------- */
.filterbar { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; }
.filterbar .field { flex: 0 1 220px; }
.filterbar select { min-height: 40px; background-color: var(--surface); border-color: transparent; font-size: 14px; }
.filterbar select:hover { border-color: var(--field); }

/* ---------- Mapa da equipe: o elemento de assinatura do painel ---------- */
.teammap { background: var(--noite); color: var(--branco); border-radius: 24px; padding: 26px 28px 22px; display: flex; flex-direction: column; gap: 18px; }
.teammap h2 { font-size: 22px; color: var(--branco); }
.teammap .muted { color: var(--dark-ink-2); }
.teammap-head p { margin-top: 4px; }
.tm-track { position: relative; height: 64px; margin: 0 22px; }
.tm-track.lanes-2 { height: 106px; } .tm-track.lanes-3 { height: 148px; } .tm-track.lanes-4 { height: 190px; } .tm-track.lanes-5 { height: 232px; }
.tm-zone { position: absolute; top: 0; bottom: 0; border-radius: 0; }
.tm-zone.z-free { background: linear-gradient(90deg, rgba(14, 122, 95, 0.32), rgba(14, 122, 95, 0.12)); border-radius: 14px 0 0 14px; }
.tm-zone.z-mid { background: rgba(169, 185, 248, 0.10); }
.tm-zone.z-hot { background: linear-gradient(90deg, rgba(180, 35, 24, 0.14), rgba(180, 35, 24, 0.34)); border-radius: 0 14px 14px 0; }
.tm-dot { position: absolute; top: 12px; width: 40px; height: 40px; margin-left: -20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--branco); color: var(--noite); font-size: 13px; font-weight: 700; letter-spacing: 0.01em; text-decoration: none; box-shadow: 0 0 0 3px var(--noite); transition: transform 0.15s ease; }
.tm-dot:hover, .tm-dot:focus-visible { transform: scale(1.12); color: var(--noite); z-index: 2; }
.tm-dot.disponivel, .tm-dot.semprojeto { background: #7FE0C2; }
.tm-dot.limite { background: #FFB4A9; }
.tm-dot.lane-1 { top: 54px; } .tm-dot.lane-2 { top: 96px; } .tm-dot.lane-3 { top: 138px; } .tm-dot.lane-4 { top: 180px; }
.tm-legend { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 13px; font-weight: 500; color: var(--dark-ink); }
.tm-legend span { display: inline-flex; align-items: center; gap: 8px; }
.tm-legend span::before { content: ''; width: 10px; height: 10px; border-radius: 50%; }
.tm-legend .k-free::before { background: #7FE0C2; } .tm-legend .k-mid::before { background: var(--branco); } .tm-legend .k-hot::before { background: #FFB4A9; }

/* ---------- Listas agrupadas (Mais, Cadastros) ---------- */
.group { background: var(--surface); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.group-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 12px 20px; color: var(--ink); text-decoration: none; font: inherit; text-align: left; background: none; border: 0; cursor: pointer; width: 100%; }
.group-row + .group-row { border-top: 1px solid var(--line-soft); }
.group-row::after { content: ''; width: 8px; height: 8px; border-top: 2px solid #B5BDCC; border-right: 2px solid #B5BDCC; transform: rotate(45deg); flex: 0 0 auto; margin-right: 4px; }
.group-row:hover { background: #FAFBFD; color: var(--ink); }
.group-row strong { font-weight: 600; }
.group-row.danger { color: var(--alert); font-weight: 600; justify-content: center; }
.group-row.danger::after { display: none; }
@media (min-width: 821px) { .group { max-width: 760px; } }

/* ---------- Mensagens ---------- */
.msg { border-radius: var(--radius-md); padding: 14px 18px; background: var(--surface); font-weight: 500; }
.msg.ok { background: var(--ok-bg); color: var(--ok-ink); }
.msg.aviso { background: var(--warn-bg); color: var(--warn-ink); }
.msg.erro { background: var(--alert-bg); color: var(--alert-ink); }
.banner { display: grid; gap: 20px; }
.token { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; word-break: break-all; background: var(--surface); border-radius: var(--radius-sm); padding: 10px 12px; margin-top: 8px; color: var(--ink); }

/* ---------- Indicadores: uma faixa única, números grandes, cor só no número ---------- */
.kpis { display: flex; flex-wrap: wrap; background: var(--surface); border-radius: var(--radius); padding: 6px; }
.kpi { flex: 1 1 170px; padding: 14px 18px; border-radius: var(--radius-md); color: var(--ink); text-decoration: none; position: relative; }
.kpi + .kpi::before { content: ''; position: absolute; left: 0; top: 18px; bottom: 18px; width: 1px; background: var(--line); }
a.kpi:hover { background: var(--surface-2); color: var(--ink); }
a.kpi:hover::before, a.kpi:hover + .kpi::before { opacity: 0; }
.kpi .label { font-size: 13px; font-weight: 500; color: var(--muted); }
.kpi .value { font-family: var(--font-display); font-size: 34px; font-weight: 600; letter-spacing: -0.03em; line-height: 1.15; margin-top: 4px; }
.kpi .unit { font-family: var(--font-body); font-size: 15px; font-weight: 500; color: var(--muted); letter-spacing: 0; }
.kpi .note { font-size: 12px; font-weight: 500; color: var(--muted); margin-top: 2px; }
.kpi.ok .value { color: var(--ok); } .kpi.warn .value { color: var(--warn); } .kpi.alert .value { color: var(--alert); }
.tiles { display: flex; flex-wrap: wrap; gap: 10px; }
.tile { min-width: 112px; padding: 12px 16px; border-radius: var(--radius-md); background: var(--surface-2); }
.tile .label { font-size: 13px; font-weight: 500; color: var(--neutral-ink); }
.tile .value { font-family: var(--font-display); font-size: 26px; font-weight: 600; letter-spacing: -0.02em; }
.tone-progress { background: var(--prog-bg); } .tone-progress .label { color: var(--prog-ink); }
.tone-blocked { background: var(--warn-bg); } .tone-blocked .label { color: var(--warn-ink); }
.tone-done { background: var(--ok-bg); } .tone-done .label { color: var(--ok-ink); }
.tone-test { background: var(--test-bg); } .tone-test .label { color: var(--test-ink); }
.tone-open { background: var(--surface-2); }

/* Status: ponto colorido + texto, sem caixa (a cor nunca é o único sinal: o texto diz o estado). */
.chip { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 500; color: var(--ink-2); white-space: nowrap; background: none; padding: 0; }
.chip::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--field); flex: 0 0 auto; }
.chip.ok::before, .chip.tone-done::before { background: var(--ok); }
.chip.warn::before, .chip.tone-blocked::before { background: var(--warn); }
.chip.alert::before { background: var(--alert); }
.chip.dark::before { background: var(--noite); }
.chip.tone-progress::before { background: var(--azul); }
.chip.tone-test::before { background: #8A94AA; }
.chip.ok { color: var(--ok-ink); } .chip.warn { color: var(--warn-ink); } .chip.alert { color: var(--alert-ink); }
.late { color: var(--alert); font-weight: 600; }
a.late:hover { color: var(--alert-ink); }

/* ---------- Tabelas ---------- */
.scroll { overflow-x: auto; position: relative; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; }
thead th { text-align: left; padding: 10px 12px; font-size: 13px; font-weight: 500; color: var(--muted); white-space: nowrap; border-bottom: 1px solid var(--line); }
thead th.right { text-align: right; } thead th.center { text-align: center; }
tbody tr + tr, tfoot tr { border-top: 1px solid var(--line-soft); }
tbody th, tbody td, tfoot th, tfoot td { padding: 13px 12px; text-align: left; vertical-align: middle; }
tbody th { font-weight: 500; }
tbody td.right, tfoot td.right { text-align: right; }
tfoot tr { border-top: 1px solid var(--line); } tfoot th, tfoot td { font-weight: 600; }
tbody tr:hover { background: #FAFBFD; }
tr.selected, tr.selected:hover { background: var(--selected); }
tr.inactive th, tr.inactive td { color: var(--muted); }
td.compact, th.compact { padding-top: 6px; padding-bottom: 6px; }
th > a, td > a { text-decoration: none; font-weight: 500; }
tbody th > a, tbody th > .with-mark, tbody td > .with-mark, .matrix thead th.proj a { color: var(--azul); }
th > a:hover, td > a:hover, tbody th > .with-mark:hover .u, tbody td > .with-mark:hover .u { color: var(--azul-hover); text-decoration: underline; }
.sub { display: block; font-size: 13px; font-weight: 400; color: var(--muted); margin-top: 1px; }
.minw-sm { min-width: 380px; } .minw-md { min-width: 680px; } .minw-lg { min-width: 860px; }
details summary { cursor: pointer; min-height: 32px; }
.alm-link { display: inline-flex; align-items: center; min-height: 44px; white-space: nowrap; font-weight: 600; font-size: 14px; text-decoration: none; }

/* ---------- Matriz consultor × cliente ---------- */
.matrix thead th.proj { text-transform: none; letter-spacing: 0; font-size: 13px; font-weight: 500; text-align: center; color: var(--muted); padding: 10px 6px; white-space: normal; }
.matrix thead th.proj a { color: var(--ink-2); }
.matrix td.cell { padding: 4px; min-width: 84px; }
.matrix .total { font-size: 16px; font-weight: 600; text-align: right; }
.matrix tfoot td { text-align: center; font-size: 16px; } .matrix tfoot td.total { text-align: right; }
.heat { display: flex; align-items: center; justify-content: center; height: 44px; border-radius: 12px; font-weight: 600; font-size: 16px; border: 1px solid transparent; color: var(--ink); }
.heat.l1 { background: var(--h1); } .heat.l2 { background: var(--h2); } .heat.l3 { background: var(--h3); color: var(--h3-ink); } .heat.l4 { background: var(--h4); color: var(--h4-ink); }
.heat.zero { background: var(--warn-bg); color: var(--warn-ink); }
.heat.noalloc { background: var(--h1); border: 2px dashed var(--warn); }
.heat.none { color: var(--none-ink); font-weight: 400; }
.legend { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13px; color: var(--muted); align-items: center; }
.legend span { display: inline-flex; align-items: center; gap: 6px; }
.legend .ramp { gap: 4px; }
.sw { width: 18px; height: 12px; border-radius: 3px; display: inline-block; border: 1px solid transparent; }
.ramp .sw { width: 28px; }
.sw.l1 { background: var(--h1); } .sw.l2 { background: var(--h2); } .sw.l3 { background: var(--h3); } .sw.l4 { background: var(--h4); }
.sw.zero { background: var(--warn-bg); border-color: var(--warn-bg); } .sw.noalloc { border: 2px dashed var(--warn); } .sw.none { border-color: var(--line); }
.alert-item { display: flex; flex-direction: column; gap: 4px; padding-bottom: 14px; border-bottom: 1px solid var(--line-soft); align-items: flex-start; }
.alert-item:last-child { border-bottom: 0; padding-bottom: 0; }
.alert-item a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }

/* ---------- Barras, filtros em pílula, abas ---------- */
.bar { display: flex; align-items: center; gap: 10px; }
.bar .track { flex: 1 1 auto; min-width: 60px; height: 12px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.bar .fill { display: block; height: 100%; border-radius: 999px; background: var(--azul); }
.pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pill { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; background: var(--fill); color: var(--ink-2); text-decoration: none; font-weight: 500; font-size: 14px; }
.pill:hover { background: #E3E7EF; color: var(--ink); }
.pill[aria-current="true"] { background: var(--noite); color: var(--branco); }
/* Abas como controle segmentado */
.tabs { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px; border-radius: 12px; background: #E6E9F0; align-self: flex-start; max-width: 100%; }
.tabs a { display: inline-flex; align-items: center; min-height: 34px; padding: 0 16px; border-radius: 9px; color: var(--ink-2); text-decoration: none; font-weight: 500; font-size: 14px; white-space: nowrap; }
.tabs a:hover { color: var(--ink); }
.tabs a[aria-current="page"] { background: var(--surface); color: var(--ink); font-weight: 600; box-shadow: 0 1px 2px rgba(10, 20, 41, 0.08); }
.legend-inline { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 12px; color: var(--muted); align-items: center; }
.legend-inline span { display: inline-flex; align-items: center; gap: 6px; }
.hbars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.hbars li { display: grid; grid-template-columns: 110px minmax(0, 1fr) 36px; align-items: center; gap: 10px; font-size: 13px; }
.hbars .track { height: 14px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.hbars .fill { display: block; height: 100%; border-radius: 999px; background: var(--h3); }
.hbars .fill.hot { background: var(--warn); }
.hbars strong { text-align: right; }

/* ---------- Gráficos (SVG) ---------- */
.chart { display: block; width: 100%; height: auto; overflow: visible; }
.ch-grid { stroke: var(--line-soft); stroke-width: 1; }
.ch-axis { stroke: var(--line); stroke-width: 1; }
.ch-tick { fill: var(--muted); font: 500 11px var(--font-body); }
.ch-val { fill: var(--ink); font: 600 11px var(--font-num); }
.ch-bar { fill: var(--azul); }
.ch-bar.s2 { fill: var(--h2); }
.ch-bar.s3 { fill: var(--warn); }
.ch-line { fill: none; stroke: var(--azul); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.ch-line.s2 { stroke: var(--h3); stroke-dasharray: 5 4; }
.ch-dot { fill: var(--azul); } .ch-dot.s2 { fill: var(--h3); }
.sw.s1 { background: var(--azul); } .sw.s2 { background: var(--h2); } .sw.s2l { background: var(--h3); } .sw.s3 { background: var(--warn); }

/* ---------- Ocupação mensal ---------- */
.occupancy td.cell { padding: 4px; min-width: 76px; }
.occ { display: flex; align-items: center; justify-content: center; height: 40px; border-radius: 10px; font-weight: 600; border: 1px solid transparent; }
.occ-free { background: var(--surface-2); color: var(--muted); font-weight: 400; }
.occ-part { background: var(--ok-bg); color: var(--ok-ink); }
.occ-full { background: var(--h1); color: var(--prog-ink); }
.occ-over { background: var(--alert-bg); color: var(--alert-ink); }
.sw.occ-free { border-color: var(--line); } .sw.occ-part { background: var(--ok-bg); border-color: var(--ok); }
.sw.occ-full { background: var(--h1); border-color: var(--h2); } .sw.occ-over { background: var(--alert-bg); border-color: var(--alert); }

/* ---------- Linha do tempo ---------- */
.gantt { display: flex; flex-direction: column; gap: 6px; }
.g-row { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 12px; align-items: center; }
.g-name { font-weight: 500; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-track { position: relative; height: 30px; background: var(--surface-2); border-radius: 8px; }
.g-track.lanes-2 { height: 58px; } .g-track.lanes-3 { height: 86px; } .g-track.lanes-4 { height: 114px; }
.g-head .g-track { background: none; height: 40px; }
.g-month { position: absolute; top: 0; padding-left: 4px; font-size: 12px; font-weight: 500; color: var(--muted); white-space: nowrap; }
.g-grid { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--line); }
.g-today { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--noite); z-index: 0; }
.g-head .g-today-tag { position: absolute; top: 20px; transform: translateX(-50%); padding: 1px 8px; border-radius: 999px; background: var(--noite); color: var(--branco); font-size: 11px; font-weight: 600; z-index: 1; }
.g-bar { position: absolute; top: 3px; height: 24px; display: flex; align-items: center; padding: 0 10px; border-radius: 999px; background: var(--azul); color: var(--branco); font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; z-index: 1; }
.g-bar.g-zero { background: var(--h2); color: var(--ink); }
.g-bar.g-abs { background: repeating-linear-gradient(135deg, var(--bruma) 0 6px, var(--surface-2) 6px 12px); color: var(--noite); border: 1px solid var(--ardosia); }
.abs-note { display: block; margin-top: 4px; font-size: 11px; color: var(--muted); text-align: center; }
.unassigned-row th, .unassigned-row td { border-top: 1px dashed var(--line); font-weight: 500; }
.g-bar.lane-1 { top: 31px; } .g-bar.lane-2 { top: 59px; } .g-bar.lane-3 { top: 87px; }
.g-empty { position: absolute; left: 10px; top: 6px; font-size: 12px; color: var(--muted); }

/* ---------- Logo do cliente ---------- */
.cmark { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 6px; border: 0; background: var(--branco); object-fit: contain; vertical-align: middle; }
.cmark.mono { background: var(--h1); border-color: var(--h1); color: var(--azul-hover); font-weight: 600; letter-spacing: 0.02em; line-height: 1; }
.cmark-sm { width: 22px; height: 22px; font-size: 9px; letter-spacing: 0; border-radius: 5px; }
.cmark-md { width: 30px; height: 30px; font-size: 11px; }
.cmark-lg { width: 48px; height: 48px; font-size: 16px; border-radius: 10px; }
.cmark-xl { width: 80px; height: 80px; font-size: 26px; border-radius: 14px; }
/* Logos mantêm a proporção: altura fixa, largura até um limite (wordmarks largos continuam legíveis). */
img.cmark { padding: 2px; object-fit: contain; }
img.cmark-sm { width: auto; max-width: 64px; height: 22px; }
img.cmark-md { width: auto; max-width: 96px; height: 32px; }
img.cmark-lg { width: auto; max-width: 160px; height: 52px; }
img.cmark-xl { width: auto; max-width: 240px; height: 88px; }
.marks img.cmark { border-radius: 999px; padding: 2px 6px; }
.auth-card label.check { color: #C9D2E6; font-size: 14px; font-weight: 500; }
.with-mark { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.with-mark .u { text-decoration: none; }
.inline-row.end .btn { white-space: nowrap; }
.aloc-table { table-layout: fixed; min-width: 640px; }
.aloc-table col.c-cli { width: 25%; } .aloc-table col.c-papel { width: 21%; } .aloc-table col.c-per { width: 20%; } .aloc-table col.c-ded { width: 10%; } .aloc-table col.c-sit { width: 14%; } .aloc-table col.c-act { width: 10%; }
.title-mark { display: flex; align-items: center; gap: 14px; }
.logo-edit { display: flex; align-items: center; gap: 16px; }
.matrix thead th.proj a { display: inline-flex; flex-direction: column; align-items: center; gap: 6px; text-decoration: none; }
.matrix thead th.proj a .pname { text-decoration: none; color: var(--ink-2); font-weight: 500; }
.cmark { text-decoration: none; }
table.load th[scope="row"] { min-width: 160px; }
table.load thead th { white-space: normal; vertical-align: bottom; }
table.load td .chip + .sub { max-width: 150px; }
table.load th[scope="row"] > a { white-space: nowrap; }
.compact-filters select { width: auto; max-width: 220px; }

/* ---------- Carga por consultor ---------- */
.marks { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.marks a { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px 2px 2px; border-radius: 999px; background: var(--surface-2); font-size: 13px; font-weight: 500; color: var(--ink-2); text-decoration: none; white-space: nowrap; }
.marks a:hover { background: var(--fill); color: var(--ink); }
.marks .cmark { border-radius: 999px; }
.loadcell { white-space: nowrap; }
.loadbar { display: inline-block; width: 64px; height: 8px; border-radius: 4px; background: var(--surface-2); vertical-align: middle; overflow: hidden; }
.loadbar .fill { display: block; height: 100%; border-radius: 4px; background: var(--h3); }
.loadbar .fill.disponivel { background: var(--ok); } .loadbar .fill.limite { background: var(--alert); } .loadbar .fill.semprojeto { background: var(--warn); }
.loadnum { display: inline-block; min-width: 2ch; margin-left: 8px; font-weight: 600; text-align: right; }

/* ---------- Alocações ---------- */
.aloc-group { display: flex; flex-direction: column; gap: 8px; padding-top: 18px; border-top: 1px solid var(--line); }
.aloc-group:first-of-type { border-top: 0; padding-top: 0; }
.aloc-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; }
.aloc-head .strong { font-weight: 600; font-size: 15px; }
.aloc-head .sub { display: inline; margin-left: 8px; }
.aloc-sum { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 13px; color: var(--muted); }
.aloc-sum strong { color: var(--ink); }
.inline-row.end { justify-content: flex-end; flex-wrap: nowrap; }
ul.plain { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }

.narrow-card { max-width: 760px; }
ul.impact { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
label.check { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; }
label.check input { width: 20px; height: 20px; margin-top: 2px; flex: 0 0 auto; }

.card > .pills { margin: 4px 0 12px; }

.param-list { display: flex; flex-direction: column; gap: 6px; }
.param-row { display: grid; grid-template-columns: 90px minmax(0, 1fr) 84px 120px 200px; gap: 8px; align-items: center; }
.param-row.nocode { grid-template-columns: minmax(0, 1fr) 84px 120px 200px; }
.param-row.head { font-size: 13px; font-weight: 500; color: var(--muted); }
.param-row.inactive input { color: var(--muted); }
.param-row form { margin: 0; }
@media (max-width: 640px) { .param-row, .param-row.nocode { grid-template-columns: 1fr 1fr; } .param-row.head { display: none; } }

/* ---------- Resumo semanal ---------- */
.report { display: flex; flex-direction: column; gap: 12px; }
.report h3 { font-family: var(--font-display); font-weight: 600; font-size: 16px; letter-spacing: -0.01em; margin: 12px 0 0; }
.report .report-title { font-size: 20px; }
.report-list { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
ol.steps { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: var(--surface-2); padding: 1px 6px; border-radius: 4px; }

/* ---------- Login (área escura da marca) ---------- */
.auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px 16px; background: var(--ground); }
.auth-card { width: 100%; max-width: 400px; background: var(--noite); color: var(--branco); border-radius: 28px; padding: 40px 32px; display: flex; flex-direction: column; gap: 18px; }
.auth-card .brand { color: var(--branco); }
.auth-card .wordmark { font-size: 34px; }
.auth-card .tagline { font-size: 15px; line-height: 1.5; color: var(--dark-ink); margin-bottom: 6px; }
.auth-card h1 { font-size: 20px; color: var(--branco); }
.auth-card .field { color: var(--dark-ink); }
.auth-card input { height: 50px; border-radius: 12px; border-color: var(--dark-border); background: var(--dark-field); color: var(--branco); font-size: 16px; }
.auth-card input:focus-visible { border-color: var(--h2); box-shadow: 0 0 0 3px rgba(169, 185, 248, 0.3); }
.auth-card .btn.primary { height: 52px; border-radius: 14px; margin-top: 8px; font-size: 16px; }
.auth-card .note { font-size: 13px; color: var(--dark-ink-2); }
.auth-card .msg.erro { background: rgba(255, 180, 169, 0.12); color: var(--dark-error); }
.auth-card a, .auth-card a:hover { color: var(--branco); }
.auth-card input:focus-visible, .auth-card button:focus-visible { outline-color: var(--h2); }

/* ---------- Classes de posição (o CSP do app não permite estilo inline) ---------- */
.w-0 { width: 0%; } .w-5 { width: 5%; } .w-10 { width: 10%; } .w-15 { width: 15%; } .w-20 { width: 20%; } .w-25 { width: 25%; } .w-30 { width: 30%; } .w-35 { width: 35%; } .w-40 { width: 40%; } .w-45 { width: 45%; } .w-50 { width: 50%; } .w-55 { width: 55%; } .w-60 { width: 60%; } .w-65 { width: 65%; } .w-70 { width: 70%; } .w-75 { width: 75%; } .w-80 { width: 80%; } .w-85 { width: 85%; } .w-90 { width: 90%; } .w-95 { width: 95%; } .w-100 { width: 100%; }
.gl-0 { left: 0%; } .gl-1 { left: 1%; } .gl-2 { left: 2%; } .gl-3 { left: 3%; } .gl-4 { left: 4%; } .gl-5 { left: 5%; } .gl-6 { left: 6%; } .gl-7 { left: 7%; } .gl-8 { left: 8%; } .gl-9 { left: 9%; } .gl-10 { left: 10%; } .gl-11 { left: 11%; } .gl-12 { left: 12%; } .gl-13 { left: 13%; } .gl-14 { left: 14%; } .gl-15 { left: 15%; } .gl-16 { left: 16%; } .gl-17 { left: 17%; } .gl-18 { left: 18%; } .gl-19 { left: 19%; } .gl-20 { left: 20%; } .gl-21 { left: 21%; } .gl-22 { left: 22%; } .gl-23 { left: 23%; } .gl-24 { left: 24%; } .gl-25 { left: 25%; } .gl-26 { left: 26%; } .gl-27 { left: 27%; } .gl-28 { left: 28%; } .gl-29 { left: 29%; } .gl-30 { left: 30%; } .gl-31 { left: 31%; } .gl-32 { left: 32%; } .gl-33 { left: 33%; } .gl-34 { left: 34%; } .gl-35 { left: 35%; } .gl-36 { left: 36%; } .gl-37 { left: 37%; } .gl-38 { left: 38%; } .gl-39 { left: 39%; } .gl-40 { left: 40%; } .gl-41 { left: 41%; } .gl-42 { left: 42%; } .gl-43 { left: 43%; } .gl-44 { left: 44%; } .gl-45 { left: 45%; } .gl-46 { left: 46%; } .gl-47 { left: 47%; } .gl-48 { left: 48%; } .gl-49 { left: 49%; } .gl-50 { left: 50%; } .gl-51 { left: 51%; } .gl-52 { left: 52%; } .gl-53 { left: 53%; } .gl-54 { left: 54%; } .gl-55 { left: 55%; } .gl-56 { left: 56%; } .gl-57 { left: 57%; } .gl-58 { left: 58%; } .gl-59 { left: 59%; } .gl-60 { left: 60%; } .gl-61 { left: 61%; } .gl-62 { left: 62%; } .gl-63 { left: 63%; } .gl-64 { left: 64%; } .gl-65 { left: 65%; } .gl-66 { left: 66%; } .gl-67 { left: 67%; } .gl-68 { left: 68%; } .gl-69 { left: 69%; } .gl-70 { left: 70%; } .gl-71 { left: 71%; } .gl-72 { left: 72%; } .gl-73 { left: 73%; } .gl-74 { left: 74%; } .gl-75 { left: 75%; } .gl-76 { left: 76%; } .gl-77 { left: 77%; } .gl-78 { left: 78%; } .gl-79 { left: 79%; } .gl-80 { left: 80%; } .gl-81 { left: 81%; } .gl-82 { left: 82%; } .gl-83 { left: 83%; } .gl-84 { left: 84%; } .gl-85 { left: 85%; } .gl-86 { left: 86%; } .gl-87 { left: 87%; } .gl-88 { left: 88%; } .gl-89 { left: 89%; } .gl-90 { left: 90%; } .gl-91 { left: 91%; } .gl-92 { left: 92%; } .gl-93 { left: 93%; } .gl-94 { left: 94%; } .gl-95 { left: 95%; } .gl-96 { left: 96%; } .gl-97 { left: 97%; } .gl-98 { left: 98%; } .gl-99 { left: 99%; } .gl-100 { left: 100%; }
.gw-1 { width: 1%; } .gw-2 { width: 2%; } .gw-3 { width: 3%; } .gw-4 { width: 4%; } .gw-5 { width: 5%; } .gw-6 { width: 6%; } .gw-7 { width: 7%; } .gw-8 { width: 8%; } .gw-9 { width: 9%; } .gw-10 { width: 10%; } .gw-11 { width: 11%; } .gw-12 { width: 12%; } .gw-13 { width: 13%; } .gw-14 { width: 14%; } .gw-15 { width: 15%; } .gw-16 { width: 16%; } .gw-17 { width: 17%; } .gw-18 { width: 18%; } .gw-19 { width: 19%; } .gw-20 { width: 20%; } .gw-21 { width: 21%; } .gw-22 { width: 22%; } .gw-23 { width: 23%; } .gw-24 { width: 24%; } .gw-25 { width: 25%; } .gw-26 { width: 26%; } .gw-27 { width: 27%; } .gw-28 { width: 28%; } .gw-29 { width: 29%; } .gw-30 { width: 30%; } .gw-31 { width: 31%; } .gw-32 { width: 32%; } .gw-33 { width: 33%; } .gw-34 { width: 34%; } .gw-35 { width: 35%; } .gw-36 { width: 36%; } .gw-37 { width: 37%; } .gw-38 { width: 38%; } .gw-39 { width: 39%; } .gw-40 { width: 40%; } .gw-41 { width: 41%; } .gw-42 { width: 42%; } .gw-43 { width: 43%; } .gw-44 { width: 44%; } .gw-45 { width: 45%; } .gw-46 { width: 46%; } .gw-47 { width: 47%; } .gw-48 { width: 48%; } .gw-49 { width: 49%; } .gw-50 { width: 50%; } .gw-51 { width: 51%; } .gw-52 { width: 52%; } .gw-53 { width: 53%; } .gw-54 { width: 54%; } .gw-55 { width: 55%; } .gw-56 { width: 56%; } .gw-57 { width: 57%; } .gw-58 { width: 58%; } .gw-59 { width: 59%; } .gw-60 { width: 60%; } .gw-61 { width: 61%; } .gw-62 { width: 62%; } .gw-63 { width: 63%; } .gw-64 { width: 64%; } .gw-65 { width: 65%; } .gw-66 { width: 66%; } .gw-67 { width: 67%; } .gw-68 { width: 68%; } .gw-69 { width: 69%; } .gw-70 { width: 70%; } .gw-71 { width: 71%; } .gw-72 { width: 72%; } .gw-73 { width: 73%; } .gw-74 { width: 74%; } .gw-75 { width: 75%; } .gw-76 { width: 76%; } .gw-77 { width: 77%; } .gw-78 { width: 78%; } .gw-79 { width: 79%; } .gw-80 { width: 80%; } .gw-81 { width: 81%; } .gw-82 { width: 82%; } .gw-83 { width: 83%; } .gw-84 { width: 84%; } .gw-85 { width: 85%; } .gw-86 { width: 86%; } .gw-87 { width: 87%; } .gw-88 { width: 88%; } .gw-89 { width: 89%; } .gw-90 { width: 90%; } .gw-91 { width: 91%; } .gw-92 { width: 92%; } .gw-93 { width: 93%; } .gw-94 { width: 94%; } .gw-95 { width: 95%; } .gw-96 { width: 96%; } .gw-97 { width: 97%; } .gw-98 { width: 98%; } .gw-99 { width: 99%; } .gw-100 { width: 100%; }

@media print {
  .top, .tabbar, .no-print, #pv-bar, #pv-toast { display: none !important; }
  body { background: #FFFFFF; color: #000000; }
  main { padding: 0; max-width: none; }
  .card { padding: 0; }
  .scroll { overflow: visible; }
}
@media (max-width: 1240px) and (min-width: 821px) {
  .top { gap: 0 16px; padding: 0 20px; }
  .mainnav a { padding: 0 11px; }
  .top-side .who-name { display: none; }
}
@media (max-width: 1080px) and (min-width: 821px) {
  .sync-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
/* Celular e tablet em pé: navegação vira barra de abas inferior, como um app. */
@media (max-width: 820px) {
  :root { --tabbar: calc(64px + env(safe-area-inset-bottom, 0px)); }
  body { font-size: 16px; }
  .top { padding: 0 16px; padding-top: env(safe-area-inset-top, 0px); min-height: 56px; gap: 12px; }
  .top .brand { min-height: 56px; }
  .top .mainnav { display: none; }
  .top-side .who-name, .top-side .logout { display: none; }
  .sync-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .tabbar { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px)); background: rgba(255, 255, 255, 0.9); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); border-top: 1px solid var(--line); }
  .tabbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 50px; font-size: 11px; font-weight: 500; color: var(--muted); text-decoration: none; }
  .tabbar svg { width: 24px; height: 24px; }
  .tabbar a[aria-current="page"] { color: var(--azul); }
  main { padding: 20px 16px calc(var(--tabbar) + 28px); gap: 20px; }
  h1 { font-size: 30px; }
  .head p { font-size: 15px; }
  .card { padding: 18px 16px; border-radius: 18px; }
  .kpis { padding: 4px; }
  .kpi { flex: 1 1 45%; padding: 12px 14px; }
  .kpi + .kpi::before { display: none; }
  .kpi .value { font-size: 28px; }
  .hide-sm { display: none !important; }
  .only-sm { display: block !important; }
  table.load .loadbar { display: none; }
  .aloc-table { table-layout: auto; min-width: 0; }
  .aloc-table td.compact, .aloc-table th.compact { padding-left: 4px; padding-right: 0; }
  table.load td:last-child .sub { display: none; }
  table.load .loadnum { margin-left: 0; }
  table.load th[scope=row] .sub { display: none; }
  table.load th[scope="row"] { min-width: 0; }
  table.load th[scope="row"] > a { white-space: normal; }
  table.load td:last-child { width: 1%; }
  thead th, td, tbody th { padding-left: 8px; padding-right: 8px; }
  .aloc-table colgroup { display: none; }
  table.load.minw-lg, table.fit-sm { min-width: 0; }
  table.load .loadbar { width: 44px; }
  .head .actions { width: 100%; justify-content: flex-start; }
}
@media (max-width: 640px) {
  .teammap { padding: 20px 16px 18px; border-radius: 20px; }
  .tm-track { margin: 0 14px; }
  .tm-dot { width: 30px; height: 30px; margin-left: -15px; font-size: 11px; top: 14px; }
  .filterbar .field { flex: 1 1 45%; }
  .inline-row > .label, .inline-row > .fixed { flex: 1 1 100%; }
  .g-row { grid-template-columns: 110px minmax(0, 1fr); }
  .tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs a { padding: 0 14px; }
  .tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tile { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
.th-sub { display: block; font-size: 12px; font-weight: 400; color: var(--muted); white-space: nowrap; }
.banner-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; }
.tags { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; padding: 0; }
.tags li { padding: 3px 10px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 13px; font-weight: 500; }
.tags a { color: inherit; text-decoration: none; }
.tags a:hover { text-decoration: underline; }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 4px 24px; margin: 0; padding: 18px 0 2px; border-top: 1px solid var(--line); }
.facts > div { display: flex; flex-direction: column; gap: 2px; padding: 4px 0 10px; }
.facts dt { font-size: 13px; font-weight: 500; color: var(--muted); }
.facts dd { margin: 0; font-family: var(--font-display); font-size: 26px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; font-variant-numeric: tabular-nums; }
.facts dd a { text-decoration: none; }
.facts dd a:not(.late) { color: var(--ink); }
.facts dd .chip { font-family: var(--font-body); font-size: 14px; letter-spacing: 0; }
.facts .sub { font-size: 13px; color: var(--muted); line-height: 1.4; }
@media (max-width: 640px) { .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; } .facts dd { font-size: 22px; } }
.aloc-table td .chip { white-space: normal; }

/* Explicações recolhidas: o texto de apoio fica disponível sem ocupar a tela. */
details.info { font-size: 14px; color: var(--muted); }
details.info > summary { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; cursor: pointer; list-style: none; color: var(--ink-2); font-weight: 500; }
details.info > summary::-webkit-details-marker { display: none; }
details.info > summary::before { content: ""; width: 16px; height: 16px; border-radius: 50%; background: var(--fill) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='4.6' r='1.1' fill='%2355607A'/%3E%3Crect x='7.1' y='6.6' width='1.8' height='5.6' rx='.9' fill='%2355607A'/%3E%3C/svg%3E") center / 16px no-repeat; }
details.info[open] > summary { margin-bottom: 6px; }
details.info ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
details.info p { margin: 0 0 4px; }

/* Primeiros passos: lista de configuração com o que falta e o botão de cada etapa. */
.setup { padding: 0; overflow: hidden; }
.setup h2 { padding: 22px 24px 4px; }
.setup > p { padding: 0 24px 14px; color: var(--muted); }
.setup ol { list-style: none; margin: 0; padding: 0; }
.setup li { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 16px 24px; border-top: 1px solid var(--line); }
.setup .n { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--fill); color: var(--ink-2); font-weight: 600; font-size: 14px; }
.setup li.done .n { background: var(--ok-bg); color: var(--ok-ink); }
.setup li strong { display: block; font-weight: 600; }
.setup li span.sub { display: block; color: var(--muted); font-size: 14px; }
@media (max-width: 640px) { .setup li { grid-template-columns: 28px minmax(0, 1fr); } .setup li .btn { grid-column: 2; justify-self: start; } }

/* Ações de linha visíveis (editar sem depender de clicar no nome). */
.row-actions { display: flex; justify-content: flex-end; gap: 6px; white-space: nowrap; }
.empty-state { display: grid; gap: 10px; justify-items: start; padding: 8px 0; }
.empty-state p { color: var(--muted); }
.alert-item a.btn { min-height: 36px; margin-top: 4px; }
.free-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.free-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); }
.free-list li:last-child { border-bottom: 0; }
.free-list a:not(.btn) { color: var(--ink); text-decoration: none; font-weight: 500; }
.free-list .sub { display: block; font-size: 13px; color: var(--muted); }
.actions.start { justify-content: flex-start; }
.only-sm { display: none; }
.nowrap { white-space: nowrap; }
.sug-table input[type=text] { min-width: 180px; }
.sug-table input.ded { width: 84px; }
.sug-table input[type=checkbox] { width: 20px; height: 20px; accent-color: var(--azul); }
.suggest-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; background: var(--azul-tint); }
.suggest-bar .sub { display: block; color: var(--ink-2); font-size: 14px; }

/* Equipe agora em três colunas: escala para dezenas de consultores, cada ponto abre o consultor. */
.tm-zones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.tm-col { border-radius: 16px; padding: 14px; display: flex; flex-direction: column; gap: 12px; min-height: 120px; }
.tm-col.z-free { background: rgba(14, 122, 95, 0.22); }
.tm-col.z-mid { background: rgba(169, 185, 248, 0.10); }
.tm-col.z-hot { background: rgba(180, 35, 24, 0.24); }
.tm-col-head { display: flex; align-items: baseline; gap: 10px; color: var(--dark-ink); font-size: 14px; font-weight: 500; text-decoration: none; }
.tm-col-head:hover { color: var(--branco); }
.tm-n { font-family: var(--font-display); font-size: 28px; font-weight: 600; color: var(--branco); line-height: 1; }
.tm-hint { display: block; font-size: 12px; font-weight: 400; color: var(--dark-ink-2); }
.tm-dots { display: flex; flex-wrap: wrap; gap: 6px; }
.tm-zones .tm-dot { position: static; margin: 0; width: 34px; height: 34px; font-size: 12px; box-shadow: none; }
@media (max-width: 640px) { .tm-zones { grid-template-columns: 1fr; } .tm-col { min-height: 0; } .tm-zones .tm-dot { width: 32px; height: 32px; } }
.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 4px 16px; }

/* Painel lateral do consultor */
.drawer { position: fixed; inset: 0; z-index: 60; }
.drawer-scrim { position: absolute; inset: 0; background: rgba(10, 20, 41, 0.28); opacity: 0; transition: opacity 0.18s ease; }
.drawer-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(440px, 100%); background: var(--surface); box-shadow: -12px 0 40px rgba(10, 20, 41, 0.16); transform: translateX(24px); opacity: 0; transition: transform 0.18s ease, opacity 0.18s ease; overflow-y: auto; padding: 28px 24px 32px; outline: none; }
.drawer.open .drawer-scrim { opacity: 1; }
.drawer.open .drawer-panel { transform: none; opacity: 1; }
.drawer-close { position: absolute; top: 14px; right: 14px; width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--fill); color: var(--ink-2); font-size: 24px; line-height: 1; cursor: pointer; }
.drawer-close:hover { background: var(--surface-2); color: var(--ink); }
.no-scroll, .no-scroll body { overflow: hidden; }
.dr-head h2 { font-size: 24px; padding-right: 44px; }
.dr-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 16px; }
.dr-sec { margin-top: 18px; }
.dr-sec h3 { font-size: 15px; margin-bottom: 8px; }
.dr-list, .dr-acts { list-style: none; margin: 0; padding: 0; }
.dr-list li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); font-size: 14px; }
.dr-list li.is-focus { background: var(--azul-tint); margin: 0 -10px; padding: 8px 10px; border-radius: 10px; }
.dr-meta { display: inline-flex; gap: 10px; align-items: center; white-space: nowrap; color: var(--ink-2); }
.dr-acts li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); font-size: 14px; }
.dr-title { display: block; color: var(--ink); }
.dr-acts .sub { display: block; font-size: 12px; color: var(--muted); }
.dr-due { white-space: nowrap; text-align: right; font-size: 13px; color: var(--ink-2); display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
.dr-alm { font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; min-height: 32px; padding: 0 8px; margin-right: -8px; }
.dr-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.dr-due.is-late { color: var(--alert); font-weight: 600; }
.dr-facts .sub { display: block; font-size: 12px; color: var(--muted); margin-top: 2px; }
@media (max-width: 640px) { .drawer-panel { width: 100%; padding: 22px 16px 28px; } }
@media (prefers-reduced-motion: reduce) { .drawer-panel, .drawer-scrim { transition: none; } }

/* Dica imediata nos pontos da equipe (o title nativo demora). */
.tm-dot { position: relative; }
.tm-dot[data-tip]:hover::after, .tm-dot[data-tip]:focus-visible::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); white-space: nowrap; background: var(--branco); color: var(--noite); font-size: 12px; font-weight: 600; padding: 6px 10px; border-radius: 8px; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25); z-index: 5; pointer-events: none; }
.searchbox { position: relative; display: flex; align-items: center; gap: 10px; }
.searchbox input[type=search] { min-height: 40px; padding: 0 14px 0 38px; border-radius: 12px; border: 1px solid var(--field); background: var(--input-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2355607A' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 12px center no-repeat; font: inherit; font-size: 15px; width: 100%; max-width: 320px; color: var(--ink); }
.searchbox .count { font-size: 13px; color: var(--muted); white-space: nowrap; }
tr[hidden], li[hidden], .aloc-group[hidden] { display: none !important; }
.top-search input { min-height: 36px; width: 180px; padding: 0 12px 0 34px; border-radius: 999px; border: 0; background: var(--fill) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%2355607A' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 11px center no-repeat; font-size: 14px; transition: width 0.15s ease; }
.top-search input:focus { width: 240px; background-color: var(--surface); box-shadow: 0 0 0 2px var(--azul); outline: none; }
@media (max-width: 1180px) { .top-search input { width: 130px; } }
@media (max-width: 820px) { .top-search { display: none; } }
.searchbox input[type=search] { max-width: 420px; }
.results { list-style: none; margin: 0; padding: 0; }
.results li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.results li:last-child { border-bottom: 0; }
.results a { text-decoration: none; font-weight: 500; }
.results .sub { display: block; font-size: 13px; color: var(--muted); }
mark { background: #FFF1B8; color: inherit; border-radius: 3px; padding: 0 1px; }

/* Ordenação por coluna */
.th-sort { all: unset; cursor: pointer; display: inline-block; padding: 6px 0; margin: -6px 0; text-align: inherit; border-radius: 4px; }
.th-sort:focus-visible { outline: 2px solid var(--azul, #1f4fd1); outline-offset: 2px; }
th[aria-sort] .th-sort::after { content: ''; display: inline-block; vertical-align: middle; width: 0; height: 0; margin-left: 4px; opacity: 0.25; border: 4px solid transparent; border-top-color: currentColor; transform: translateY(2px); }
th[aria-sort]:hover .th-sort::after { opacity: 0.35; }
th[aria-sort="ascending"] .th-sort::after { opacity: 1; border-top-color: transparent; border-bottom-color: currentColor; transform: translateY(-2px); }
th[aria-sort="descending"] .th-sort::after { opacity: 1; }

/* Matriz recolhida por padrão; primeira coluna fixa ao rolar para o lado */
.matrix-wrap > summary { list-style: none; margin-bottom: 12px; }
.matrix-wrap > summary::-webkit-details-marker { display: none; }
.matrix-wrap[open] > summary { margin-bottom: 14px; }
table.matrix th[scope="row"] { position: sticky; left: 0; background: var(--surface); z-index: 1; }
mark { background: var(--lume-tint, #FFF1C2); color: inherit; border-radius: 3px; padding: 0 1px; }

/* Foco visível sobre o mapa escuro da equipe */
.teammap a:focus-visible { outline-color: var(--branco, #fff); }
/* Alvo de toque maior nos nomes e números das tabelas */
tbody th[scope="row"] > a:first-child { display: inline-block; padding: 6px 0; margin: -6px 0; }
td.right > a { display: inline-block; min-width: 28px; padding: 6px 0; margin: -6px 0; }
.filterbar select { border-color: var(--field); }
.sync-state { min-width: 44px; justify-content: center; }
table.matrix td.cell { min-width: 64px; }
@media (min-width: 900px) { tbody th[scope="row"] { min-width: 170px; } }
.dist { margin-top: 10px; padding: 12px 14px; border-radius: 12px; background: var(--azul-tint); }
.dist p { margin: 0; } .dist p + p { margin-top: 4px; }
.alert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px 20px; }
@media (max-width: 640px) { .row-actions { flex-wrap: wrap; white-space: normal; } }
.scroll.has-more { background: linear-gradient(to left, rgba(10, 20, 41, 0.14), rgba(10, 20, 41, 0) 28px) right / 28px 100% no-repeat; }
.alert-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 8px 28px; }
.alert-h { font-size: 15px; margin: 0 0 6px; }
.alert-list { list-style: none; margin: 0 0 8px; padding: 0; }
.alert-list li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); }
.alert-list li .sub { display: block; font-size: 13px; color: var(--muted); }
.small-h { font-size: 14px; margin: 16px 0 4px; }