/* ============================================================
   neumorphism.css — camada de tema (apenas visual)
   Carregada por último; sobrepõe brand.css. 100% reversível:
   basta remover o <link> deste arquivo no index.html.
   NÃO altera nenhuma lógica/JS — só aparência.
   ============================================================ */

:root {
  /* base única (fundo = superfícies, pra sombra ler como relevo) */
  --neu-bg: #e9ecf5;
  --neu-bg-2: #eef1f8;
  --neu-d: rgba(163, 171, 201, 0.55);   /* sombra escura (baixo-direita) */
  --neu-l: rgba(255, 255, 255, 0.95);   /* luz (cima-esquerda) */
  --neu-raise:    7px 7px 16px var(--neu-d), -7px -7px 16px var(--neu-l);
  --neu-raise-sm: 4px 4px 10px var(--neu-d), -4px -4px 10px var(--neu-l);
  --neu-inset:    inset 4px 4px 10px var(--neu-d), inset -4px -4px 10px var(--neu-l);
  --neu-radius: 20px;

  /* unifica superfícies do tema antigo com a base neu */
  --paper: var(--neu-bg);
  --glass: var(--neu-bg);
  --glass-2: var(--neu-bg-2);
  --bg-1: var(--neu-bg); --bg-2: var(--neu-bg); --bg-3: var(--neu-bg); --bg-deep: #e1e4f0;
  --hair: rgba(120, 130, 165, 0.14);
  --hair-2: rgba(120, 130, 165, 0.08);
}

/* fundo plano (neumorfismo precisa de fundo sólido e uniforme) */
body { background: var(--neu-bg) !important; }
.atmos, .grain { display: none !important; }

