/* Aline Resolve — identidade em 3 territórios (Personalizar → Cores da marca), claro e escuro.
   Celular primeiro; texto ≥ 16px; alvos ≥ 44px; contraste AA. Sem fontes externas. */

:root,
:root[data-marca="quartzo"] {
  --primaria: #a14e6f; --primaria-forte: #84385a; --primaria-texto: #ffffff;
  --acento: #b8913a; --bg: #fdf8f6; --sup: #ffffff; --sup-2: #f7e9ee; --borda: #ecd9df;
  --texto: #2b1f24; --mudo: #74626a; --sombra-cor: 120 40 70;
}
:root[data-marca="terracota"] {
  --primaria: #a24f33; --primaria-forte: #843c23; --primaria-texto: #ffffff;
  --acento: #6f8152; --bg: #fcf7f1; --sup: #ffffff; --sup-2: #f6e8dc; --borda: #ead8c8;
  --texto: #2a1e17; --mudo: #77655a; --sombra-cor: 120 70 40;
}
:root[data-marca="lavanda"] {
  --primaria: #6f55a0; --primaria-forte: #574086; --primaria-texto: #ffffff;
  --acento: #5f8f6d; --bg: #faf8fd; --sup: #ffffff; --sup-2: #eee8f7; --borda: #ddd5ec;
  --texto: #221d2b; --mudo: #6c6577; --sombra-cor: 80 60 130;
}
:root {
  --verde: #2f7d57; --azul: #2f6fd1; --amarelo: #a86d12; --vermelho: #b63a3a; --cinza: #8b8389;
  --raio: 18px; --raio-p: 12px;
  --sombra: 0 1px 2px rgb(var(--sombra-cor) / 0.06), 0 8px 24px rgb(var(--sombra-cor) / 0.07);
  --fonte: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --fonte-titulo: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #15111a; --sup: #1f1924; --sup-2: #2a2230; --borda: #3a3040; --texto: #f4eef2; --mudo: #b6a9b2;
    --primaria: #e391b1; --primaria-forte: #f0b0c8; --primaria-texto: #2a0f1c;
    --verde: #5cc796; --azul: #78a8f0; --amarelo: #e3b25a; --vermelho: #f08a8a; color-scheme: dark;
  }
  :root[data-marca="terracota"]:not([data-theme="light"]) { --primaria: #eb9a78; --primaria-forte: #f4b79c; --primaria-texto: #2b130a; --bg: #17120f; --sup: #211a16; --sup-2: #2d231d; --borda: #40332a; }
  :root[data-marca="lavanda"]:not([data-theme="light"]) { --primaria: #b9a2e6; --primaria-forte: #cdbbf0; --primaria-texto: #1d1430; --bg: #13111a; --sup: #1c1925; --sup-2: #272233; --borda: #383047; }
}
:root[data-theme="dark"] {
  --bg: #15111a; --sup: #1f1924; --sup-2: #2a2230; --borda: #3a3040; --texto: #f4eef2; --mudo: #b6a9b2;
  --primaria: #e391b1; --primaria-forte: #f0b0c8; --primaria-texto: #2a0f1c;
  --verde: #5cc796; --azul: #78a8f0; --amarelo: #e3b25a; --vermelho: #f08a8a; color-scheme: dark;
}
:root[data-theme="dark"][data-marca="terracota"] { --primaria: #eb9a78; --primaria-forte: #f4b79c; --primaria-texto: #2b130a; --bg: #17120f; --sup: #211a16; --sup-2: #2d231d; --borda: #40332a; }
:root[data-theme="dark"][data-marca="lavanda"] { --primaria: #b9a2e6; --primaria-forte: #cdbbf0; --primaria-texto: #1d1430; --bg: #13111a; --sup: #1c1925; --sup-2: #272233; --borda: #383047; }

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--texto); font: 16px/1.55 var(--fonte);
  padding-bottom: calc(150px + env(safe-area-inset-bottom));
}
h1, h2, h3, .numero, .marca-texto strong { font-family: var(--fonte-titulo); letter-spacing: -0.01em; }
h1 { font-size: 1.75rem; margin: 0.4rem 0 0.9rem; line-height: 1.2; }
h2 { font-size: 1.15rem; margin: 0 0 0.55rem; }
h3 { font-size: 0.95rem; margin: 1rem 0 0.4rem; color: var(--mudo); }
p { margin: 0.3rem 0; }
a { color: var(--primaria); }
small { font-size: 0.86rem; }
.mudo { color: var(--mudo); }
.pequeno { font-size: 0.86rem; }
.lead { font-size: 1.08rem; color: var(--mudo); margin-bottom: 1rem; }
.flex1 { flex: 1; min-width: 0; }
.ic { flex: none; }

/* ---------- topo ---------- */
.topo {
  position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: calc(10px + env(safe-area-inset-top)) 16px 10px;
  background: color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--borda);
}
.marca-topo { display: flex; align-items: center; gap: 10px; min-width: 0; background: none; border: 0; padding: 0; color: inherit; font: inherit; cursor: pointer; text-align: left; }
.marca-texto { display: flex; flex-direction: column; min-width: 0; }
.marca-texto strong { font-size: 1.12rem; }
.marca-texto small { color: var(--mudo); font-size: 0.74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.selo {
  flex: none; width: 40px; height: 40px; border-radius: 13px; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--primaria), var(--primaria-forte)); color: var(--primaria-texto);
  font: 700 1rem/1 var(--fonte-titulo); box-shadow: 0 4px 12px rgb(var(--sombra-cor) / 0.25);
}
.topo-acoes { display: flex; align-items: center; gap: 8px; }
.botao-icone { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--borda); background: var(--sup); color: var(--texto); display: grid; place-items: center; cursor: pointer; }
.chip-sync {
  display: inline-flex; align-items: center; gap: 8px; max-width: 46vw; padding: 8px 12px; min-height: 44px; border-radius: 999px;
  border: 1px solid var(--borda); background: var(--sup); color: var(--texto); font: inherit; font-size: 0.82rem; cursor: pointer;
}
.chip-sync .txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chip-sync .ponto { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--cinza); }
.chip-sync[data-cor="verde"] .ponto { background: var(--verde); }
.chip-sync[data-cor="azul"] .ponto { background: var(--azul); animation: pulsar 1s infinite alternate; }
.chip-sync[data-cor="amarelo"] .ponto { background: var(--amarelo); }
.chip-sync[data-cor="vermelho"] .ponto { background: var(--vermelho); }
@keyframes pulsar { to { opacity: 0.3; } }

