/* ============================================================
   VOXSIZE — TEMA "MEDICO" (claro, azul royal, componentes pill)
   Camada de estilo: sobrescreve o tema anterior sem tocar no app.js
   ============================================================ */

:root {
  --blue: #2B54E8;
  --blue-2: #3A5BF0;
  --blue-3: #2440D8;
  --blue-soft: #EEF1FE;
  --blue-soft-2: #E3E9FD;

  --ink: #111629;
  --ink-2: #4A5468;
  --muted: #8A93A8;

  --bg: #F5F7FB;
  --card: #FFFFFF;
  --line: #E8EBF3;
  --line-2: #DDE2EF;

  --yellow: #FFC93C;
  --green: #12B76A;
  --red: #F04438;

  --pill: 999px;
  --radius: 20px;
  --r-md: 16px;

  --shadow: 0 2px 4px rgba(17, 22, 41, .03), 0 12px 28px -18px rgba(17, 22, 41, .18);
  --shadow-blue: 0 14px 28px -16px rgba(43, 84, 232, .85);

  /* remapeamento dos tokens antigos */
  --bg0: #F5F7FB;
  --bg1: #F5F7FB;
  --accent: #2B54E8;
  --accent-dark: #2440D8;
  --accent-soft: #EEF1FE;
  --text: #111629;
  --borda: #E8EBF3;
  --card-2: #F7F8FC;
}

/* ---------- base ---------- */
html, body { background: var(--bg) !important; }
body {
  font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  background-image: none !important;
  padding-bottom: 84px; /* espaco da nav inferior */
}
.bg-glow { display: none !important; }

h1, h2, h3, h4, b, strong { letter-spacing: -.2px; }
h1, h2, h3 { font-weight: 800; }

/* ---------- topbar ---------- */
.topbar {
  background: rgba(255, 255, 255, .94) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 0 rgba(17, 22, 41, .02) !important;
  backdrop-filter: blur(14px) !important;
  padding: 10px 20px 12px !important;
}
.topbar .logo {
  width: 38px; height: 38px; border-radius: 12px;
  background: var(--blue); color: #fff;
  display: grid; place-items: center;
  font-size: 16px; font-weight: 800;
  box-shadow: 0 8px 18px -10px rgba(43, 84, 232, .9);
}
.topbar h1 { font-size: 15px !important; font-weight: 800 !important; color: var(--ink) !important; }
.topbar .sub { font-size: 10.5px !important; color: var(--muted) !important; font-weight: 600 !important; }
.badge {
  background: var(--blue-soft) !important;
  color: var(--blue) !important;
  border: 1px solid #DCE4FB !important;
  border-radius: var(--pill) !important;
  font-weight: 800 !important;
  font-size: 10.5px !important;
  padding: 5px 11px !important;
}
.btn-ghost-top {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 50% !important;
  width: 36px; height: 36px;
  color: var(--ink-2) !important;
  font-size: 14px !important;
  transition: border-color .15s, color .15s;
}
.btn-ghost-top:hover { border-color: var(--line-2) !important; color: var(--ink) !important; }

/* ---------- cards ---------- */
.card, .welcome, .identidade {
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
  backdrop-filter: none !important;
  padding: 18px !important;
}
.glass { background: var(--card) !important; border-color: var(--line) !important; backdrop-filter: none !important; }

.card-head {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 0 0 12px !important;
  margin-bottom: 14px !important;
  color: var(--ink) !important;
}
.card-head h2 { font-size: 15px !important; font-weight: 800 !important; color: var(--ink) !important; }
.card-head .ch-sub { color: var(--muted) !important; }
.card-head .ch-ico {
  width: 34px; height: 34px; border-radius: 11px;
  background: var(--blue-soft) !important;
  color: var(--blue) !important;
  display: grid; place-items: center;
  font-size: 15px !important;
}
/* variacoes de cor do card somem: um vocabulario so */
.card-roxo .card-head, .card-verde .card-head,
.card-ciano .card-head, .card-laranja .card-head {
  background: transparent !important; color: var(--ink) !important;
}

/* ---------- botoes ---------- */
.btn {
  border-radius: var(--pill) !important;
  font-family: inherit !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  letter-spacing: -.1px;
  padding: 0 22px !important;
  height: 46px;
  border: 1px solid transparent !important;
  transition: transform .14s ease, box-shadow .14s, background .14s;
}
.btn.big { height: 52px; font-size: 13.5px !important; }
.btn.primary {
  background: var(--blue) !important;
  color: #fff !important;
  box-shadow: var(--shadow-blue) !important;
}
.btn.primary:hover:not(:disabled) { background: var(--blue-3) !important; transform: translateY(-1px); }
.btn.ghost {
  background: #fff !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  box-shadow: none !important;
}
.btn.ghost:hover { border-color: var(--line-2) !important; background: #FBFCFE !important; }
.btn.danger {
  background: #fff !important;
  color: var(--red) !important;
  border: 1px solid #FBD9D6 !important;
}
.btn.link {
  background: transparent !important;
  color: var(--blue) !important;
  box-shadow: none !important;
  height: auto; padding: 8px 0 !important;
  font-weight: 700 !important;
}
.btn.primary:disabled, .btn.primary[disabled],
.btn:disabled, .btn[disabled] {
  background: #DDE3F0 !important;
  color: #9AA6BE !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
}
.btn-add-ico {
  background: var(--blue) !important;
  color: #fff !important;
  border-radius: 50% !important;
  width: 44px; height: 44px;
  box-shadow: var(--shadow-blue) !important;
  font-size: 20px !important;
}
.btn-edit {
  background: var(--blue-soft) !important;
  color: var(--blue) !important;
  border-radius: 50% !important;
  width: 34px; height: 34px;
  border: 0 !important;
}

/* ---------- formularios ---------- */
label {
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: .7px !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  margin-bottom: 6px !important;
}
input, select, textarea {
  font-family: inherit !important;
  background: #FBFCFE !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 13px 14px !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}
input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: var(--blue) !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px var(--blue-soft) !important;
}
input::placeholder { color: #A9B2C4 !important; font-weight: 500 !important; }
select { appearance: none; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238A93A8' stroke-width='2.4'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 14px center !important; padding-right: 38px !important; }

/* ---------- home ---------- */
.identidade {
  display: flex; align-items: center; gap: 12px;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 4px 0 12px !important;
}
.identidade .avatar {
  width: 44px; height: 44px; border-radius: 50% !important;
  background: var(--blue-soft) !important;
  color: var(--blue) !important;
  border: 0 !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  display: grid; place-items: center;
}
.identidade-saud { font-size: 10.5px !important; color: var(--muted) !important; font-weight: 700 !important; letter-spacing: .5px; }
.identidade-nome { font-size: 15px !important; font-weight: 800 !important; color: var(--ink) !important; }
.identidade-prof { font-size: 11px !important; color: var(--muted) !important; font-weight: 600 !important; }

/* chips (atalhos) */
.home-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
.home-tile {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--r-md) !important;
  box-shadow: var(--shadow) !important;
  padding: 12px 6px 10px !important;
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  min-height: 0 !important;
  transition: transform .14s, border-color .14s;
}
.home-tile:hover, .home-tile:active { transform: translateY(-2px); border-color: var(--line-2) !important; }
.home-tile .tile-ico {
  width: 34px; height: 34px; border-radius: 11px;
  background: var(--blue-soft);
  color: var(--blue);
  display: grid; place-items: center;
  font-size: 0 !important; /* esconde emoji; o SVG entra aqui */
}
.home-tile .tile-ico svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.9; }
.home-tile .tile-txt {
  font-size: 9.6px !important;
  font-weight: 800 !important;
  color: var(--ink-2) !important;
  line-height: 1.2;
  text-align: center;
}

/* hero card injetado */
.vx-hero {
  background: linear-gradient(150deg, var(--blue-2), var(--blue-3));
  border-radius: 24px;
  padding: 19px;
  color: #fff;
  position: relative;
  overflow: hidden;
  box-shadow: 0 18px 34px -22px rgba(43, 84, 232, .85);
  margin-bottom: 18px;
}
.vx-hero::after {
  content: ""; position: absolute; width: 190px; height: 190px; border-radius: 50%;
  background: rgba(255, 255, 255, .10); right: -70px; top: -80px;
}
.vx-hero::before {
  content: ""; position: absolute; width: 110px; height: 110px; border-radius: 50%;
  background: rgba(255, 255, 255, .08); right: 20px; bottom: -64px;
}
.vx-hero h2 { font-size: 17px; font-weight: 800; letter-spacing: -.3px; position: relative; }
.vx-hero p { font-size: 11.8px; opacity: .84; margin-top: 5px; line-height: 1.45; position: relative; max-width: 90%; font-weight: 500; }
.vx-hero .vx-go {
  display: inline-flex; align-items: center; gap: 7px; margin-top: 15px;
  background: #fff; color: var(--blue);
  padding: 11px 20px; border-radius: var(--pill);
  font-size: 12.5px; font-weight: 800;
  border: 0; font-family: inherit; position: relative;
  box-shadow: 0 8px 18px -10px rgba(0, 0, 0, .4);
  cursor: pointer;
}
.vx-hero .vx-go svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2.4; }