/* ---------- superfícies elevadas ---------- */
.tint-card, .glass, .read-card, .opt, .spine-card, .panorama-card,
.hud-pop, .celebrate-card, .cut-full, .drawer, .admin-panel,
.doc-scene, .doc-scene-img {
  background: var(--neu-bg) !important;
  border: none !important;
  border-radius: var(--neu-radius) !important;
  box-shadow: var(--neu-raise) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* estado "escolhida/ativa" = afundado (metáfora de pressionado) */
.opt.chosen { box-shadow: var(--neu-inset) !important; }

/* botões de escolha — padrão único, sem gradiente, com contraste */
.opt-pick {
  background: var(--neu-bg) !important;
  border: none !important;
  color: var(--rc) !important;
  box-shadow: var(--neu-raise-sm) !important;
  font-weight: 600 !important;
}
.opt:hover .opt-pick,
.opt.chosen .opt-pick {
  background: var(--rc) !important;
  color: #ffffff !important;
  box-shadow: inset 2px 2px 6px rgba(20,30,60,0.35), inset -2px -2px 6px rgba(255,255,255,0.18) !important;
}

/* ---------- botões ---------- */
.btn {
  border: none !important;
  border-radius: 100px !important;
  background: var(--neu-bg) !important;
  color: var(--ink-2) !important;
  box-shadow: var(--neu-raise-sm) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: box-shadow .2s ease, filter .2s ease;
}
.btn:hover { box-shadow: var(--neu-raise) !important; }
.btn:active { box-shadow: var(--neu-inset) !important; }
/* primário: SÓLIDO (sem gradiente), alto contraste */
.btn-primary {
  background: var(--ink) !important;
  color: #ffffff !important;
  box-shadow: 5px 5px 13px var(--neu-d), -5px -5px 13px var(--neu-l) !important;
}
.btn-primary:hover { filter: brightness(1.06); box-shadow: 6px 6px 16px var(--neu-d), -6px -6px 16px var(--neu-l) !important; }
.btn-primary:active { box-shadow: var(--neu-inset) !important; }

/* ---------- campos (afundados) ---------- */
input, textarea, select,
.cmt, .admin-search, .admin-field input, .admin-field textarea,
.roteiro-pick-select {
  background: var(--neu-bg) !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: var(--neu-inset) !important;
}
.admin-search { border-radius: 100px !important; }
.roteiro-pick-select { border-radius: 100px !important; }

/* ---------- chips, tags, ícones, pílulas ---------- */
.tag, .chip, .icon-chip, .x-btn, .hud-ring, .admin-pill,
.roteiro-chip, .panorama-badge, .roteiro-pick-field {
  background: var(--neu-bg) !important;
  border: none !important;
  box-shadow: var(--neu-raise-sm) !important;
}
.x-btn:active, .hud-ring:active { box-shadow: var(--neu-inset) !important; }
.icon-chip { border-radius: 14px !important; }

/* ---------- navegação (Ato 1/2/3) ---------- */
.jstep {
  background: var(--neu-bg) !important;
  border: none !important;
  box-shadow: var(--neu-raise-sm) !important;
}
.jstep.on { box-shadow: var(--neu-inset) !important; }
.jstep.on::after { display: none; }
.jstep-ic { background: var(--neu-bg) !important; box-shadow: var(--neu-raise-sm); }
.jstep.on .jstep-ic { background: var(--accent) !important; box-shadow: none; }

/* ---------- pips da curadoria ---------- */
.dec-pip {
  background: var(--neu-bg) !important;
  border: none !important;
  box-shadow: var(--neu-raise-sm) !important;
}
.dec-pip.on { box-shadow: var(--neu-inset) !important; }

/* ---------- imagens de cena ---------- */
.scene-img {
  border: none !important;
  box-shadow: var(--neu-raise-sm) !important;
  background: var(--neu-bg) !important;
}
.scene-img.editable:not(.has) { box-shadow: var(--neu-inset) !important; }

/* ---------- chevron "Sua voz monta o filme" ---------- */
.flowstep { background: linear-gradient(180deg, #f3f5fb, #e2e6f1) !important; color: var(--ink-2) !important; }
.flowstep.last { background: linear-gradient(180deg, #5b8bf0, #4f6fd0) !important; color: #fff !important; }
.flowstep-n { background: rgba(79,111,208,0.14) !important; box-shadow: var(--neu-inset); }

/* ---------- divisor neumórfico (sulco gravado) ---------- */
.neu-divider, .neu-hr {
  height: 2px; border: 0; margin: 28px 0; border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--neu-d) 12%, var(--neu-d) 88%, transparent);
  box-shadow: 0 1px 0 var(--neu-l);
}

/* separadores do panorama viram sulcos gravados */
.panorama-item { border-top: none !important; position: relative; }
.panorama-item:not(:first-child) { margin-top: 10px; }
.panorama-item:not(:first-child)::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--neu-d) 12%, var(--neu-d) 88%, transparent);
  box-shadow: 0 1px 0 var(--neu-l);
}

/* a barra de ação no fim do panorama também separada por sulco */
.panorama-cta { border-top: none !important; position: relative; }
.panorama-cta-end::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--neu-d) 12%, var(--neu-d) 88%, transparent);
  box-shadow: 0 1px 0 var(--neu-l);
}

.admin-tabs-bar, .admin-head, .admin-foot { border-color: var(--hair) !important; }