/* ---------- cronômetro ---------- */
.cronometro-barra {
  position: sticky; top: 65px; z-index: 19; display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  padding: 10px 16px; background: var(--primaria); color: var(--primaria-texto);
}
.cronometro-barra .pulso { width: 10px; height: 10px; border-radius: 50%; background: currentColor; animation: pulsar 1s infinite alternate; }
.cronometro-barra .btn { background: var(--sup); color: var(--texto); border-color: transparent; }
.cronometro-barra .btn.escuro { background: var(--texto); color: var(--bg); }
.cronometro-barra .link { color: var(--primaria-texto); }

/* ---------- estrutura ---------- */
.layout { max-width: 1200px; margin: 0 auto; }
.tela { padding: 14px 16px; outline: none; }
.nav-lateral { display: none; }
.nav-inferior {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 30; display: grid; grid-template-columns: repeat(5, 1fr);
  background: var(--sup); border-top: 1px solid var(--borda); padding-bottom: env(safe-area-inset-bottom);
  box-shadow: 0 -6px 20px rgb(var(--sombra-cor) / 0.06);
}
.nav-inferior button {
  min-height: 62px; border: 0; background: none; color: var(--mudo); font: inherit; font-size: 0.72rem;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; cursor: pointer;
}
.nav-inferior button.ativo { color: var(--primaria); font-weight: 700; }
.fab {
  position: fixed; right: 16px; bottom: calc(78px + env(safe-area-inset-bottom)); z-index: 31; min-height: 54px; padding: 0 22px;
  border-radius: 999px; border: 0; background: linear-gradient(135deg, var(--primaria), var(--primaria-forte)); color: var(--primaria-texto);
  font: inherit; font-weight: 700; box-shadow: 0 10px 24px rgb(var(--sombra-cor) / 0.35); cursor: pointer;
}