/* titulo de secao injetado */
.vx-sec {
  display: flex; align-items: center; justify-content: space-between;
  margin: 20px 2px 11px;
}
.vx-sec h3 { font-size: 13.5px; font-weight: 800; letter-spacing: -.1px; }
.vx-sec a { font-size: 11px; color: var(--blue); font-weight: 800; text-decoration: none; }

/* ---------- lista de avaliados / pacientes ---------- */
.av-item {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--r-md) !important;
  box-shadow: var(--shadow) !important;
  padding: 12px 13px !important;
  margin-bottom: 9px !important;
  display: flex; align-items: center; gap: 12px;
}
.av-item:hover { border-color: var(--line-2) !important; }
.av-avatar {
  width: 42px; height: 42px; border-radius: 50% !important;
  background: var(--blue-soft-2) !important;
  color: var(--blue) !important;
  display: grid; place-items: center;
  font-weight: 800 !important;
  font-size: 13px !important;
  border: 0 !important;
  flex: 0 0 auto;
}
.av-nome { font-size: 13px !important; font-weight: 800 !important; color: var(--ink) !important; }
.av-meta { font-size: 10.5px !important; color: var(--muted) !important; font-weight: 600 !important; }
.av-data { font-size: 10.5px !important; color: var(--muted) !important; }
.av-data strong { color: var(--ink) !important; font-weight: 800 !important; }
.av-res { color: var(--blue) !important; font-weight: 800 !important; font-size: 14px !important; }
.av-badge {
  background: var(--blue-soft) !important;
  color: var(--blue) !important;
  border: 1px solid #DCE4FB !important;
  border-radius: var(--pill) !important;
  font-size: 9px !important; font-weight: 800 !important;
  letter-spacing: .5px; text-transform: uppercase;
  padding: 3px 8px !important;
}
.av-badge-continuar { background: #FFF6E0 !important; color: #B47600 !important; border-color: #FBE3AE !important; }

/* ---------- ficha ---------- */
#tela-ficha .card-head {
  background: linear-gradient(150deg, var(--blue-2), var(--blue-3)) !important;
  border: 0 !important;
  border-radius: 24px !important;
  padding: 18px 18px 20px !important;
  margin-bottom: 16px !important;
  color: #fff !important;
  box-shadow: 0 18px 34px -22px rgba(43, 84, 232, .85) !important;
}
#tela-ficha .card-head h2 { color: #fff !important; font-size: 18px !important; letter-spacing: -.3px; }
#tela-ficha .card-head .ch-ico { background: rgba(255, 255, 255, .18) !important; color: #fff !important; }
#tela-ficha .card-head .btn.ghost {
  background: rgba(255, 255, 255, .16) !important;
  color: #fff !important;
  border: 0 !important;
  height: 34px;
  padding: 0 14px !important;
  font-size: 11.5px !important;
  box-shadow: none !important;
}
.ficha-dados {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  background: var(--card-2) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--r-md) !important;
  padding: 14px !important;
  margin-bottom: 14px;
}
.fd-item { display: flex; flex-direction: column; gap: 2px; }
.fd-item span {
  font-size: 8.8px !important; font-weight: 800 !important;
  letter-spacing: .7px; text-transform: uppercase;
  color: var(--muted) !important;
}
.fd-item b { font-size: 14px !important; font-weight: 800 !important; color: var(--ink) !important; letter-spacing: -.3px; }

.ficha-sub {
  font-size: 13.5px !important; font-weight: 800 !important;
  color: var(--ink) !important;
  margin: 20px 0 11px !important;
  letter-spacing: -.1px;
}

/* ---------- dobras ---------- */
.dobras-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}
.dobra-chip, .dobras-grid > * {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow) !important;
  padding: 10px 12px !important;
}
.dobra-nome { font-size: 11px !important; font-weight: 700 !important; color: var(--ink-2) !important; }
.dobra-valor, .dobra-val { font-size: 13px !important; font-weight: 800 !important; color: var(--ink) !important; letter-spacing: -.3px; }
.dobra-ok {
  background: var(--blue-soft) !important;
  border-color: #D5DEFB !important;
}
.dobra-ok .dobra-valor, .dobra-ok .dobra-val { color: var(--blue) !important; }

/* ---------- progresso ---------- */
.progresso { margin: 14px 0 !important; }
.progresso-info {
  font-size: 10.5px !important;
  color: var(--muted) !important;
  font-weight: 700 !important;
  margin-bottom: 8px !important;
  align-items: baseline;
  gap: 10px;
}
.progresso-info > span { flex: 0 0 auto; white-space: nowrap; }
.progresso-info b { color: var(--blue) !important; font-size: 12px !important; flex: 1 1 auto; min-width: 0; text-align: right; }
.progresso-bar, .progresso-track {
  height: 7px !important;
  background: #EDF0F7 !important;
  border-radius: 99px !important;
  overflow: hidden;
}
.progresso-fill { background: var(--blue) !important; border-radius: 99px !important; height: 100% !important; }
.progresso-sub { color: var(--muted) !important; font-size: 10.5px !important; }

/* ---------- blocos de aviso / info ---------- */
.dobras-nec, .aviso, .warn, .feedback {
  background: var(--blue-soft) !important;
  border: 1px solid #DCE4FB !important;
  border-radius: 14px !important;
  color: #34437A !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 11px 12px !important;
}
.dobras-nec .dn-titulo { color: var(--blue) !important; font-weight: 800 !important; }
.dobras-nec .dn-falta { color: var(--red) !important; font-weight: 800 !important; }
.dobras-nec .dn-ok { color: var(--green) !important; font-weight: 800 !important; }
.erro { background: #FEF1F0 !important; border: 1px solid #FBD9D6 !important; border-radius: 14px !important; color: #B42318 !important; }

.hint { color: var(--muted) !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1.5; }
.divisor {
  font-size: 9.6px !important; font-weight: 800 !important;
  letter-spacing: .9px; text-transform: uppercase; color: var(--muted) !important;
}
.divisor::before, .divisor::after { background: var(--line) !important; }

/* ---------- gravacao ---------- */
.btn.record {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 20px !important;
  box-shadow: var(--shadow) !important;
  color: var(--ink) !important;
  height: 68px !important;
  justify-content: flex-start;
  padding: 0 16px !important;
  gap: 13px;
}
.btn.record .rec-ico {
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--blue); color: #fff;
  display: grid; place-items: center;
  font-size: 21px;
  box-shadow: 0 12px 24px -12px rgba(43, 84, 232, .9);
  flex: 0 0 auto;
}
.btn.record.recording .rec-ico { background: var(--red); box-shadow: 0 12px 24px -12px rgba(240, 68, 56, .9); }
#waveform { border-radius: 14px; background: #FBFCFE; border: 1px solid var(--line); margin-top: 10px; width: 100%; }
.timer { color: var(--muted) !important; font-weight: 800 !important; font-size: 11px !important; }

/* ---------- resultado ---------- */
.resultado { background: var(--card-2) !important; border: 1px solid var(--line) !important; border-radius: var(--r-md) !important; padding: 16px !important; }
.gauge-val { font-size: 44px !important; font-weight: 800 !important; color: var(--blue) !important; letter-spacing: -2px; }
.gauge-label { color: var(--muted) !important; font-weight: 700 !important; font-size: 10.5px !important; text-transform: uppercase; letter-spacing: .8px; }
.kpi {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  padding: 12px !important;
}
.kpi-v { font-size: 16px !important; font-weight: 800 !important; color: var(--ink) !important; letter-spacing: -.4px; }
.kpi-l { font-size: 9px !important; color: var(--muted) !important; font-weight: 800 !important; text-transform: uppercase; letter-spacing: .6px; }
.cls-badge, .cls-adequado, .cls-alto, .cls-moderado { border-radius: var(--pill) !important; font-weight: 800 !important; }

