/* Visual adaptation only. Loaded after the original production CSS.
   Reference: DESIGN-SYSTEM-CUPOLA-OS-COMP. No DOM or application changes. */
@import url('./tokens.css');
@font-face { font-family: Inter; src: url("./inter-regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: Inter; src: url("./inter-medium.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: Inter; src: url("./inter-semibold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
:root:not(.dark) {
  --papel: var(--cupola-hsl-background);
  --carta: var(--cupola-hsl-surface);
  --tinta: var(--cupola-hsl-text);
  --tinta-2: var(--cupola-hsl-text-secondary);
  --tinta-3: var(--cupola-hsl-text-secondary);
  --linha: var(--cupola-hsl-border);
  --linha-2: 100.000 20.930% 91.569%;
  --mata: var(--cupola-hsl-action);
  --poco: var(--cupola-hsl-forest);
  --salvia: var(--cupola-hsl-focus);
  --neon: var(--cupola-hsl-citron);
  --bruma: 101.250 22.857% 86.275%;
  --alerta: var(--cupola-hsl-warning);
  --risco: var(--cupola-hsl-error);
}

body { font-family: var(--cupola-font-interface); }
.font-mono, .rotulo, kbd { font-family: var(--cupola-font-interface); }
.rotulo { letter-spacing: .09em; font-weight: 500; }
.display, .editorial { font-family: var(--cupola-font-expressive); font-weight: 400; letter-spacing: -.035em; }
.display { line-height: 1.12; }
.painel-numero { font-family: var(--cupola-font-interface); font-weight: 400; letter-spacing: -.045em; }
svg.lucide:not(.capa-inicio svg) { stroke-width: 1.65; }
.rounded-carta { border-radius: var(--cupola-radius-lg); }
.shadow-carta { box-shadow: var(--cupola-shadow-soft); }
.shadow-alto { box-shadow: var(--cupola-shadow-raised); }
/* Existing primary, secondary and AI actions retain their distinct states. */
:where(button, a).inline-flex.items-center.justify-center[class*="rounded-"] {
  border-radius: var(--cupola-radius-pill);
}
:where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), select).border {
  border-radius: var(--cupola-radius-md);
}
textarea.border { border-radius: var(--cupola-radius-md); }
:focus-visible { outline-color: var(--cupola-color-focus); outline-offset: 3px; }
.foco-marca:focus, .foco-marca:focus-visible {
  border-color: hsl(var(--salvia) / .35);
  box-shadow: 0 0 0 3px hsl(var(--salvia) / .12);
}
/* Campo focado: anel claro, uma borda só. 23/09/2026.
   O contorno verde-escuro de `:focus-visible` vale para botão e link — é ele
   que mostra onde o teclado está. Em campo de texto ele somava com a borda do
   próprio campo e virava contorno duplo e pesado. Campo com borda troca o
   contorno por um anel claro; campo sem borda fica com um contorno claro. */
:where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), textarea, select):focus-visible {
  outline: 2px solid hsl(var(--salvia) / .3); outline-offset: 1px;
}
:where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), textarea, select):is(.border, .foco-marca):focus-visible {
  outline: none;
  border-color: hsl(var(--salvia) / .35);
  box-shadow: 0 0 0 3px hsl(var(--salvia) / .12);
}
html.dark :focus-visible { outline-color: #B0F90A; }
/* Forest navigation; original widths, scrolling and mobile drawer preserved. */
.sup-poco { background: linear-gradient(165deg,#123f32,#0a342a 58%,#092b24); }
.sup-poco.grao::after { opacity: .045; }
.sup-poco a[aria-current="page"] {
  border-radius: var(--cupola-radius-pill);
  background-color: #ffffff18;
  box-shadow: inset 0 0 0 1px #ffffff12;
}
.sup-poco :is(a,button):focus-visible { outline-color: #B0F90A; }
/* Atmosphere derived from the new library, confined to existing brand areas. */
.sup-campo {
  background: radial-gradient(ellipse at 15% 90%,#749457,transparent 65%),linear-gradient(145deg,#0a342a,#214f38 58%,#102b25);
}
.sup-campo.grao::after { opacity: .08; }
form:has(#compositor):not(.capa-inicio form) { border-radius: var(--cupola-radius-lg); }
/* Cards keep their images, actions and existing grid; quieter material. */
:is(a,button).rounded-carta.group { border-color: hsl(var(--linha)); }
:is(a,button).rounded-carta.group .grao::after { opacity: .06; }
:is(a,button).rounded-carta.group h3 { font-family: var(--cupola-font-expressive); font-weight: 500; letter-spacing: -.025em; }
[role="dialog"] { border-radius: var(--cupola-radius-lg); }
[role="menu"], [role="listbox"] { border-radius: var(--cupola-radius-md); }
[role="tablist"] { border-radius: var(--cupola-radius-pill); }
[role="tab"] { border-radius: var(--cupola-radius-pill); }
[data-sonner-toast] { font-family: var(--cupola-font-interface) !important; border-radius: var(--cupola-radius-md) !important; }
@media (hover:hover) and (pointer:fine) {
  :is(a,button).rounded-carta.group:hover { border-color: hsl(var(--salvia) / .5); box-shadow: var(--cupola-shadow-soft); }
}
@media (prefers-reduced-motion:reduce) {
  :is(a,button).rounded-carta.group, :is(a,button).rounded-carta.group img { transition: none; transform: none; }
}
/* New design system typography for the application pages. */
aside.sup-poco a[aria-current="page"] { color: #B0F90A; }
aside.sup-poco .rotulo { color: #9dbba7 !important; }
/* Scope to the application shell; editors and artwork previews are untouched. */
#root > div:has(> aside.sup-poco),
#root > div:has(> .sup-poco) { background: hsl(var(--papel)); }
main > div > header h1.display { font-size: clamp(30px,3.2vw,42px); }
main > div > header { padding-bottom: 8px; }
main > div > section > div > h2 { font-family: var(--cupola-font-expressive); font-size: 22px; font-weight: 400; letter-spacing: -.025em; }
main > div > div > section > div > h2 { font-family: var(--cupola-font-expressive); font-size: 22px; font-weight: 400; letter-spacing: -.025em; }
/* The toolbar is outside the inset hero. Recolor only its own controls. */
/* Auth uses the same contained surface and generous corners as the catalogue. */
@media (min-width:1024px) {
  #root > .grid:has(> .sup-campo) { padding: 16px; gap: 16px; background: hsl(var(--papel)); }
  #root > .grid > .sup-campo { border-radius: 32px; }
}
/* New agent thumbnails from tokens.material.agentThumbnails.
   Only default legacy covers are restyled; uploaded covers retain their identity. */
:root { --ds-agent: var(--cupola-agentThumbnails-social); }
.rounded-carta.group:has(> img[src="/capas/agentes/verde.webp"]),
.rounded-carta.group:has(> img[src="/capas/agentes/neutro.webp"]) {
  --tinta: 80 46% 95%;
  --tinta-2: 90 20% 88%;
  --tinta-3: 90 20% 88%;
  background: var(--ds-agent);
  border-color: #f4f8ec40;
  color: #f4f8ec;
  min-height: 260px;
  padding: 24px;
  gap: 16px;
  box-shadow: inset 0 1px 0 #f4f8ec26;
}
.rounded-carta.group:has(> img[src="/capas/agentes/neutro.webp"]) {
  --ds-agent: var(--cupola-agentThumbnails-script);
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"])[href*="pantera"] {
  --ds-agent: var(--cupola-gradients-dusk);
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"])[href*="blog"] {
  --ds-agent: var(--cupola-agentThumbnails-blog);
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"])[href*="goes"] {
  --ds-agent: var(--cupola-agentThumbnails-script);
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"])[href*="franciosi-padrao"] {
  --ds-agent: var(--cupola-agentThumbnails-report);
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > :is(img,div[aria-hidden]) { visibility: hidden; }
.rounded-carta.group:has(> img[src^="/capas/agentes/"])::before {
  content: ""; position: absolute; width: 280px; height: 280px;
  border: 1px solid #f4f8ec25; border-radius: 50%; right: -100px; top: -155px; pointer-events: none;
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > div:has(> h3) { flex-wrap: wrap; }
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) h3 {
  flex-basis: 100%; font-family: var(--cupola-font-expressive); font-size: 24px; line-height: 1.15; font-weight: 400; color: #f4f8ec;
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > div:has(> h3) > span {
  width: 48px; height: 48px; border-radius: 50%; color: #f4f8ec;
  background: #f4f8ec10; border: 1px solid #f4f8ec66; box-shadow: inset 0 1px 0 #f4f8ec1f;
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) .etiqueta {
  color: #f4f8ec !important; border-color: #f4f8ec40; background: #f4f8ec10;
}
.font-leitura { font-family: var(--cupola-font-interface); line-height: 1.75; }
/* Compact segmented controls adopt the library's pill silhouette. */
main .inline-flex.border:has(> button + button) { border-radius: 999px; padding: 4px; background: hsl(var(--linha-2)); }
main .inline-flex.border:has(> button + button) > button { border-radius: 999px; }
main section > div.flex.items-baseline > h2 { font-family: var(--cupola-font-expressive); font-size: 22px; font-weight: 400; }
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > div:has(> h3) > span svg { color: #f4f8ec; width: 20px; height: 20px; }
/* A porta do Blog para a News.
   Mesma gramática do card de agente — arco, anel, título expressivo — e o
   MESMO token de cor do agente News (`agentThumbnails-script`). Escrito aqui
   com classe própria, e não reaproveitando os seletores da grade de agentes:
   aqueles dependem do `src` da capa, e um card que não tem capa nenhuma só
   entraria neles por acidente. */
.cartao-news {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
  padding: 24px; min-height: 264px;
  border-radius: var(--radius-carta, 20px);
  border: 1px solid #f4f8ec40;
  background: var(--cupola-agentThumbnails-script);
  color: #f4f8ec;
  box-shadow: inset 0 1px 0 #f4f8ec26;
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.cartao-news::before {
  content: ""; position: absolute; pointer-events: none;
  width: 280px; height: 280px; right: -100px; top: -155px;
  border: 1px solid #f4f8ec25; border-radius: 50%;
}
/* O segundo arco, que o card do agente não tem: aqui sobra altura, e ele é o
   que faz a passagem parecer um lugar em vez de um aviso colorido. */
.cartao-news::after {
  content: ""; position: absolute; pointer-events: none;
  width: 420px; height: 420px; right: -180px; bottom: -300px;
  border: 1px solid #f4f8ec1a; border-radius: 50%;
}
.cartao-news > * { position: relative; z-index: 1; }
.cartao-news-etiqueta {
  font-family: var(--cupola-font-interface); font-size: 10.5px; line-height: 1;
  padding: 7px 12px; border-radius: 999px;
  border: 1px solid #f4f8ec40; background: #f4f8ec10; color: #f4f8ec;
}
.cartao-news-anel {
  display: grid; place-items: center; width: 48px; height: 48px;
  margin-top: auto; border-radius: 50%; color: #f4f8ec;
  background: #f4f8ec10; border: 1px solid #f4f8ec66; box-shadow: inset 0 1px 0 #f4f8ec1f;
}
.cartao-news-titulo {
  font-family: var(--cupola-font-expressive); font-size: 24px; line-height: 1.15;
  font-weight: 400; color: #f4f8ec; letter-spacing: -.3px;
}
.cartao-news-texto {
  font-family: var(--cupola-font-interface); font-size: 12.5px; line-height: 1.55;
  max-width: 52ch; color: #f4f8ecc4;
}
/* A ação: pílula clara no card ligado, texto discreto no card à espera. Os dois
   ocupam a mesma linha, então o card não muda de altura quando o post é
   aprovado — a tela não pula debaixo da mão de quem acabou de aprovar. */
.cartao-news-acao {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; border-radius: 999px;
  background: #f4f8ec; color: #24404a;
  font-family: var(--cupola-font-interface); font-size: 13px; font-weight: 500;
  transition: gap .25s;
}
.cartao-news-espera {
  display: inline-flex; align-items: center; min-height: 37px;
  font-family: var(--cupola-font-interface); font-size: 12.5px; color: #f4f8ec8f;
}
.cartao-news-ligado:hover { transform: translateY(-2px); border-color: #f4f8ec80; box-shadow: inset 0 1px 0 #f4f8ec26, 0 12px 28px -18px #0b1f26; }
.cartao-news-ligado:hover .cartao-news-acao { gap: 12px; }
@media (max-width: 640px) { .cartao-news { padding: 20px; min-height: 0; } .cartao-news-titulo { font-size: 21px; } }

/* Hero restored from dist-v4. Keep its original palette and typography local. */
.capa-inicio { --papel:60 11% 97%;--carta:0 0% 100%;--tinta:150 18% 12%;--tinta-2:145 8% 40%;--tinta-3:144 7% 57%;--linha:90 11% 89%;--linha-2:90 13% 94%;--mata:145 35% 30%;--salvia:130 25% 55%;--poco:164 100% 7%;--neon:78 95% 51%;--bruma:120 20% 75%;--alerta:38 84% 45%;--risco:4 68% 48%;--serie-1:#1baf7a;--serie-2:#eb6834;--serie-3:#2a78d6;--serie-4:#eda100;--serie-5:#4a3aa7;--serie-6:#e87ba4; font-family: "Funnel Display",system-ui,-apple-system,sans-serif; }
.dark .capa-inicio { --papel:160 29% 6%;--carta:155 25% 9%;--tinta:120 12% 92%;--tinta-2:143 10% 64%;--tinta-3:150 8% 46%;--linha:150 16% 17%;--linha-2:150 19% 13%;--mata:142 34% 64%;--salvia:128 30% 70%;--bruma:150 12% 28%;--alerta:38 74% 62%;--risco:4 70% 66%;--serie-1:#199e70;--serie-2:#d95926;--serie-3:#3987e5;--serie-4:#c98500;--serie-5:#9085e9;--serie-6:#d55181; }
.capa-inicio .shadow-carta { --tw-shadow-color: hsl(var(--carta));--tw-shadow: var(--tw-shadow-colored) }
.capa-inicio .font-mono, .capa-inicio .rotulo { font-family: ui-monospace,SFMono-Regular,"SF Mono",Menlo,monospace; }
.capa-inicio .rotulo { font-weight: 400; letter-spacing: .14em; }
.capa-inicio form:has(#compositor) { border-radius: 20px; }
div:has(> main .capa-inicio) > header { font-family: "Funnel Display",system-ui,-apple-system,sans-serif; }
div:has(> main .capa-inicio) > header kbd { font-family: ui-monospace,SFMono-Regular,"SF Mono",Menlo,monospace; }
/* Edge-to-edge sidebar. Preserve the current material, motion and controls. */
@media (min-width:1024px) {
  aside.sup-poco { margin: 0; width: 236px; border: 0; border-radius: 0; }
}
/* Reference thumbnails: tags at the top; icon, title and one-line summary below. */
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > div:last-child {
  order: -1; margin-top: 0; min-height: 24px;
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > div:has(> h3) {
  margin-top: auto; flex-direction: column; align-items: flex-start; gap: 16px;
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > p {
  order: 1; width: 100%; max-width: 100%; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; font-size: 12px; line-height: 1.5;
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) h3 { flex-basis: auto; }
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > div:has(> h3) > svg {
  position: absolute; right: 0; top: 0;
}

.capa-inicio { color: hsl(var(--tinta)); }
.capa-inicio .shadow-carta { box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow); }
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) h3 {
  font-family: var(--cupola-font-interface); font-size: 24px; letter-spacing: -.7px;
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) .etiqueta {
  text-transform: none; font-size: 10px; letter-spacing: .5px; font-weight: 400;
}
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) .etiqueta > i { display: none; }
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > div:has(> h3) > span { width: 52px; height: 52px; }
.rounded-carta.group:has(> img[src^="/capas/agentes/"]) > div:has(> h3) > span svg { width: 24px; height: 24px; }
.rounded-carta.group:has(> img[src^="/capas/agentes/"])::before { width: 310px; height: 310px; right: -108px; top: -142px; }

/* Dashboard de custos: composição do DS, limitada a esta página administrativa. */
.custos-dashboard { --serie-1:#416651; --serie-2:#7b7191; --serie-3:#a77d71; --serie-4:#70929a; --serie-5:#8b9574; --serie-6:#526b61; }
.dark .custos-dashboard { --serie-1:#8fad8f; --serie-2:#b5a3cc; --serie-3:#d4a99b; --serie-4:#99c3cb; --serie-5:#b6c28e; --serie-6:#92b6a4; }
.custos-dashboard > div { max-width:1440px; padding:40px 36px; gap:28px; }
.custos-dashboard header h1 { font-size:40px; font-weight:400; }
.custos-dashboard header > div > p:last-child { font-family:var(--cupola-font-expressive); font-size:16px; }
.custos-grade { display:grid; grid-template-columns:1.1fr 1fr 1fr; gap:20px; }
.custos-filtros { grid-column:1/-1; grid-row:1; margin-bottom:4px; }
.custos-eficiencia { grid-column:1; grid-row:2/4; position:relative; overflow:hidden; isolation:isolate; min-width:0; min-height:520px; border-radius:28px; padding:28px; background:radial-gradient(ellipse at 0 0,#c3b9d4,transparent 62%),radial-gradient(ellipse at 0 100%,#8eacb4,transparent 68%),#eff0e8; color:#2d4247; }
.custos-eficiencia::before { content:""; position:absolute; z-index:-1; pointer-events:none; width:740px; height:850px; border:3px solid #ffffffa8; border-right-color:#7b9da7; border-radius:50%; right:25px; top:-280px; transform:rotate(-24deg); }
.custos-vidro { display:inline-flex; align-items:center; gap:8px; padding:9px 12px; border-radius:999px; border:1px solid #ffffff99; background:#ffffff80; font-size:10px; }
.custos-eficiencia-copy { margin-top:48px; }
.custos-eficiencia h2 { font:400 27px/1.15 var(--cupola-font-expressive); letter-spacing:-.7px; max-width:240px; }
.custos-grande { display:flex; align-items:center; gap:8px; font:400 clamp(54px,5.8vw,96px)/1.2 var(--cupola-font-interface); letter-spacing:-5px; margin:24px 0 30px; }
.custos-grande > span { font-size:38px; letter-spacing:-1px; }
.custos-grande small { display:block; font-size:12px; letter-spacing:0; }
.custos-eficiencia-copy > p { font:400 24px/1.25 var(--cupola-font-expressive); letter-spacing:-.5px; margin-bottom:18px; }
.custos-eficiencia-copy > small { display:block; font-size:10px; line-height:1.7; margin-top:10px; }
.custos-kpis { grid-column:2/4; grid-row:2; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.custos-dashboard .rounded-carta { border-radius:24px; background:hsl(var(--carta)/.8); }
.custos-dashboard .custos-metrica { padding:22px; gap:16px; min-height:170px; }
.custos-metrica > .rotulo { font:400 11px/1.5 var(--cupola-font-interface); text-transform:none; letter-spacing:0; color:hsl(var(--tinta-2)); }
.custos-metrica > b { font:400 clamp(22px,2vw,31px)/1.3 var(--cupola-font-interface); letter-spacing:-1px; overflow-wrap:anywhere; }
.custos-metrica > span:last-child { font:400 12px/1.5 var(--cupola-font-expressive); }
.custos-graficos { display:contents; }
.custos-evolucao { grid-column:2/4; grid-row:3; padding:24px; min-height:310px; }
.custos-fornecedores { grid-column:1; grid-row:4; padding:24px; }
.custos-complementos { grid-column:2/4; grid-row:4; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.custos-complementos > .rounded-carta { padding:20px; gap:12px; min-width:0; }
.custos-complementos .rotulo { font-size:10px; line-height:1.6; text-transform:none; letter-spacing:0; }
.custos-complementos .display { font-family:var(--cupola-font-interface); font-weight:400; }
.custos-distribuicao { grid-column:1/3; grid-row:5; padding:24px; }
.custos-insight { grid-column:3; grid-row:5; min-width:0; display:flex; flex-direction:column; padding:28px; border-radius:24px; background:radial-gradient(ellipse at 0 0,#739451,transparent 65%),linear-gradient(145deg,#214f38,#102b25); color:#f4f8ec; }
.custos-insight-label { display:flex; align-items:center; gap:8px; font-size:12px; }
.custos-insight-numero { display:flex; align-items:baseline; gap:4px; margin:24px 0; font:400 clamp(48px,5.5vw,84px)/1.2 var(--cupola-font-interface); letter-spacing:-4px; overflow-wrap:anywhere; }
.custos-insight-numero small { font-size:36px; letter-spacing:-1px; }.custos-insight-numero svg { align-self:flex-start; margin:12px 0 0 4px; color:#c8ee9a; flex-shrink:0; }
.custos-insight h2 { font:400 25px/1.25 var(--cupola-font-expressive); letter-spacing:-.4px; }
.custos-insight p { font:400 14px/1.7 var(--cupola-font-expressive); color:#d7e3d1; margin-top:16px; }
.custos-insight p + p { font:400 10px/1.7 var(--cupola-font-interface); color:#c4d5c2; }
.custos-insight-rodape { font-size:8px; letter-spacing:1px; color:#bbcfb9; margin-top:auto; padding-top:24px; }
.custos-creditos { grid-column:1/-1; grid-row:6; padding:24px; }
.custos-lancamentos { grid-column:1/-1; grid-row:7; padding:24px; }
.custos-creditos .display,.custos-lancamentos .display { font-family:var(--cupola-font-interface); font-weight:400; letter-spacing:-1px; }
.custos-creditos .rotulo { font-size:10px; line-height:1.6; text-transform:none; letter-spacing:0; }
.custos-rodape { grid-column:1/-1; grid-row:8; }
@media(max-width:1250px) {
 .custos-dashboard > div { padding:32px 24px; }
 .custos-grade { grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:16px; }
 .custos-kpis,.custos-evolucao,.custos-complementos { grid-column:2; }
 .custos-kpis { grid-template-columns:1fr; gap:12px; }.custos-dashboard .custos-kpis .custos-metrica { min-height:0; padding:16px 20px; gap:8px; }
 .custos-complementos { grid-template-columns:1fr; }.custos-distribuicao { grid-column:1; }.custos-insight { grid-column:2; }
 .custos-creditos,.custos-lancamentos { grid-column:1/-1; }
 .custos-grande { font-size:72px; }.custos-fornecedores > div:last-child { flex-direction:column; align-items:stretch; }
}
@media(max-width:700px) {
 .custos-dashboard > div { padding:28px 16px; }.custos-dashboard header h1 { font-size:34px; }
 .custos-grade { display:flex; flex-direction:column; gap:16px; }.custos-eficiencia { min-height:480px; padding:28px; order:1; }
 .custos-filtros { order:0; }.custos-kpis { order:2; }.custos-evolucao { order:3; padding:18px; }.custos-fornecedores { order:6; }
 .custos-complementos { order:7; }.custos-distribuicao { order:4; padding:20px; }.custos-insight { order:5; min-height:370px; }
 .custos-creditos { order:8; padding:20px; }.custos-lancamentos { order:9; padding:20px; }.custos-rodape { order:10; }
 .custos-grande { font-size:84px; }.custos-insight-numero { font-size:76px; }
 .custos-filtros > div { border-radius:20px!important; }
}

/* Navegação aprovada: reflexo só no topo, sem halo no perímetro. */
.sup-poco [class~="hover:shadow-aro-neon"]:hover {
  border-color: transparent;
  box-shadow: inset 0 1px 0 #ffffff66;
}
.ds-editor-overlay { position:fixed;inset:0;z-index:60;background:#06271f66;backdrop-filter:blur(4px); }
.ds-editor-agente { position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:61;width:min(850px,94vw);max-height:90dvh;overflow:auto;border:1px solid hsl(var(--linha));border-radius:24px;background:hsl(var(--carta));color:hsl(var(--tinta));padding:28px; }
.ds-editor-heading { display:flex;justify-content:space-between;align-items:center;gap:16px; }
.ds-editor-heading h2 { font-size:25px;font-weight:500; }
.ds-editor-agente > p { font-size:14px;color:hsl(var(--tinta-3));margin:8px 0 24px; }
.ds-editor-agente fieldset { min-width:0; }
.ds-editor-fields { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
.ds-editor-fields input { width:100%;border:1px solid hsl(var(--linha));border-radius:12px;padding:12px;background:hsl(var(--papel)); }
.ds-editor-preview { max-width:360px;margin:24px auto;pointer-events:none; }
.ds-editor-agente h3 { display:flex;justify-content:space-between;align-items:center;margin:18px 0;gap:12px; }
.ds-editor-agente h3 > span { font-size:11px;color:hsl(var(--tinta-3));text-transform:uppercase;letter-spacing:.06em; }
.ds-gradient-options { display:grid;grid-template-columns:1fr 1fr;gap:10px; }
.ds-gradient-options button { display:flex;align-items:center;gap:14px;text-align:left;border:1px solid hsl(var(--linha));border-radius:16px;padding:12px;background:hsl(var(--papel));font-size:14px; }
.ds-gradient-options button[aria-pressed="true"] { border-color:#6a8f55;box-shadow:inset 0 0 0 1px #6a8f55; }
.ds-gradient-options i { display:block;width:70px;height:52px;flex-shrink:0;border-radius:12px;box-shadow:inset 0 1px 0 #ffffff66; }
.ds-editor-agente button:focus-visible,.ds-editor-agente input:focus-visible { outline:2px solid #6a8f55;outline-offset:3px; }
.ds-reset-capa { margin:16px 0;font-size:14px;text-decoration:underline;text-underline-offset:4px; }
.ds-editor-agente footer { display:flex;justify-content:flex-end;gap:10px;margin-top:20px; }
.ds-editor-agente [role="alert"] { color:#b64450; }
@media(max-width:600px) { .ds-editor-agente {padding:20px;} .ds-editor-fields,.ds-gradient-options {grid-template-columns:1fr;} }

/* Biblioteca editorial do Blog: voz primeiro, contexto herdado em segundo. */
.blog-contexto { overflow: hidden; }
.blog-contexto-cabecalho h2 { font-size: clamp(21px, 2.4vw, 30px); letter-spacing: -.035em; margin: 10px 0; font-weight: 500; }
.blog-contexto-cabecalho p, .blog-contexto-perfil p { color: hsl(var(--tinta-3)); font-size: 13px; line-height: 1.65; }
.blog-contexto-upload { padding: 20px; border-radius: 26px; color: #f1f6ed; border: 1px solid #b9d0bc55; background: radial-gradient(ellipse at 12% 0%, #77936488, transparent 60%), linear-gradient(125deg,#214c40,#102f29); box-shadow: inset 0 1px 0 #ffffff35; }
.blog-contexto-destinos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.blog-contexto-destinos button { display: flex; align-items: center; gap: 14px; text-align: left; padding: 18px; border: 1px solid #ffffff20; border-radius: 18px; background: #ffffff05; transition: background .18s, border-color .18s; }
.blog-contexto-destinos button[aria-pressed="true"] { background: #d4e5c921; border-color: #cfdfb880; }
.blog-contexto-destinos button > span:nth-child(2) { flex: 1; }
.blog-contexto-destinos strong, .blog-contexto-destinos small { display: block; }
.blog-contexto-destinos strong { font-weight: 500; font-size: 14px; }
.blog-contexto-destinos small { margin-top: 4px; color: #bed0c5; font-size: 12px; }
.blog-contexto button:focus-visible, .blog-contexto summary:focus-visible { outline: 2px solid #86b36b; outline-offset: 4px; }
.blog-contexto-drop { margin-top: 16px; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; padding: 32px 20px; border-radius: 20px; border: 1px dashed #d6e6cf55; background: #071c2330; }
.blog-contexto-drop.arrastando { background: #b6d59630; border-color: #d6fba6; }
.blog-contexto-drop p { color: #c3d3c9; font-size: 13px; }
.blog-contexto-drop small { color: #b1c7bb; font-size: 11px; }
.blog-contexto-perfil { display: flex; flex-direction: column; gap: 12px; border: 1px solid hsl(var(--linha)); padding: 20px; border-radius: 20px; background: hsl(var(--salvia) / .06); }
.blog-contexto-perfil small { color: hsl(var(--tinta-3)); font-size: 11px; }
.blog-contexto-ficha summary { cursor: pointer; padding: 12px 0; font-size: 13px; font-weight: 500; }
.blog-contexto-ficha dl { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 16px 0; }
.blog-contexto-ficha dt { font-size: 11px; color: hsl(var(--tinta-3)); }
.blog-contexto-ficha dd, .blog-contexto-ficha p { font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.blog-contexto-ficha h3 { margin-top: 20px; font-weight: 600; }
@media (max-width: 640px) { .blog-contexto-destinos, .blog-contexto-ficha dl { grid-template-columns: 1fr; } .blog-contexto-upload { padding: 12px; } }

.blog-contexto .blog-perfil-acao,
.blog-contexto .blog-perfil-acao:disabled { background: hsl(var(--neon)); color: #16382b; opacity: 1; }
.blog-contexto .blog-perfil-acao:disabled { cursor: default; }
.blog-contexto-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 8px; margin: 12px 0; }
.blog-contexto-campos > details, .blog-contexto-materiais { border: 1px solid hsl(var(--linha)); border-radius: 12px; padding: 0 14px; }
.blog-contexto-campos p, .blog-contexto-materiais p { max-height: 240px; overflow: auto; padding-bottom: 14px; }
@media (max-width: 640px) { .blog-contexto-campos { grid-template-columns: 1fr; } }
.blog-contexto-arquivos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 8px; padding-bottom: 14px; }
.blog-contexto-arquivos > details { border: 1px solid hsl(var(--linha)); border-radius: 12px; background: hsl(var(--salvia) / .04); padding: 0 12px; min-width: 0; }
.blog-contexto-arquivos summary { display: flex; align-items: center; gap: 10px; list-style: none; }
.blog-contexto-arquivos summary::-webkit-details-marker { display: none; }
.blog-contexto-arquivos summary > svg { flex-shrink: 0; }
.blog-contexto-arquivos summary > span { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: 12px; }
.blog-contexto-arquivos small { display: block; color: hsl(var(--tinta-3)); font-size: 10px; letter-spacing: .06em; margin-top: 3px; }
.blog-contexto-arquivos details[open] summary > svg:last-child { transform: rotate(180deg); }
.blog-contexto-complementos { margin-top: 16px; padding: 16px; border-radius: 16px; background: hsl(var(--salvia) / .06); }
.blog-contexto-complementos h3 { margin: 0; font-size: 13px; }
.blog-contexto-complementos > p { margin: 6px 0 14px; color: hsl(var(--tinta-3)); }
@media (max-width: 640px) { .blog-contexto-arquivos { grid-template-columns: 1fr; } }

/* Entrada de clientes: arquivo como ação principal; complementos sob demanda. */
.cliente-cadastro-conteudo { display: flex; flex-direction: column; gap: 18px; }
.cliente-materiais { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); align-items: start; gap: 20px; }
.cliente-materiais > .cliente-material-porta { background: radial-gradient(ellipse at 0 0, hsl(var(--salvia) / .12), transparent 65%), hsl(var(--carta) / .8); backdrop-filter: blur(18px); box-shadow: inset 0 1px 0 #ffffff70, 0 12px 38px #0c342a06; border-radius: 26px; padding: 24px; }
.cliente-materiais .cliente-upload-zona { min-height: 310px; justify-content: center; border-radius: 20px; background: linear-gradient(140deg,hsl(var(--salvia) / .1),hsl(var(--carta) / .35)); border-color: hsl(var(--salvia) / .4); }
.cliente-materiais .cliente-upload-zona > span:first-child { width: 60px; height: 60px; background: hsl(var(--salvia) / .2); }
.cliente-materiais .cliente-upload-zona b { font-size: 18px; letter-spacing: -.025em; }
.cliente-materiais-apoio { display: flex; flex-direction: column; gap: 16px; }
.cliente-materiais-apoio > [data-porta="3"] { order: -1; border-radius: 24px; padding: 24px; background: radial-gradient(ellipse at top left,hsl(var(--neon) / .12),transparent 80%),hsl(var(--carta) / .75); border-color: hsl(var(--salvia) / .3); backdrop-filter: blur(16px); }
.cliente-materiais-opcionais { border: 1px solid hsl(var(--linha)); background: hsl(var(--carta) / .65); border-radius: 20px; overflow: hidden; }
.cliente-materiais-opcionais > summary, .cliente-cadastro-ajuda > summary { cursor: pointer; padding: 18px; font-size: 13px; font-weight: 500; }
.cliente-materiais-opcionais summary span { color: hsl(var(--tinta-3)); font-size: 11px; margin-left: 8px; }
.cliente-materiais-opcionais .cliente-material-porta { border: 0; background: transparent; padding-top: 0; }
.cliente-materiais-opcionais h2 { display: none; }
.cliente-materiais-detalhes { font-size: 12px; color: hsl(var(--tinta-3)); }
.cliente-materiais-detalhes summary { cursor: pointer; }
.cliente-materiais-detalhes p { margin-top: 8px; }
.cliente-cadastro-ajuda { border-top: 1px solid hsl(var(--linha)); }
.cliente-cadastro-ajuda > div { padding: 0 18px 18px; }
.cliente-trilha { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 6px; padding: 10px; background: hsl(var(--carta) / .65); border: 1px solid hsl(var(--linha)); border-radius: 20px; backdrop-filter: blur(16px); }
.cliente-trilha > button { border-radius: 12px; min-height: 42px; font-size: 12px; text-align: left; border-color: transparent; background: transparent; }
.cliente-trilha > button[aria-current="step"] { background: hsl(var(--mata)); color: hsl(var(--papel)); box-shadow: inset 0 1px 0 #ffffff30; }
.cliente-trilha > button[aria-current="step"] > span { background: hsl(var(--neon)); color: #16382b; }
.cliente-trilha > button:focus-visible, .cliente-materiais summary:focus-visible { outline: 2px solid hsl(var(--salvia)); outline-offset: 2px; }
@media(max-width:900px) { .cliente-materiais { grid-template-columns: 1fr; } .cliente-trilha { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:480px) { .cliente-materiais > .cliente-material-porta { padding: 16px; } .cliente-materiais .cliente-upload-zona { min-height: 270px; padding: 20px 12px; } }

/* Loading Campo circular — movimento original aprovado, sem cronômetro. */
.cupola-loading-campo { width: 100%; min-height: 320px; }
.cupola-loading-campo cupola-loading { display: block; min-height: 320px; }
.cupola-loading-fallback { min-height: 320px; display: grid; place-content: center; gap: 16px; padding: 28px; background: #103b30; color: #eef4e9; }
.leitura-campo-modal { width: 100%; max-width: 540px; max-height: 90dvh; overflow: auto; border-radius: 26px; border: 1px solid hsl(var(--linha)); background: hsl(var(--carta)); text-align: center; box-shadow: 0 24px 80px #05281d30; }
.leitura-campo-modal > div:not(.cupola-loading-campo) { padding: 20px 24px 0; }
.leitura-campo-modal > p { margin: 18px 24px 24px; }

/* Salvamento não muda a geometria do cabeçalho. */
.ficha-bloco-cabecalho { display: grid; grid-template-columns: minmax(0,1fr) 112px; align-items: start; gap: 12px; min-height: 28px; }
.ficha-bloco-titulos { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; min-width: 0; }
.ficha-bloco-status { display: flex; align-items: center; gap: 6px; width: 112px; height: 28px; font-size: 12px; white-space: nowrap; }
.ficha-status-icone { display: grid; place-items: center; flex: 0 0 18px; width: 18px; height: 18px; overflow: hidden; }
.ficha-status-icone > * { max-width: 18px; max-height: 18px; }
@media(max-width:480px) { .ficha-bloco-cabecalho { grid-template-columns: minmax(0,1fr); gap: 6px; } }

/* News: escala editorial compartilhada com o Blog; sem textos herdando 16px. */
.news-editorial { font-size: 13px; line-height: 1.6; }
.news-editorial fieldset { margin: 0; padding: 0; border: 0; }
.news-editorial label strong { font-size: 14px; font-weight: 500; }
.news-editorial label small { font-size: 12px; }
.news-editorial input[type="checkbox"] { accent-color: hsl(var(--mata)); }
.news-editorial button:focus-visible { outline: 2px solid hsl(var(--mata)); outline-offset: 3px; }

/* Inteligência de mercado — 22/09/2026.
   Hierarquia em três níveis: o número de hoje (superfície escura, o único
   ponto de alto contraste da página), o que toca as contas (vidro), e o
   acervo (cartões claros, leitura primeiro). O vidro só existe porque há um
   campo de cor atrás dele: sem isso, backdrop-filter borra um fundo liso e o
   resultado é um cartão branco com borda. */
:is(.mercado, .config, .pessoas) { position: relative; isolation: isolate; min-height: 100%; }
:is(.mercado, .config, .pessoas)::before {
  content: ""; position: absolute; inset: 0 0 auto; height: 760px; z-index: -1; pointer-events: none;
  background:
    radial-gradient(ellipse 48% 60% at 8% 22%, #86a1a73d, transparent 70%),
    radial-gradient(ellipse 42% 55% at 62% 8%, #b0c9a547, transparent 70%),
    radial-gradient(ellipse 36% 48% at 96% 38%, #c3b9d433, transparent 70%);
  -webkit-mask-image: linear-gradient(#000 55%, transparent);
          mask-image: linear-gradient(#000 55%, transparent);
}
.dark :is(.mercado, .config, .pessoas)::before {
  background:
    radial-gradient(ellipse 48% 60% at 8% 22%, #2f4d5a55, transparent 70%),
    radial-gradient(ellipse 42% 55% at 62% 8%, #23483755, transparent 70%),
    radial-gradient(ellipse 36% 48% at 96% 38%, #40384f40, transparent 70%);
}
.mercado > div { max-width: 1320px; gap: 24px; }
:is(.mercado, .config, .pessoas) {
  --mercado-vidro: hsl(var(--carta) / .58);
  --mercado-borda: #ffffffb3;
  --mercado-aro: inset 0 1px 0 #ffffffcc, inset 0 -1px 0 #50635714;
  --mercado-sombra: 0 18px 44px -26px #0a342a33;
}
.dark :is(.mercado, .config, .pessoas) {
  --mercado-vidro: hsl(var(--carta) / .5);
  --mercado-borda: #ffffff1c;
  --mercado-aro: inset 0 1px 0 #ffffff14;
  --mercado-sombra: 0 18px 44px -26px #000000aa;
}
.mercado-vidro {
  min-width: 0; border-radius: 28px; padding: 24px;
  background: var(--mercado-vidro);
  border: 1px solid var(--mercado-borda);
  box-shadow: var(--mercado-aro), var(--mercado-sombra);
  -webkit-backdrop-filter: blur(24px) saturate(1.3); backdrop-filter: blur(24px) saturate(1.3);
}
.mercado-cabeca { display: flex; align-items: baseline; gap: 12px; margin-bottom: 18px; }
.mercado-cabeca h2 { font: 400 20px/1.2 var(--cupola-font-expressive); letter-spacing: -.02em; color: hsl(var(--tinta)); }
.mercado-cabeca > span { margin-left: auto; font-size: 12px; color: hsl(var(--tinta-2)); font-variant-numeric: tabular-nums; }

/* Filtros: uma barra só, em vidro. Quatro caixas soltas liam como quatro
   formulários; aqui é um instrumento, e o filtro aceso se destaca dele. */
.mercado-filtros {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 6px; width: fit-content; max-width: 100%;
  border-radius: 999px; background: var(--mercado-vidro); border: 1px solid var(--mercado-borda);
  box-shadow: var(--mercado-aro), var(--mercado-sombra);
  -webkit-backdrop-filter: blur(24px) saturate(1.3); backdrop-filter: blur(24px) saturate(1.3);
}
.mercado-filtro {
  position: relative; display: flex; align-items: center; gap: 10px; padding: 9px 14px 9px 18px;
  border-radius: 999px; cursor: pointer; color: hsl(var(--tinta-2)); transition: background .18s, color .18s;
}
.mercado-filtro:hover { background: hsl(var(--carta) / .7); }
.mercado-filtro > span { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.mercado-filtro select {
  appearance: none; -webkit-appearance: none; background: transparent; border: 0; outline: none; cursor: pointer;
  font-size: 13.5px; font-weight: 500; color: hsl(var(--tinta)); max-width: 220px; padding-right: 2px; field-sizing: content;
}
.mercado-filtro select option { color: initial; }
.mercado-filtro:focus-within { box-shadow: 0 0 0 3px hsl(var(--salvia) / .14); }
.mercado-filtro select:focus-visible, .mercado-guardar select:focus-visible, .pessoas-busca input:focus-visible { outline: none; }
.mercado-filtro[data-ativo] { background: hsl(var(--mata)); color: hsl(var(--papel) / .8); }
.mercado-filtro[data-ativo] select { color: hsl(var(--papel)); }
.dark .mercado-filtro[data-ativo] { color: #0b1411b3; }
.dark .mercado-filtro[data-ativo] select { color: #0b1411; }
.mercado-limpar { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border-radius: 999px; font-size: 12.5px; color: hsl(var(--tinta-2)); }
.mercado-limpar:hover { color: hsl(var(--tinta)); background: hsl(var(--carta) / .7); }

.mercado-grade { display: grid; gap: 20px; }
@media (min-width: 1280px) { .mercado-grade { grid-template-columns: minmax(0, 1fr) 340px; } }
.mercado-topo { display: grid; gap: 20px; }
@media (min-width: 1024px) { .mercado-topo { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } }

/* Hoje: a única superfície escura. É o que se lê primeiro, e o número é a
   notícia — por isso ele é grande e o resto do card é moldura. */
.mercado-hoje {
  position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: 20px;
  min-height: 330px; padding: 24px; border-radius: 28px; color: #f4f8ec;
  background: var(--cupola-gradients-aurora); border: 1px solid #f4f8ec2e;
  box-shadow: inset 0 1px 0 #f4f8ec2e, 0 24px 60px -30px #0a342a99;
}
.mercado-hoje::before, .mercado-hoje::after { content: ""; position: absolute; z-index: -1; pointer-events: none; border-radius: 50%; }
.mercado-hoje::before { width: 320px; height: 320px; right: -110px; top: -150px; border: 1px solid #f4f8ec26; }
.mercado-hoje::after { width: 460px; height: 460px; right: -210px; bottom: -330px; border: 1px solid #f4f8ec1a; }
.mercado-hoje-cabeca { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.mercado-pilula {
  display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px;
  font-size: 11px; letter-spacing: .04em; color: #f4f8ec;
  background: #f4f8ec14; border: 1px solid #f4f8ec3d; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.mercado-ponto { width: 7px; height: 7px; border-radius: 50%; background: #b0f90a; box-shadow: 0 0 12px #b0f90a99; }
.mercado-hoje-numero { display: flex; align-items: flex-end; gap: 14px; }
.mercado-hoje-numero b { font: 400 clamp(64px, 7vw, 92px)/.9 var(--cupola-font-interface); letter-spacing: -.05em; }
.mercado-hoje-numero span { font: 400 20px/1.2 var(--cupola-font-expressive); letter-spacing: -.02em; padding-bottom: 6px; color: #e3ecdc; }
.mercado-hoje-temas { margin-top: auto; display: flex; flex-direction: column; gap: 6px; }
.mercado-hoje-temas small { font-size: 11.5px; color: #c4d5c2; margin-bottom: 4px; }
.mercado-hoje-temas p { font-size: 12.5px; color: #d7e3d1; }
.mercado-hoje-temas button {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 16px; text-align: left;
  background: #f4f8ec0f; border: 1px solid #f4f8ec1f; color: #f4f8ec; transition: background .18s, border-color .18s;
}
.mercado-hoje-temas button > svg { color: #c8ee9a; }
.mercado-hoje-temas button > span { flex: 1; min-width: 0; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mercado-hoje-temas button > em { font-style: normal; font-size: 12px; color: #c4d5c2; font-variant-numeric: tabular-nums; }
.mercado-hoje-temas button:hover, .mercado-hoje-temas button[aria-pressed="true"] { background: #f4f8ec1f; border-color: #f4f8ec52; }
.mercado-hoje :focus-visible { outline: 2px solid #b0f90a; outline-offset: 2px; }

/* Clientes: o número de novidades é o dado; nome e cidade são o rótulo. */
.mercado-clientes-grade { display: grid; gap: 10px; }
@media (min-width: 560px) { .mercado-clientes-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mercado-cliente {
  display: flex; flex-direction: column; gap: 18px; padding: 16px; border-radius: 20px; text-align: left; min-width: 0;
  background: hsl(var(--carta) / .62); border: 1px solid var(--mercado-borda); box-shadow: var(--mercado-aro);
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
.mercado-cliente:hover { transform: translateY(-2px); box-shadow: var(--mercado-aro), 0 14px 28px -20px #0a342a55; }
.mercado-cliente[aria-pressed="true"] { border-color: hsl(var(--mata)); box-shadow: inset 0 0 0 1px hsl(var(--mata)), var(--mercado-aro); }
.mercado-cliente-topo { display: flex; align-items: center; gap: 12px; min-width: 0; }
.mercado-cliente-topo b { display: block; font-size: 14.5px; font-weight: 500; color: hsl(var(--tinta)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mercado-cliente-topo small { display: block; font-size: 12px; color: hsl(var(--tinta-2)); margin-top: 2px; }
.mercado-sigla { display: grid; place-items: center; flex-shrink: 0; width: 36px; height: 36px; border-radius: 12px; font-size: 10px; font-weight: 600; color: #fff; box-shadow: inset 0 1px 0 #ffffff40; }
.mercado-cliente-numero { display: flex; align-items: baseline; gap: 8px; }
.mercado-cliente-numero b { font: 400 30px/1 var(--cupola-font-interface); letter-spacing: -.04em; color: hsl(var(--tinta)); font-variant-numeric: tabular-nums; }
.mercado-cliente-numero small { font-size: 12px; color: hsl(var(--tinta-2)); }

/* Cabeçalho da lista: título expressivo, abas em cápsula de vidro. */
.mercado-lista-cabeca { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 8px; }
.mercado-lista-cabeca h2 { font: 400 24px/1.2 var(--cupola-font-expressive); letter-spacing: -.025em; color: hsl(var(--tinta)); }
.mercado-abas {
  display: inline-flex; gap: 2px; padding: 4px; border-radius: 999px;
  background: var(--mercado-vidro); border: 1px solid var(--mercado-borda); box-shadow: var(--mercado-aro);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
}
.mercado-abas button { padding: 8px 16px; border-radius: 999px; font-size: 13px; color: hsl(var(--tinta-2)); transition: background .18s, color .18s; }
.mercado-abas button:hover { color: hsl(var(--tinta)); }
.mercado-abas button[aria-selected="true"] { background: hsl(var(--mata)); color: hsl(var(--papel)); box-shadow: inset 0 1px 0 #ffffff30; }
.dark .mercado-abas button[aria-selected="true"] { color: #0b1411; }
.mercado-contagem { margin-left: auto; font-size: 12px; color: hsl(var(--tinta-2)); font-variant-numeric: tabular-nums; }

/* Leituras: cartões separados, título primeiro. O resumo fica um tom abaixo
   e os metadados mais um — três níveis que o olho separa sem esforço. */
.mercado-lista { display: flex; flex-direction: column; gap: 10px; }
.mercado-leitura {
  display: flex; gap: 18px; padding: 20px 22px; border-radius: 22px; min-width: 0;
  background: hsl(var(--carta) / .82); border: 1px solid hsl(var(--linha) / .8);
  transition: border-color .2s, box-shadow .2s;
}
.mercado-leitura:hover { border-color: hsl(var(--salvia) / .55); box-shadow: 0 16px 36px -26px #0a342a55; }
.mercado-leitura > img { width: 112px; height: 84px; flex-shrink: 0; border-radius: 14px; object-fit: cover; border: 1px solid hsl(var(--linha)); }
.mercado-leitura-corpo { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 0; }
.mercado-tema {
  align-self: flex-start; padding: 4px 10px; border-radius: 999px; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase;
  color: hsl(var(--mata)); background: hsl(var(--salvia) / .14); border: 1px solid hsl(var(--salvia) / .28);
}
.mercado-leitura h3 { font-size: 16px; line-height: 1.35; font-weight: 500; letter-spacing: -.012em; color: hsl(var(--tinta)); }
.mercado-leitura h3 a { color: inherit; transition: color .18s; }
.mercado-leitura h3 a svg { color: hsl(var(--tinta-2)); }
.mercado-leitura h3 a:hover { color: hsl(var(--mata)); }
.mercado-leitura-corpo > p { font-size: 13.5px; line-height: 1.6; color: hsl(var(--tinta-2)); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mercado-leitura-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 12px; color: hsl(var(--tinta-2)); }
.mercado-leitura-meta b { font-weight: 500; color: hsl(var(--tinta)); }
.mercado-leitura-acoes { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; flex-shrink: 0; }
.mercado-contas { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: hsl(var(--tinta-2)); }
.mercado-contas-sigla {
  display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; font-size: 8.5px; font-weight: 600;
  color: hsl(var(--mata)); background: hsl(var(--carta)); border: 1px solid hsl(var(--salvia) / .35); box-shadow: 0 0 0 2px hsl(var(--carta));
}
.mercado-guardar {
  position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; cursor: pointer;
  color: hsl(var(--tinta)); background: hsl(var(--papel) / .7); border: 1px solid hsl(var(--linha));
  transition: border-color .18s, background .18s;
}
.mercado-guardar:hover { border-color: hsl(var(--salvia) / .7); }
.mercado-guardar:focus-within { border-color: hsl(var(--salvia) / .35); box-shadow: 0 0 0 3px hsl(var(--salvia) / .12); }
.mercado-guardar select { appearance: none; -webkit-appearance: none; background: transparent; border: 0; outline: none; cursor: pointer; font-size: 12.5px; color: inherit; field-sizing: content; max-width: 180px; }
.mercado-guardar select option { color: initial; }
.mercado-guardar[data-salva] { color: hsl(var(--mata)); background: hsl(var(--salvia) / .14); border-color: hsl(var(--salvia) / .4); cursor: default; }
@media (max-width: 720px) {
  .mercado-leitura { flex-wrap: wrap; padding: 18px; }
  .mercado-leitura > img { width: 100%; height: 160px; }
  .mercado-leitura-acoes { flex-direction: row; align-items: center; justify-content: space-between; width: 100%; }
}

/* Lateral: manutenção, não leitura — vidro, mas em tom mais baixo. */
.mercado-fontes { display: flex; flex-direction: column; gap: 2px; }
.mercado-fonte { display: flex; align-items: center; gap: 12px; padding: 10px 8px; margin: 0 -8px; border-radius: 16px; transition: background .18s; }
.mercado-fonte:hover { background: hsl(var(--carta) / .6); }
.mercado-fonte b { font-size: 13.5px; font-weight: 500; color: hsl(var(--tinta)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mercado-fonte small { font-size: 12px; color: hsl(var(--tinta-2)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mercado-fonte .mercado-fonte-erro, .mercado-fontes-rodape .mercado-fonte-erro { white-space: normal; color: hsl(var(--risco)); }
.mercado-fonte-icone {
  display: grid; place-items: center; flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%;
  color: hsl(var(--tinta-2)); background: hsl(var(--carta) / .7); border: 1px solid hsl(var(--linha));
}
.mercado-fonte-icone[data-feed] { color: hsl(var(--mata)); background: hsl(var(--salvia) / .16); border-color: hsl(var(--salvia) / .35); }
.mercado-fonte[data-erro] .mercado-fonte-icone { color: hsl(var(--risco)); border-color: hsl(var(--risco) / .4); background: hsl(var(--risco) / .08); }
.mercado-icone-botao {
  display: grid; place-items: center; flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%;
  color: hsl(var(--tinta-2)); transition: background .18s, color .18s;
}
.mercado-icone-botao:hover { background: hsl(var(--carta)); color: hsl(var(--mata)); }
.mercado-icone-botao:disabled { opacity: .4; }
.mercado-fontes-rodape { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 14px; padding-top: 14px; border-top: 1px solid hsl(var(--linha) / .8); font-size: 12.5px; }
.mercado-fontes-rodape b { font-weight: 500; color: hsl(var(--mata)); }
.mercado .mercado-atualizar { width: 100%; margin-top: 14px; padding: 11px 16px; font-size: 13px; }

/* Temas em alta: a barra atrás do nome diz o peso sem pedir que se leia o número. */
.mercado-temas { display: flex; flex-direction: column; gap: 6px; }
.mercado-temas button {
  position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 14px; text-align: left; border: 1px solid transparent; transition: border-color .18s;
}
.mercado-temas button::before {
  content: ""; position: absolute; inset: 0 auto 0 0; z-index: -1; width: var(--parte, 0%);
  background: linear-gradient(90deg, hsl(var(--salvia) / .22), hsl(var(--salvia) / .1)); border-radius: inherit;
}
.mercado-temas button:hover { border-color: hsl(var(--salvia) / .45); }
.mercado-temas button[aria-pressed="true"] { border-color: hsl(var(--mata)); }
.mercado-temas span { flex: 1; min-width: 0; font-size: 13px; color: hsl(var(--tinta)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mercado-temas em { font-style: normal; font-size: 12px; color: hsl(var(--tinta-2)); font-variant-numeric: tabular-nums; }
.mercado :is(button, a):focus-visible { outline: 2px solid hsl(var(--salvia)); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .mercado-cliente, .mercado-leitura { transition: none; } .mercado-cliente:hover { transform: none; } }
@media (max-width: 640px) {
  .mercado-filtros { border-radius: 24px; width: 100%; }
  .mercado-filtro { flex: 1 1 100%; justify-content: space-between; }
  .mercado-vidro, .mercado-hoje { padding: 20px; border-radius: 24px; }
  .mercado-hoje { min-height: 0; }
}

/* Configurações — 22/09/2026. Mesmo material da Inteligência de mercado: o
   perfil é a superfície escura (quem você é), e o resto é vidro sobre o campo
   de cor. A escolha de tema mostra a casa em miniatura, para ninguém precisar
   clicar para descobrir o que "Escuro" quer dizer. */
.config > div { max-width: 1080px; gap: 24px; }
.config-perfil {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 24px 28px;
  padding: 28px; border-radius: 28px; color: #f4f8ec;
  background: var(--cupola-gradients-aurora); border: 1px solid #f4f8ec2e;
  box-shadow: inset 0 1px 0 #f4f8ec2e, 0 24px 60px -30px #0a342a99;
}
@media (min-width: 900px) { .config-perfil { grid-template-columns: auto minmax(0, 1fr) minmax(240px, .8fr); } }
.config-perfil::before, .config-perfil::after { content: ""; position: absolute; z-index: -1; pointer-events: none; border-radius: 50%; }
.config-perfil::before { width: 360px; height: 360px; right: -120px; top: -190px; border: 1px solid #f4f8ec26; }
.config-perfil::after { width: 520px; height: 520px; left: -240px; bottom: -420px; border: 1px solid #f4f8ec1a; }
.config-foto { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.config-retrato { position: relative; width: 104px; height: 104px; border-radius: 50%; padding: 4px; background: #f4f8ec14; border: 1px solid #f4f8ec4d; box-shadow: inset 0 1px 0 #f4f8ec2e; }
.config-retrato > span:first-child { width: 100%; height: 100%; }
.config-retrato-camera {
  position: absolute; right: -2px; bottom: -2px; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  color: #0a342a; background: #f4f8ec; box-shadow: 0 6px 16px -6px #00000080; transition: transform .2s;
}
.config-retrato:hover .config-retrato-camera { transform: scale(1.08); }
.config-foto-acoes { display: flex; gap: 10px; font-size: 12px; }
.config-foto-acoes button { color: #d7e3d1; text-decoration: underline; text-decoration-color: #f4f8ec40; text-underline-offset: 3px; }
.config-foto-acoes button:hover { color: #f4f8ec; }
.config-foto-acoes .config-remover:hover { color: #ffb4b0; }
.config-perfil-nome { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.config-perfil-nome h2 { font: 400 clamp(26px, 3vw, 34px)/1.1 var(--cupola-font-expressive); letter-spacing: -.03em; margin-top: 4px; }
.config-perfil-nome > p { font-size: 14.5px; color: #e3ecdc; }
.config-perfil-nome .config-bio { font-size: 13px; line-height: 1.6; color: #c4d5c2; max-width: 52ch; margin-top: 6px; }
.config-pilula { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; font-size: 11px; letter-spacing: .04em; color: #0a342a; background: #b0f90a; }
.config-email { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #c4d5c2; overflow-wrap: anywhere; }
.config-fatos {
  display: flex; flex-direction: column; gap: 4px; padding: 10px; border-radius: 20px; min-width: 0;
  background: #f4f8ec0f; border: 1px solid #f4f8ec24; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
@media (max-width: 899px) { .config-fatos { grid-column: 1 / -1; } }
.config-fatos > div { display: grid; grid-template-columns: 16px 72px minmax(0, 1fr); align-items: center; gap: 10px; padding: 10px; border-radius: 14px; }
.config-fatos svg { color: #c8ee9a; }
.config-fatos dt { font-size: 12px; color: #c4d5c2; }
.config-fatos dd { font-size: 13.5px; color: #f4f8ec; overflow-wrap: anywhere; }
.config-fatos a { text-decoration: underline; text-decoration-color: #f4f8ec55; text-underline-offset: 3px; }
.config-perfil :focus-visible { outline: 2px solid #b0f90a; outline-offset: 3px; }

.config-grade { display: grid; gap: 20px; }
@media (min-width: 900px) { .config-grade { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); } }
.config-ajuda { font-size: 13px; line-height: 1.6; color: hsl(var(--tinta-2)); margin: -8px 0 18px; }
.config > div > .config-ajuda { margin: 0; }
.config-temas { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.config-tema {
  display: flex; flex-direction: column; gap: 12px; padding: 10px 10px 14px; border-radius: 22px; text-align: left;
  background: hsl(var(--carta) / .6); border: 1px solid var(--mercado-borda); box-shadow: var(--mercado-aro);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.config-tema:hover { transform: translateY(-2px); }
.config-tema[aria-checked="true"] { border-color: hsl(var(--mata)); box-shadow: inset 0 0 0 1px hsl(var(--mata)), var(--mercado-aro); }
.config-previa { display: flex; height: 112px; overflow: hidden; border-radius: 14px; border: 1px solid hsl(var(--linha)); }
.config-previa i { display: block; }
.config-previa-menu { width: 30%; display: flex; flex-direction: column; gap: 6px; padding: 12px 8px; background: linear-gradient(165deg,#123f32,#0a342a 58%,#092b24); }
.config-previa-menu i { height: 6px; border-radius: 99px; background: #f4f8ec33; }
.config-previa-menu i:first-child { width: 60%; background: #b0f90a; margin-bottom: 6px; }
.config-previa-pagina { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 14px 12px; }
.config-previa-pagina i:nth-child(1) { width: 55%; height: 9px; border-radius: 99px; }
.config-previa-pagina i:nth-child(2) { height: 34px; border-radius: 10px; }
.config-previa-pagina i:nth-child(3) { width: 40%; height: 14px; border-radius: 99px; margin-top: auto; align-self: flex-end; background: #0a342a; }
.config-tema[data-tema="claro"] .config-previa-pagina { background: #f6f7f4; }
.config-tema[data-tema="claro"] .config-previa-pagina i:nth-child(1) { background: #2d4247; }
.config-tema[data-tema="claro"] .config-previa-pagina i:nth-child(2) { background: #fff; border: 1px solid #dce3dc; }
.config-tema[data-tema="escuro"] .config-previa-pagina { background: #0d1613; }
.config-tema[data-tema="escuro"] .config-previa-pagina i:nth-child(1) { background: #e6ede6; }
.config-tema[data-tema="escuro"] .config-previa-pagina i:nth-child(2) { background: #16211d; border: 1px solid #243430; }
.config-tema[data-tema="escuro"] .config-previa-pagina i:nth-child(3) { background: #8fc98f; }
.config-tema-rotulo { display: flex; align-items: center; gap: 8px; padding: 0 6px; font-size: 14px; font-weight: 500; color: hsl(var(--tinta)); }
.config-marca {
  margin-left: auto; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%;
  border: 1px solid hsl(var(--linha)); color: transparent; transition: background .2s, color .2s;
}
.config-tema[aria-checked="true"] .config-marca { background: hsl(var(--mata)); border-color: hsl(var(--mata)); color: hsl(var(--papel)); }

.config-acessos { display: flex; flex-direction: column; gap: 10px; }
.config-acesso { display: flex; gap: 14px; padding: 16px; border-radius: 20px; background: hsl(var(--carta) / .6); border: 1px solid var(--mercado-borda); box-shadow: var(--mercado-aro); }
.config-acesso-icone { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; color: hsl(var(--mata)); background: hsl(var(--salvia) / .16); border: 1px solid hsl(var(--salvia) / .35); }
.config-acesso-titulo { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: hsl(var(--tinta-2)); margin-bottom: 10px; }
.config-acesso-titulo b { font: 400 24px/1 var(--cupola-font-interface); letter-spacing: -.03em; color: hsl(var(--tinta)); font-variant-numeric: tabular-nums; }
.config-acesso-titulo small { font-size: 12px; }
.config-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.config-chips > span { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font-size: 12px; color: hsl(var(--tinta)); background: hsl(var(--papel) / .7); border: 1px solid hsl(var(--linha)); }
.config-chips i { width: 7px; height: 7px; border-radius: 50%; }
.config-chips small { font-size: 12px; color: hsl(var(--tinta-2)); }
.config-gerenciar { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-radius: 18px; font-size: 13.5px; font-weight: 500; color: hsl(var(--tinta)); border: 1px solid transparent; transition: background .18s, border-color .18s; }
.config-gerenciar:hover { background: hsl(var(--carta) / .7); border-color: hsl(var(--salvia) / .45); }
.config-gerenciar svg:first-child { color: hsl(var(--mata)); }
.config-nota { display: flex; gap: 12px; align-items: flex-start; padding: 16px 20px; border-radius: 20px; font-size: 13px; line-height: 1.6; color: hsl(var(--tinta-2)); background: hsl(var(--salvia) / .07); border: 1px solid hsl(var(--salvia) / .22); }
.config-nota svg { margin-top: 2px; color: hsl(var(--mata)); }
.config-nota b { font-weight: 500; color: hsl(var(--tinta)); }
.config-fase2 { border-style: dashed; }
.config :is(button, a):focus-visible { outline: 2px solid hsl(var(--salvia)); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .config-tema, .config-retrato-camera { transition: none; } .config-tema:hover { transform: none; } }
@media (max-width: 560px) {
  .config-perfil { grid-template-columns: 1fr; justify-items: center; text-align: center; padding: 24px 20px; }
  .config-perfil-nome { align-items: center; }
  .config-fatos { width: 100%; text-align: left; }
  .config-temas { grid-template-columns: 1fr 1fr; gap: 8px; }
  .config-previa { height: 88px; }
}

/* Jornada — 22/09/2026. Continua no escuro (é tela de celebração, não de
   trabalho), mas com o material da biblioteca: aurora no topo, vidro escuro
   nos blocos, citron só onde há conquista. */
/* O topo branco: a regra acima que pinta a casca de papel valia também aqui,
   e a faixa do cabeçalho transparente mostrava esse papel sobre a tela escura. */
#root > div.casca-poco:has(> aside) { background: #0a342a; }
.jornada {
  position: relative; isolation: isolate; min-height: 100%; color: #f4f8ec;
  background:
    radial-gradient(ellipse 60% 40% at 85% 0%, #56833166, transparent 70%),
    radial-gradient(ellipse 50% 40% at 0% 35%, #3c596555, transparent 70%),
    radial-gradient(ellipse 60% 50% at 100% 90%, #40384f44, transparent 70%),
    linear-gradient(180deg, #0a342a, #072a22 45%, #06231d);
}
.jornada-miolo { max-width: 1120px; margin: 0 auto; padding: 32px 20px 48px; display: flex; flex-direction: column; gap: 24px; }
@media (min-width: 640px) { .jornada-miolo { padding: 40px 28px 56px; } }
.jornada :focus-visible { outline: 2px solid #b0f90a; outline-offset: 3px; }

.jornada-topo {
  position: relative; isolation: isolate; overflow: hidden; display: grid; gap: 32px; align-items: center;
  padding: 36px; border-radius: 32px;
  background: radial-gradient(ellipse at 20% 110%, #749457cc, transparent 60%), linear-gradient(135deg, #0d3b2f, #1d4d36 55%, #123a2c);
  border: 1px solid #f4f8ec26; box-shadow: inset 0 1px 0 #f4f8ec2e, 0 30px 80px -40px #000;
}
@media (min-width: 860px) { .jornada-topo { grid-template-columns: minmax(0, 1fr) 280px; } }
.jornada-topo::before, .jornada-topo::after { content: ""; position: absolute; z-index: -1; pointer-events: none; border-radius: 50%; }
.jornada-topo::before { width: 520px; height: 520px; left: -200px; top: -330px; border: 1px solid #f4f8ec1f; }
.jornada-topo::after { width: 760px; height: 760px; right: -300px; bottom: -560px; border: 1px solid #f4f8ec14; }
.jornada-topo-texto { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.jornada-pilula {
  display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; font-size: 11.5px; letter-spacing: .04em;
  background: #f4f8ec14; border: 1px solid #f4f8ec3d; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.jornada-pilula svg { color: #b0f90a; }
.jornada-topo h1 { font: 400 clamp(52px, 8vw, 104px)/.95 var(--cupola-font-expressive); letter-spacing: -.045em; }
.jornada-topo-texto > p { font: 400 18px/1.45 var(--cupola-font-expressive); color: #d7e3d1; max-width: 36ch; }
.jornada-contadores { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.jornada-contador {
  display: flex; align-items: baseline; gap: 8px; padding: 10px 16px; border-radius: 999px;
  background: #f4f8ec10; border: 1px solid #f4f8ec2e; box-shadow: inset 0 1px 0 #f4f8ec1f;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.jornada-contador b { font: 400 22px/1 var(--cupola-font-interface); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.jornada-contador span { font-size: 12px; color: #c4d5c2; }

/* O anel é a barra de progresso: o número no centro e o arco em volta dizem
   a mesma coisa de dois jeitos, e nenhum precisa de bloco próprio. */
.jornada-anel { position: relative; justify-self: center; width: 240px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.jornada-anel svg { width: 240px; height: 240px; transform: rotate(-90deg); }
.jornada-anel-fundo { fill: #f4f8ec08; stroke: #f4f8ec1f; stroke-width: 10; }
.jornada-anel-traco { fill: none; stroke: url(#jornada-traco); stroke-width: 10; stroke-linecap: round; filter: drop-shadow(0 0 10px #b0f90a80); transition: stroke-dashoffset 1s cubic-bezier(.23,1,.32,1); }
.jornada-anel-miolo { position: absolute; top: 0; width: 240px; height: 240px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.jornada-anel-miolo b { font: 400 64px/1 var(--cupola-font-interface); letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.jornada-anel-miolo span { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: #c4d5c2; margin-top: 6px; }
.jornada-anel-legenda { font-size: 13.5px; color: #d7e3d1; text-align: center; }
.jornada-anel-legenda b { color: #b0f90a; font-weight: 500; }

.jornada-bloco {
  min-width: 0; padding: 28px; border-radius: 28px;
  background: linear-gradient(160deg, #f4f8ec0d, #f4f8ec05); border: 1px solid #f4f8ec1a;
  box-shadow: inset 0 1px 0 #f4f8ec14; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
}
.jornada-cabeca { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 22px; }
.jornada-cabeca h2 { font: 400 24px/1.2 var(--cupola-font-expressive); letter-spacing: -.025em; }
.jornada-cabeca > span { margin-left: auto; font-size: 12.5px; color: #9dbba7; font-variant-numeric: tabular-nums; }
.jornada-nota { margin-top: 20px; font-size: 12.5px; line-height: 1.6; color: #9dbba7; max-width: 72ch; }
.jornada-rodape { margin-top: 0; padding: 0 4px; color: #7fa491; }

/* Trilha: seis estações numa linha. O trilho acende até onde a pessoa está. */
.jornada-trilha { position: relative; display: grid; gap: 12px; list-style: none; margin: 0; padding: 0; }
@media (min-width: 860px) {
  .jornada-trilha { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
  .jornada-trilha::before { content: ""; position: absolute; left: 22px; right: 22px; top: 21px; height: 2px; background: #f4f8ec1f; }
}
.jornada-trilha li { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 0 4px; min-width: 0; }
@media (max-width: 859px) {
  .jornada-trilha li { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 14px; }
  .jornada-trilha li > :not(.jornada-no) { grid-column: 2; }
  .jornada-trilha .jornada-no { grid-row: 1 / span 3; }
}
.jornada-no {
  position: relative; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; margin-bottom: 8px;
  font: 500 15px/1 var(--cupola-font-interface); color: #9dbba7; background: #0b2e25; border: 1px solid #f4f8ec2e;
}
.jornada-trilha li[data-estado="feito"] .jornada-no { color: #0a342a; background: #c8ee9a; border-color: #c8ee9a; }
.jornada-trilha li[data-estado="atual"] .jornada-no { color: #0a342a; background: #b0f90a; border-color: #b0f90a; box-shadow: 0 0 0 6px #b0f90a26, 0 0 28px #b0f90a66; }
.jornada-trilha small { font-size: 11px; letter-spacing: .04em; color: #7fa491; font-variant-numeric: tabular-nums; }
.jornada-trilha b { font: 400 19px/1.2 var(--cupola-font-expressive); letter-spacing: -.02em; color: #f4f8ec; }
.jornada-trilha li[data-estado="adiante"] b { color: #9dbba7; }
.jornada-trilha p { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; line-height: 1.45; color: #d7e3d1; margin-top: 4px; }
.jornada-trilha p svg { margin-top: 2px; color: #c8ee9a; }
.jornada-trilha li[data-estado="adiante"] p { color: #9dbba7; }
.jornada-trilha li[data-estado="adiante"] p svg { color: #7fa491; }
.jornada-trilha p em { display: block; font-style: normal; font-size: 11.5px; color: #7fa491; margin-top: 3px; }
.jornada-trilha .jornada-sem-premio { color: #7fa491; }
.jornada-trilha li[data-estado="atual"]::after {
  content: "Você está aqui"; position: absolute; top: -26px; left: 4px; font-size: 10.5px; letter-spacing: .06em; color: #b0f90a; white-space: nowrap;
}
@media (max-width: 859px) { .jornada-trilha li[data-estado="atual"]::after { position: static; grid-column: 2; order: -1; } }
@media (min-width: 860px) { .jornada-trilha { margin-top: 40px; } }

/* Conquistas: a feita brilha, a trancada é contorno. */
.jornada-grupo-cabeca { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.jornada-grupo-cabeca p { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #c4d5c2; white-space: nowrap; }
.jornada-grupo-barra { flex: 1; height: 4px; border-radius: 99px; background: #f4f8ec14; overflow: hidden; }
.jornada-grupo-barra i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7ed957, #b0f90a); }
.jornada-grupo-cabeca small { font-size: 12px; color: #9dbba7; font-variant-numeric: tabular-nums; }
.jornada-conquistas { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.jornada-conquista {
  position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 6px; padding: 18px; border-radius: 20px; min-height: 164px;
  border: 1px dashed #f4f8ec24; background: transparent;
}
.jornada-conquista[data-feita] {
  border: 1px solid #b0f90a40;
  background: radial-gradient(ellipse at 100% 0%, #b0f90a24, transparent 60%), #f4f8ec0a;
  box-shadow: inset 0 1px 0 #f4f8ec1f;
}
.jornada-conquista-icone { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; margin-bottom: 8px; color: #7fa491; border: 1px solid #f4f8ec24; }
.jornada-conquista[data-feita] .jornada-conquista-icone { color: #0a342a; background: #b0f90a; border-color: #b0f90a; box-shadow: 0 0 20px #b0f90a4d; }
.jornada-conquista b { font-size: 14px; font-weight: 500; line-height: 1.3; color: #9dbba7; }
.jornada-conquista[data-feita] b { color: #f4f8ec; }
.jornada-conquista p { font-size: 12px; line-height: 1.5; color: #7fa491; }
.jornada-conquista[data-feita] p { color: #c4d5c2; }
.jornada-conquista-pontos { margin-top: auto; padding-top: 8px; font-size: 12px; color: #7fa491; font-variant-numeric: tabular-nums; }
.jornada-conquista[data-feita] .jornada-conquista-pontos { color: #b0f90a; }

.jornada-dupla { display: grid; gap: 24px; }
@media (min-width: 860px) { .jornada-dupla { grid-template-columns: 1fr 1fr; } }
.jornada-regras, .jornada-historico { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.jornada-regras li, .jornada-historico li { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid #f4f8ec12; }
.jornada-regras li:last-child, .jornada-historico li:last-child { border-bottom: 0; }
.jornada-regras span, .jornada-historico span { flex: 1; min-width: 0; font-size: 13.5px; line-height: 1.4; color: #e3ecdc; }
.jornada-regras small { display: block; font-size: 11.5px; color: #7fa491; margin-top: 2px; }
.jornada-regras b, .jornada-historico b {
  flex-shrink: 0; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 500; font-variant-numeric: tabular-nums;
  color: #b0f90a; background: #b0f90a14; border: 1px solid #b0f90a33;
}
.jornada-historico { max-height: 420px; overflow: auto; }
.jornada-historico i { width: 7px; height: 7px; flex-shrink: 0; border-radius: 50%; background: #c8ee9a; box-shadow: 0 0 8px #b0f90a80; }
.jornada-vazio { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 32px 0; text-align: center; font-size: 13.5px; color: #9dbba7; }
@media (max-width: 640px) {
  .jornada-topo { padding: 24px; border-radius: 26px; }
  .jornada-bloco { padding: 20px; border-radius: 24px; }
  .jornada-anel, .jornada-anel svg, .jornada-anel-miolo { width: 200px; }
  .jornada-anel svg, .jornada-anel-miolo { height: 200px; }
  .jornada-anel-miolo b { font-size: 52px; }
}
@media (prefers-reduced-motion: reduce) { .jornada-anel-traco { transition: none; } }

/* Pessoas — 22/09/2026. O resumo escuro é o único ponto de alto contraste e
   também é o filtro; os cartões são vidro claro, com a cor da área como fio
   no alto de cada um para o time se ler por área sem precisar ler texto. */
.pessoas > div { max-width: 1240px; gap: 24px; }
.pessoas-resumo {
  position: relative; isolation: isolate; overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; gap: 24px 36px;
  padding: 26px 28px; border-radius: 28px; color: #f4f8ec;
  background: var(--cupola-gradients-aurora); border: 1px solid #f4f8ec2e;
  box-shadow: inset 0 1px 0 #f4f8ec2e, 0 24px 60px -30px #0a342a99;
}
.pessoas-resumo::before { content: ""; position: absolute; z-index: -1; width: 420px; height: 420px; right: -140px; top: -260px; border-radius: 50%; border: 1px solid #f4f8ec24; pointer-events: none; }
.pessoas-resumo-total { display: flex; align-items: flex-end; gap: 12px; }
.pessoas-resumo-total b { font: 400 64px/.9 var(--cupola-font-interface); letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.pessoas-resumo-total span { font: 400 16px/1.25 var(--cupola-font-expressive); color: #d7e3d1; padding-bottom: 4px; }
.pessoas-recortes { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.pessoas-recortes button {
  display: flex; align-items: baseline; gap: 8px; padding: 10px 16px; border-radius: 999px; color: #f4f8ec;
  background: #f4f8ec10; border: 1px solid #f4f8ec2e; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  transition: background .18s, border-color .18s, color .18s;
}
.pessoas-recortes button b { font: 400 20px/1 var(--cupola-font-interface); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.pessoas-recortes button span { font-size: 12.5px; color: #c4d5c2; }
.pessoas-recortes button:hover { background: #f4f8ec1f; border-color: #f4f8ec52; }
.pessoas-recortes button[aria-pressed="true"] { background: #b0f90a; border-color: #b0f90a; color: #0a342a; }
.pessoas-recortes button[aria-pressed="true"] span { color: #0a342a; }
.pessoas-resumo :focus-visible { outline: 2px solid #b0f90a; outline-offset: 3px; }

.pessoas-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.pessoas-busca {
  display: flex; align-items: center; gap: 10px; flex: 1 1 320px; max-width: 520px; padding: 12px 18px; border-radius: 999px;
  color: hsl(var(--tinta-2)); background: var(--mercado-vidro); border: 1px solid var(--mercado-borda);
  box-shadow: var(--mercado-aro), var(--mercado-sombra); -webkit-backdrop-filter: blur(24px) saturate(1.3); backdrop-filter: blur(24px) saturate(1.3);
}
.pessoas-busca:focus-within { border-color: hsl(var(--salvia) / .35); box-shadow: 0 0 0 3px hsl(var(--salvia) / .12), var(--mercado-aro); }
.pessoas-busca input { flex: 1; min-width: 0; background: transparent; border: 0; outline: none; font-size: 14px; color: hsl(var(--tinta)); }
.pessoas-busca input::placeholder { color: hsl(var(--tinta-2)); }
.pessoas-busca button { display: grid; place-items: center; color: hsl(var(--tinta-2)); }
.pessoas-busca button:hover { color: hsl(var(--tinta)); }
.pessoas-contagem { margin-left: auto; font-size: 12.5px; color: hsl(var(--tinta-2)); font-variant-numeric: tabular-nums; }
.pessoas-vazio { font-size: 13.5px; color: hsl(var(--tinta-2)); }
.pessoas-vazio button { color: hsl(var(--mata)); text-decoration: underline; text-underline-offset: 3px; }
.pessoas-nota { max-width: 74ch; font-size: 12.5px; line-height: 1.6; color: hsl(var(--tinta-2)); }
.pessoas-nota a { color: hsl(var(--mata)); text-decoration: underline; text-underline-offset: 3px; }

.pessoas-grade { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.pessoa {
  position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 14px; min-width: 0; padding: 22px;
  border-radius: 26px; background: hsl(var(--carta) / .72); border: 1px solid var(--mercado-borda);
  box-shadow: var(--mercado-aro), var(--mercado-sombra); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  transition: box-shadow .2s, transform .2s;
}
.pessoa::before { content: ""; position: absolute; left: 22px; right: 22px; top: 0; height: 3px; border-radius: 0 0 99px 99px; background: var(--cor-area); opacity: .9; }
.pessoa:hover { box-shadow: var(--mercado-aro), 0 22px 44px -26px #0a342a55; }
.pessoa[data-inativa] { background: hsl(var(--carta) / .4); box-shadow: none; }
.pessoa[data-inativa]::before { opacity: .25; }
.pessoa[data-inativa] :is(.pessoa-retrato, .pessoa-nome, .pessoa-email, .pessoa-campos) { opacity: .5; }
.pessoa[data-inativa] .pessoa-nome { text-decoration: line-through; }
.pessoa-topo { display: flex; align-items: flex-start; gap: 14px; }
.pessoa-retrato {
  display: block; flex-shrink: 0; width: 52px; height: 52px; border-radius: 50%; padding: 3px;
  background: conic-gradient(from 200deg, var(--cor-area), transparent 70%, var(--cor-area));
}
.pessoa-retrato > span { box-shadow: 0 0 0 2px hsl(var(--carta)); }
.pessoa-papel { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; margin-bottom: 6px; padding: 3px 10px; border-radius: 999px; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: hsl(var(--tinta-2)); background: hsl(var(--linha) / .5); }
.pessoa-papel[data-papel="admin"] { color: hsl(var(--papel)); background: hsl(var(--mata)); }
.dark .pessoa-papel[data-papel="admin"] { color: #0b1411; }
.pessoa-papel[data-papel="gestor"] { color: hsl(var(--mata)); background: hsl(var(--salvia) / .18); }
.pessoa-papel em { font-style: normal; padding-left: 6px; border-left: 1px solid currentColor; color: hsl(var(--alerta)); }
.pessoa-papel[data-papel="admin"] em { color: #b0f90a; }
.pessoa-nome { font: 500 17px/1.25 var(--cupola-font-interface); letter-spacing: -.02em; color: hsl(var(--tinta)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pessoa .pessoa-cargo { margin-left: -4px; margin-top: 2px; }
.pessoa-chave { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex-shrink: 0; }
.pessoa-chave small { font-size: 10.5px; color: hsl(var(--tinta-2)); white-space: nowrap; }
.pessoa-email { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: hsl(var(--tinta-2)); min-width: 0; }
.pessoa-email span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pessoa-campos { display: flex; flex-direction: column; gap: 2px; padding: 4px; border-radius: 18px; background: hsl(var(--papel) / .6); border: 1px solid hsl(var(--linha) / .7); }
.pessoa-seletor {
  display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border-radius: 14px; text-align: left;
  transition: background .18s;
}
.pessoa-seletor:hover:not(:disabled) { background: hsl(var(--carta)); }
.pessoa-seletor:disabled { cursor: not-allowed; }
.pessoa-seletor + .pessoa-seletor, .pessoa-campos > * + * { border-top: 1px solid hsl(var(--linha) / .6); border-radius: 0 0 14px 14px; }
.pessoa-seletor-rotulo { display: block; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: hsl(var(--tinta-2)); margin-bottom: 2px; }
.pessoa-seletor b { font-size: 14px; }
.pessoa-seletor[data-state="open"] { background: hsl(var(--carta)); }
.pessoa-numeros { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto; }
.pessoa-numeros > span { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 16px; font-size: 12px; color: hsl(var(--tinta-2)); background: hsl(var(--salvia) / .07); }
.pessoa-numeros b { font: 400 24px/1 var(--cupola-font-interface); letter-spacing: -.035em; color: hsl(var(--tinta)); font-variant-numeric: tabular-nums; }
.pessoa-numeros small { font-size: 13px; letter-spacing: 0; color: hsl(var(--tinta-2)); }
.pessoa-sem-acesso { margin-top: auto; padding: 12px 14px; border-radius: 16px; font-size: 12.5px; color: hsl(var(--risco)); background: hsl(var(--risco) / .07); border: 1px solid hsl(var(--risco) / .2); }
.pessoas :is(button, a):focus-visible { outline: 2px solid hsl(var(--salvia)); outline-offset: 2px; }
@media (max-width: 640px) {
  .pessoas-resumo { padding: 22px 20px; border-radius: 24px; }
  .pessoas-recortes { margin-left: 0; }
  .pessoas-busca { max-width: none; }
  .pessoa { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) { .pessoa { transition: none; } }