:root{
    --tinta:#2b3444;
    --tinta-suave:#556073;
    --neutro:#7c8798;
    --papel:#f4f6f9;
    --superficie:#ffffff;
    --superficie-2:#eaeef4;
    --linha:#dde3ec;
    --linha-forte:#c2cad8;
    --selo:#0f9d63;
    --selo-claro:#e2f5ec;
    --livro:#1f6f5c;
    --livro-claro:#e5f1ee;
    --ambar:#8a6a1f;
    --ambar-claro:#f7efdb;
    --alerta:#c0392b;
    --btn-texto:#ffffff;
    --sombra:0 1px 2px rgba(43,52,68,.05), 0 8px 24px -16px rgba(43,52,68,.26);
    --raio:6px;
    --serif:"Archivo","Helvetica Neue",Arial,sans-serif;
    --sans:"Source Sans 3","Segoe UI",system-ui,sans-serif;
    --mono:"IBM Plex Mono","SFMono-Regular",Consolas,monospace;
  }
  @media (prefers-color-scheme:dark){
    :root:not([data-theme="light"]){
      --tinta:#e8ecf3; --tinta-suave:#a9b4c6; --neutro:#8b96a9;
      --papel:#1b2130; --superficie:#232b3b; --superficie-2:#2c3547;
      --linha:#354056; --linha-forte:#475369;
      --selo:#2fe08a; --selo-claro:#1a3a2c;
      --livro:#5fd3ae; --livro-claro:#1a3128;
      --ambar:#d9b76a; --ambar-claro:#332a18;
      --alerta:#f08a7f;
      --btn-texto:#10261c;
      --sombra:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.7);
    }
  }
  :root[data-theme="dark"]{
    --tinta:#e8ecf3; --tinta-suave:#a9b4c6; --neutro:#8b96a9;
    --papel:#1b2130; --superficie:#232b3b; --superficie-2:#2c3547;
    --linha:#354056; --linha-forte:#475369;
    --selo:#2fe08a; --selo-claro:#1a3a2c;
    --livro:#5fd3ae; --livro-claro:#1a3128;
    --ambar:#d9b76a; --ambar-claro:#332a18;
    --alerta:#f08a7f;
    --btn-texto:#10261c;
    --sombra:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -16px rgba(0,0,0,.7);
  }

  *{box-sizing:border-box}
  body{
    margin:0; background:var(--papel); color:var(--tinta);
    font-family:var(--sans); font-size:16px; line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{font-family:var(--serif); font-weight:700; letter-spacing:-.015em; text-wrap:balance; margin:0}
  .mono{font-family:var(--mono); font-variant-numeric:tabular-nums}

  /* ---------- topo ---------- */
  .topo{
    position:sticky; top:0; z-index:20;
    background:var(--superficie); border-bottom:1px solid var(--linha);
    padding-block:12px;
  }
  .topo-int{
    max-width:1080px; margin:0 auto; padding-inline:20px;
    display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  }
  .marca{display:flex; align-items:center; gap:10px; margin-right:auto}
  .marca-selo{width:34px; height:34px; flex:none; display:block}
  .marca-txt{display:flex; flex-direction:column; line-height:1.15}
  .marca-txt b{font-family:var(--serif); font-weight:700; font-size:17px; letter-spacing:-.01em}
  .marca-txt span{font-size:11px; letter-spacing:.09em; text-transform:uppercase; color:var(--neutro); font-weight:600}
  .marca-txt span i{font-style:normal; color:var(--selo)}

  .abas{display:flex; gap:4px; background:var(--superficie-2); padding:3px; border-radius:var(--raio)}
  .aba{
    font:inherit; font-size:14px; font-weight:500;
    border:0; background:transparent; color:var(--tinta-suave);
    padding:6px 14px; border-radius:4px; cursor:pointer;
  }
  .aba[aria-selected="true"]{background:var(--superficie); color:var(--tinta); box-shadow:var(--sombra)}
  .aba:focus-visible{outline:2px solid var(--selo); outline-offset:2px}

  /* ---------- estrutura ---------- */
  main{max-width:1080px; margin:0 auto; padding-inline:20px; padding-block:36px 64px}
  .vista[hidden]{display:none!important}

  .cabeca{margin-bottom:28px; max-width:60ch}
  .cabeca .eyebrow{
    font-size:11px; letter-spacing:.11em; text-transform:uppercase;
    color:var(--selo); font-weight:600; margin-bottom:8px;
  }
  .cabeca h1{font-size:clamp(26px,4vw,34px); line-height:1.15; margin-bottom:10px}
  .cabeca p{margin:0; color:var(--tinta-suave)}

  .cartao{
    background:var(--superficie); border:1px solid var(--linha);
    border-radius:var(--raio); box-shadow:var(--sombra);
  }

  /* ---------- formulário ---------- */
  .form-grade{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,300px); gap:24px; align-items:start}
  @media (max-width:760px){ .form-grade{grid-template-columns:1fr} }

  .campo{display:flex; flex-direction:column; gap:6px; margin-bottom:18px}
  .campo label{font-size:13px; font-weight:600; letter-spacing:.02em}
  .campo .ajuda{font-size:12.5px; color:var(--neutro)}
  input[type=text],input[type=email]{
    font:inherit; color:var(--tinta); background:var(--papel);
    border:1px solid var(--linha-forte); border-radius:4px; padding:9px 11px; width:100%;
  }
  input:focus-visible{outline:2px solid var(--selo); outline-offset:1px; border-color:var(--selo)}
  input.mono{font-family:var(--mono); letter-spacing:.06em}

  .btn{
    font:inherit; font-weight:600; font-size:15px; cursor:pointer;
    background:var(--selo); color:#fff; border:1px solid var(--selo);
    padding:10px 20px; border-radius:4px; color:var(--btn-texto);
  }
  .btn:hover{filter:brightness(1.07)}
  .btn:focus-visible{outline:2px solid var(--tinta); outline-offset:2px}
  .btn.fantasma{background:transparent; color:var(--tinta); border-color:var(--linha-forte)}
  .btn.pequeno{font-size:13.5px; padding:7px 14px}

  .nota{
    border-left:3px solid var(--livro); background:var(--livro-claro);
    padding:14px 16px; border-radius:0 var(--raio) var(--raio) 0; font-size:14px;
  }
  .nota b{font-weight:600}
  .nota.demo{border-left-color:var(--ambar); background:var(--ambar-claro)}
  .erro{color:var(--alerta); font-size:13.5px; font-weight:600; min-height:1.2em}

  /* ---------- ficha da serventia ---------- */
  .ficha{padding:20px 22px; margin-bottom:20px}
  .ficha h3{font-size:19px; margin-bottom:4px}
  .ficha .local{color:var(--neutro); font-size:14px; margin-bottom:16px}
  .ficha dl{display:grid; grid-template-columns:auto 1fr; gap:7px 18px; margin:0; font-size:14px}
  .ficha dt{color:var(--neutro); font-size:12px; letter-spacing:.06em; text-transform:uppercase; padding-top:2px}
  .ficha dd{margin:0}
  .pastilha.neutra{background:var(--superficie-2); color:var(--neutro)}
  .pastilha{
    display:inline-block; font-size:11.5px; font-weight:600; letter-spacing:.05em;
    text-transform:uppercase; padding:2px 9px; border-radius:99px;
    background:var(--livro-claro); color:var(--livro);
  }

  /* ---------- código ---------- */
  .codigo-caixa{max-width:420px}
  #codigo{font-family:var(--mono); font-size:26px; letter-spacing:.5em; text-align:center; padding:14px}

  /* ---------- faixa de benefícios do associado ---------- */
  .beneficios{
    padding:22px 24px; margin-bottom:26px;
    border-left:4px solid var(--selo); background:var(--selo-claro); border-color:var(--linha);
  }
  .beneficios h2{font-size:19px; margin-bottom:4px}
  .beneficios .sub{font-size:13.5px; color:var(--tinta-suave); margin:0 0 16px}
  .beneficios ul{
    list-style:none; margin:0; padding:0;
    display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:10px 22px;
  }
  .beneficios li{display:grid; grid-template-columns:auto 1fr; gap:9px; align-items:start; font-size:13.5px}
  .beneficios li::before{
    content:""; width:6px; height:6px; border-radius:50%; background:var(--selo); margin-top:7px;
  }
  .beneficios .selo-assoc{
    display:inline-block; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase;
    color:var(--selo); margin-bottom:8px;
  }

  /* ---------- catálogo ---------- */
  .catalogo-grade{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,320px); gap:28px; align-items:start}
  @media (max-width:860px){ .catalogo-grade{grid-template-columns:1fr} }

  .grupo{margin-bottom:32px}
  .grupo-titulo{
    font-size:12px; letter-spacing:.11em; text-transform:uppercase; color:var(--neutro);
    font-weight:600; padding-bottom:8px; border-bottom:1px solid var(--linha); margin-bottom:16px;
  }
  .itens{display:grid; gap:12px}
  .item{
    display:grid; grid-template-columns:1fr auto; gap:6px 20px; align-items:start;
    padding:16px 18px; background:var(--superficie); border:1px solid var(--linha);
    border-radius:var(--raio);
  }
  .item h4{margin:0; font-family:var(--serif); font-size:17px; font-weight:600}
  .item .desc{grid-column:1; font-size:13.5px; color:var(--tinta-suave); margin-top:2px}
  .item .recursos{
    grid-column:1/-1; margin:12px 0 0; padding:0; list-style:none;
    display:grid; gap:5px; font-size:13px; color:var(--tinta-suave);
  }
  .item .recursos li{display:grid; grid-template-columns:auto 1fr; gap:8px; align-items:start}
  .item .recursos li::before{
    content:""; width:5px; height:5px; border-radius:50%; background:var(--selo); margin-top:7px;
  }
  .item .ressalva{
    grid-column:1/-1; margin:12px 0 0; font-size:12.5px; color:var(--neutro);
    padding-top:10px; border-top:1px solid var(--linha);
  }
  .item .preco{grid-row:1/span 2; text-align:right; white-space:nowrap}
  .preco .de{font-size:13px; color:var(--neutro); text-decoration:line-through; display:block}
  .preco .por{font-family:var(--mono); font-size:18px; font-weight:500}
  .preco .un{font-size:12px; color:var(--neutro)}
  .selo-desc{
    display:inline-block; font-size:11px; font-weight:600; letter-spacing:.04em;
    background:var(--selo-claro); color:var(--selo); padding:1px 7px; border-radius:99px; margin-left:6px;
  }
  .item-acoes{grid-column:1/-1; display:flex; align-items:center; gap:10px; margin-top:10px}
  .qtd{display:flex; align-items:center; gap:6px; font-size:13px; color:var(--neutro)}
  .qtd input{width:74px; padding:5px 8px; font-family:var(--mono)}

  .etiquetas{grid-column:1; display:flex; gap:6px; flex-wrap:wrap; margin-top:6px}
  .etiqueta{
    font-size:10.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
    padding:2px 8px; border-radius:3px; white-space:nowrap;
  }
  .etiqueta.locacao{background:var(--livro-claro); color:var(--livro)}
  .etiqueta.venda{background:var(--ambar-claro); color:var(--ambar)}
  .etiqueta.servico{background:var(--superficie-2); color:var(--tinta-suave)}
  .etiqueta.tempo{background:transparent; color:var(--neutro); border:1px solid var(--linha)}

  td select{
    font:inherit; font-size:13px; color:var(--tinta); background:var(--papel);
    border:1px solid var(--linha-forte); border-radius:4px; padding:6px 8px; max-width:150px;
  }
  td select:focus-visible{outline:2px solid var(--selo); outline-offset:1px}

  /* ---------- carrinho ---------- */
  .carrinho{padding:20px; position:sticky; top:92px}
  .carrinho h3{font-size:18px; margin-bottom:14px}
  .carrinho ul{list-style:none; margin:0 0 16px; padding:0; display:grid; gap:10px}
  .carrinho li{display:grid; grid-template-columns:1fr auto; gap:4px 12px; font-size:14px; align-items:baseline}
  .carrinho li .nome{font-weight:500}
  .carrinho li .v{font-family:var(--mono); font-variant-numeric:tabular-nums}
  .rm{
    font:inherit; font-size:12px; color:var(--neutro); font-weight:500;
    background:none; border:0; padding:0; cursor:pointer; text-decoration:underline;
  }
  .rm:focus-visible{outline:2px solid var(--selo); outline-offset:2px; border-radius:2px}
  .carrinho li .rm{grid-column:1/-1; justify-self:start}
  .vazio{color:var(--neutro); font-size:14px; margin:0 0 16px}
  .totais{border-top:1px solid var(--linha); padding-top:14px; display:grid; gap:8px}
  .linha-total{display:flex; justify-content:space-between; align-items:baseline; font-size:14px}
  .linha-total.destaque{font-size:16px; font-weight:600}
  .linha-total .v{font-family:var(--mono); font-variant-numeric:tabular-nums}
  .economia{color:var(--livro); font-size:13px; font-weight:600}

  /* ---------- senha, login e contratação ---------- */
  input[type=password]{
    font:inherit; color:var(--tinta); background:var(--papel);
    border:1px solid var(--linha-forte); border-radius:4px; padding:9px 11px; width:100%;
    letter-spacing:.14em;
  }
  .forca{display:grid; gap:6px; margin:-6px 0 18px; font-size:12.5px; color:var(--neutro)}
  .forca .trilho{height:5px; background:var(--superficie-2); border-radius:3px; overflow:hidden}
  .forca .preenche{height:100%; border-radius:3px; width:0; transition:width .18s ease}
  .forca .preenche.fraca{background:var(--alerta)}
  .forca .preenche.media{background:var(--ambar)}
  .forca .preenche.forte{background:var(--selo)}

  .opcoes-pag{display:grid; gap:10px; margin-bottom:22px}
  .opcao{
    display:grid; grid-template-columns:auto 1fr; gap:11px; align-items:start;
    border:1px solid var(--linha); border-radius:var(--raio); padding:13px 15px; cursor:pointer;
  }
  .opcao:has(input:checked){border-color:var(--selo); background:var(--selo-claro)}
  .opcao input{accent-color:var(--selo); margin-top:3px}
  .opcao b{display:block; font-size:14px; font-weight:600}
  .opcao small{display:block; font-size:12.5px; color:var(--tinta-suave); margin-top:2px}

  .aceite{
    display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:start;
    font-size:13px; color:var(--tinta-suave); margin-bottom:16px; cursor:pointer;
  }
  .aceite input{accent-color:var(--selo); margin-top:2px}

  /* ---------- meu ambiente ---------- */
  .assinatura{padding:22px 24px; margin-bottom:22px; display:grid; gap:18px}
  .assinatura .topo-ass{display:flex; justify-content:space-between; align-items:flex-start; gap:20px; flex-wrap:wrap}
  .assinatura h2{font-size:20px; margin-bottom:4px}
  .assinatura .cond{font-size:13.5px; color:var(--tinta-suave)}
  .assinatura .valor{text-align:right; white-space:nowrap}
  .assinatura .valor b{font-family:var(--mono); font-size:26px; font-weight:500; display:block}
  .assinatura .valor span{font-size:12px; color:var(--neutro)}

  .modulos{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:18px}
  .modulo{
    background:var(--superficie); border:1px solid var(--linha); border-radius:var(--raio);
    padding:20px 22px; display:flex; flex-direction:column; gap:12px;
  }
  .modulo header{display:flex; justify-content:space-between; align-items:flex-start; gap:12px}
  .modulo h3{font-size:16px}
  .modulo p{margin:0; font-size:13.5px; color:var(--tinta-suave)}
  .modulo .acao{margin-top:auto; padding-top:6px}
  .modulo.bloqueado{border-style:dashed}
  .modulo.bloqueado h3, .modulo.bloqueado p{opacity:.72}

  .medidor{display:grid; gap:6px}
  .medidor .trilho{height:8px; background:var(--superficie-2); border-radius:4px; overflow:hidden}
  .medidor .preenche{height:100%; background:var(--selo); border-radius:4px}
  .medidor .leitura{display:flex; justify-content:space-between; font-size:12.5px; color:var(--neutro)}
  .medidor .leitura b{font-family:var(--mono); color:var(--tinta); font-weight:500}

  .sites{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px}
  .site{border:1px solid var(--linha); border-radius:var(--raio); padding:14px 16px; background:var(--papel)}
  .site .nome{font-weight:600; font-size:14px; display:flex; align-items:center; gap:7px}
  .site .det{font-size:12.5px; color:var(--neutro); margin-top:5px; line-height:1.6}
  .ponto{width:7px; height:7px; border-radius:50%; background:var(--selo); flex:none}

  /* ---------- admin ---------- */
  .tabela-envolt{overflow-x:auto; border:1px solid var(--linha); border-radius:var(--raio); background:var(--superficie)}
  table{border-collapse:collapse; width:100%; min-width:680px; font-size:14px}
  th,td{padding:11px 14px; text-align:left; border-bottom:1px solid var(--linha)}
  th{
    font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--neutro);
    font-weight:600; background:var(--superficie-2);
  }
  tbody tr:last-child td{border-bottom:0}
  td.num,th.num{text-align:right; font-variant-numeric:tabular-nums}
  td input[type=text]{width:104px; padding:6px 9px; font-family:var(--mono); text-align:right}
  td input:disabled{opacity:.4; cursor:not-allowed}
  .opcao-consulta{
    display:flex; align-items:center; justify-content:flex-end; gap:5px;
    margin-top:6px; font-size:12px; color:var(--neutro); cursor:pointer; white-space:nowrap;
  }
  .opcao-consulta input{accent-color:var(--selo); cursor:pointer}
  td .final{font-family:var(--mono); font-weight:600}
  .admin-barra{display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:18px}

  /* ---------- CRM ---------- */
  .subabas{display:flex; gap:2px; background:var(--superficie-2); padding:3px; border-radius:var(--raio); margin-bottom:26px; width:fit-content}
  .subaba{
    font:inherit; font-size:14px; font-weight:500; border:0; background:transparent; color:var(--tinta-suave);
    padding:6px 16px; border-radius:4px; cursor:pointer;
  }
  .subaba[aria-selected="true"]{background:var(--superficie); color:var(--tinta); box-shadow:var(--sombra)}
  .subaba:focus-visible{outline:2px solid var(--selo); outline-offset:2px}

  .tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; margin-bottom:26px}
  .tile{background:var(--superficie); border:1px solid var(--linha); border-radius:var(--raio); padding:16px 18px}
  .tile .rot{font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--neutro); font-weight:600}
  .tile .num{
    font-family:var(--serif); font-size:30px; font-weight:700; letter-spacing:-.02em;
    font-variant-numeric:tabular-nums; margin-top:6px; line-height:1;
  }
  .tile .sub{font-size:12.5px; color:var(--neutro); margin-top:5px}

  .graficos{display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:18px; margin-bottom:26px}
  .gcard{background:var(--superficie); border:1px solid var(--linha); border-radius:var(--raio); padding:18px 20px 20px}
  .gcard h3{font-size:15px; margin-bottom:3px}
  .gcard .legenda{font-size:12.5px; color:var(--neutro); margin:0 0 18px}

  /* barras verticais por dia */
  .dias{display:flex; align-items:flex-end; gap:4px; height:140px}
  .dia{flex:1; display:flex; flex-direction:column; justify-content:flex-end; height:100%; position:relative}
  .dia .col{
    background:var(--selo); border-radius:4px 4px 0 0; min-height:3px;
    transition:filter .12s ease;
  }
  .dia:hover .col{filter:brightness(1.15)}
  .dia .dica{
    position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%);
    background:var(--tinta); color:var(--papel); font-size:11.5px; white-space:nowrap;
    padding:4px 8px; border-radius:4px; opacity:0; pointer-events:none; transition:opacity .12s ease; z-index:5;
  }
  .dia:hover .dica, .dia:focus-within .dica{opacity:1}
  .dias-eixo{display:flex; gap:4px; margin-top:8px; font-size:10.5px; color:var(--neutro)}
  .dias-eixo span{flex:1; text-align:center; font-variant-numeric:tabular-nums}

  /* barras horizontais */
  .barras{display:grid; gap:12px}
  .barra{display:grid; grid-template-columns:1fr auto; gap:4px 12px; align-items:baseline}
  .barra .nome{font-size:13.5px}
  .barra .val{font-family:var(--mono); font-size:13px; font-variant-numeric:tabular-nums; color:var(--tinta-suave)}
  .barra .trilho{grid-column:1/-1; height:8px; background:var(--superficie-2); border-radius:4px; overflow:hidden}
  .barra .preenche{height:100%; background:var(--selo); border-radius:4px; min-width:3px}

  /* status */
  .estado{
    display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:600;
    padding:2px 9px; border-radius:99px; white-space:nowrap;
  }
  .estado::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor}
  .estado.ok{background:var(--selo-claro); color:var(--livro)}
  .estado.espera{background:var(--ambar-claro); color:var(--ambar)}
  .estado.parou{background:var(--superficie-2); color:var(--neutro)}

  /* parâmetros do cálculo */
  .params{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px;
    background:var(--superficie); border:1px solid var(--linha); border-radius:var(--raio);
    padding:18px 20px; margin-bottom:24px;
  }
  .param{display:flex; flex-direction:column; gap:6px}
  .param label{font-size:13px; font-weight:600}
  .pcampo{display:flex; align-items:center; gap:7px}
  .pcampo input{
    width:82px; padding:7px 10px; font-family:var(--mono); text-align:right;
    font:inherit; font-family:var(--mono); color:var(--tinta); background:var(--papel);
    border:1px solid var(--linha-forte); border-radius:4px;
  }
  .pcampo span{font-size:14px; color:var(--neutro)}
  .phint{font-size:12px; color:var(--neutro)}

  /* barras de dedução */
  .barra.saida .preenche{background:var(--linha-forte)}
  .barra.liquido .nome{font-weight:600}

  /* CDI */
  .cdi-controles{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px;
    padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid var(--linha);
  }
  .horizontes{display:flex; gap:4px; background:var(--superficie-2); padding:3px; border-radius:4px; width:fit-content}
  .horizontes button{
    font:inherit; font-size:13px; font-weight:500; border:0; background:transparent; color:var(--tinta-suave);
    padding:5px 11px; border-radius:3px; cursor:pointer; font-variant-numeric:tabular-nums;
  }
  .horizontes button.ativo{background:var(--superficie); color:var(--tinta); box-shadow:var(--sombra)}
  .horizontes button:focus-visible{outline:2px solid var(--selo); outline-offset:2px}

  .legenda-cores{display:flex; gap:18px; font-size:12.5px; color:var(--tinta-suave); margin-bottom:14px}
  .legenda-cores span{display:flex; align-items:center; gap:6px}
  .chip{width:10px; height:10px; border-radius:2px; display:inline-block}
  .chip.aportado{background:var(--linha-forte)}
  .chip.rendimento{background:var(--selo)}

  .dia .col.base{background:var(--linha-forte); border-radius:0 0 0 0}
  .dia .pilha{display:flex; flex-direction:column; justify-content:flex-end; height:100%; gap:2px}

  .passos{margin:0; padding:0 0 0 20px; display:grid; gap:10px; font-size:13.5px; color:var(--tinta-suave)}
  .passos li::marker{color:var(--selo); font-weight:600}
  .passos b{color:var(--tinta); font-weight:600}
  .passos .conta{font-family:var(--mono); font-size:12.5px; color:var(--neutro); display:block; margin-top:2px}

  tfoot td{font-weight:600; border-top:2px solid var(--linha-forte); background:var(--superficie-2)}