/* ---------- sugestoes / busca ---------- */
.busca-grupo input { border-radius: 14px !important; }
.sugestoes, .sugestao {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 36px -22px rgba(17, 22, 41, .38) !important;
  color: var(--ink) !important;
}
.sugestao:hover { background: var(--blue-soft) !important; }
.avaliado-sel {
  background: var(--blue-soft) !important;
  border: 1px solid #DCE4FB !important;
  border-radius: 14px !important;
}
.avaliado-nome { color: var(--ink) !important; font-weight: 800 !important; }
.avaliado-bar { background: #fff !important; border: 1px solid var(--line) !important; border-radius: var(--pill) !important; }

/* ---------- rodape ---------- */
.foot, .foot-note {
  color: var(--muted) !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
}

/* ---------- NAV INFERIOR (celular) ---------- */
.vx-nav {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  height: 68px;
  background: rgba(255, 255, 255, .96);
  border-top: 1px solid var(--line);
  backdrop-filter: blur(16px);
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 6px 4px;
  z-index: 70;
}
.vx-nav button {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  width: 58px; padding: 6px 0;
  background: none; border: 0; cursor: pointer;
  color: #A6AEC0; font-family: inherit;
  font-size: 9px; font-weight: 800; letter-spacing: .1px;
}
.vx-nav button svg { width: 21px; height: 21px; stroke: currentColor; fill: none; stroke-width: 1.9; }
.vx-nav button.on { color: var(--blue); }
.vx-nav .vx-fab {
  width: 50px; height: 50px; border-radius: 50%;
  background: var(--blue); color: #fff;
  display: grid; place-items: center;
  margin-top: -22px;
  box-shadow: 0 12px 22px -8px rgba(43, 84, 232, .8);
  border: 4px solid #fff;
}
.vx-nav .vx-fab svg { width: 22px; height: 22px; stroke: #fff; stroke-width: 2.4; }

/* menu lateral existe so no desktop */
.side-nav { display: none !important; }

/* ---------- desktop ---------- */
@media (min-width: 900px) {
  body { padding-bottom: 24px; }
  .vx-nav { display: none; }
  .side-nav {
    display: flex !important;
    flex-direction: column; gap: 4px;
    position: sticky; top: 20px; align-self: start;
    padding: 14px 10px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
  }
  .side-nav .sn-titulo {
    font-size: 9.5px; font-weight: 800; letter-spacing: 1.1px;
    text-transform: uppercase; color: var(--muted);
    padding: 2px 10px 10px;
  }
  .side-nav button {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 11px; border-radius: 12px; margin-bottom: 2px;
    background: none; border: 0; cursor: pointer;
    font-family: inherit; font-size: 13px; font-weight: 600;
    color: var(--ink-2); text-align: left; width: 100%;
  }
  .side-nav button .sn-ico { font-size: 0; display: grid; place-items: center; }
  .side-nav button .sn-ico svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.9; }
  .side-nav button:hover { background: #F7F8FC; color: var(--ink); }
  .side-nav button.ativo { background: var(--blue-soft); color: var(--blue); font-weight: 800; }

  .topbar {
    grid-column: 1 / -1;
    border-radius: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--line) !important;
  }
  main { max-width: 1040px; }
  .home-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .ficha-dados { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}


/* ===== v2: correcoes apos print ===== */

/* chips da home: uma cor so (lavanda/azul), sem variacao por posicao */
#tela-home .home-tile:nth-child(n) .tile-ico,
#tela-home .home-tile:nth-child(n) .tile-ico svg {
  color: var(--blue) !important;
}
#tela-home .home-tile .tile-ico { background: var(--blue-soft) !important; border: 0 !important; }
#tela-home .home-tile { background: #fff !important; }

/* topbar: botao de config sem emoji */
.btn-ghost-top svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.9; }

/* ficha: cartao azul de verdade (avatar + nome + metricas dentro) */
#tela-ficha .card-head {
  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin-bottom: 12px !important;
  color: var(--ink) !important;
}
#tela-ficha .card-head h2 { color: var(--ink) !important; font-size: 15px !important; }
#tela-ficha .card-head .ch-ico { background: var(--blue-soft) !important; color: var(--blue) !important; }
#tela-ficha .card-head .btn.ghost {
  background: #fff !important; color: var(--ink-2) !important;
  border: 1px solid var(--line) !important;
  height: 34px; padding: 0 14px !important; font-size: 11.5px !important;
}

.vx-pcard {
  background: linear-gradient(150deg, var(--blue-2), var(--blue-3));
  border-radius: 24px;
  padding: 20px;
  color: #fff;
  text-align: center;
  position: relative;
  overflow: hidden;
  box-shadow: 0 18px 34px -22px rgba(43, 84, 232, .85);
  margin-bottom: 14px;
}
.vx-pcard::after {
  content: ""; position: absolute; width: 220px; height: 220px; border-radius: 50%;
  background: rgba(255, 255, 255, .09); left: -90px; bottom: -120px;
}
.vx-pav {
  width: 66px; height: 66px; border-radius: 50%;
  background: rgba(255, 255, 255, .20);
  border: 2px solid rgba(255, 255, 255, .35);
  display: grid; place-items: center;
  margin: 0 auto 11px;
  font-size: 22px; font-weight: 800; letter-spacing: -.5px;
  position: relative;
}
.vx-pcard h3 { font-size: 18px; font-weight: 800; letter-spacing: -.3px; position: relative; }
.vx-psub { font-size: 11px; opacity: .84; margin-top: 3px; position: relative; font-weight: 600; }

/* metricas dentro do cartao azul */
.vx-pcard .ficha-dados {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 16px 0 0 !important;
  text-align: left;
  position: relative;
}
.vx-pcard .fd-item {
  border-left: 1px solid rgba(255, 255, 255, .22);
  padding: 0 0 0 10px;
  margin: 6px 0;
}
.vx-pcard .fd-item:nth-child(3n+1) { border-left: 0; padding-left: 0; }
.vx-pcard .fd-item span {
  color: rgba(255, 255, 255, .78) !important;
  font-size: 8.4px !important;
  letter-spacing: .6px;
}
.vx-pcard .fd-item b {
  color: #fff !important;
  font-size: 14.5px !important;
  font-weight: 800 !important;
}

/* titulo de secao "Avaliacoes" sem caixa alta */
.ficha-sub {
  text-transform: none !important;
  letter-spacing: -.1px !important;
  font-size: 13.5px !important;
  color: var(--ink) !important;
}

/* lista de avaliacoes: sem truncar a equacao */
.av-item .av-meta, .av-item .av-data, .av-meta, .av-data {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
.av-item { align-items: center !important; }
.av-item .av-top { display: flex; align-items: center; gap: 6px; min-width: 0; }
.av-avatar { font-size: 0 !important; }
.av-avatar svg, .av-avatar::after {
  content: "";
}


/* ===== v3: cartao azul com metricas isoladas ===== */
.vx-metrics {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin: 16px 0 0 !important;
  text-align: left;
  position: relative;
}
.vx-metrics .fd-item {
  border-left: 1px solid rgba(255, 255, 255, .22);
  padding: 4px 0 4px 10px;
  margin: 4px 0;
}
.vx-metrics .fd-item:nth-child(3n+1) { border-left: 0; padding-left: 0; }
.vx-metrics .fd-item span {
  color: rgba(255, 255, 255, .78) !important;
  font-size: 8.4px !important; letter-spacing: .6px;
}
.vx-metrics .fd-item b {
  color: #fff !important; font-size: 14.5px !important; font-weight: 800 !important;
}
/* foto redonda do avaliado nao entra no cartao azul (avatar de iniciais ja existe) */
.vx-pcard .fd-foto, .vx-pcard .fd-foto-placeholder { display: none !important; }
/* botao grande e os ghost ficam fora, empilhados */
#tela-ficha #fichaDados .btn { margin-top: 0 !important; }
#tela-ficha #fichaDados .btn + .btn { margin-top: 9px !important; }
#tela-ficha .vx-pcard { margin-bottom: 12px !important; }

/* ===== v4: ficha limpa + lista em duas linhas ===== */
#tela-ficha #fichaDados {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  display: block !important;
  grid-template-columns: none !important;
}
#tela-ficha #fichaDados .fd-foto,
#tela-ficha #fichaDados .fd-foto-placeholder { display: none !important; }