@media (min-width: 960px) {
  body { padding-bottom: 40px; }
  .layout { display: grid; grid-template-columns: 236px 1fr; gap: 20px; padding: 0 20px; }
  .nav-lateral {
    display: flex; flex-direction: column; gap: 2px; position: sticky; top: 84px; align-self: start; margin-top: 14px;
    padding: 10px; background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra);
  }
  .nav-lateral .nav-grupo { margin: 10px 10px 4px; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--mudo); }
  .nav-lateral button { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px; background: none; color: var(--texto); font: inherit; cursor: pointer; text-align: left; }
  .nav-lateral button:hover { background: var(--sup-2); }
  .nav-lateral button.ativo { background: var(--sup-2); color: var(--primaria); font-weight: 700; }
  .nav-inferior { display: none; }
  .fab { bottom: 28px; right: 28px; }
  .tela { padding: 18px 4px 40px; }
}

/* ---------- blocos ---------- */
.cartao {
  display: block; width: 100%; text-align: left; color: inherit; font: inherit; background: var(--sup);
  border: 1px solid var(--borda); border-radius: var(--raio); padding: 16px 18px; margin: 0 0 14px; box-shadow: var(--sombra);
}
.cartao.compacto { padding: 10px 14px; }
button.cartao { cursor: pointer; transition: transform 0.15s ease; }
button.cartao:hover { transform: translateY(-1px); }
.colunas { display: grid; gap: 14px; margin-bottom: 14px; }
@media (min-width: 760px) { .colunas { grid-template-columns: 1fr 1fr; } .colunas > .cartao { margin: 0; } }
.linha-entre { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.numero { font-size: 2rem; font-weight: 700; margin: 0.15rem 0; }
.numero small { font: 400 0.92rem var(--fonte); color: var(--mudo); }
.nota[data-nivel="alerta"] { color: var(--amarelo); font-weight: 600; }
.nota[data-nivel="cheio"] { color: var(--vermelho); font-weight: 600; }
.nota[data-nivel="ok"] { color: var(--mudo); }
.script { background: var(--sup-2); border-radius: var(--raio-p); padding: 12px 14px; white-space: pre-line; }
.marcadores { margin: 0; padding-left: 1.2rem; } .marcadores li { margin: 0.35rem 0; }
.tag { display: inline-block; padding: 2px 10px; border-radius: 999px; background: var(--sup-2); font-size: 0.8rem; }
.tag-aviso { background: color-mix(in srgb, var(--amarelo) 22%, transparent); }
.etiqueta { display: inline-block; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--primaria); font-weight: 700; }

/* boas-vindas */
.boas-vindas { margin: 4px 0 16px; }
.boas-vindas h1 { font-size: 2rem; margin: 0 0 6px; }
.data-hoje { color: var(--mudo); text-transform: capitalize; margin: 0; }
.boas-vindas blockquote { margin: 8px 0 12px; padding: 10px 14px; border-left: 3px solid var(--acento); background: var(--sup-2); border-radius: 0 12px 12px 0; font-family: var(--fonte-titulo); font-style: italic; }
.busca-falsa { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 50px; padding: 0 16px; border: 1px solid var(--borda); border-radius: 999px; background: var(--sup); color: var(--mudo); font: inherit; cursor: pointer; text-align: left; }
.celebracao { display: flex; gap: 12px; align-items: center; background: linear-gradient(135deg, color-mix(in srgb, var(--acento) 20%, var(--sup)), var(--sup)); }
.celebracao .ic { color: var(--acento); }
.descanso { background: var(--sup-2); }
.atalhos-rapidos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 14px; }
@media (min-width: 760px) { .atalhos-rapidos { grid-template-columns: repeat(4, 1fr); } }
.atalho {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-height: 84px; padding: 14px; border-radius: var(--raio);
  border: 1px solid var(--borda); background: var(--sup); color: var(--texto); font: inherit; font-weight: 600; cursor: pointer; box-shadow: var(--sombra); text-align: left;
}
.atalho .ic { color: var(--primaria); }
.grade-atalhos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }

/* listas */
.lista, .lista-cartoes { list-style: none; padding: 0; margin: 0; }
.lista-cartoes > li > .cartao { margin-bottom: 10px; }
.grade-cartoes { display: grid; gap: 10px; }
@media (min-width: 760px) { .grade-cartoes { grid-template-columns: 1fr 1fr; } .grade-cartoes > li > .cartao { margin: 0; height: 100%; } }
.item { display: flex; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid var(--borda); }
.item:first-child { border-top: 0; }
.item.vencida strong { color: var(--vermelho); }
.item.feito { opacity: 0.7; }
.item .data, .item .hora { flex: none; width: 66px; font-weight: 700; font-size: 0.95rem; line-height: 1.2; }
.item .data small, .item .hora small { display: block; color: var(--mudo); font-weight: 400; }
.item p { margin: 0.2rem 0; }
.riscado { text-decoration: line-through; }
.check {
  flex: none; width: 44px; height: 44px; border-radius: 50%; border: 2px solid var(--borda); background: var(--sup);
  color: transparent; display: grid; place-items: center; cursor: pointer;
}
.check:hover, .check.marcado { color: var(--verde); border-color: var(--verde); }
.check.marcado { background: color-mix(in srgb, var(--verde) 14%, var(--sup)); }
.pessoa { font-weight: 600; } .pessoa-luiz { color: var(--azul); } .pessoa-aline { color: var(--primaria); }
.avatar { flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--sup-2); color: var(--primaria); font: 700 1.1rem var(--fonte-titulo); }
.avatar.grande { width: 60px; height: 60px; font-size: 1.5rem; }
.cartao.cliente { display: flex; gap: 12px; align-items: flex-start; }
.cabeca-ficha { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 6px 0 4px; }
.cabeca-ficha h1 { margin: 0; }
.linha-busca { display: flex; flex-direction: column; gap: 2px; }
.vazio { text-align: center; padding: 34px 16px; background: var(--sup); border: 1px dashed var(--borda); border-radius: var(--raio); color: var(--mudo); margin-bottom: 14px; }
.vazio .ic { color: var(--primaria); }
.dica { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; background: var(--sup-2); }
.passo { display: flex; gap: 14px; align-items: flex-start; }
.passo .num { flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--primaria); color: var(--primaria-texto); font: 700 1rem var(--fonte-titulo); }

/* números e gráficos */
.kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 14px; }
@media (min-width: 900px) { .kpis { grid-template-columns: repeat(4, 1fr); } }
.kpi { background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); padding: 14px; box-shadow: var(--sombra); display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kpi span { color: var(--mudo); font-size: 0.85rem; }
.kpi strong { font: 700 1.5rem var(--fonte-titulo); }
.kpi small { color: var(--mudo); }
.kpi.destaque { grid-column: span 2; background: linear-gradient(135deg, color-mix(in srgb, var(--primaria) 10%, var(--sup)), var(--sup)); }
.barra { height: 10px; border-radius: 999px; background: var(--sup-2); overflow: hidden; margin: 8px 0 4px; }
.barra span { display: block; height: 100%; background: var(--verde); border-radius: inherit; }
.barra[data-nivel="alerta"] span { background: var(--amarelo); }
.barra[data-nivel="cheio"] span { background: var(--vermelho); }
.barra-rotulada { display: grid; grid-template-columns: 130px 1fr 30px; gap: 10px; align-items: center; }
.barra-rotulada .barra span { background: var(--primaria); }
.grafico { margin: 6px 0 0; }
.grafico svg { width: 100%; height: auto; overflow: visible; }
.grafico .eixo { stroke: var(--borda); stroke-width: 1; }
.grafico path { fill: color-mix(in srgb, var(--primaria) 45%, var(--sup)); }
.grafico path.atual { fill: var(--primaria); }
.grafico .marca-barra:hover path, .grafico .marca-barra:focus path { fill: var(--primaria-forte); }
.grafico .marca-barra { outline: none; }
.grafico .linha-ref { stroke: var(--acento); stroke-width: 2; stroke-dasharray: 6 5; }
.grafico .rotulo-ref, .grafico .rotulo-valor { font: 600 12px var(--fonte); fill: var(--texto); }
.grafico .rotulo-eixo { font: 12px var(--fonte); fill: var(--mudo); }
.tabela-grafico summary { cursor: pointer; color: var(--mudo); font-size: 0.86rem; margin-top: 6px; }
.tabela { width: 100%; border-collapse: collapse; font-size: 0.94rem; }
.tabela th, .tabela td { text-align: left; padding: 8px 6px; border-top: 1px solid var(--borda); }
.linha-fechamento { flex-wrap: wrap; }
.linha-fechamento .valor { font: 700 1.05rem var(--fonte-titulo); }

