/*
  VISUAL DA MENTORIA LINKAE — as mesmas cores e fontes das ferramentas CEP© (MAPA, CICLO, Bússola, IKIGAI, ROTA, Barreiras).
  Fundo claro com brilho roxo e ciano, títulos em Fraunces com itálico roxo, botões roxos com texto verde.
  Tema claro sempre, igual às ferramentas.
*/
:root {
  color-scheme: light;
  --roxo: #540094;           /* principal da marca */
  --roxo-escuro: #25043B;
  --roxo-medio: #7B2CC0;     /* itálicos dos títulos */
  --roxo-l: #EDE0FF;
  --roxo-claro: #F8F3FF;
  --verde: #ABD905;          /* verde-limão: texto dos botões, conquistas */
  --verde-texto: #3D5200;
  --verde-claro: #F0F9D4;
  --azul: #21C4F7;           /* ciano da marca */
  --azul-texto: #0A7FA3;
  --azul-claro: #E8F9FE;
  --coral: #C2410C;          /* fase P (Posicionamento) */
  --coral-claro: #FFF1EC;
  --vermelho: #B42318; --vermelho-claro: #FDECEB;
  --ambar: #92400E; --ambar-claro: #FEF3C7;

  --papel: #FDFCFF;
  --superficie: #FFFFFF;
  --tinta: #0F0A1A;
  --sub: #3A3555;
  --suave: #6B6480;
  --linha: #DDD5EE;
  --botao: #540094; --botao-texto: #ABD905;
  --texto-roxo: #540094;
  --gradiente-marca: linear-gradient(90deg, #540094, #21C4F7, #ABD905);
  --sombra: 0 1px 3px rgba(84, 0, 148, .07), 0 8px 24px rgba(84, 0, 148, .06);

  --fonte-titulo: "Fraunces", Georgia, "Times New Roman", serif;
  --fonte-texto: "DM Sans", "Segoe UI", system-ui, sans-serif;
  --raio: 14px;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--papel) radial-gradient(ellipse at 50% 0%, rgba(84, 0, 148, .06) 0%, transparent 55%) no-repeat,
              radial-gradient(ellipse at 90% 90%, rgba(33, 196, 247, .04) 0%, transparent 50%) no-repeat;
  background-attachment: fixed;
  color: var(--tinta); font-family: var(--fonte-texto); font-size: 1rem; line-height: 1.6; -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { font-family: var(--fonte-titulo); font-weight: 300; line-height: 1.15; margin: 0; text-wrap: balance; }
h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); }
h2 { font-size: 1.6rem; }
h3 { font-size: 1.1rem; font-weight: 400; }
p { margin: 0; }
a { color: var(--texto-roxo); }
:focus-visible { outline: 3px solid var(--azul); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

.rotulo { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.17em; text-transform: uppercase; color: var(--suave); }
.mudo { color: var(--suave); }
.pequeno { font-size: 0.875rem; }
.citacao { font-family: var(--fonte-titulo); font-style: italic; font-weight: 300; color: var(--sub); line-height: 1.85; }

/* ---------- botões e campos ---------- */
.botao { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; font: 600 0.92rem var(--fonte-texto); padding: 0.8rem 1.5rem; border-radius: 12px; border: 0; background: linear-gradient(135deg, var(--roxo), var(--roxo-medio)); color: var(--botao-texto); cursor: pointer; text-decoration: none; box-shadow: 0 4px 18px rgba(84, 0, 148, .3); transition: transform .2s, box-shadow .2s; }
.botao:hover { transform: translateY(-1px); box-shadow: 0 8px 28px rgba(84, 0, 148, .38); }
.botao:disabled { opacity: .45; cursor: wait; transform: none; box-shadow: none; }
.botao.secundario { background: transparent; color: var(--suave); border: 1.5px solid var(--linha); box-shadow: none; }
.botao.secundario:hover { color: var(--tinta); border-color: var(--tinta); }
.botao.verde { background: var(--verde); border-color: var(--verde); color: var(--roxo-escuro); }
.botao.largo { width: 100%; }
.botao.mini { padding: 0.4rem 0.9rem; font-size: 0.82rem; }
.link-botao { background: none; border: 0; padding: 0; font: inherit; color: var(--texto-roxo); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

label { display: block; font-weight: 600; font-size: 0.875rem; margin-bottom: 0.3rem; }
input[type="email"], input[type="password"], input[type="text"], input[type="date"], select, textarea {
  width: 100%; font: inherit; font-size: 0.95rem; color: var(--tinta); background: var(--superficie);
  border: 1.5px solid var(--linha); border-radius: 10px; padding: 0.65rem 0.8rem;
}
textarea { resize: vertical; min-height: 5.5rem; line-height: 1.6; }
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--roxo-medio); box-shadow: 0 0 0 3px var(--roxo-claro); }
.campo { display: grid; gap: 0.1rem; min-width: 0; }
.grade-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.grade-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 640px) { .grade-2, .grade-3 { grid-template-columns: 1fr; } }

.aviso { padding: 0.75rem 1rem; border-radius: 10px; font-size: 0.92rem; }
.aviso.erro { background: var(--vermelho-claro); color: var(--vermelho); }
.aviso.ok { background: var(--verde-claro); color: var(--verde-texto); }
.aviso.info { background: var(--roxo-claro); color: var(--sub); }

.faixa-demo { background: var(--ambar-claro); color: var(--ambar); font-size: 0.85rem; padding: 0.5rem 16px; display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; justify-content: center; align-items: center; }
.faixa-demo .link-botao { color: var(--ambar); }

/* ---------- logo ---------- */
.logo { display: inline-flex; align-items: center; gap: 0.75rem; text-decoration: none; }
.logo img { height: 1.5rem; width: auto; display: block; }
.logo .logo-txt { font-size: 0.68rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; }