/* lista de avaliacoes: avatar + nome na 1a linha, data/%G na 2a, dobras na 3a */
.av-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 5px !important;
  padding: 12px 14px !important;
}
.av-top {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  width: 100% !important;
  min-width: 0 !important;
}
.av-avatar {
  width: 34px !important; height: 34px !important;
  border-radius: 50% !important;
  background: var(--blue-soft-2) !important;
  color: var(--blue) !important;
  display: grid !important; place-items: center !important;
  font-size: 11px !important; font-weight: 800 !important;
  flex: 0 0 auto !important;
  overflow: hidden !important;
}
.av-avatar img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.av-nome {
  font-size: 13px !important; font-weight: 800 !important;
  color: var(--ink) !important; flex: 1 1 auto; min-width: 0;
}
.av-baixo {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
  padding-left: 43px !important;
}
.av-data {
  font-size: 10.5px !important; color: var(--muted) !important;
  font-weight: 600 !important;
  white-space: normal !important;
}
.av-data strong { color: var(--ink) !important; font-weight: 800 !important; }
.av-res { color: var(--green) !important; font-weight: 800 !important; font-size: 14px !important; white-space: nowrap; }
.av-meta {
  font-size: 10px !important; color: var(--muted) !important;
  font-weight: 600 !important;
  padding-left: 43px !important;
  white-space: normal !important;
}
.av-badge {
  flex: 0 0 auto !important;
  font-size: 8.5px !important;
}

/* nada fica escondido atras da nav inferior */
main { padding-bottom: 96px !important; }

/* ===== v5: captura ===== */
#tela-captura .progresso { margin-top: 12px !important; }
#tela-captura .eq-cap { margin-top: 4px !important; }
#tela-captura .dobras-nec { margin: 8px 0 10px !important; }
#tela-captura .btn.record { width: 100% !important; }
#tela-captura .btn.record #rec-txt { font-size: 14px !important; font-weight: 800 !important; }
#tela-captura #btnCalcular { margin-top: 14px !important; }
#tela-captura .foto-ava-add {
  border-radius: 14px !important;
  border: 1px dashed var(--line-2) !important;
  background: #FBFCFE !important;
  color: var(--blue) !important;
}
#tela-captura .foto-ava-item { border-radius: 14px !important; }
.foto-ava-titulo { font-size: 11px !important; font-weight: 800 !important; color: var(--ink-2) !important; }
.foto-ava-contador { background: var(--blue-soft) !important; color: var(--blue) !important; border-radius: var(--pill) !important; padding: 2px 8px !important; font-weight: 800 !important; }

/* ===== v6: ficha topbar limpa + canvas oculto + dica larga ===== */
#tela-ficha .card-head .ch-ico { display: none !important; }
#tela-ficha .card-head h2 { display: none !important; }
#tela-ficha .card-head { justify-content: flex-end !important; padding-top: 2px !important; }

/* waveform: controlado no fim do arquivo (v66) */

/* dica / textos auxiliares ocupam a largura toda e nao viram blocos apertados */
#tela-captura .card .hint,
#tela-captura .card > p.hint {
  display: block !important;
  width: 100% !important;
  background: transparent !important;
  border: 0 !important;
  padding: 8px 2px !important;
}
#tela-captura #dobrasNecCap ~ .hint { background: transparent !important; }

main { padding-bottom: 110px !important; }

/* ===== v8: linha da lista — alinhamento e tipografia ===== */
.av-item {
  box-sizing: border-box !important;
  overflow: hidden !important;
  width: 100% !important;
}
.av-item .av-top {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  width: 100% !important;
  min-width: 0 !important;
}
.av-item .av-nome {
  text-transform: none !important;
  letter-spacing: -.2px !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  color: var(--ink) !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.av-item .av-baixo {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding-left: 43px !important;
  padding-right: 0 !important;
}
.av-item .av-baixo .av-data {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  text-align: left !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.av-item .av-baixo .av-res {
  flex: 0 0 auto !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: var(--green) !important;
}
.av-item .av-meta {
  padding-left: 43px !important;
  font-size: 10px !important;
  color: var(--muted) !important;
  font-weight: 600 !important;
  text-transform: none !important;
}


/* ===== v9: estrutura propria da linha ===== */
.av-item.vx-linha {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  padding: 12px 14px !important;
}
.av-item.vx-linha .av-avatar {
  width: 38px !important; height: 38px !important;
  border-radius: 50% !important;
  background: var(--blue-soft-2) !important;
  color: var(--blue) !important;
  display: grid !important; place-items: center !important;
  font-size: 12px !important; font-weight: 800 !important;
  flex: 0 0 auto !important;
}
.av-item.vx-linha .av-corpo {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
}
.av-item.vx-linha .av-nome {
  font-size: 13px !important;
  font-weight: 800 !important;
  color: var(--ink) !important;
  letter-spacing: -.2px !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.av-item.vx-linha .av-data {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.av-item.vx-linha .av-meta {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  text-transform: none !important;
}
.av-item.vx-linha .av-res {
  flex: 0 0 auto !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: var(--green) !important;
  letter-spacing: -.3px !important;
}
.av-item.vx-linha .vx-badge-linha {
  flex: 0 0 auto !important;
  font-size: 8px !important;
  align-self: flex-start !important;
  margin-top: 2px !important;
}

/* ===== v10: linha em row (o v4 forcava column) ===== */
.av-item.vx-linha {
  flex-direction: row !important;
  align-items: center !important;
  text-align: left !important;
}
.av-item.vx-linha .av-corpo { align-items: flex-start !important; text-align: left !important; }
.av-item.vx-linha .av-avatar { margin: 0 !important; }

/* ===== v11: quinto atalho ocupa a linha (sem buraco ao lado) ===== */
#tela-home .home-tile:last-child {
  grid-column: 1 / -1 !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px 14px !important;
}
#tela-home .home-tile:last-child .tile-ico { width: 26px !important; height: 26px !important; }
#tela-home .home-tile:last-child .tile-txt { font-size: 11px !important; }

/* ===== v12: textos auxiliares da captura ocupam a largura toda ===== */
#tela-captura .hint,
#tela-captura p.hint,
#tela-captura .card > .hint {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 7px 2px !important;
  margin: 0 !important;
  text-align: left !important;
}
#tela-captura .foto-avaliacao-box { display: block !important; }
#tela-captura .dobras-nec { width: 100% !important; box-sizing: border-box !important; }

/* ===== v13: cabecalho sem sobreposicao + dados do detalhe ===== */
.card-head {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  flex-wrap: nowrap !important;
}
.card-head h2 {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  flex: 1 1 auto !important;
}
.card-head .btn, .card-head .badge, .card-head button:not(.ch-ico) {
  flex: 0 0 auto !important;
  margin-left: auto !important;
}
.card-head .ch-ico {
  flex: 0 0 auto !important;
  display: grid !important;
  place-items: center !important;
}

/* detalhe: grade de dados alinhada em 3 colunas */
#tela-detalhe .ficha-dados {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px 10px !important;
  background: var(--card-2) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--r-md) !important;
  padding: 14px !important;
  margin-bottom: 14px !important;
}
#tela-detalhe .fd-item { min-width: 0 !important; }
#tela-detalhe .fd-item b {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* recentes na home */
.vx-recentes { display: flex; flex-direction: column; gap: 9px; }
.vx-recentes .av-item { margin-bottom: 0 !important; }
.vx-recentes .av-data { font-size: 10.5px !important; }
.vx-recentes .av-meta { font-size: 10px !important; }

/* waveform nunca ocupa espaco vazio (v66 controla no fim) */

/* icones svg nos cabecalhos e na barra */
.ch-ico svg { width: 17px; height: 17px; }
.ava-ico svg, .btn-edit svg { width: 15px; height: 15px; }

/* ===== v14: textos de apoio largos + folga para a barra inferior ===== */
#tela-captura .card p,
#tela-captura .card .hint,
#tela-captura .card small {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
}
main { padding-bottom: 112px !important; }