/* agenda */
.navegar-semana { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; }
.semana { display: grid; gap: 10px; margin-bottom: 14px; }
@media (min-width: 1100px) { .semana { grid-template-columns: repeat(7, 1fr); } }
.dia { background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio-p); padding: 10px; display: flex; flex-direction: column; gap: 6px; min-height: 90px; }
.dia.hoje { border-color: var(--primaria); box-shadow: 0 0 0 2px color-mix(in srgb, var(--primaria) 25%, transparent); }
.dia header { display: flex; justify-content: space-between; color: var(--mudo); font-size: 0.86rem; }
.dia header strong { color: var(--texto); }
.bloqueio { font-size: 0.8rem; padding: 6px 8px; border-radius: 8px; color: var(--mudo); background: repeating-linear-gradient(135deg, var(--sup-2) 0 6px, transparent 6px 12px); border: 1px dashed var(--borda); display: flex; justify-content: space-between; gap: 6px; }
.bloqueio.tipo-escala { border-color: color-mix(in srgb, var(--azul) 50%, var(--borda)); }
.visita { display: flex; flex-direction: column; gap: 1px; text-align: left; padding: 8px 10px; border-radius: 10px; border: 0; border-left: 4px solid var(--primaria); background: var(--sup-2); color: var(--texto); font: inherit; font-size: 0.9rem; cursor: pointer; }
.visita .hora { font-size: 0.78rem; color: var(--mudo); }
.visita.feita { border-left-color: var(--verde); opacity: 0.75; }
.visita.conflito { border-left-color: var(--vermelho); }
.visita .alerta { color: var(--vermelho); }
.selo-tipo { width: 12px; height: 12px; border-radius: 50%; background: var(--primaria); }
.selo-tipo.tipo-escala { background: var(--azul); } .selo-tipo.tipo-sono { background: var(--cinza); } .selo-tipo.tipo-treino { background: var(--verde); }
.dias-semana { display: flex; flex-wrap: wrap; gap: 6px; }

/* indicações */
.quadro { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 10px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 14px; scroll-snap-type: x mandatory; }
.coluna-funil { background: var(--sup-2); border-radius: var(--raio-p); padding: 10px; display: flex; flex-direction: column; gap: 8px; min-height: 160px; scroll-snap-align: start; }
.coluna-funil header { display: flex; justify-content: space-between; font-weight: 700; }
.coluna-funil header span { color: var(--mudo); font-weight: 400; }
.card-funil { background: var(--sup); border: 1px solid var(--borda); border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 3px; cursor: grab; }
.acoes-card { display: flex; gap: 6px; margin-top: 6px; }