/* ---------- entrada e capa ---------- */
.capa { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh; }
.capa-esq { background: var(--roxo); color: #fff; padding: 3rem clamp(16px, 5vw, 3.5rem); display: flex; flex-direction: column; justify-content: space-between; gap: 2.5rem; position: relative; overflow: hidden; }
.capa-esq::before { content: ""; position: absolute; top: -6rem; right: -6rem; width: 22rem; height: 22rem; border-radius: 50%; background: radial-gradient(circle, rgba(171, 217, 5, .16), transparent 70%); pointer-events: none; }
.capa-esq::after { content: ""; position: absolute; bottom: -5rem; left: -5rem; width: 16rem; height: 16rem; border-radius: 50%; background: radial-gradient(circle, rgba(33, 196, 247, .14), transparent 70%); pointer-events: none; }
.capa-esq > * { position: relative; z-index: 1; }
.capa-esq .logo-txt { color: rgba(255, 255, 255, .55); }
.capa-esq .rotulo { color: rgba(255, 255, 255, .5); }
.capa-nome { font-family: var(--fonte-titulo); font-weight: 200; font-size: clamp(2.4rem, 5vw, 3.6rem); line-height: 1.05; margin-block: 1rem; }
.capa-nome em { display: block; font-style: italic; font-weight: 300; font-size: .72em; color: rgba(255, 255, 255, .55); }
.capa-frase { font-family: var(--fonte-titulo); font-style: italic; font-weight: 300; color: rgba(255, 255, 255, .75); line-height: 1.8; padding-left: 1rem; border-left: 2px solid rgba(171, 217, 5, .55); max-width: 24rem; margin-bottom: 1.75rem; }
.capa-texto { color: rgba(255, 255, 255, .8); max-width: 26rem; }
.segmentos { display: flex; gap: 4px; }
.segmentos span { flex: 1; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, .15); overflow: hidden; position: relative; }
.segmentos span i { position: absolute; inset: 0 auto 0 0; background: var(--verde); border-radius: 2px; }
.capa-prog-topo { display: flex; justify-content: space-between; font-size: 0.7rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .45); margin-bottom: .6rem; font-weight: 600; }
.capa-prog-topo b { color: rgba(255, 255, 255, .75); font-weight: 600; }
.capa-rodape { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.capa-rodape .fase { font-size: 0.75rem; color: rgba(255, 255, 255, .55); font-weight: 600; letter-spacing: .06em; }
.botao-capa { background: #fff; color: var(--roxo); border-color: #fff; }
.capa-dir { background: var(--superficie); padding: 3rem clamp(16px, 4vw, 3rem); display: flex; flex-direction: column; justify-content: center; position: relative; overflow: hidden; }
.capa-dir::before { content: "CEP©"; font-family: var(--fonte-titulo); font-weight: 200; font-size: 9rem; color: var(--roxo-claro); position: absolute; right: -0.5rem; bottom: 1.5rem; line-height: 1; pointer-events: none; }
.capa-dir > * { position: relative; }
.mini-fase { margin-top: 1.5rem; }
.mini-fase-rotulo { display: flex; align-items: center; gap: .5rem; font-size: 0.62rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; margin-bottom: .6rem; }
.mini-fase-rotulo::after { content: ""; flex: 1; height: 1px; background: var(--linha); }
.f-C { color: var(--texto-roxo); } .f-E { color: var(--verde-texto); } .f-P { color: var(--coral); }
.mini-sessoes { display: flex; flex-wrap: wrap; gap: 6px; }
.mini-sessao { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: 0.7rem; font-weight: 600; border: 1px solid var(--linha); color: var(--suave); background: var(--papel); }
.mini-sessao::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.mini-sessao.feita { background: var(--roxo-claro); color: var(--texto-roxo); border-color: transparent; }
.mini-sessao.atual { background: var(--roxo); color: #fff; border-color: var(--roxo); }
.mini-sessao.atual::before { background: var(--verde); }
.capa-mentor { margin-top: 1.75rem; padding-top: 1.25rem; border-top: 1px solid var(--linha); font-size: 0.85rem; color: var(--suave); }
.capa-mentor strong { color: var(--tinta); }
.cartao-form { width: 100%; max-width: 24rem; display: grid; gap: 1rem; }
.separador { display: flex; align-items: center; gap: .75rem; color: var(--suave); font-size: .75rem; letter-spacing: .1em; }
.separador::before, .separador::after { content: ""; flex: 1; height: 1px; background: var(--linha); }
@media (max-width: 800px) {
  .capa { grid-template-columns: 1fr; min-height: 0; }
  .capa-esq { padding-block: 2rem; gap: 1.75rem; }
  .capa-dir::before { font-size: 6rem; }
}

/* ---------- tela de entrada · layout "Janela" ---------- */
/* Esquerda: degradê verde e azul com a frase. Direita: branco, só o login. */
.janela { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); background: var(--superficie); }
.janela-marca { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(125deg, #ABD905 0%, #47BFCF 55%, #21C4F7 100%); color: #fff; padding: clamp(2rem, 5vw, 3.5rem) clamp(16px, 5vw, 4rem); display: flex; flex-direction: column; justify-content: space-between; gap: 2.5rem; }
.bolha { position: absolute; z-index: -1; pointer-events: none; border-radius: 58% 42% 63% 37% / 45% 55% 45% 55%; background: rgba(255, 255, 255, .16); }
.bolha-1 { width: min(36rem, 70vw); aspect-ratio: 1; right: -12rem; bottom: -12rem; animation: flutuar 16s ease-in-out infinite alternate; }
.bolha-2 { width: 15rem; aspect-ratio: 1; left: 45%; top: -6rem; background: rgba(255, 255, 255, .12); border-radius: 42% 58% 37% 63% / 55% 45% 55% 45%; animation: flutuar 19s ease-in-out infinite alternate-reverse; }
@keyframes flutuar { to { transform: translate(14px, -16px) rotate(8deg); } }
.selo-logo { align-self: flex-start; background: #fff; border-radius: 999px; padding: .8rem 1.4rem; box-shadow: 0 10px 30px rgba(10, 80, 100, .16); display: inline-flex; }
.selo-logo img { height: 2.1rem; width: auto; display: block; }
.janela-texto { display: grid; gap: 1.1rem; max-width: 34rem; }
.janela-caps { font-size: .72rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(255, 255, 255, .95); }
.janela-marca h1 { font-family: var(--fonte-titulo); font-weight: 300; font-size: clamp(2.4rem, 4.6vw, 3.9rem); line-height: 1.05; letter-spacing: -.015em; color: #fff; text-shadow: 0 1px 18px rgba(10, 80, 100, .15); }
.janela-marca h1 em { font-style: italic; color: var(--roxo-escuro); text-shadow: none; }
.janela-lead { font-size: 1rem; line-height: 1.75; color: rgba(255, 255, 255, .96); max-width: 28rem; }
.janela-rodape { opacity: .85; }
.janela-login { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.25rem; padding: 3rem 16px; }
.cartao-login { width: 100%; max-width: 25rem; display: grid; gap: 1.1rem; }
.cartao-login h2 { font-family: var(--fonte-titulo); font-size: 2rem; font-weight: 400; color: var(--tinta); }
.cartao-login h2 em { font-style: italic; color: var(--roxo-medio); }
.cartao-login input { border-radius: 12px; padding: .8rem 1rem; }
.cartao-login input:focus { border-color: var(--roxo); box-shadow: 0 0 0 4px rgba(84, 0, 148, .07); }
.cartao-login .botao { border-radius: 999px; padding: .95rem 1.5rem; background: var(--roxo); color: #fff; box-shadow: 0 8px 22px rgba(84, 0, 148, .22); }
.cartao-login .botao:hover { background: var(--roxo-escuro); }
.abas-entrada { display: grid; grid-template-columns: 1fr 1fr; background: var(--roxo-claro); border-radius: 999px; padding: 4px; border: 1px solid var(--linha); }
.abas-entrada button { border: 0; background: transparent; border-radius: 999px; padding: .6rem .5rem; font: 600 .85rem var(--fonte-texto); color: var(--suave); cursor: pointer; transition: background .2s, color .2s, box-shadow .2s; }
.abas-entrada button.on { background: #fff; color: var(--roxo); box-shadow: 0 2px 10px rgba(37, 4, 59, .10); }
.contato-entrada { font-size: .8rem; color: var(--suave); max-width: 25rem; text-align: center; }
@media (max-width: 860px) {
  .janela { grid-template-columns: 1fr; min-height: 0; }
  .janela-marca { gap: 1.5rem; padding-block: 1.5rem 2.25rem; }
  .janela-marca h1 { font-size: 2.2rem; }
  .janela-lead, .janela-rodape { display: none; }
  .selo-logo { padding: .6rem 1.1rem; }
  .selo-logo img { height: 1.7rem; }
  .bolha-1 { width: 20rem; right: -8rem; bottom: -10rem; }
  .janela-login { padding-block: 2rem 3rem; justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) { .bolha { animation: none; } }

/* ---------- topo ---------- */
.topo { background: var(--superficie); border-bottom: 1px solid var(--linha); position: sticky; top: env(safe-area-inset-top, 0px); z-index: 10; }
.topo-dentro { max-width: 68rem; margin: 0 auto; padding: 0 16px; display: flex; align-items: stretch; gap: 1rem; min-height: 3.5rem; flex-wrap: wrap; }
.topo .logo { padding-right: 1rem; border-right: 1px solid var(--linha); }
.topo .logo-txt { color: var(--tinta); font-family: var(--fonte-titulo); letter-spacing: 0; text-transform: none; font-size: .85rem; font-weight: 400; }
.topo-nome { display: flex; align-items: center; font-size: 0.85rem; color: var(--suave); margin-right: auto; }
.topo-nome strong { color: var(--tinta); margin-right: .35rem; }
.abas { display: flex; align-items: stretch; overflow-x: auto; scrollbar-width: none; }
.abas a { display: flex; align-items: center; padding: 0 0.85rem; font-size: 0.82rem; font-weight: 500; color: var(--suave); text-decoration: none; border-bottom: 2px solid transparent; white-space: nowrap; }
.abas a:hover { color: var(--tinta); }
.abas a.ativo { color: var(--texto-roxo); border-bottom-color: var(--texto-roxo); }
.topo-fim { display: flex; align-items: center; gap: .75rem; padding-left: .75rem; border-left: 1px solid var(--linha); font-size: .8rem; }
.fase-chip { display: inline-flex; align-items: center; gap: .4rem; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-roxo); white-space: nowrap; }
.fase-chip::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--verde); }
@media (max-width: 860px) {
  .topo-dentro { padding-top: .5rem; }
  .topo-nome { display: none; }
  .abas { order: 3; width: 100%; margin-inline: -16px; padding-inline: 8px; min-height: 2.75rem; }
  .topo .logo { border-right: 0; margin-right: auto; }
}

/* ---------- páginas ---------- */
.pagina { max-width: 68rem; margin: 0 auto; padding: 2.25rem 16px 5rem; display: grid; gap: 1.75rem; }
.pagina.estreita { max-width: 50rem; }
.cabeca { display: grid; gap: .4rem; }
.cabeca p { color: var(--suave); max-width: 60ch; }
.voltar { font-size: .875rem; text-decoration: none; font-weight: 600; }

/* ---------- trilha ---------- */
.trilha-grade { display: grid; grid-template-columns: minmax(0, 1fr) 17.5rem; gap: 2rem; align-items: start; }
@media (max-width: 900px) { .trilha-grade { grid-template-columns: 1fr; } .painel { position: static !important; order: -1; } }
.trilha { display: grid; gap: .4rem; position: relative; }
.trilha::before { content: ""; position: absolute; left: 19px; top: 1.25rem; bottom: 1.25rem; width: 2px; background: linear-gradient(to bottom, var(--roxo) var(--prog, 0%), var(--linha) var(--prog, 0%)); }
.parada { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: .9rem; position: relative; }
.pino { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-size: .78rem; font-weight: 700; border: 2.5px solid var(--linha); background: var(--superficie); color: var(--suave); margin-top: .55rem; position: relative; z-index: 1; font-variant-numeric: tabular-nums; }
.pino.feita { background: var(--roxo); border-color: var(--roxo); color: #fff; }
.pino.atual { border-color: var(--roxo); color: var(--texto-roxo); box-shadow: 0 0 0 4px var(--roxo-claro); }
.cartao { background: var(--superficie); border: 1.5px solid var(--linha); border-radius: var(--raio); overflow: hidden; margin-bottom: .35rem; min-width: 0; }
.cartao.atual { border-color: var(--roxo); box-shadow: 0 6px 22px rgba(84, 0, 148, .1); }
.cartao.futura { opacity: .62; }
.cartao > summary { list-style: none; padding: .8rem 1rem; display: flex; align-items: center; gap: .75rem; cursor: pointer; }
.cartao > summary::-webkit-details-marker { display: none; }
.cartao > summary .info { flex: 1; min-width: 0; }
.cartao-fase { font-size: .6rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.cartao-nome { font-family: var(--fonte-titulo); font-size: 1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.etiqueta { font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 3px 9px; border-radius: 999px; white-space: nowrap; background: var(--papel); color: var(--suave); border: 1px solid var(--linha); }
.etiqueta.feita, .etiqueta.feito { background: var(--verde-claro); color: var(--verde-texto); border-color: transparent; }
.etiqueta.atual { background: var(--roxo-claro); color: var(--texto-roxo); border-color: transparent; }
.etiqueta.parcial { background: var(--ambar-claro); color: var(--ambar); border-color: transparent; }
.etiqueta.nao { background: var(--vermelho-claro); color: var(--vermelho); border-color: transparent; }
.etiqueta.novo { background: var(--azul-claro); color: var(--azul-texto); border-color: transparent; }
.cartao-corpo { border-top: 1px solid var(--linha); padding: 1.1rem; display: grid; gap: 1rem; }
.bloco { display: grid; gap: .45rem; }
.caixa { border-radius: 10px; padding: .9rem 1rem; }
.caixa.percepcao { background: var(--roxo-claro); border-left: 3px solid var(--roxo-medio); }
.caixa.escrita { background: var(--papel); }
.caixa.meta { background: var(--azul-claro); border-left: 3px solid var(--azul); }
.caixa.meta .rotulo { color: var(--azul-texto); }
.caixa.declaracao { background: var(--roxo-claro); text-align: center; }
.caixa.declaracao p { color: var(--texto-roxo); }
.caixa.pergunta { background: var(--roxo-claro); border: 1.5px solid var(--linha); }
.caixa.observacao { background: var(--papel); border: 1.5px solid var(--linha); font-size: .9rem; color: var(--sub); }
.caixa.ferramenta { background: linear-gradient(120deg, var(--verde-claro), var(--azul-claro)); display: flex; gap: 1rem; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.caixa.ferramenta strong { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.05rem; }
.compromisso { display: flex; gap: .7rem; align-items: flex-start; padding: .7rem .85rem; border-radius: 10px; background: var(--verde-claro); }
.icone-status { width: 22px; height: 22px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: .7rem; font-weight: 700; background: var(--superficie); border: 1.5px solid var(--linha); color: var(--suave); }
.icone-status.feito { color: var(--verde-texto); } .icone-status.nao { color: var(--vermelho); } .icone-status.parcial { color: var(--ambar); }

.painel { display: grid; gap: 1rem; position: sticky; top: 5rem; }
.p-cartao { background: var(--superficie); border: 1.5px solid var(--linha); border-radius: var(--raio); padding: 1.1rem; display: grid; gap: .5rem; }
.numero-grande { font-family: var(--fonte-titulo); font-weight: 200; font-size: 2.4rem; line-height: 1; font-variant-numeric: tabular-nums; }
.barra { height: 6px; background: var(--linha); border-radius: 3px; overflow: hidden; }
.barra i { display: block; height: 100%; background: linear-gradient(90deg, var(--roxo), var(--verde)); border-radius: 3px; }
.fases-mini { display: flex; gap: 3px; }
.fases-mini span { flex: 1; text-align: center; font-size: .58rem; font-weight: 700; letter-spacing: .1em; padding: 3px 0; border-radius: 3px; }
.fases-mini .C { background: var(--roxo-claro); color: var(--texto-roxo); } .fases-mini .E { background: var(--verde-claro); color: var(--verde-texto); } .fases-mini .P { background: var(--coral-claro); color: var(--coral); }
.meta-item { padding-bottom: .6rem; border-bottom: 1px solid var(--linha); display: grid; gap: .15rem; }
.meta-item:last-child { border-bottom: 0; padding-bottom: 0; }
.meta-topo { display: flex; justify-content: space-between; font-size: .65rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--azul-texto); }
.meta-topo span { color: var(--suave); font-weight: 500; letter-spacing: 0; text-transform: none; }
.meta-item p { font-size: .82rem; font-style: italic; color: var(--sub); line-height: 1.55; }

/* ---------- listas de registros ---------- */
.lista { display: grid; gap: .9rem; }
.registro { background: var(--superficie); border: 1.5px solid var(--linha); border-radius: var(--raio); padding: 1.1rem 1.2rem; display: grid; gap: .6rem; min-width: 0; }
.registro-topo { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }
.linha-tempo { display: grid; gap: .7rem; padding-left: 1.6rem; position: relative; }
.linha-tempo::before { content: ""; position: absolute; left: 6px; top: 0; bottom: 0; width: 2px; background: var(--linha); }
.linha-tempo .registro::before { content: ""; position: absolute; left: -1.45rem; top: 1.2rem; width: 10px; height: 10px; border-radius: 50%; background: var(--superficie); border: 2px solid var(--linha); }
.linha-tempo .registro { position: relative; }
.linha-tempo .registro.feito::before { background: var(--verde-texto); border-color: var(--verde-texto); }
.linha-tempo .registro.nao::before { background: var(--vermelho); border-color: var(--vermelho); }
.linha-tempo .registro.parcial::before { background: var(--ambar); border-color: var(--ambar); }
.vazio { text-align: center; padding: 3rem 1rem; font-family: var(--fonte-titulo); font-weight: 300; font-size: 1.1rem; color: var(--suave); }

.ciclos-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 900px) { .ciclos-grade { grid-template-columns: 1fr; } }
.ciclo-num { width: 2.4rem; height: 2.4rem; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: .85rem; flex: none; }
.ciclo-num.c30 { background: var(--roxo-claro); color: var(--texto-roxo); } .ciclo-num.c60 { background: var(--azul-claro); color: var(--azul-texto); } .ciclo-num.c90 { background: var(--verde-claro); color: var(--verde-texto); }

.anot-grade { display: grid; grid-template-columns: minmax(0, 1fr) 16rem; gap: 1.5rem; align-items: start; }
@media (max-width: 860px) { .anot-grade { grid-template-columns: 1fr; } }
.editor { background: var(--superficie); border: 1.5px solid var(--linha); border-radius: var(--raio); overflow: hidden; }
.editor textarea { border: 0; border-radius: 0; min-height: 16rem; padding: 1.25rem; font-family: var(--fonte-titulo); font-size: 1.02rem; line-height: 1.9; background: transparent; }
.editor textarea:focus { box-shadow: none; }
.editor-rodape { display: flex; gap: .75rem; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: .7rem 1rem; border-top: 1px solid var(--linha); }
.editor-rodape label { display: flex; align-items: center; gap: .4rem; font-weight: 500; margin: 0; font-size: .85rem; }
.editor-rodape select { width: auto; padding: .35rem .6rem; font-size: .82rem; }
.marcar { accent-color: var(--roxo); width: 1rem; height: 1rem; margin: 0; }
.insights-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .9rem; }

.fases-sobre { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 760px) { .fases-sobre { grid-template-columns: 1fr; } }
.fase-cartao { border-radius: var(--raio); padding: 1.3rem; display: grid; gap: .3rem; }
.fase-cartao.C { background: var(--roxo-claro); } .fase-cartao.E { background: var(--verde-claro); } .fase-cartao.P { background: var(--coral-claro); }
.fase-cartao .letra { font-size: 2rem; font-weight: 700; line-height: 1; }

/* ---------- ferramenta aberta ---------- */
.ferramenta-tela { position: fixed; inset: 0; z-index: 50; background: var(--papel); display: grid; grid-template-rows: auto 1fr; }
.ferramenta-barra { display: flex; align-items: center; gap: 1rem; padding: .6rem 16px; padding-top: calc(.6rem + env(safe-area-inset-top, 0px)); background: var(--roxo); color: #fff; flex-wrap: wrap; }
.ferramenta-barra .titulo { font-family: var(--fonte-titulo); font-size: 1.05rem; margin-right: auto; }
.ferramenta-barra .estado { font-size: .8rem; color: rgba(255, 255, 255, .8); }
.ferramenta-barra .botao { background: #fff; color: var(--roxo); border-color: #fff; padding: .45rem 1rem; font-size: .85rem; }
.ferramenta-tela iframe { width: 100%; height: 100%; border: 0; background: #fff; }

/* ---------- equipe ---------- */
.numeros { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 640px) { .numeros { grid-template-columns: 1fr; } }
.numero { background: var(--superficie); border: 1.5px solid var(--linha); border-radius: var(--raio); padding: 1rem 1.2rem; }
.numero strong { display: block; font-family: var(--fonte-titulo); font-weight: 300; font-size: 2.2rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.tabela-caixa { overflow-x: auto; background: var(--superficie); border: 1.5px solid var(--linha); border-radius: var(--raio); }
table { border-collapse: collapse; width: 100%; min-width: 40rem; font-size: .92rem; }
th { text-align: left; font-size: .65rem; letter-spacing: .14em; text-transform: uppercase; color: var(--suave); font-weight: 700; padding: .75rem 1rem; border-bottom: 1px solid var(--linha); }
td { padding: .8rem 1rem; border-bottom: 1px solid var(--linha); vertical-align: middle; }
tr:last-child td { border-bottom: 0; }
td a { font-weight: 600; text-decoration: none; }
.dica { border: 1.5px dashed var(--linha); border-radius: var(--raio); padding: 1rem 1.2rem; display: grid; gap: .35rem; font-size: .9rem; }
.sub-abas { display: flex; gap: .4rem; flex-wrap: wrap; border-bottom: 1px solid var(--linha); }
.sub-abas button { background: none; border: 0; border-bottom: 2px solid transparent; padding: .6rem .9rem; font: 600 .88rem var(--fonte-texto); color: var(--suave); cursor: pointer; }
.sub-abas button.ativo { color: var(--texto-roxo); border-bottom-color: var(--texto-roxo); }
.editor-sessao { background: var(--superficie); border: 1.5px solid var(--linha); border-radius: var(--raio); overflow: hidden; }
.editor-sessao.atual { border-color: var(--roxo); }
.editor-sessao > summary { list-style: none; cursor: pointer; padding: .8rem 1rem; display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.editor-sessao > summary::-webkit-details-marker { display: none; }
.editor-sessao form { border-top: 1px solid var(--linha); padding: 1.1rem; display: grid; gap: .9rem; }
.form-acoes { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.check { display: flex; gap: .5rem; align-items: center; font-weight: 500; margin: 0; }
.dados-lista { display: grid; gap: .5rem; margin: 0; font-size: .88rem; }
.dados-lista dt { font-weight: 700; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--suave); }
.dados-lista dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 14rem; overflow: auto; }
.carregando { padding: 4rem 16px; text-align: center; color: var(--suave); }

/* =====================================================================
   ÁREA DO MENTORADO · INÍCIO (layout "Mural + Seu caminho CEP©")
   ===================================================================== */
.topo .logo { border-right: 0; padding-right: 0; margin-right: .5rem; display: flex; align-items: center; }
.topo .logo img { height: 1.9rem; width: auto; display: block; }
.topo-dentro { max-width: 76rem; align-items: center; }
.abas { align-self: stretch; }
.topo-fim { margin-left: auto; border-left: 0; padding-left: 0; }
.avatar { width: 2.1rem; height: 2.1rem; border-radius: 50%; background: linear-gradient(125deg, #ABD905, #21C4F7); color: #fff; display: grid; place-items: center; font-size: .72rem; font-weight: 700; letter-spacing: .02em; flex: none; }
.topo-pessoa { font-size: .85rem; color: var(--sub); white-space: nowrap; }
@media (max-width: 860px) { .topo-pessoa { display: none; } }

.inicio { padding-bottom: 4rem; }
.boas-vindas { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(125deg, #ABD905 0%, #47BFCF 55%, #21C4F7 100%); color: #fff; }
.boas-vindas .bolha-1 { width: 26rem; right: -6rem; top: -12rem; bottom: auto; }
.boas-dentro { max-width: 76rem; margin: 0 auto; padding: 2.4rem 16px 6rem; display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; }
.boas-caps { font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(255, 255, 255, .95); margin-bottom: .6rem; }
.boas-vindas h1 { font-family: var(--fonte-titulo); font-weight: 300; font-size: clamp(1.9rem, 3.6vw, 2.8rem); line-height: 1.1; color: #fff; max-width: 28ch; text-shadow: 0 1px 16px rgba(10, 80, 100, .14); }
.boas-vindas h1 em { font-style: italic; color: var(--roxo-escuro); text-shadow: none; }
.tracinhos { display: flex; gap: 5px; }
.tracinhos i { width: 22px; height: 6px; border-radius: 6px; background: rgba(255, 255, 255, .38); }
.tracinhos i.feita { background: #fff; }
.tracinhos i.atual { background: var(--roxo-escuro); }

.mural { max-width: 76rem; margin: -4rem auto 0; padding-inline: 16px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); gap: 1.1rem; position: relative; align-items: stretch; }
.cartao-mural { background: #fff; border: 1px solid var(--linha); border-radius: 18px; padding: 1.3rem 1.4rem; display: grid; gap: .6rem; align-content: start; min-width: 0; box-shadow: 0 2px 6px rgba(37, 4, 59, .03); }
.cartao-mural .rotulo { margin: 0; }
.cartao-mural > p:not(.rotulo):not(.pequeno) { font-size: .93rem; color: var(--sub); }
.cartao-mural h2 { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.45rem; line-height: 1.2; }
.cartao-mural textarea { min-height: 4.2rem; font-size: .9rem; }
.cartao-mural .etiqueta { justify-self: start; }
.destaque { grid-row: span 2; border-color: transparent; box-shadow: 0 16px 40px rgba(37, 4, 59, .10); padding: 1.6rem; gap: .9rem; }
.ferramenta-vez { border-radius: 14px; background: linear-gradient(125deg, rgba(171, 217, 5, .17), rgba(33, 196, 247, .17)); padding: 1.2rem 1.3rem; display: grid; gap: .55rem; justify-items: start; }
.ferramenta-vez h3 { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.3rem; }
.ferramenta-vez p { font-size: .88rem; color: var(--sub); }
.ferramenta-vez .botao { margin-top: .3rem; border-radius: 999px; background: var(--roxo); color: #fff; padding: .7rem 1.4rem; }
.ferramenta-vez.calma { background: var(--roxo-claro); }
.chip-roxo { font-size: .65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--roxo); background: #fff; border-radius: 999px; padding: .2rem .7rem; }
.destaque .citacao { font-size: .98rem; }
.progresso { grid-template-columns: auto 1fr; align-items: center; align-content: center; gap: 1rem; }
.anel { width: 4.6rem; height: 4.6rem; border-radius: 50%; background: conic-gradient(var(--roxo) 0 var(--pct), #EEE9F5 var(--pct) 100%); display: grid; place-items: center; }
.anel span { width: 3.6rem; height: 3.6rem; border-radius: 50%; background: #fff; display: grid; place-items: center; font-family: var(--fonte-titulo); font-size: 1.05rem; color: var(--roxo); font-variant-numeric: tabular-nums; }
.meta-linha { font-size: .9rem; color: var(--sub); }
.meta-linha b { color: var(--azul-texto); margin-right: .25rem; }
@media (max-width: 980px) { .mural { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .destaque { grid-column: 1 / -1; grid-row: auto; } }
@media (max-width: 600px) { .mural { grid-template-columns: 1fr; margin-top: -3.5rem; } .boas-dentro { padding-bottom: 5rem; } .tracinhos i { width: 14px; } }

.caminho { max-width: calc(76rem - 32px); margin: 1.6rem auto 0; background: #fff; border: 1px solid var(--linha); border-radius: 22px; overflow: hidden; }
@media (max-width: 76rem) { .caminho { margin-inline: 16px; } }
.caminho-cab { display: flex; align-items: center; gap: 1rem; padding: 1.4rem 1.6rem 0; flex-wrap: wrap; }
.bussola { width: 3rem; height: 3rem; flex: none; }
.caminho-cab h2 { font-family: var(--fonte-titulo); font-weight: 300; font-size: 1.7rem; line-height: 1.1; }
.caminho-cab h2 em { font-style: italic; color: var(--roxo-medio); }
.caminho-cab p { font-size: .88rem; color: var(--suave); margin-top: .2rem; }
.fases-chips { margin-left: auto; display: flex; gap: .4rem; flex-wrap: wrap; }
.fases-chips span { font-size: .72rem; font-weight: 700; padding: .25rem .7rem; border-radius: 999px; }
.fase-c { background: rgba(84, 0, 148, .08); color: var(--roxo); }
.fase-e { background: rgba(171, 217, 5, .18); color: var(--verde-texto); }
.fase-p { background: rgba(33, 196, 247, .15); color: var(--azul-texto); }
.mapa-horizontal, .mapa-vertical { display: block; width: 100%; height: auto; }
.mapa-vertical { display: none; max-width: 19rem; margin: .5rem auto 0; }
.parada-mapa { cursor: pointer; outline: none; }
.parada-mapa:hover circle:not([fill="transparent"]), .parada-mapa:focus-visible circle:not([fill="transparent"]) { filter: drop-shadow(0 0 6px rgba(84, 0, 148, .35)); }
.parada-mapa:focus-visible text { text-decoration: underline; }
@media (max-width: 700px) { .mapa-horizontal { display: none; } .mapa-vertical { display: block; } .fases-chips { margin-left: 0; } }
.marcos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.5fr); gap: .9rem; padding: .4rem 1.6rem 1.6rem; }
@media (max-width: 760px) { .marcos { grid-template-columns: 1fr; } }
.marco { border-radius: 14px; padding: .9rem 1.1rem; display: grid; gap: .2rem; background: var(--papel); border: 1px solid var(--linha); align-content: start; }
.marco .rotulo { font-size: .62rem; }
.marco b { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.1rem; }
.marco p:not(.rotulo) { font-size: .85rem; color: var(--sub); }
.marco.aqui { background: var(--roxo-claro); border-color: rgba(84, 0, 148, .18); }
.marco.destino { background: linear-gradient(125deg, rgba(171, 217, 5, .14), rgba(33, 196, 247, .16)); border-color: transparent; }
.marco.destino .rotulo { color: var(--azul-texto); }
.marco.destino .frase { font-family: var(--fonte-titulo); font-style: italic; font-size: 1rem !important; color: var(--roxo-escuro) !important; line-height: 1.5; }

/* =====================================================================
   PAINEL DA EQUIPE · layout "Mesa do mentor" e ficha da pessoa
   ===================================================================== */
.numeros-equipe { display: flex; gap: .7rem; flex-wrap: wrap; position: relative; }
.numeros-equipe div { background: rgba(255, 255, 255, .93); border-radius: 14px; padding: .7rem 1.1rem; min-width: 7.5rem; }
.numeros-equipe strong { display: block; font-family: var(--fonte-titulo); font-weight: 300; font-size: 2rem; line-height: 1; color: var(--roxo); font-variant-numeric: tabular-nums; }
.numeros-equipe span { font-size: .78rem; color: var(--sub); }
.mesa { max-width: 76rem; margin: -4rem auto 0; padding-inline: 16px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); gap: 1.1rem; position: relative; align-items: start; }
@media (max-width: 1000px) { .mesa { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .destaque-equipe { grid-column: 1 / -1; } }
@media (max-width: 640px) { .mesa { grid-template-columns: 1fr; margin-top: -3.5rem; } .numeros-equipe div { min-width: 0; flex: 1; } }
.destaque-equipe { border-color: transparent; box-shadow: 0 16px 40px rgba(37, 4, 59, .10); }
.destaque-equipe > .rotulo { color: var(--roxo); }
.lista-acoes, .agenda, .lista-pessoas { list-style: none; margin: 0; padding: 0; display: grid; }
.lista-acoes li { display: flex; align-items: center; gap: .75rem; padding: .7rem 0; border-bottom: 1px solid #F1ECF7; }
.lista-acoes li:last-child { border-bottom: 0; }
.acao-texto { flex: 1; min-width: 0; font-size: .9rem; color: var(--sub); line-height: 1.45; }
.acao-texto b { color: var(--tinta); font-weight: 600; }
.lista-acoes .botao { flex: none; white-space: nowrap; }
.botao.mini.secundario { border: 1.5px solid var(--roxo); color: var(--roxo); background: #fff; }
.tudo-certo { background: var(--verde-claro); color: var(--verde-texto); border-radius: 12px; padding: .9rem 1rem; font-size: .9rem; }
.agenda li { display: flex; align-items: center; gap: .8rem; padding: .55rem 0; border-bottom: 1px solid #F1ECF7; }
.agenda li:last-child { border-bottom: 0; }
.dia-data { width: 3rem; flex: none; text-align: center; border-radius: 10px; background: var(--roxo-claro); padding: .3rem 0; line-height: 1.1; }
.dia-data b { display: block; font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.3rem; color: var(--roxo); font-variant-numeric: tabular-nums; }
.dia-data small { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--suave); }
.agenda a, .lista-pessoas a { text-decoration: none; color: inherit; display: flex; align-items: center; gap: .75rem; min-width: 0; flex: 1; }
.agenda a b { display: block; font-size: .92rem; color: var(--tinta); }
.agenda a span { font-size: .8rem; color: var(--suave); }
.agenda a:hover b, .lista-pessoas a:hover b { color: var(--roxo); }
.lista-pessoas li { border-bottom: 1px solid #F1ECF7; }
.lista-pessoas li:last-child { border-bottom: 0; }
.lista-pessoas a { padding: .55rem 0; }
.pessoa-nome { flex: 1; min-width: 0; display: grid; }
.pessoa-nome b { font-size: .9rem; font-weight: 600; color: var(--tinta); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pessoa-nome span { font-size: .75rem; color: var(--suave); }
.mini-progresso { width: 4.5rem; height: 6px; border-radius: 6px; background: #EEE9F5; overflow: hidden; flex: none; }
.mini-progresso i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, #ABD905, #21C4F7); }
.dica-equipe { max-width: calc(76rem - 32px); margin: 1.4rem auto 0; background: #fff; }
@media (max-width: 76rem) { .dica-equipe { margin-inline: 16px; } }

.ficha-cab { position: relative; overflow: hidden; isolation: isolate; border-radius: 22px; background: linear-gradient(125deg, #ABD905 0%, #47BFCF 55%, #21C4F7 100%); color: #fff; padding: 1.5rem 1.75rem; display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.ficha-cab .bolha-1 { width: 20rem; right: -5rem; top: -10rem; bottom: auto; }
.avatar-grande { width: 4rem; height: 4rem; font-size: 1.2rem; background: #fff; color: var(--roxo); }
.ficha-texto { flex: 1; min-width: 14rem; }
.ficha-texto h1 { font-family: var(--fonte-titulo); font-weight: 300; font-size: clamp(1.7rem, 3vw, 2.3rem); color: #fff; line-height: 1.1; }
.ficha-texto p { font-size: .88rem; color: rgba(255, 255, 255, .95); margin-top: .25rem; }
.ficha-acoes { display: flex; gap: .5rem; flex-wrap: wrap; position: relative; }
.ficha-acoes .botao { background: #fff; color: var(--roxo); box-shadow: none; }
.ficha-acoes .botao.secundario { background: rgba(255, 255, 255, .18); color: #fff; border: 1.5px solid rgba(255, 255, 255, .7); }
.caminho-ficha { margin: 0; max-width: none; }
@media (max-width: 76rem) { .caminho-ficha { margin-inline: 0; } }
.caminho-dica { padding: 0 1.6rem 1rem; }
.editor-sessao { scroll-margin-top: 5rem; }
.lista-acoes .botao:not(.secundario), .lista-acoes a.botao:not(.secundario) { color: #fff; }
.agenda a { display: grid; gap: 0; }

/* =====================================================================
   LIBERAÇÃO DE SESSÕES · PERGUNTAS ADICIONAIS · DEVOLUTIVAS
   ===================================================================== */
.oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.etiqueta.bloqueada { background: #F3F1F6; color: var(--suave); border-color: transparent; }
.caixa.devolutiva { background: linear-gradient(125deg, rgba(171, 217, 5, .14), rgba(33, 196, 247, .14)); border-left: 3px solid var(--azul); display: grid; gap: .8rem; justify-items: start; }
.caixa.devolutiva p { color: var(--tinta); line-height: 1.75; }
.caixa.devolutiva .botao { background: var(--roxo); color: #fff; }
.perguntas-extras { background: var(--roxo-claro); border-radius: 12px; padding: 1rem 1.1rem; gap: .8rem; }
.perguntas-extras label { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1rem; color: var(--tinta); }
.perguntas-extras .botao { background: var(--roxo); color: #fff; }
.devolutiva-cartao { background: linear-gradient(125deg, rgba(171, 217, 5, .12), rgba(33, 196, 247, .14)); border-color: transparent; }
.devolutiva-cartao h3, .perguntas-cartao h3 { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.2rem; }
.devolutiva-cartao .botao, .perguntas-cartao .botao { justify-self: start; background: var(--roxo); color: #fff; }
.perguntas-cartao { background: var(--roxo-claro); border-color: rgba(84, 0, 148, .15); }
.perguntas-cartao > p:not(.rotulo) { font-family: var(--fonte-titulo); font-style: italic; }

.liberacao { background: #fff; border: 1px solid var(--linha); border-radius: 18px; padding: 1.2rem 1.4rem; display: grid; gap: 1rem; }
.liberacao h3 { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.3rem; }
.liberacao-fases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
@media (max-width: 760px) { .liberacao-fases { grid-template-columns: 1fr; } }
.fase-lib { border-radius: 14px; padding: .9rem 1rem; display: grid; gap: .35rem; }
.fase-lib b { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.05rem; }
.fase-lib span { font-size: .8rem; color: var(--sub); }
.fase-lib .botao { background: var(--roxo); color: #fff; }
.fase-lib .botao.secundario { background: #fff; color: var(--roxo); border: 1.5px solid var(--roxo); }
.fase-lib .botao:disabled { opacity: .35; cursor: default; }
.barrinha-lib { height: 6px; border-radius: 6px; background: rgba(255, 255, 255, .8); overflow: hidden; margin: .2rem 0 .3rem; }
.barrinha-lib i { display: block; height: 100%; background: var(--roxo); border-radius: 6px; }

.devolutiva-editor { border: 1.5px solid var(--linha); border-radius: 14px; padding: .9rem 1rem 1rem; margin: 0; display: grid; gap: .6rem; background: linear-gradient(125deg, rgba(171, 217, 5, .06), rgba(33, 196, 247, .07)); }
.devolutiva-editor legend { font-family: var(--fonte-titulo); font-size: 1.05rem; padding: 0 .4rem; color: var(--tinta); }
.arquivo-linha { display: flex; gap: .6rem 1rem; align-items: center; flex-wrap: wrap; }
.arquivo-linha input[type="file"] { font-size: .85rem; max-width: 100%; }
.arquivo-linha label { margin: 0; }
.liberar-sessao { background: var(--verde-claro); border-radius: 10px; padding: .6rem .8rem; color: var(--verde-texto); font-weight: 600; }
.perguntas-editor { border-top: 1px solid var(--linha); padding: 1.1rem; display: grid; gap: .7rem; background: var(--roxo-claro); }
.perguntas-editor h4 { margin: 0; font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.05rem; }
.pergunta-item { background: #fff; border: 1px solid var(--linha); border-radius: 12px; padding: .8rem 1rem; display: grid; gap: .35rem; justify-items: start; }
.pq-texto { font-weight: 600; color: var(--tinta); }
.pq-resp { font-family: var(--fonte-titulo); font-style: italic; color: var(--sub); line-height: 1.6; }
.nova-pergunta { display: grid; gap: .4rem; }
.nova-pergunta .botao { background: var(--roxo); color: #fff; }

/* Aviso de ferramenta aberta em outra aba */
.aviso-ferramenta { position: fixed; z-index: 60; left: 50%; bottom: calc(1.2rem + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); width: min(36rem, calc(100% - 32px)); background: #fff; border: 1px solid var(--linha); border-left: 4px solid var(--azul); border-radius: 14px; box-shadow: 0 18px 40px rgba(37, 4, 59, .18); padding: .9rem 1.1rem; display: flex; gap: 1rem; align-items: flex-start; }
.aviso-ferramenta > div { flex: 1; display: grid; gap: .2rem; }
.aviso-ferramenta strong { font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.05rem; }
.aviso-ferramenta .estado { font-size: .88rem; color: var(--sub); line-height: 1.5; }
.abas-ferramentas { display: flex; gap: .4rem; flex-wrap: wrap; }
.abas-ferramentas button { border: 1.5px solid var(--linha); background: #fff; border-radius: 999px; padding: .45rem .9rem; font: 600 .85rem var(--fonte-texto); color: var(--sub); cursor: pointer; }
.abas-ferramentas button.ativo { background: var(--roxo); border-color: var(--roxo); color: #fff; }
.abas-ferramentas button span { opacity: .7; margin-left: .2rem; }
.relatorio .botao { background: var(--roxo); color: #fff; }

/* =====================================================================
   RESPOSTAS DAS FERRAMENTAS (equipe) · cartões em vez de texto corrido
   ===================================================================== */
.respostas-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: .9rem; align-items: start; }
.resp-cartao { background: #fff; border: 1px solid var(--linha); border-radius: 14px; padding: 1rem 1.1rem; display: grid; gap: .1rem; min-width: 0; }
.resp-cartao h4 { margin: 0 0 .45rem; font-family: var(--fonte-titulo); font-weight: 400; font-size: 1.05rem; color: var(--roxo); }
.resp-linha { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: .8rem; padding: .45rem 0; border-top: 1px solid #F1ECF7; font-size: .88rem; align-items: start; }
.resp-linha:first-of-type { border-top: 0; }
.resp-rotulo { color: var(--suave); font-size: .82rem; }
.resp-valor { color: var(--tinta); font-weight: 500; overflow-wrap: anywhere; display: grid; gap: .15rem; }
.linha-valor { display: block; }
.resp-lista { margin: 0; padding-left: 1.1rem; display: grid; gap: .3rem; font-size: .88rem; color: var(--sub); }
.medidor { display: inline-flex; align-items: center; gap: 4px; }
.medidor i { width: 10px; height: 10px; border-radius: 50%; background: #E9E2F3; }
.medidor i.cheio { background: linear-gradient(135deg, #ABD905, #21C4F7); }
.medidor b { margin-left: .35rem; font-size: .8rem; color: var(--sub); font-weight: 600; }
.visao-mapa { display: grid; gap: 1rem; }
.mapa-ident { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: .6rem 1.2rem; background: var(--roxo-claro); border-radius: 14px; padding: 1rem 1.2rem; }
.mapa-ident div { display: grid; gap: .1rem; min-width: 0; }
.mapa-ident b { font-weight: 600; font-size: .92rem; overflow-wrap: anywhere; }
.mapa-objetivo { margin: 0; border-radius: 14px; padding: 1.1rem 1.3rem; background: linear-gradient(125deg, rgba(171, 217, 5, .14), rgba(33, 196, 247, .15)); border-left: 4px solid var(--azul); display: grid; gap: .35rem; }
.mapa-objetivo p { font-family: var(--fonte-titulo); font-style: italic; font-size: 1.12rem; line-height: 1.5; color: var(--roxo-escuro); }
.mapa-situacoes, .mapa-ancoras { display: grid; gap: .45rem; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chip-sit { background: #fff; border: 1.5px solid var(--roxo); color: var(--roxo); border-radius: 999px; padding: .25rem .8rem; font-size: .82rem; font-weight: 600; }
.chip-ancora { background: var(--verde-claro); color: var(--verde-texto); border-radius: 999px; padding: .25rem .8rem; font-size: .82rem; font-weight: 700; }
.chip-ancora small { opacity: .7; font-weight: 600; }
.mapa-trilha { border: 1px solid var(--linha); border-radius: 14px; padding: .4rem 1rem 1rem; background: #fff; }
.mapa-trilha summary { cursor: pointer; padding: .6rem 0; font-family: var(--fonte-titulo); font-size: 1.05rem; color: var(--roxo); }
.resp-envios { margin-top: .4rem; }