/* ===== v15: linha da lista em duas faixas, badge nunca sobre o nome ===== */
.av-item.vx-linha {
  display: flex !important;
  flex-wrap: wrap !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 3px 11px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  padding: 13px 14px !important;
  text-align: left !important;
}
.av-item.vx-linha .av-avatar {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: var(--blue-soft-2) !important;
  color: var(--blue) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  flex: 0 0 42px !important;
  margin: 0 !important;
}
.av-item.vx-linha .av-corpo {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  align-items: flex-start !important;
  text-align: left !important;
}
.av-item.vx-linha .av-nome {
  font-size: 13.5px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  color: var(--ink) !important;
  letter-spacing: -.2px !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}
.av-item.vx-linha .av-data,
.av-item.vx-linha .av-meta {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
  overflow: visible !important;
  text-align: left !important;
  line-height: 1.35 !important;
}
.av-item.vx-linha .av-res {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  color: var(--green) !important;
  letter-spacing: -.3px !important;
}
.av-item.vx-linha .vx-badge-linha {
  flex: 0 0 auto !important;
  margin: 6px 0 0 53px !important;
  padding: 4px 9px !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  border-radius: 999px !important;
  align-self: flex-start !important;
  position: static !important;
  float: none !important;
}

/* ===== v16: badge em faixa propria (nao espreme o nome) ===== */
.av-item.vx-linha { align-items: flex-start !important; }
.av-item.vx-linha .av-corpo { flex: 1 1 auto !important; min-width: 0 !important; }
.av-item.vx-linha .vx-badge-faixa {
  flex: 0 0 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
  display: flex !important;
  justify-content: flex-start !important;
  padding-left: 53px !important;
  margin-top: 7px !important;
}
.av-item.vx-linha .vx-badge-faixa .vx-badge-linha {
  margin: 0 !important;
  flex: 0 0 auto !important;
}
.av-item.vx-linha .av-res { order: 2 !important; }

/* ===== v17: cartao azul compacto, metricas sem estourar ===== */
#tela-ficha .vx-pcard .vx-pav {
  width: 56px !important;
  height: 56px !important;
  font-size: 18px !important;
  border: 2px solid rgba(255,255,255,.45) !important;
  border-style: solid !important;
  background: rgba(255,255,255,.16) !important;
  color: #fff !important;
  margin: 0 auto 10px !important;
}
#tela-ficha .vx-metrics { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
#tela-ficha .vx-metrics .fd-item { min-width: 0 !important; overflow: hidden !important; }
#tela-ficha .vx-metrics .fd-item span {
  font-size: 8.5px !important;
  letter-spacing: .7px !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.62) !important;
  display: block !important;
}
#tela-ficha .vx-metrics .fd-item b {
  display: block !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #fff !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  letter-spacing: -.2px !important;
}
#tela-ficha .vx-metrics .fd-item:last-child { grid-column: span 2 !important; }

/* ===== v18: zera recuo herdado, tira mono do nome, plural correto ===== */
.av-item.vx-linha .av-data,
.av-item.vx-linha .av-meta,
.av-item.vx-linha .av-corpo .av-data,
.av-item.vx-linha .av-corpo .av-meta {
  padding-left: 0 !important;
  margin-left: 0 !important;
  text-indent: 0 !important;
  font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  letter-spacing: 0 !important;
  word-spacing: normal !important;
}
.av-item.vx-linha .av-nome,
.av-item.vx-linha .av-corpo .av-nome,
.av-item.vx-linha b {
  font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  letter-spacing: -.2px !important;
  word-spacing: normal !important;
  font-variant-numeric: normal !important;
}
.av-item.vx-linha .vx-badge-faixa {
  padding-left: 53px !important;
  margin-top: 6px !important;
}
.av-item.vx-linha .vx-badge-faixa .av-badge {
  font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  letter-spacing: .3px !important;
}
/* numeros da data seguem mono so neles */
.av-item.vx-linha .av-data { font-variant-numeric: tabular-nums !important; }

/* ===== v19: celular com 2 colunas + checks do guia sem emoji ===== */
#tela-ficha .vx-metrics .fd-item:nth-child(5),
#tela-ficha .ficha-dados .fd-item:nth-child(5) { grid-column: span 2 !important; }
#tela-ficha .vx-metrics .fd-item:nth-child(5) b,
#tela-ficha .ficha-dados .fd-item:nth-child(5) b { font-size: 12.5px !important; }

#tela-guia li { list-style: none !important; position: relative !important; padding-left: 22px !important; }
#tela-guia li::before {
  content: "";
  position: absolute;
  left: 2px; top: 5px;
  width: 13px; height: 7px;
  border-left: 2px solid var(--green);
  border-bottom: 2px solid var(--green);
  transform: rotate(-45deg);
  border-radius: 1px;
}

/* ===== v20: metricas originais escondidas (o cartao usa clones) ===== */
#tela-ficha #fichaDados > .fd-item,
#tela-ficha #fichaDados > .fd-foto,
#tela-ficha #fichaDados > .fd-foto-placeholder { display: none !important; }

/* ===== v22: cabecalhos com respiro, botao voltar sem espremer ===== */
.card-head {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 42px !important;
  padding: 10px 4px 16px !important;
  margin: 0 0 6px !important;
  box-sizing: border-box !important;
}
#tela-ficha .card-head {
  padding: 6px 2px 14px !important;
  justify-content: flex-end !important;
  margin-bottom: 2px !important;
}
.card-head .btn,
.card-head .btn.ghost,
.card-head button:not(.ch-ico) {
  min-height: 38px !important;
  padding: 9px 16px !important;
  line-height: 1 !important;
  flex: 0 0 auto !important;
  font-size: 12px !important;
}
.card-head .ch-ico {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px !important;
}
.card-head h2 { line-height: 1.2 !important; }
/* primeiro bloco depois do cabecalho nao cola */
.card-head + * { margin-top: 4px !important; }

/* ===== v23: ficha com titulo proprio no cabecalho e folga real ===== */
#tela-ficha .card-head {
  justify-content: flex-start !important;
  align-items: center !important;
  padding: 14px 4px 18px !important;
  gap: 10px !important;
  margin-bottom: 4px !important;
  min-height: 46px !important;
}
#tela-ficha .card-head .ch-ico { display: grid !important; }
#tela-ficha .card-head .vx-head-titulo {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: var(--ink) !important;
  letter-spacing: -.2px !important;
  line-height: 1.2 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#tela-ficha .card-head .btn.ghost { margin-left: auto !important; }
#tela-ficha .vx-pcard { margin-top: 6px !important; }
.card-head .btn.ghost { padding: 9px 15px !important; }

/* ===== v25: botao gravar em card central (como o mockup) ===== */
#btnGravar.btn.record {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 20px 18px !important;
  background: var(--card) !important;
  border: 1.5px dashed var(--line-2) !important;
  border-radius: var(--r-md) !important;
  box-shadow: none !important;
  color: var(--ink) !important;
}
#btnGravar.btn.record .rec-ico {
  width: 62px !important;
  height: 62px !important;
  border-radius: 50% !important;
  background: var(--blue) !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  box-shadow: 0 10px 22px -12px var(--blue) !important;
  font-size: 0 !important;
}
#btnGravar.btn.record .rec-ico svg { width: 26px !important; height: 26px !important; }
#btnGravar.btn.record #rec-txt {
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: -.2px !important;
  color: var(--ink) !important;
}
#btnGravar.btn.record.recording .rec-ico { background: var(--red) !important; }

/* textos de apoio: esquerda, largura toda */
#tela-captura .hint,
#tela-captura div.hint,
#tela-captura .card > div:not([class]) {
  text-align: left !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 6px 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

/* calcular desabilitado: neutro (sem borda verde) */
#btnCalcular:disabled,
#tela-captura .btn:disabled {
  background: var(--card) !important;
  border: 1.5px solid var(--line-2) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

/* aviso de dobras faltando: ambar sobrio */
#dobrasNecCap, #tela-captura .dobras-nec {
  background: #FFF8E8 !important;
  border: 1px solid #F3E0AE !important;
  color: #8A6100 !important;
  border-radius: var(--r-md) !important;
  padding: 11px 13px !important;
  font-weight: 700 !important;
  text-align: left !important;
}

/* avatar com foto real */
.av-item.vx-linha .av-avatar img,
.vx-pcard .vx-pav img {
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;
}

/* ===== v26: altura do gravar e textos de apoio ===== */
#btnGravar.btn.record {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 20px 18px !important;
  box-sizing: border-box !important;
}
#btnGravar.btn.record .rec-ico { flex: 0 0 62px !important; }
#btnGravar.btn.record #rec-txt { flex: 0 0 auto !important; }