/* personalizar */
.marcas { display: grid; gap: 10px; }
@media (min-width: 700px) { .marcas { grid-template-columns: repeat(3, 1fr); } }
.marca-opcao { display: flex; flex-direction: column; gap: 4px; padding: 14px; border: 2px solid var(--borda); border-radius: var(--raio-p); background: var(--sup); color: var(--texto); font: inherit; text-align: left; cursor: pointer; }
.marca-opcao.ativa { border-color: var(--primaria); }
.amostras { display: flex; gap: 6px; margin-bottom: 6px; }
.amostras i { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--sup); box-shadow: 0 0 0 1px var(--borda); }
.status { display: inline-block; font-size: 0.75rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.status.ok { background: color-mix(in srgb, var(--verde) 18%, transparent); color: var(--verde); }
.status.pendente { background: color-mix(in srgb, var(--amarelo) 18%, transparent); color: var(--amarelo); }
.conexao .ic { color: var(--primaria); }
.opcoes-grandes { display: flex; flex-wrap: wrap; gap: 8px; }
.upload { display: flex; gap: 12px; align-items: center; padding: 14px; border: 2px dashed var(--borda); border-radius: var(--raio-p); cursor: pointer; margin-bottom: 8px; }
.upload .ic { color: var(--primaria); }
.visualizador img { max-width: 100%; border-radius: 12px; }

/* controles */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 12px;
  border: 1px solid var(--borda); background: var(--sup); color: var(--texto); font: inherit; font-weight: 600; text-decoration: none; cursor: pointer;
}
.btn:hover { border-color: var(--primaria); }
.btn.primario { background: linear-gradient(135deg, var(--primaria), var(--primaria-forte)); color: var(--primaria-texto); border-color: transparent; }
.btn.perigo { color: var(--vermelho); border-color: currentColor; }
.btn.pequeno { min-height: 38px; padding: 0 12px; font-size: 0.88rem; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.link { background: none; border: 0; color: var(--primaria); font: inherit; font-weight: 600; padding: 8px 0; min-height: 44px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.link.pequeno { min-height: 32px; font-size: 0.85rem; }
.voltar { margin-bottom: 4px; }
.acoes { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.acoes.sem-margem { margin: 0; }
.acoes.coluna { flex-direction: column; } .acoes.coluna .btn { width: 100%; }
.abas { display: flex; gap: 2px; border-bottom: 1px solid var(--borda); margin: 10px 0 14px; overflow-x: auto; scrollbar-width: none; }
.abas button { min-height: 46px; padding: 0 14px; border: 0; background: none; color: var(--mudo); font: inherit; cursor: pointer; border-bottom: 3px solid transparent; white-space: nowrap; }
.abas button[aria-selected="true"] { color: var(--texto); font-weight: 700; border-bottom-color: var(--primaria); }
.busca, .seletor { width: 100%; min-height: 50px; padding: 0 16px; margin-bottom: 10px; border: 1px solid var(--borda); border-radius: 999px; background: var(--sup); color: var(--texto); font: inherit; }
.seletor { width: auto; margin: 0; border-radius: 12px; min-height: 44px; }
.filtros { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 8px; scrollbar-width: none; }
.filtros button, .chip-check span {
  flex: none; display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--borda);
  background: var(--sup); color: var(--texto); font: inherit; font-size: 0.88rem; cursor: pointer;
}
.filtros button.ativo { background: var(--primaria); color: var(--primaria-texto); border-color: transparent; }
.chip-check { display: inline-flex; cursor: pointer; position: relative; }
.chip-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip-check input:checked + span { background: color-mix(in srgb, var(--verde) 16%, var(--sup)); border-color: var(--verde); color: var(--verde); font-weight: 600; }
.chip-check input:focus-visible + span { outline: 2px solid var(--primaria); }

/* diálogos e formulários */
.dialogo { width: min(600px, 100vw); max-height: 100dvh; margin: auto auto 0; padding: 0; border: 0; border-radius: 22px 22px 0 0; background: var(--sup); color: var(--texto); box-shadow: 0 -10px 40px rgb(0 0 0 / 0.2); }
.dialogo::backdrop { background: rgb(20 10 15 / 0.45); backdrop-filter: blur(2px); }
@media (min-width: 640px) { .dialogo { margin: auto; border-radius: 22px; max-height: 90dvh; } }
.form { padding: 20px 18px calc(20px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 12px; }
form.cartao.form { padding: 18px; }
.form label { display: flex; flex-direction: column; gap: 5px; font-size: 0.92rem; font-weight: 600; }
.form label small { font-weight: 400; }
.form input, .form select, .form textarea {
  min-height: 48px; padding: 10px 14px; border-radius: 12px; border: 1px solid var(--borda); background: var(--bg); color: var(--texto); font: inherit; font-weight: 400; width: 100%;
}
.form input:focus, .form select:focus, .form textarea:focus, .busca:focus { outline: 2px solid color-mix(in srgb, var(--primaria) 60%, transparent); outline-offset: 1px; border-color: var(--primaria); }
.form textarea { min-height: 84px; resize: vertical; }
.form fieldset { border: 1px solid var(--borda); border-radius: 14px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.form legend { font-weight: 700; font-size: 0.92rem; padding: 0 6px; }
.check-linha { flex-direction: row !important; align-items: center; gap: 10px !important; font-weight: 500 !important; }
.check-linha input { width: 24px; min-height: 24px; height: 24px; flex: none; accent-color: var(--primaria); }
.grade { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 400px) { .grade { grid-template-columns: 1fr; } }
.erros { color: var(--vermelho); font-weight: 600; margin: 0; } .erros:empty { display: none; }
.aviso-senha { color: var(--vermelho); font-weight: 700; margin: -4px 0 0; }

.aviso {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(146px + env(safe-area-inset-bottom)); z-index: 50; max-width: calc(100vw - 32px);
  padding: 12px 18px; border-radius: 14px; background: var(--texto); color: var(--bg); box-shadow: 0 10px 30px rgb(0 0 0 / 0.2); font-weight: 600;
}
@media (min-width: 960px) { .aviso { bottom: 100px; } }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
@media print { .topo, .nav-inferior, .nav-lateral, .fab, .cronometro-barra { display: none !important; } }

/* Ficha 360 (spec 02 §1) */
.numeros-360 { list-style: none; padding: 0; margin: 0 0 8px; display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 12px; }
.numeros-360 li { display: flex; flex-direction: column; }
.numeros-360 strong { font-size: 1.6rem; line-height: 1.1; }
.numeros-360 span { color: var(--mudo); font-size: 0.9rem; }