/* ---------- "Sua voz monta o filme" — horizontal no desktop, vertical no mobile ---------- */
.flowline {
  background: var(--neu-bg);
  border-radius: var(--neu-radius);
  box-shadow: var(--neu-raise);
  padding: clamp(24px,3vw,34px) clamp(20px,3vw,32px);
  display: flex; flex-direction: row; align-items: flex-start; gap: 0;
}
.flowline-step { position: relative; flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; padding: 0 10px; }
.flowline-node {
  width: 46px; height: 46px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-weight: 700; font-size: 13px; color: var(--accent);
  background: var(--neu-bg); box-shadow: var(--neu-raise-sm);
  position: relative; z-index: 1;
}
.flowline-step:not(:last-child)::after {
  content: ""; position: absolute; top: 21px; left: calc(50% + 28px); width: calc(100% - 56px); height: 4px; border-radius: 4px;
  background: var(--neu-bg); box-shadow: var(--neu-inset); z-index: 0;
}
.flowline-body { display: flex; flex-direction: column; gap: 3px; align-items: center; min-width: 0; }
.flowline-label { font-family: var(--font-display); font-weight: 600; font-size: 15px; color: var(--ink); letter-spacing: -0.01em; }
.flowline-role { font-size: 12.5px; color: var(--ink-4); font-style: normal; line-height: 1.4; }
.flowline-last .flowline-node { background: var(--accent); color: #fff; box-shadow: inset 2px 2px 5px rgba(40,55,110,0.5), -3px -3px 8px var(--neu-l); }
@media (max-width: 760px) {
  .flowline { flex-direction: column; }
  .flowline-step { display: grid; grid-template-columns: 46px 1fr; align-items: center; text-align: left; gap: 16px; padding: 9px 0; }
  .flowline-body { align-items: flex-start; }
  .flowline-step:not(:last-child)::after { top: 46px; left: 22px; width: 4px; height: calc(100% - 28px); }
}

/* ---------- decisão de cena: carrossel HORIZONTAL no mobile/tablet (3 opções da mesma cena) ---------- */
@media (max-width: 900px) {
  .dec-grid {
    display: flex !important;
    grid-template-columns: none !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 14px;
    padding: 4px 2px 14px;
    scrollbar-width: none;
  }
  .dec-grid::-webkit-scrollbar { display: none; }
  .dec-grid > .opt {
    flex: 0 0 88% !important;
    max-width: 88% !important;
    scroll-snap-align: center;
  }
  /* imagem do card ocupa mais espaço (corta ~16% das laterais) */
  .dec-grid > .opt .scene-img { aspect-ratio: 3 / 2 !important; max-height: none !important; }
}

/* coverflow: cards sobrepostos com o do meio em destaque (scroll-driven, sem JS) */
@supports (animation-timeline: view()) {
  @media (max-width: 900px) {
    .dec-grid {
      gap: 0 !important;
      perspective: 1200px;
      padding: 8px 6% 18px !important;
    }
    .dec-grid > .opt {
      flex: 0 0 88% !important;
      max-width: 88% !important;
      margin: 0 -4% !important;
      transform-origin: center center;
      animation: optFlow linear both;
      animation-timeline: view(inline);
      animation-range: cover 0% cover 100%;
      transition: box-shadow .3s var(--ease);
    }
    @keyframes optFlow {
      0%   { transform: scale(0.78) rotateY(22deg); opacity: 0.5; z-index: 1; }
      45%  { transform: scale(1) rotateY(0deg);     opacity: 1;   z-index: 3; }
      55%  { transform: scale(1) rotateY(0deg);     opacity: 1;   z-index: 3; }
      100% { transform: scale(0.78) rotateY(-22deg); opacity: 0.5; z-index: 1; }
    }
    /* o card central ganha mais profundidade */
    .dec-grid > .opt { box-shadow: 10px 14px 30px var(--neu-d), -10px -10px 24px var(--neu-l) !important; }
  }
}

/* tags/chips: fonte menor, TEXTO COMPLETO (quebra dentro do chip), sem cortar nem escapar */
.tag { font-size: 10.5px !important; }
.opt-os { gap: 6px 7px !important; }
.opt-os .chip {
  font-size: 10px !important;
  padding: 6px 11px !important;
  line-height: 1.3 !important;
  white-space: normal !important;     /* deixa quebrar em vez de cortar */
  max-width: 100% !important;          /* nunca passa do card */
  overflow: visible !important;
  text-overflow: clip !important;
  align-items: flex-start !important;
}
.opt-os .chip svg { flex: 0 0 auto; margin-top: 1px; }
/* no mobile, cada estímulo ocupa a largura toda do card (lista, não pílulas espremidas) */
@media (max-width: 560px) {
  .opt-os .chip { flex: 1 1 100%; }
}

/* mobile: imagem do corte/leitura ocupa menos espaço — texto em foco */
@media (max-width: 760px) {
  .cut-full .scene-img,
  .read-card .scene-img {
    aspect-ratio: 16 / 8 !important;
    max-height: 140px !important;
    min-height: 0 !important;
  }
}

/* ====== Ajustes finos: cadeira, assinatura, painel admin ====== */

/* cadeira de fundo: -50% de opacidade (0.22 -> 0.11) */
.chair-backdrop { opacity: 0.11 !important; }

/* assinatura/busca: o container É o campo (sem "forma dentro de forma") */
.field { background: var(--neu-bg) !important; border: none !important; box-shadow: var(--neu-inset) !important; }
.field input { background: transparent !important; box-shadow: none !important; border: none !important; border-radius: 0 !important; }

/* painel admin: remover o glow dos componentes internos (linha fina no lugar do relevo) */
.admin-panel .btn:not(.btn-primary),
.admin-panel .stat,
.admin-panel .admin-search,
.admin-panel .admin-field input,
.admin-panel .admin-field textarea,
.admin-panel select {
  box-shadow: none !important;
  border: 1px solid var(--hair) !important;
  background: #ffffff !important;
}
.admin-panel .stat { background: var(--neu-bg-2) !important; }
.admin-panel .admin-search input { background: transparent !important; border: none !important; box-shadow: none !important; }
.admin-panel .btn-primary,
.admin-panel .icon-chip, .admin-panel .x-btn,
.admin-panel .tag, .admin-panel .chip { box-shadow: none !important; }

/* barra do admin: respiro horizontal + botões espaçados */
.admin-ribbon { padding: 12px clamp(20px,4vw,42px) !important; gap: 18px !important; }
.admin-ribbon > div { gap: 12px !important; }
.admin-ribbon .btn { padding: 9px 18px !important; }

/* ====== Refinamentos: mobile, barra admin, cards "Como ler", disclaimers ====== */

/* 1. stepper de cenas: sem quebra de linha no mobile (rola na horizontal) */
@media (max-width: 760px) {
  .dec-stepper {
    display: flex !important;
    grid-template-columns: none !important;
    flex-wrap: nowrap !important;
    gap: 8px;
  }
  .dec-stepper .dec-pip { flex: 1 1 0; min-width: 0; justify-content: center; }
}

/* 2. barra do admin: CINZA (não azul-marinho) + itens legíveis + sem glow */
.admin-ribbon { background: #646b7a !important; }
.admin-ribbon, .admin-ribbon > span:first-child { color: #f4f6fa !important; }
.admin-ribbon .btn, .admin-ribbon select, .admin-ribbon button {
  box-shadow: none !important;
  background: rgba(255,255,255,0.96) !important;
  color: var(--ink) !important;
  border: 1px solid rgba(255,255,255,0.45) !important;
}
.admin-ribbon .btn svg, .admin-ribbon select { color: var(--ink-2) !important; }
.admin-ribbon select option { color: var(--ink) !important; background: #fff !important; }

/* 3. "Como ler este material": cards lado a lado (desktop e mobile) */
.aviso-list {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 16px !important;
  border-top: none !important;
}
.aviso-row {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  gap: 10px !important;
  padding: clamp(20px,2.4vw,26px) !important;
  border-bottom: none !important;
  background: var(--neu-bg);
  border-radius: var(--neu-radius);
  box-shadow: var(--neu-raise);
}
.aviso-row .icon-chip { display: inline-flex !important; width: 44px !important; height: 44px !important; order: -1; }
.aviso-row-n { padding-top: 0 !important; }
.aviso-row .xlink { margin-top: auto; }
@media (max-width: 900px) {
  /* no mobile: vertical (empilhado) */
  .aviso-list {
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    gap: 14px !important;
  }
  .aviso-row { flex: 1 1 auto !important; max-width: 100% !important; }
}

/* 4. disclaimers (IA + Método Caelum): neumorfismo elegante e padronizado */
.ia-note, .legal-float {
  background: var(--neu-bg) !important;
  border: none !important;
  box-shadow: var(--neu-raise) !important;
  border-radius: 16px !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.ia-note [style*="35,35"], .ia-note [style*="25,25"],
.legal-float [style*="35,35"], .legal-float [style*="25,25"] { color: var(--accent) !important; }

/* ---------- correções de mobile ---------- */
@media (max-width: 760px) {
  /* Ato 1/2/3 — acaba com os blocões gigantes */
  .journey { flex-direction: column; gap: 8px; }
  .jstep { flex: 0 0 auto !important; width: 100%; min-height: 0 !important; height: auto !important; padding: 12px 16px !important; align-items: center; border-radius: 14px !important; }
  .jstep-meta { gap: 1px; }
  /* sombras mais sutis no celular */
  .tint-card, .glass, .read-card, .opt, .panorama-card, .flowline, .admin-panel, .cut-full, .spine-card {
    box-shadow: 5px 5px 12px var(--neu-d), -5px -5px 12px var(--neu-l) !important;
  }
  /* nada estoura a largura */
  .opt, .read-card, .panorama-item, .flowline, .tint-card, .panorama-card { max-width: 100%; }
}

/* mantém legibilidade do texto sobre o fundo neu */
.aviso-row-body h3, .panorama-title, h1, h2, h3 { color: var(--ink) !important; }

/* ====== Navegador lateral de roteiros (rail neumórfico) ====== */
.roteiro-rail {
  position: sticky; top: 90px; float: right; margin: 0 0 14px 18px;
  display: flex; flex-direction: column; gap: 10px; padding: 12px 10px;
  background: var(--neu-bg); border-radius: 100px; box-shadow: var(--neu-raise);
  z-index: 5;
}
.rail-dot {
  width: 40px; height: 40px; border-radius: 50%; border: none; cursor: pointer;
  background: var(--neu-bg); box-shadow: var(--neu-raise-sm);
  font-family: var(--font-display); font-size: 13px; font-weight: 700; color: var(--ink-4);
  display: inline-flex; align-items: center; justify-content: center;
  transition: box-shadow .2s, color .2s, transform .2s;
}
.rail-dot:hover { color: var(--accent); transform: translateY(-1px); }
.rail-dot.on { box-shadow: var(--neu-inset); color: var(--accent); }
.rail-dot.done { color: #1d9e78; }
@media (max-width: 760px) {
  .roteiro-rail { position: static; float: none; flex-direction: row; justify-content: center; width: max-content; margin: 0 auto 14px; padding: 8px 12px; }
  .rail-dot { width: 34px; height: 34px; font-size: 12px; }
}

/* ====== Mobile: passos da curadoria mostram só o número (label escapava) ====== */
@media (max-width: 560px) {
  .dec-pip-label, .dec-pip-chosen { display: none !important; }
  .dec-pip { padding: 8px !important; justify-content: center; }
  .dec-pip .dec-pip-n { margin: 0 !important; }
}

/* ====== Sino de notificações (admin) ====== */
.notif-bell { position: relative; width: 38px; height: 38px; border-radius: 50%; border: none; cursor: pointer; background: rgba(255,255,255,0.96); color: var(--ink-2); display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.notif-bell .notif-badge { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 100px; background: #e5484d; color: #fff; font-family: var(--font-display); font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0,0,0,0.25); }

/* impressão: fundo branco e oculta cromos */
@media print { body { background: #fff !important; } .roteiro-rail, .admin-ribbon, .hud, .tweaks-host { display: none !important; } }

/* ====== Ver corte assinado pelo cliente (painel Registros) ====== */
.cut-view > summary { cursor: pointer; font-family: var(--font-display); font-size: 12.5px; font-weight: 700; color: var(--accent); list-style: none; display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 10px; background: rgba(255,255,255,0.9); box-shadow: var(--neu-out-sm, 0 2px 6px rgba(0,0,0,0.08)); }
.cut-view > summary::-webkit-details-marker { display: none; }
.cut-view[open] > summary { margin-bottom: 8px; }
.cut-pre { white-space: pre-wrap; word-break: break-word; font-family: var(--font-body); font-size: 12.5px; line-height: 1.55; color: var(--ink-2); margin: 0; max-height: 360px; overflow: auto; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,0.96); box-shadow: var(--neu-inset); }

/* ====== Edição inline do admin direto nos cards do comparativo ====== */
.opt-admin-edit { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; padding: 12px; border-radius: 12px; background: rgba(255,255,255,0.7); box-shadow: var(--neu-inset); cursor: default; }
.opt-admin-edit .opt-admin-flag { display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-display); font-size: 10.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent); margin-bottom: 2px; }
.opt-admin-edit label { font-family: var(--font-display); font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-4); margin-top: 4px; }
.opt-admin-edit input, .opt-admin-edit textarea { width: 100%; box-sizing: border-box; font-family: var(--font-body); font-size: 13px; line-height: 1.5; color: var(--ink); padding: 8px 10px; border: none; border-radius: 9px; background: rgba(255,255,255,0.96); box-shadow: var(--neu-inset); outline: none; resize: vertical; }
.opt-admin-edit input:focus, .opt-admin-edit textarea:focus { box-shadow: var(--neu-inset), 0 0 0 2px var(--accent); }

/* ====== Conclusão do roteiro: ações + aviso ====== */
.cut-actions .btn { white-space: nowrap; }
.cut-dl-note { display: flex; align-items: center; gap: 8px; margin: -6px 0 20px; padding: 10px 14px; border-radius: 12px; background: var(--grad-soft, rgba(63,111,214,0.08)); color: var(--ink-3); font-size: 13.5px; line-height: 1.5; box-shadow: var(--neu-inset); }
.cut-dl-note svg { color: var(--accent); flex: 0 0 auto; }

/* container temporário de impressão (mesma base do .doc) */
.print-doc-temp { position: absolute; left: -99999px; top: 0; }
@media print { .print-doc-temp { position: static !important; left: 0 !important; } }

/* ====== Indicador flutuante do roteiro/progresso (só durante a escolha) ====== */
.roteiro-float {
  position: fixed; left: 18px; bottom: 18px; z-index: 240;
  width: 210px; max-width: calc(100vw - 36px);
  padding: 11px 14px; border-radius: 16px;
  background: rgba(255,255,255,0.92); backdrop-filter: blur(10px);
  box-shadow: var(--neu-out, 0 6px 20px rgba(20,30,60,0.14));
  font-family: var(--font-display); pointer-events: none; user-select: none;
}
.roteiro-float-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.roteiro-float-r { font-size: 12.5px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.roteiro-float-pct { font-size: 12.5px; font-weight: 700; color: var(--accent); flex: 0 0 auto; }
.roteiro-float-stage { font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-4); margin-top: 2px; }
.roteiro-float-bar { height: 5px; border-radius: 100px; background: rgba(40,50,80,0.1); margin-top: 8px; overflow: hidden; }
.roteiro-float-bar > span { display: block; height: 100%; border-radius: 100px; background: var(--accent); transition: width .5s cubic-bezier(.22,1,.36,1); }
@media (max-width: 560px) { .roteiro-float { left: 12px; bottom: 12px; width: 168px; padding: 9px 12px; } }
@media print { .roteiro-float { display: none !important; } }