/* rotulo de fotos e textos auxiliares: esquerda, largura total, sem emoji */
#tela-captura .foto-ava-titulo {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: 100% !important;
  text-align: left !important;
  justify-content: flex-start !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .4px !important;
  color: var(--muted) !important;
  text-transform: uppercase !important;
}
#tela-captura .foto-ava-titulo .foto-ava-contador { margin-left: auto !important; }

#tela-captura .hint,
#tela-captura p,
#tela-captura .dica,
#tela-captura [class*="ajuda"] {
  text-align: left !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 6px 0 0 !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  color: var(--muted) !important;
}

/* ===== v27: fotos com tamanho fixo e recorte circular ===== */
.av-item.vx-linha .av-avatar {
  overflow: hidden !important;
  padding: 0 !important;
  line-height: 0 !important;
}
.av-item.vx-linha .av-avatar img {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 50% !important;
  display: block !important;
  margin: 0 !important;
}
.vx-pcard .vx-pav {
  overflow: hidden !important;
  padding: 0 !important;
  line-height: 0 !important;
  display: grid !important;
  place-items: center !important;
}
.vx-pcard .vx-pav img {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  max-width: 56px !important;
  max-height: 56px !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: 50% !important;
  display: block !important;
  margin: 0 !important;
}
/* fallback: qualquer avatar com imagem */
.av-avatar > img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  display: block !important;
}

/* ===== v28: icone do gravar centrado no circulo ===== */
#btnGravar.btn.record .rec-ico {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 0 !important;
  padding: 0 !important;
  font-size: 0 !important;
}
#btnGravar.btn.record .rec-ico svg {
  display: block !important;
  width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  transform: none !important;
  vertical-align: middle !important;
}
/* qualquer icone svg dentro de botao: sem baseline */
.btn svg, .rec-ico svg, .chip svg, .nav-item svg { vertical-align: middle !important; }

/* ===== v29: nome do avaliado sem CAPS e dicas a esquerda ===== */
#tela-captura .ava-nome,
.ava-nome,
#avaSelNome {
  text-transform: none !important;
  letter-spacing: -.2px !important;
  font-weight: 800 !important;
  color: var(--ink) !important;
}
#tela-captura .hint.center,
.hint.center,
#tela-captura .hint {
  text-align: left !important;
  justify-content: flex-start !important;
  display: block !important;
  width: 100% !important;
  margin: 8px 0 0 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 1.5 !important;
  color: var(--muted) !important;
  background: transparent !important;
  border: 0 !important;
}
#tela-captura .dica-audio {
  text-align: left !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  line-height: 1.5 !important;
}

/* ===== v30: detalhe sem truncamento ===== */
#tela-detalhe .card-head h2 {
  font-size: 16px !important;
  letter-spacing: -.3px !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
/* metadados do detalhe: paciente ocupa a linha inteira */
#detalheMeta {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px 14px !important;
}
#detalheMeta > *:nth-child(1),
#detalheMeta > *:nth-child(2) {
  grid-column: 1 / -1 !important;
}
#detalheMeta .meta-label,
#detalheMeta small,
#detalheMeta label {
  font-size: 9px !important;
  letter-spacing: .6px !important;
  color: var(--muted) !important;
  text-transform: uppercase !important;
  display: block !important;
}
#detalheMeta b, #detalheMeta strong, #detalheMeta span {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-transform: none !important;
  word-break: break-word !important;
  font-size: 13px !important;
}

/* ===== v32: equacao do detalhe com espaco de sobra ===== */
#detalheMeta { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
#detalheMeta > *:nth-child(1) { grid-column: 1 / -1 !important; }
#detalheMeta > *:nth-child(6),
#detalheMeta > *:nth-child(7),
#detalheMeta > *:nth-child(8) { grid-column: 1 / -1 !important; }
#detalheMeta b, #detalheMeta strong { font-size: 13px !important; }
.dobra-ok { font-size: 0 !important; line-height: 0 !important; }
.dobra-ok svg { display: block !important; }

/* ===== v34: equacao do detalhe quebra linha em vez de cortar ===== */
#detalheMeta b,
#detalheMeta strong,
#detalheMeta .meta-valor {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  display: block !important;
}
#detalheMeta > div:nth-child(odd):last-child { grid-column: 1 / -1 !important; }

/* ===== v36: nome do avaliado selecionado sem CAPS ===== */
.avaliado-nome,
#tela-captura .avaliado-nome {
  text-transform: none !important;
  letter-spacing: -.2px !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  color: var(--ink) !important;
}

/* ===== v38: sem avatar de perfil (nem foto, nem iniciais) ===== */
.av-avatar,
.vx-pcard .vx-pav,
#fichaDados .fd-foto,
.fd-foto-placeholder,
.ava-ico { display: none !important; }

/* o texto da linha ocupa o espaco que era do avatar */
.av-item.vx-linha { padding-left: 16px !important; }
.av-item.vx-linha .av-corpo { padding-left: 0 !important; margin-left: 0 !important; }
.av-item.vx-linha .av-nome,
.av-item.vx-linha .av-data,
.av-item.vx-linha .av-meta { padding-left: 0 !important; margin-left: 0 !important; text-indent: 0 !important; }

/* cartao azul sem avatar: nome e metricas alinhados a esquerda */
.vx-pcard { display: block !important; }

/* ===== v40: nenhum avatar em nenhuma lista (regra final) ===== */
.av-avatar,
.vx-recentes .av-avatar,
.vx-sec .av-avatar,
.av-item .av-avatar,
#homeRecentes .av-avatar,
.vx-pcard .vx-pav,
#fichaDados .fd-foto,
.fd-foto-placeholder,
.ava-ico { display: none !important; visibility: hidden !important; width: 0 !important; height: 0 !important; }

.vx-recentes .av-corpo,
.vx-sec .av-corpo,
.av-item .av-corpo { padding-left: 0 !important; margin-left: 0 !important; }

/* ===== v41: sem avatar do profissional e icone do topo visivel ===== */
#homeAvatar,
#tela-home .avatar,
.card-head .avatar { display: none !important; }

/* botao redondo do topo: icone de volta com tamanho real */
.btn-ghost-top,
#btnHome {
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
}
.btn-ghost-top svg,
#btnHome svg {
  width: 17px !important;
  height: 17px !important;
  min-width: 17px !important;
  display: block !important;
  margin: 0 !important;
  vertical-align: 0 !important;
}
.btn-ghost-top { font-size: 0 !important; }

/* cabecalho da home sem avatar: texto encosta a esquerda */
#tela-home .card-head { gap: 12px !important; }
#tela-home .card-head > div,
#tela-home .card-head > span:not(.avatar) { margin-left: 0 !important; }

/* ===== v42: botao do topo com tamanho explicito (corrige colapso do v41) ===== */
#btnHome.btn-ghost-top,
.btn-ghost-top {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  overflow: visible !important;
  font-size: 12px !important;
  flex: 0 0 38px !important;
}
#btnHome.btn-ghost-top svg,
.btn-ghost-top svg {
  width: 17px !important;
  height: 17px !important;
  display: block !important;
  margin: 0 !important;
  position: static !important;
}

/* ===== v44: avaliação aberta x fechada ===== */
/* fechada: neutra, com acao "Ver Resultado" */
.av-item.vx-linha.vx-fechada {
  background: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  border-left: 3px solid var(--line) !important;
}
.av-item.vx-linha.vx-fechada .av-badge.vx-badge-fechada {
  background: var(--lav) !important;
  color: var(--blue) !important;
  border: 1px solid #D5DEFA !important;
  font-weight: 800 !important;
}

/* aberta: ambar (exige acao), com "Prosseguir" */
.av-item.vx-linha.vx-aberta {
  background: #FFFBF0 !important;
  border: 1px solid #F5E2B4 !important;
  border-left: 3px solid #E9A93B !important;
}
.av-item.vx-linha.vx-aberta .av-badge.vx-badge-aberta {
  background: #FDF0D0 !important;
  color: #855C00 !important;
  border: 1px solid #EDD79A !important;
  font-weight: 800 !important;
}
.av-item.vx-linha.vx-aberta .av-meta { color: #8A6A22 !important; }
.av-item.vx-linha.vx-aberta .av-nome { color: var(--ink) !important; }

/* os dois selos ocupam a linha inteira, alinhados a esquerda */
.av-item.vx-linha .vx-badge-faixa {
  width: 100% !important;
  display: flex !important;
  justify-content: flex-start !important;
  margin-top: 8px !important;
}
.av-item.vx-linha .av-badge.vx-badge-linha {
  font-size: 10.5px !important;
  letter-spacing: .5px !important;
  text-transform: uppercase !important;
  padding: 7px 14px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}

/* ===== v45: ficha — data em destaque, sem nome repetido ===== */
#fichaLista .av-item .av-data-destaque {
  font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 15.5px !important;
  font-weight: 800 !important;
  letter-spacing: -.3px !important;
  color: var(--ink) !important;
  text-transform: none !important;
  line-height: 1.25 !important;
  display: block !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}
