/* Funnel Labs identity over the original member-area layout.
   Geometry, menu order, grids, spacing and responsive breakpoints remain in
   base.css and the original page styles. This file changes only visual skin. */
body { background:var(--surface-0);color:var(--ink-1); }
body::before { background:none; }
h1,h2,h3,.display,.section-title,.brand-word,.art-headline,.art-stats strong { font-weight:600; }
.brand-word small { color:var(--accent-text); }  /* 8,5px exige o laranja de texto: o --accent puro dá 3,68:1 no claro */
.site-header { background:var(--topbar-solid);border-color:var(--hair-2); }
@media (min-width:1024px) { .site-header { background:var(--topbar-bg); } }
.main-nav a { color:var(--ink-2); }.main-nav a:hover,.main-nav a.active { color:var(--accent-text); }
.avatar { background:var(--accent-soft);border-color:var(--hair-accent);color:var(--ink-1); }
.avatar.yellow { background:var(--btn-primary-gradient);color:var(--accent-ink); }
.btn { font-family:var(--font-body);font-weight:600;border-radius:var(--radius-control); }
.btn-primary { background:var(--btn-primary-gradient);color:var(--accent-ink);box-shadow:var(--shadow-btn-primary); }
.btn-primary:hover { box-shadow:var(--shadow-btn-primary-hover); }
.btn-ghost { background:var(--surface-3);border-color:var(--hair-3);color:var(--ink-1); }
.btn-ghost:hover { background:var(--surface-4);border-color:var(--hair-4); }
.card { background:var(--card-gradient);border-color:var(--hair-2);box-shadow:var(--elev-1); }
.field input,.field textarea,.field select,.search-box { background:var(--surface-3);border-color:var(--hair-3);color:var(--ink-1); }
.field input:focus,.field textarea:focus,.field select:focus { border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-quiet); }
.field input::placeholder,.field textarea::placeholder,.search-box input::placeholder { color:var(--ink-3); }
.empty-state { color:var(--ink-3);border-color:var(--hair-2); }
.empty-state strong { color:var(--ink-1); }
.toast,.modal,.modal-box,.dialog { background:var(--surface-2);border-color:var(--hair-3);color:var(--ink-1); }
.mobile-nav { background:var(--bottom-nav-solid);border-color:var(--hair-3); }
.mobile-nav a.active { color:var(--accent-text); }  /* rótulo de 10px sobre superfície clara pede o laranja de texto */
.hero-slide::before { background:radial-gradient(ellipse at 85% 25%,var(--accent-soft),transparent 65%),var(--card-gradient); }
.cover:not(.has-img),.card-lesson .thumb { background:radial-gradient(ellipse at 100% 0%,var(--accent-soft),transparent 80%),var(--card-gradient); }
.course-hero { background:radial-gradient(ellipse at 90% 10%,var(--accent-quiet),transparent 60%),var(--card-gradient); }
.s-item { color:var(--ink-2); }.s-item:hover { background:var(--surface-3);color:var(--ink-1); }
/* Ativo não perde identidade no hover: a cor de estado vem depois. */
.s-item.active,.s-item.active:hover { background:var(--accent-soft);color:var(--accent-text);box-shadow:inset 0 0 0 1px var(--hair-accent); }
.b-theme.ink,.b-theme.navy { background:radial-gradient(circle at 72% 18%,rgba(193,18,31,.26),transparent 58%),linear-gradient(160deg,#121212,#080808); }
.b-theme.yellow { background:var(--btn-primary-gradient); }
.b-theme.green,.b-theme.texture { background:repeating-linear-gradient(-45deg,transparent 0 8px,rgba(193,18,31,.22) 8px 12px),linear-gradient(160deg,#121212,#080808); }
/* Os nomes internos de tema continuam compatíveis com os banners existentes. */
.b-theme.navy { background: #080808 url("../img/premium/launch/hero-mentoria-small.webp") 80% center / cover; }
.b-theme.yellow { background: #080808 url("../img/premium/launch/hero-laboratorio-small.webp") 80% center / cover; }
.b-theme.green { background: #080808 url("../img/premium/launch/hero-copywriting-small.webp") 80% center / cover; }
#nb-themes { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
#nb-themes .b-theme { width: 100%; height: 88px; position: relative; overflow: hidden; }
#nb-themes .b-theme span { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px 4px 8px; background: linear-gradient(transparent, #000); color: var(--on-art); font: 500 10px var(--font-body); }
.abar i { background:var(--accent);opacity:.88; }.abar:last-child i { background:var(--accent);opacity:1; }
.fl-assistant-fab { background:var(--surface-2);border:1px solid var(--hair-accent-strong);box-shadow:var(--elev-3); }
.fl-assistant-fab img { object-fit:contain; }
.fl-assistant-panel { background:var(--surface-2);border-color:var(--hair-3);box-shadow:var(--elev-3); }
.fl-assistant-head { background:var(--card-gradient);border-color:var(--hair-2); }.fl-assistant-head img { background:var(--surface-3);border-color:var(--accent);object-fit:contain; }
.fl-assistant-head .who span { color:var(--ink-3); }
.fl-assistant-msg { white-space:pre-wrap;overflow-wrap:anywhere; }
.fl-assistant-msg.bot { background:var(--surface-3);color:var(--ink-1); }.fl-assistant-msg.me { background:var(--accent-soft);color:var(--ink-1);border-color:var(--hair-accent); }
.fl-assistant-sugs button { background:var(--surface-3);border-color:var(--hair-3);color:var(--ink-2); }
.fl-assistant-sugs button:hover { background:var(--accent);color:var(--accent-ink); }
.fl-assistant-input { background:var(--surface-1);border-color:var(--hair-2); }.fl-assistant-input button { background:var(--accent);color:var(--accent-ink); }
.login-form-col { background:linear-gradient(180deg,var(--surface-1),var(--surface-0)); }
/* A arte do login nao inverte: fundo de forja nos dois temas. */
.login-art { background:radial-gradient(ellipse at 85% 0%,rgba(193,18,31,.16),transparent 60%),#050505; color:var(--on-art); }
.login-art .art-sub,.login-art .art-mark,.login-art .art-stats span { color:var(--on-art-dim); }
.login-art .art-stats { border-color:rgba(253,253,253,.16); }
.login-art .art-headline em { color:#E5222F; }
.login-art::before { background-image:radial-gradient(rgba(253,253,253,.07) 1px,transparent 1px); }
.art-tape { background:linear-gradient(90deg,var(--accent-deep),var(--accent),var(--accent-hover)); }
.support-link { color:var(--accent-text);font-weight:600; }.support-link:hover { text-decoration:underline; }
#support-message { color:var(--ink-2); }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }*,*::before,*::after { animation:none!important;transition:none!important; }.reveal { opacity:1!important;transform:none!important; } }
/* A arte de cada destaque é um picture no home.js, carregado sob demanda.
   O véu mantém o contraste da tipografia nos dois temas. */
.hero-slide::before {
  background-image: var(--art-scrim);
  background-position: center right;
  background-size: cover;
  background-repeat: no-repeat;
}
/* No retrato a parte clara da arte ficava atrás do H1: o véu vira vertical. */
@media (max-width: 900px) {
  .hero-slide::before { background-image: var(--art-scrim-v); }
}
/* QF-V-15 — a miniatura espera a capa real (aplicada inline pelo lazy do
   app.js) sobre a matéria da marca, sem baixar imagem nenhuma: a arte do hero
   como fundo padrão custava ~19 KB e LCP no curso pelo celular. */
.card-lesson .thumb {
  background-image: radial-gradient(circle at 78% 12%, rgba(193,18,31, .22), transparent 55%),
                    linear-gradient(165deg, #121212 0%, #0A0A0A 60%, #060606 100%);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.card-lesson .thumb::before { background: none; }
.cover.has-img::before { background: none; }

/* Tema claro: a arte não inverte — vira objeto sobre papel. */
:root[data-theme="light"] .hero,
:root[data-theme="light"] .course-hero.has-banner,
:root[data-theme="light"] .v-banner {
  border-radius: var(--radius-surface);
  box-shadow: var(--elev-2), var(--art-inset);
  border-color: transparent;
}
:root[data-theme="light"] .hero { margin-inline: var(--s-7); overflow: hidden; }
:root[data-theme="light"] .v-banner { margin-inline: var(--s-7); }
:root[data-theme="light"] .course-hero.has-banner { margin: var(--s-4) var(--s-7); overflow: hidden; }
@media (max-width: 900px) {
  :root[data-theme="light"] .hero,
  :root[data-theme="light"] .v-banner { margin-inline: var(--s-4); }
  :root[data-theme="light"] .course-hero.has-banner { margin: var(--s-3) var(--s-4); }
}
/* Texto sobre arte permanece claro nos dois temas. */
.hero-slide, .hero-slide h2, .hero-slide .tag-mono,
.course-hero.has-banner, .course-hero.has-banner h1,
.cover-hover, .cover-caption, .cover-lock { color: var(--on-art); }
.hero-slide p,
.course-hero.has-banner .tagline, .course-hero.has-banner .crumbs,
.course-hero.has-banner .course-stats span,
.course-hero.has-banner .course-stats strong { color: var(--on-art-dim); }
.course-hero.has-banner .course-stats strong { color: var(--on-art); }
.course-hero.has-banner .course-stats { border-color: rgba(253,253,253,.16); }
.course-hero.has-banner .cpl-bar { background: rgba(253,253,253,.18); box-shadow: none; }
.course-hero.has-banner .crumbs a:hover { color: var(--accent-hover); }
.course-hero.has-banner .tag-status { background: rgba(193,18,31,.18); border-color: rgba(193,18,31,.42); color: var(--on-art); }
.course-hero.has-banner .btn-ghost {
  background: rgba(253,253,253,.10);
  border-color: rgba(253,253,253,.28);
  color: var(--on-art);
}
.course-hero.has-banner .btn-ghost:hover { background: rgba(253,253,253,.18); }

/* Resultados no mesmo miolo da vitrine, sem deslocar o menu. */
.search-results-list{display:grid;gap:12px;margin:20px 0}
.search-result{display:flex;flex-direction:column;gap:6px;padding:20px;text-decoration:none;color:inherit}
.search-result:hover{border-color:var(--hair-accent)}
.search-result>span:last-child{font-size:13px;opacity:.7}
.quiz-editor{margin:20px 0;padding-top:18px;border-top:1px solid var(--hair-2)}
.quiz-question{padding:14px;margin:12px 0;border:1px solid var(--hair-2);border-radius:var(--radius-control)}
.quiz-question textarea{width:100%;box-sizing:border-box}
.community-replies{margin-top:14px;border-top:1px solid var(--hair-2);padding-top:12px}
.community-replies p{white-space:pre-wrap;overflow-wrap:anywhere}
.community-reply{margin:12px 0;padding:12px;border-radius:var(--radius-control);background:var(--surface-3)}
.community-replies textarea,.post-edit-text{width:100%;box-sizing:border-box;min-height:70px;background:var(--surface-3);color:inherit;border:1px solid var(--hair-3);border-radius:var(--radius-control);padding:10px}
.p-actions{flex-wrap:wrap}.post>p{white-space:pre-wrap;overflow-wrap:anywhere}
.p-act[aria-pressed=true]{color:var(--accent-text)}
.channel-manager{margin-bottom:18px;padding:18px}.channel-manager form{display:grid;gap:12px}
.channel-manager label{display:grid;gap:6px}.channel-manager input{background:var(--surface-3);color:inherit;border:1px solid var(--hair-3);border-radius:var(--radius-control);padding:8px;max-width:100%}

/* ---------------------------------------------------------------
   Tipografia por papel, independente da tag.
   Os agentes de HTML estão ajustando os níveis de heading para a
   hierarquia de acessibilidade; o estilo segue o PAPEL do texto, não o
   número do <h>. Regra-mãe: Playfair Display só a partir de 28px —
   abaixo disso a didone perde traço e parece frágil.
   --------------------------------------------------------------- */
.card-lesson .body :is(h2, h3, h4, h5) {
  font-family: var(--font-body);
  font-size: var(--t-card);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -.005em;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(var(--t-card) * 1.35 * 2);
  text-wrap: initial;
}
.playlist-head :is(h2, h3, h4),
.notebook-head :is(h2, h3, h4),
.dl-head :is(h3, h4, h5),
.rail-card :is(h2, h3, h4),
.channel-manager :is(h2, h3),
.b-item .b-info strong {
  font-family: var(--font-body);
  font-size: var(--t-card);
  font-weight: 600;
  letter-spacing: -.005em;
}
.about-lesson > :is(h2, h3),
.comments > :is(h2, h3),
.quiz-head :is(h2, h3),
.alerts > :is(h2, h3),
.chart-card :is(h2, h3),
.chart-box :is(h2, h3),
.badges > :is(h2, h3),
.rank-card > :is(h2, h3),
.first-week-card > :is(h2, h3),
.inactive-list :is(h2, h3),
.form-card :is(h2, h3),
.live-session-card > :is(h2, h3),
.onboarding-answers > :is(h2, h3),
.about :is(h2, h3),
.module-head :is(h2, h3),
.post > :is(h2, h3) {
  font-family: var(--font-body);
  font-size: var(--t-section);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.01em;
}
/* Nome do mentorado no cartão de status: grotesca firme, não serifa de 24px. */
.status-top h1, .status-top h2, .status-top h3 {
  font-family: var(--font-body); font-size: 22px; font-weight: 600; letter-spacing: -.015em;
}
/* Corpo de aula em leitura: hierarquia interna em grotesca. */
.lesson-article h1, .lesson-article h2, .lesson-article h3, .lesson-article h4 {
  font-family: var(--font-body); font-weight: 700; letter-spacing: -.01em;
}
.lesson-article h1 { font-size: 21px; }
.lesson-article h2 { font-size: 18.5px; }
.lesson-article h3 { font-size: 16.5px; }
.lesson-article h4 { font-size: 15px; }
/* Título de modal abaixo de 28px também é grotesca. */
.modal h2, .modal h3 { font-family: var(--font-body); font-size: 20px; font-weight: 600; letter-spacing: -.015em; }
/* Destaque do título da aula dentro do h2 do hero: cor, não itálico — a
   Playfair itálica baixaria um peso a mais no elemento de LCP. */
/* O hero é sempre arte escura: o destaque usa o vermelho claro nos dois temas. */
.hero-focus { font-style: normal; font-weight: inherit; color: #E5222F; }
.popup.is-welcome h3 { font-family: var(--font-display); font-size: var(--t-h2); font-weight: 700; }

/* Título dos banners da vitrine sobre a metade escura da arte. */
.v-banner { position:relative; }
.v-banner-copy { position:absolute; left:5%; top:50%; transform:translateY(-50%); max-width:46%; color:var(--on-art); pointer-events:none; }
.v-banner-copy strong { display:block; font:800 clamp(20px,3vw,40px)/1.08 var(--font-display); letter-spacing:-.02em; text-wrap:balance; }
@media (max-width:700px) { .v-banner-copy { max-width:58%; } }
.v-banner img { object-fit:cover; object-position:right center; }
/* As capas da Labs I.A não trazem título: a legenda fica visível também no desktop. */
.cover.has-img:not(.art-titled) .cover-caption { display:flex; }

/* ---------------------------------------------------------------
   Lapidação da vitrine (30/09): menos rótulo, mais arte e título.
   O quadrado vermelho da marca substitui índices numerados e rótulos
   em caixa alta espaçada.
   --------------------------------------------------------------- */

/* Hero: rótulo legível com o quadrado da marca, sem contador numerado. */
.hero .hero-slide .tag-mono {
  display: flex; width: fit-content; align-items: center; gap: 10px;
  font: 600 15px/1.2 var(--font-body); letter-spacing: 0; text-transform: none;
  color: var(--on-art);
}
.hero .hero-slide .tag-mono::before { content: ""; width: 10px; height: 10px; background: var(--accent); flex: none; }
.hero-slide.is-plan .tag-mono { color: var(--on-art); }
.hero-count { display: none; }
.hero-dots button.on::before { background: #E5222F; }

/* Slide da marca: a revelação da logo ocupa a metade direita, sobre o mesmo preto. */
/* O vídeo tem fundo #090909: o slide usa o mesmo tom, sem véu, para a moldura não aparecer. */
.hero-slide.is-brand { background: #090909; }
.hero-slide.is-brand::before { background: none; }
.hero-brand { position: absolute; z-index: 1; top: 50%; right: clamp(8px, 5vw, 96px); transform: translateY(-50%); height: min(100%, 560px); aspect-ratio: 1; pointer-events: none; }
.hero-brand video { width: 100%; height: 100%; object-fit: contain; display: block; background: #090909; }
.hero-slide.is-brand .hero-inner { max-width: min(560px, 48%); }
.hero-slide.is-brand h2 { -webkit-line-clamp: 3; line-clamp: 3; }
@media (max-width: 900px) {
  .hero-brand { top: -6px; right: 50%; transform: translateX(50%); height: 52%; }
  /* No celular a própria animação já diz o nome: o rótulo sairia colado nela. */
  .hero-slide.is-brand .tag-mono { display: none; }
  .hero-slide.is-brand .hero-inner { max-width: none; }
  .hero-slide.is-brand h2 { font-size: clamp(26px, 7.4vw, 34px); }
}

/* Cabeçalho das esteiras: título, contagem e fio na mesma linha. */
body[data-scope="home"] .shelf-head { align-items: center; gap: 16px; }
body[data-scope="home"] .shelf-head .section-title { margin: 0; line-height: 1.05; }
body[data-scope="home"] .shelf-head .count {
  font: 500 14px/1 var(--font-body); letter-spacing: 0; color: var(--ink-3);
  padding: 6px 10px; border: 1px solid var(--hair-2); border-radius: var(--radius-control);
}
.section-index, .section-heading-copy .tag-mono { display: none; }

/* Capas com arte: maiores no desktop e com título que se lê de longe. */
@media (min-width: 1100px) {
  body[data-scope="home"] .shelf-track .cover { flex-basis: 262px; }
}
.cover { container-type: inline-size; }
.cover.has-img { background-position: center; }
.cover.has-img .cover-caption {
  display: flex; flex-direction: column; justify-content: flex-end; gap: 7px;
  top: 38%; padding: 0 clamp(14px, 7cqi, 22px) clamp(14px, 7cqi, 22px);
  background: linear-gradient(180deg, rgba(8,8,8,0) 0%, rgba(8,8,8,.72) 34%, rgba(8,8,8,.95) 100%);
  font-family: var(--font-body);
}
.cover-caption .cc-title { font: 800 clamp(17px, 10.5cqi, 30px)/1.02 var(--font-display); letter-spacing: -.025em; color: #FFFFFF; text-wrap: balance; }
.cover-caption .cc-sub { font: 500 clamp(12px, 5cqi, 13.5px)/1.4 var(--font-body); color: rgba(253,253,253,.74); display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cover-caption .cc-meta { display: inline-flex; align-items: center; gap: 8px; font: 600 12.5px/1 var(--font-body); color: rgba(253,253,253,.66); }
.cover-caption .cc-meta::before { content: ""; width: 7px; height: 7px; background: var(--accent); }
.cover-caption .cc-cta { display: grid; overflow: hidden; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows var(--dur-control) var(--ease), opacity var(--dur-control) var(--ease), margin var(--dur-control) var(--ease); }
.cover-caption .cc-cta > .btn { display: flex; min-height: 0; overflow: hidden; width: 100%; }
.cover:hover .cover-caption .cc-cta, .cover:focus-visible .cover-caption .cc-cta { grid-template-rows: 1fr; opacity: 1; margin-top: 6px; }
@media (hover: none) { .cover-caption .cc-cta { display: none; } }
@media (max-width: 700px) { .cover-caption .cc-sub { display: none; } }

/* Cartão de aula: rótulo em caixa normal, sem espaçamento de máquina de escrever. */
.card-lesson .kicker { font: 500 12.5px/1.3 var(--font-body); letter-spacing: 0; text-transform: none; color: var(--ink-3); }
.card-lesson .thumb.has-img { background-position: center; }

/* Banner do assistente e do WhatsApp: título com a mesma força das capas. */
.v-banner-copy strong { font-weight: 800; }

/* Slide da live: data em bloco próprio (dia e mês no quadrado vermelho),
   o tema como título e o apoio abaixo. */
.hero-slide.is-live .live-when { display: flex; width: fit-content; align-items: stretch; gap: 16px; margin: 22px 0 4px; }
.hero-slide.is-live .lw-date { display: grid; place-content: center; justify-items: center; width: 76px; min-height: 76px; background: var(--accent); color: #FFFFFF; }
.hero-slide.is-live .lw-date b { font: 800 34px/1 var(--font-display); letter-spacing: -.03em; }
.hero-slide.is-live .lw-date small { font: 700 13px/1 var(--font-body); text-transform: uppercase; letter-spacing: .08em; margin-top: 4px; }
.hero-slide.is-live .lw-info { display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.hero-slide.is-live .lw-info strong { font: 700 21px/1.15 var(--font-body); color: #FFFFFF; letter-spacing: -.01em; }
.hero-slide.is-live .lw-info small { font: 500 14px/1.3 var(--font-body); color: rgba(253,253,253,.66); }
.hero-slide.is-live h2 { margin-top: 18px; -webkit-line-clamp: 3; line-clamp: 3; max-width: 20ch; }
@media (max-width: 900px) {
  .hero-slide.is-live .lw-date { width: 60px; min-height: 60px; }
  .hero-slide.is-live .lw-date b { font-size: 27px; }
  .hero-slide.is-live .lw-info strong { font-size: 17px; }
  .hero-slide.is-live h2 { max-width: none; }
}

/* ---------------------------------------------------------------
   Labszinho, o assistente da comunidade (modelo: Nerdzinhu da
   Funnel Labs). Períodos dessincronizados (3s, 2,6s, 1,8s) para o
   boneco parecer vivo sem os loops baterem.
   --------------------------------------------------------------- */
@keyframes lz-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes lz-glow {
  0%, 100% { box-shadow: 0 0 0 3px rgba(193,18,31,.22), 0 0 20px 2px rgba(193,18,31,.24), 0 12px 28px -10px rgba(0,0,0,.55); }
  50% { box-shadow: 0 0 0 3px rgba(229,34,47,.5), 0 0 34px 8px rgba(229,34,47,.42), 0 12px 28px -10px rgba(0,0,0,.55); }
}
@keyframes lz-ring { 0% { transform: scale(1); opacity: 1; } 70%, 100% { transform: scale(1.35); opacity: 0; } }
@keyframes lz-label-in { from { opacity: 0; transform: translateX(10px); } to { opacity: 1; transform: none; } }
@keyframes lz-dot { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .45; transform: scale(.75); } }

.lz-launcher {
  position: fixed; right: var(--s-5); bottom: var(--s-5); z-index: 80;
  display: flex; align-items: center; gap: 12px;
}
.lz-launcher .fl-assistant-fab.lz-fab {
  position: relative; right: auto; bottom: auto;
  width: 66px; height: 66px;
  background: radial-gradient(circle at 30% 22%, #2A2A2A, #0A0A0A 72%);
  border: 2px solid var(--accent);
  animation: lz-glow 2.6s ease-in-out infinite;
}
.lz-fab:hover { transform: scale(1.07) rotate(-4deg); }
.lz-fab:active { transform: scale(.95); }
.lz-launcher .lz-fab::after { inset: -6px; border-color: rgba(229,34,47,.5); animation: lz-ring 2.6s infinite; }
.lz-launcher .lz-fab img {
  width: 60px; height: auto; border-radius: 0; object-fit: contain; margin-top: 2px;
  animation: lz-bob 3s ease-in-out infinite;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.35));
}
.lz-label {
  padding: 9px 15px; border-radius: 999px;
  background: #0A0A0A; color: rgba(253,253,253,.86);
  border: 1px solid rgba(229,34,47,.45);
  font: 500 13.5px/1 var(--font-body); white-space: nowrap; user-select: none;
  box-shadow: 0 8px 20px -10px rgba(0,0,0,.5);
  animation: lz-label-in .5s ease .4s both;
  transition: opacity .2s ease;
}
.lz-label b { color: #FFFFFF; font-weight: 700; }
/* A animação de entrada prende a opacidade: aberto, a pílula sai sem animação. */
.lz-launcher.is-open .lz-label { animation: none; opacity: 0; visibility: hidden; }
body.has-next-prompt .lz-launcher { display: none; }

/* Painel: cabeçalho escuro com grade de laboratório, avatar e status pulsando. */
.fl-assistant-panel { border-color: rgba(193,18,31,.3); box-shadow: var(--elev-3), 0 0 44px -18px rgba(193,18,31,.4); }
.fl-assistant-head.lz-head {
  position: relative; color: #FFFFFF;
  background: linear-gradient(135deg, #1E1E1E 0%, #111111 55%, #0B0B0B 100%);
  border-bottom: 2px solid rgba(193,18,31,.6);
}
.lz-head::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(253,253,253,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(253,253,253,.05) 1px, transparent 1px);
  background-size: 22px 22px;
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.35)); mask-image: linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.35));
}
.lz-head > * { position: relative; }
.lz-head .who strong { color: #FFFFFF; font-size: 16px; }
.lz-head .who span { color: rgba(253,253,253,.62); }
.lz-head .who span::before { background: #E5222F; animation: lz-dot 1.8s ease-in-out infinite; }
.lz-avatar {
  width: 44px; height: 44px; flex: none; border-radius: 50%; overflow: hidden;
  border: 2px solid var(--accent);
  background: radial-gradient(circle at 32% 26%, #2A2A2A, #0A0A0A 72%);
}
.fl-assistant-head .lz-avatar img, .lz-avatar img { width: 100%; height: 100%; object-fit: cover; border: 0; border-radius: 0; background: none; }
.lz-avatar.sm { width: 28px; height: 28px; border-width: 1px; }
.lz-close { margin-left: auto; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; color: rgba(253,253,253,.7); }
.lz-close:hover { background: rgba(253,253,253,.08); color: #FFFFFF; }

.lz-intro { position: relative; display: grid; place-items: center; padding: 6px 0 2px; }
.lz-halo { position: absolute; width: 120px; height: 120px; border-radius: 50%; background: rgba(193,18,31,.3); filter: blur(24px); }
.lz-mascot { position: relative; width: 112px; height: auto; animation: lz-bob 3s ease-in-out infinite; filter: drop-shadow(0 8px 16px rgba(0,0,0,.45)); }
.lz-row { display: flex; align-items: flex-end; gap: 8px; }
.lz-row .fl-assistant-msg { max-width: calc(100% - 40px); }
.lz-row .fl-assistant-msg.bot .fl-assistant-typing { padding: 4px 2px; }
.lz-row .fl-assistant-typing i { background: #E5222F; }

@media (max-width: 900px) {
  .lz-launcher { right: 14px; bottom: calc(var(--bottom-nav-h) + var(--s-6) + env(safe-area-inset-bottom)); }
  .lz-launcher .fl-assistant-fab.lz-fab { width: 58px; height: 58px; }
  .lz-launcher .lz-fab img { width: 52px; }
  .lz-mascot { width: 84px; }
  .lz-halo { width: 90px; height: 90px; }
  .lz-label { font-size: 12.5px; padding: 8px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .lz-launcher .fl-assistant-fab.lz-fab, .lz-launcher .lz-fab::after, .lz-launcher .lz-fab img,
  .lz-label, .lz-mascot, .lz-head .who span::before { animation: none; }
}