#fichaLista .av-item .av-peso {
  display: block !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: var(--muted) !important;
  margin-top: 2px !important;
  letter-spacing: -.1px !important;
}
#fichaLista .av-item .av-meta {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
  margin-top: 3px !important;
}
/* mais respiro no card, ja que saiu uma linha de texto */
#fichaLista .av-item.vx-linha { padding: 14px 16px !important; }
#fichaLista .av-item .av-corpo { gap: 1px !important; }

/* ===== v46: situação ao lado da data ===== */
#fichaLista .av-item .vx-data-linha {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  width: 100% !important;
}
#fichaLista .av-item .vx-chip-sit {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: .6px !important;
  text-transform: uppercase !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  line-height: 1.5 !important;
  white-space: nowrap !important;
}
#fichaLista .av-item .vx-chip-aberta {
  background: #FDF0D0 !important;
  color: #855C00 !important;
  border: 1px solid #EDD79A !important;
}
#fichaLista .av-item .vx-chip-fechada {
  background: #E9EEFD !important;
  color: #2747B8 !important;
  border: 1px solid #CFDAF9 !important;
}

/* ===== v47: situacao como texto simples (sem formato de botao) ===== */
#fichaLista .av-item .vx-chip-sit {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .1px !important;
  text-transform: none !important;
  line-height: 1.4 !important;
  display: inline !important;
}
#fichaLista .av-item .vx-chip-aberta { color: #A97A16 !important; }
#fichaLista .av-item .vx-chip-fechada { color: #3A5BF0 !important; }

/* ===== v48: selo alinhado a esquerda (havia recuo de 53px na faixa) ===== */
#fichaLista .vx-badge-faixa,
.av-item .vx-badge-faixa {
  padding: 0 !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
  text-indent: 0 !important;
  justify-content: flex-start !important;
  align-items: center !important;
  display: flex !important;
  width: 100% !important;
}
#fichaLista .vx-badge-faixa .av-badge,
.av-item .vx-badge-faixa .av-badge {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* ===== v49: titulo do detalhe nunca invade o botao Voltar ===== */
#tela-detalhe .card-head,
.card-head {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
}
#tela-detalhe .card-head h2,
.card-head h2 {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: calc(100% - 110px) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  margin: 0 !important;
  position: static !important;
}
#tela-detalhe .card-head h2 { max-width: calc(100% - 100px) !important; }
#tela-detalhe .card-head > button,
#tela-detalhe .card-head > .btn {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  white-space: nowrap !important;
}

/* ===== v50: cabecalho do detalhe — titulo inteiro e controle no topo ===== */
#tela-detalhe .card-head .ch-ico,
#tela-detalhe .card-head > svg {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  flex: 0 0 32px !important;
}
#tela-detalhe .card-head {
  padding: 10px 2px 14px !important;
  gap: 8px !important;
}
#tela-detalhe .card-head h2 {
  font-size: 14.5px !important;
  font-weight: 800 !important;
  letter-spacing: -.2px !important;
  line-height: 1.2 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#tela-detalhe .card-head > button,
#tela-detalhe .card-head > .btn {
  flex: 0 0 auto !important;
  padding: 9px 13px !important;
  font-size: 12px !important;
  margin-left: 6px !important;
  min-width: 0 !important;
}
#tela-detalhe .card-head > button svg { width: 14px !important; height: 14px !important; }

/* ===== v51: dobras junto ao gravador, grade alinhada ===== */
/* card de dobras passa a viver dentro do card do gravador */
#tela-captura .card-roxo .card-verde.vx-dobras-junto {
  margin: 14px -4px 0 !important;
  padding: 12px 12px 14px !important;
  border-radius: 16px !important;
  background: #F7FAFF !important;
  border: 1px solid #E4EBFA !important;
  box-shadow: none !important;
}
#tela-captura .card-verde.vx-dobras-junto .card-head {
  padding: 0 0 8px !important;
  gap: 8px !important;
  border: 0 !important;
}
#tela-captura .card-verde.vx-dobras-junto .card-head h2 {
  font-size: 13px !important;
  letter-spacing: -.1px !important;
  white-space: nowrap !important;
  overflow: visible !important;
}
#tela-captura .card-verde.vx-dobras-junto .card-head .ch-ico,
#tela-captura .card-verde.vx-dobras-junto .card-head svg {
  width: 22px !important; height: 22px !important; min-width: 22px !important;
}

/* grade: 2 colunas iguais, cards de mesma altura, sem sobras */
#tela-captura #dobrasGrid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
  width: 100% !important;
  margin: 0 !important;
}
#tela-captura #dobrasGrid > * {
  min-width: 0 !important;
  width: auto !important;
  height: 100% !important;
  box-sizing: border-box !important;
}
/* card sozinho na ultima linha ocupa a largura toda (nao fica orfao) */
#tela-captura #dobrasGrid > *:last-child:nth-child(odd) {
  grid-column: 1 / -1 !important;
}
/* nada de texto solto dentro da grade */
#tela-captura #dobrasGrid > .hint,
#tela-captura #dobrasGrid > p {
  grid-column: 1 / -1 !important;
  text-align: left !important;
}

/* progresso das dobras: sem truncar */
#tela-captura .card-verde.vx-dobras-junto .progresso { margin: 0 0 10px !important; }
#tela-captura .card-verde.vx-dobras-junto .progresso-info {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
}
#tela-captura .card-verde.vx-dobras-junto .progresso-info span { flex: 0 0 auto !important; }
#tela-captura .card-verde.vx-dobras-junto .progresso-info b {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  text-align: right !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

/* calcular logo abaixo da grade */
#tela-captura .card-verde.vx-dobras-junto #btnCalcular { margin-top: 12px !important; }

/* folga no fim para a barra inferior nao cobrir nada */
#tela-captura .card-roxo { padding-bottom: 28px !important; }
#tela-captura { padding-bottom: 110px !important; }

/* ===== v53: dica unica, fora da grade, discreta ===== */
#tela-captura .vx-dica-fora {
  grid-column: auto !important;
  width: 100% !important;
  text-align: left !important;
  font-size: 10.5px !important;
  line-height: 1.45 !important;
  color: var(--muted) !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
#tela-captura #dobrasGrid + .vx-dica-fora { margin-top: 8px !important; }

/* ===== v54: cabecalho e progresso compactos, grade sobe ===== */
#tela-captura .card-verde.vx-dobras-junto .card-head {
  padding: 0 0 6px !important;
  min-height: 0 !important;
  border: 0 !important;
}
#tela-captura .card-verde.vx-dobras-junto .card-head .ch-ico,
#tela-captura .card-verde.vx-dobras-junto .card-head > svg { display: none !important; }
#tela-captura .card-verde.vx-dobras-junto .card-head h2 {
  font-size: 10.5px !important;
  letter-spacing: .7px !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  font-weight: 800 !important;
}
#tela-captura .card-verde.vx-dobras-junto .progresso { margin: 0 0 8px !important; }
#tela-captura .card-verde.vx-dobras-junto .progresso-bar { height: 5px !important; margin-top: 4px !important; }
#tela-captura .card-verde.vx-dobras-junto .dobras-nec { margin: 0 0 8px !important; font-size: 10.5px !important; }

/* ===== v57: dobras em lista vertical, com botao de apagar ===== */
#tela-captura #dobrasGrid {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  gap: 7px !important;
  width: 100% !important;
}
#tela-captura #dobrasGrid > .dobra-chip {
  width: 100% !important;
  max-width: 100% !important;
  grid-column: auto !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 50px !important;
  height: auto !important;
  padding: 11px 12px !important;
  box-sizing: border-box !important;
  border-radius: 14px !important;
}
#tela-captura #dobrasGrid > .dobra-chip .dobra-ok {
  flex: 0 0 auto !important;
  display: grid !important;
  place-items: center !important;
}
#tela-captura #dobrasGrid > .dobra-chip .dobra-nome {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}
#tela-captura #dobrasGrid > .dobra-chip .dobra-valor {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
#tela-captura #dobrasGrid > .dobra-chip .vx-del {
  flex: 0 0 26px !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  margin-left: 2px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid #F0D5D5 !important;
  background: #FDF3F3 !important;
  color: #C0392B !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
}
#tela-captura #dobrasGrid > .dobra-chip .vx-del svg { display: block !important; }
#tela-captura #dobrasGrid > .dobra-chip .vx-del:active { background: #F9E3E3 !important; }

/* ===== v58: alinhamento igual em qualquer lista (ficha e avaliados) ===== */
.av-item.vx-linha .vx-badge-faixa,
#avaliadosLista .av-item .vx-badge-faixa,
#fichaLista .av-item .vx-badge-faixa,
.av-item .vx-badge-faixa {
  padding: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 8px 0 0 !important;
  text-indent: 0 !important;
  float: none !important;
  position: static !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.av-item.vx-linha .vx-badge-faixa .av-badge,
#avaliadosLista .av-item .vx-badge-faixa .av-badge,
#fichaLista .av-item .vx-badge-faixa .av-badge {
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  text-indent: 0 !important;
  position: static !important;
  flex: 0 0 auto !important;
}
/* colunas alinhadas com o texto do card */
#avaliadosLista .av-item .av-corpo,
#fichaLista .av-item .av-corpo {
  padding-left: 0 !important;
  margin-left: 0 !important;
  text-align: left !important;
  align-items: flex-start !important;
}
#avaliadosLista .av-item .av-nome,
#avaliadosLista .av-item .av-data,
#avaliadosLista .av-item .av-meta {
  text-align: left !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
  text-indent: 0 !important;
}
/* nome pode ocupar a linha toda antes do selo */
#avaliadosLista .av-item .av-nome {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  width: 100% !important;
}

/* ===== v59: aviso da equacao (falta / completa / ignoradas) ===== */
#tela-captura #dobrasNecCap,
#tela-captura #dobrasNecCap.vx-falta,
#tela-captura #dobrasNecCap.vx-ok {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 10px 0 0 !important;
  padding: 11px 13px !important;
  border-radius: 13px !important;
  text-align: left !important;
  line-height: 1.45 !important;
}
#tela-captura #dobrasNecCap.vx-falta {
  background: #FFF8E7 !important;
  border: 1px solid #F3DFAE !important;
}
#tela-captura #dobrasNecCap.vx-ok {
  background: #EFF9F1 !important;
  border: 1px solid #CBE9D2 !important;
}
#tela-captura #dobrasNecCap .dn-titulo {
  display: block !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #8A5B00 !important;
}
#tela-captura #dobrasNecCap.vx-ok .dn-titulo { color: #1E7A3C !important; }
#tela-captura #dobrasNecCap .dn-extra {
  display: block !important;
  margin-top: 4px !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  color: var(--muted) !important;
}
/* eco da dobra coletada nao repete o que a lista ja mostra */
#tela-captura #feedback.vx-eco {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ===== v61: home com 3 atalhos preenchendo a linha ===== */
#tela-home .home-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
#tela-home .home-grid .home-tile {
  width: 100% !important;
  box-sizing: border-box !important;
}
/* o ultimo (Planos) continua ocupando a linha inteira */
#tela-home .home-tile:last-child {
  grid-column: 1 / -1 !important;
}

/* ===== v63: bottom-nav com FAB no centro exato (grid deterministico) ===== */
/* 3 itens: dois a esquerda, FAB no meio da tela, o ultimo ocupa a direita */
.vx-nav {
  display: grid !important;
  grid-template-columns: 1fr 1fr 50px 1fr 1fr !important;
  align-items: center !important;
  justify-items: center !important;
  padding: 0 2px 4px !important;
  gap: 0 !important;
}
.vx-nav > button {
  order: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
}
.vx-nav .vx-fab {
  width: 50px !important;
  min-width: 50px !important;
  height: 50px !important;
  margin: -22px 0 0 !important;
  justify-self: center !important;
}

/* ===== v64: lapis de editar no canto inferior direito do card ===== */
#avaliadosLista .av-item { position: relative !important; }
#avaliadosLista .av-item .vx-edit {
  position: absolute !important;
  right: 12px !important;
  bottom: 12px !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  background: var(--blue-soft, #EEF2FE) !important;
  border: 1px solid #D9E2FC !important;
  color: var(--blue, #2B54E8) !important;
  cursor: pointer !important;
  box-shadow: none !important;
  z-index: 2;
  -webkit-tap-highlight-color: transparent;
}
#avaliadosLista .av-item .vx-edit svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 1.9 !important;
}
#avaliadosLista .av-item .vx-edit:active { background: #E1E9FD !important; }
/* o selo nao pode ficar embaixo do lapis */
#avaliadosLista .av-item .vx-badge-faixa { padding-right: 42px !important; }

/* ===== v65: equacao de predicao compacta, logo no topo do card ===== */
#tela-captura .card-verde .eq-cap {
  margin: 10px 0 12px !important;
  display: block !important;
  width: 100% !important;
}
#tela-captura .card-verde .eq-cap select {
  margin-top: 5px !important;
  height: 42px !important;
  width: 100% !important;
  font-size: 13px !important;
}
/* a dica desce para o fim, nao empurra a equacao nem a lista */
#tela-captura .card-verde .vx-dica-fora {
  order: 99 !important;
  margin-top: 10px !important;
}


/* ===== v66: indicador de captacao durante a gravacao (barras de espectro) ===== */
#waveform {
  display: none !important;
  height: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
/* so existe enquanto grava: sem espaco vazio quando parado */
#btnGravar.recording ~ #waveform {
  display: block !important;
  height: 74px !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  background: #FBFCFE !important;
  border: 1px solid #E6EAF2 !important;
  border-radius: 14px !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}
.vx-aviso-som {
  margin: 8px 0 0 !important;
  background: #FFF8E7 !important;
  border: 1px solid #F3DFAE !important;
  color: #8A5B00 !important;
  border-radius: 12px !important;
  padding: 9px 12px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-align: center !important;
  line-height: 1.35 !important;
}

/* ===== v67: controles esmaecidos ate ter avaliado + peso ===== */
#tela-captura .vx-off {
  opacity: .42 !important;
  filter: grayscale(.55) !important;
  pointer-events: none !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}
#tela-captura .vx-off * { pointer-events: none !important; }
#tela-captura .vx-off::after { display: none !important; }
#inPeso.vx-off { background: #F4F6FB !important; color: #9AA3B5 !important; }
.vx-faixa-bloqueio {
  margin: 6px 0 12px !important;
  background: #FFF8E7 !important;
  border: 1px solid #F3DFAE !important;
  color: #8A5B00 !important;
  border-radius: 12px !important;
  padding: 9px 12px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-align: center !important;
  line-height: 1.35 !important;
}

/* ===== v68: sem avaliado, valor neutro no lugar do nome ===== */
.vx-sem-avaliado-valor {
  color: #9AA3B5 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 10px 0 4px !important;
  margin-bottom: 8px !important;
  line-height: 1.3 !important;
}
#divisorSessao { margin-bottom: 4px !important; }

/* ===== v69: aviso de dobras nao aparece vazio enquanto calcula ===== */
#tela-captura #dobrasNecCap:empty { display: none !important; }

/* ===== v70: Gravar desabilitado = cinza de verdade (o circulo era azul forte) ===== */
#tela-captura #btnGravar.vx-off {
  filter: none !important;
  opacity: 1 !important;
  background: #F1F3F8 !important;
  border-color: #E1E6EF !important;
  box-shadow: none !important;
}
#tela-captura #btnGravar.vx-off .rec-ico {
  background: #C9D0DE !important;
  background-image: none !important;
  border-color: #C9D0DE !important;
  color: #FFFFFF !important;
  box-shadow: none !important;
}
#tela-captura #btnGravar.vx-off .rec-ico svg,
#tela-captura #btnGravar.vx-off .rec-ico svg rect,
#tela-captura #btnGravar.vx-off .rec-ico svg path,
#tela-captura #btnGravar.vx-off .rec-ico svg circle {
  fill: #FFFFFF !important;
  stroke: #FFFFFF !important;
  color: #FFFFFF !important;
}
#tela-captura #btnGravar.vx-off #rec-txt {
  color: #9AA3B5 !important;
  font-weight: 700 !important;
}