/* ============================================================
   ESC PRO — Design do aplicativo (v2)
   Identidade: verde-mata profundo + dourado
   Tipos: Sora (títulos) · Inter (texto) · IBM Plex Mono (valores)
   ============================================================ */
:root{
  --mata:#0A2621;
  --mata-2:#103A32;
  --mata-3:#17493F;
  --primaria:#12866F;
  --primaria-clara:#E7F3EF;
  --primaria-escura:#0C6B58;
  --ouro:#E8A93D;
  --tinta:#132420;
  --tinta-2:#5D6F6A;
  --tinta-3:#93A5A0;
  --fundo:#F4F7F6;
  --cartao:#FFFFFF;
  --linha:#E4EBE9;
  --linha-forte:#D3DEDB;
  --perigo:#C94F4F;
  --perigo-claro:#FBECEC;
  --aviso:#B7791F;
  --aviso-claro:#FDF4E4;
  --raio:14px;
  --raio-p:10px;
  --sombra:0 1px 2px rgba(10,38,33,.04), 0 4px 14px rgba(10,38,33,.05);
  --sombra-alta:0 12px 32px rgba(10,38,33,.14), 0 2px 8px rgba(10,38,33,.08);
  --transicao:.16s cubic-bezier(.4,0,.2,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:'Inter',system-ui,-apple-system,sans-serif;font-size:14.5px;color:var(--tinta);
     background:var(--fundo);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Sora',sans-serif;letter-spacing:-.015em;margin:0}
a{color:var(--primaria);text-decoration:none}
a:hover{text-decoration:underline}
.mono,.valor{font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums}
::selection{background:rgba(18,134,111,.18)}

/* ---------- estrutura ---------- */
.layout{display:flex;min-height:100vh}
.sidebar{width:244px;flex-shrink:0;background:linear-gradient(180deg,var(--mata) 0%,var(--mata-2) 100%);
         color:#D6E7E2;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:40}
.conteudo{flex:1;min-width:0;display:flex;flex-direction:column}
.principal{flex:1;padding:26px 30px 40px;max-width:1320px;width:100%}
.rodape-app{padding:16px 30px;color:var(--tinta-3);font-size:12px;border-top:1px solid var(--linha)}
.cortina{display:none;position:fixed;inset:0;background:rgba(10,38,33,.45);z-index:39;backdrop-filter:blur(2px)}
.cortina.visivel{display:block}

/* ---------- marca / sidebar ---------- */
.marca{padding:22px 22px 14px;font-family:'Sora',sans-serif;font-weight:700;font-size:21px;letter-spacing:.02em}
.marca-esc{color:#fff}
.marca-pro{color:var(--ouro);margin-left:3px}
.tenant-cartao{margin:0 14px 12px;padding:12px 14px;background:rgba(255,255,255,.055);border-radius:var(--raio-p);
               border:1px solid rgba(255,255,255,.07)}
.tenant-nome{font-size:13px;color:#fff;font-weight:600;line-height:1.35;
             white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge-plano{display:inline-block;margin-top:7px;background:rgba(232,169,61,.16);color:var(--ouro);
             font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:99px;text-transform:uppercase;letter-spacing:.06em}

.menu{display:flex;flex-direction:column;padding:6px 12px 14px;gap:1px;flex:1;overflow-y:auto}
.menu::-webkit-scrollbar{width:6px}
.menu::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:99px}
.menu-grupo{font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:#6F8F88;
            font-weight:700;padding:14px 12px 6px}
.menu-item{display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:var(--raio-p);
           color:#BDD3CE;font-size:13.8px;font-weight:500;position:relative;transition:var(--transicao)}
.menu-item:hover{background:rgba(255,255,255,.07);color:#fff;text-decoration:none}
.menu-item.ativo{background:var(--primaria);color:#fff;box-shadow:0 2px 10px rgba(18,134,111,.35)}
.menu-item.ativo::before{content:'';position:absolute;left:-12px;top:50%;transform:translateY(-50%);
                         width:3px;height:20px;background:var(--ouro);border-radius:0 3px 3px 0}
.menu-icone{width:18px;text-align:center;opacity:.9;font-size:14px}

.sidebar-rodape{padding:14px 22px;border-top:1px solid rgba(255,255,255,.08);
                display:flex;align-items:center;justify-content:space-between}
.versao{font-size:11px;color:#6F8F88;font-family:'IBM Plex Mono',monospace}
.sair{color:#8FB3AB;font-size:12.5px}
.sair:hover{color:#fff;text-decoration:none}

/* ---------- topo ---------- */
.topo{display:flex;align-items:center;gap:14px;padding:0 30px;height:64px;background:rgba(255,255,255,.88);
      backdrop-filter:blur(10px);border-bottom:1px solid var(--linha);position:sticky;top:0;z-index:30}
.titulo-pagina{font-size:18px;flex:1;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.btn-menu{display:none;background:none;border:0;font-size:20px;cursor:pointer;color:var(--tinta);padding:4px}
.topo-direita{display:flex;align-items:center;gap:8px}

.relogio{text-align:right;line-height:1.2;padding-right:10px;margin-right:2px;border-right:1px solid var(--linha)}
.relogio-hora{display:block;font-family:'IBM Plex Mono',monospace;font-size:14.5px;font-weight:600;color:var(--tinta)}
.relogio-data{font-size:11px;color:var(--tinta-3);text-transform:capitalize}

.menu-flutuante{position:relative}
.botao-icone{position:relative;background:none;border:1px solid transparent;width:38px;height:38px;
             border-radius:var(--raio-p);cursor:pointer;color:var(--tinta-2);font-size:17px;transition:var(--transicao)}
.botao-icone:hover{background:var(--fundo);border-color:var(--linha);color:var(--tinta)}
.sino{display:block;line-height:1}
.contador{position:absolute;top:3px;right:2px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;
          background:var(--ouro);color:#2A1E05;font-size:10.5px;font-weight:700;line-height:17px;
          font-family:'Inter',sans-serif}
.contador-urgente{background:var(--perigo);color:#fff}

.botao-usuario{display:flex;align-items:center;gap:9px;background:none;border:1px solid transparent;
               padding:5px 9px 5px 5px;border-radius:99px;cursor:pointer;font-family:'Inter',sans-serif;
               transition:var(--transicao)}
.botao-usuario:hover{background:var(--fundo);border-color:var(--linha)}
.avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--primaria),var(--mata-3));
        color:#fff;display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;flex-shrink:0}
.usuario-info{text-align:left;line-height:1.25}
.usuario-nome{display:block;font-weight:600;font-size:13px;color:var(--tinta)}
.usuario-perfil{font-size:11px;color:var(--tinta-3)}
.seta{color:var(--tinta-3);font-size:10px}

/* ---------- painéis suspensos ---------- */
.painel{position:absolute;top:calc(100% + 10px);right:0;min-width:290px;background:var(--cartao);
        border:1px solid var(--linha);border-radius:var(--raio);box-shadow:var(--sombra-alta);
        z-index:50;overflow:hidden;display:none;animation:surge .14s ease-out}
.painel.aberto{display:block}
@keyframes surge{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.painel-avisos{width:330px;max-height:70vh;overflow-y:auto}
.painel-topo{padding:13px 16px;border-bottom:1px solid var(--linha);background:#FAFCFB;
             display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.painel-topo strong{font-size:13.5px}
.painel-vazio{padding:26px 16px;text-align:center;color:var(--tinta-3);font-size:13.5px}
.aviso{display:flex;gap:11px;padding:12px 16px;border-bottom:1px solid var(--linha);color:inherit;
       transition:var(--transicao)}
.aviso:last-child{border-bottom:0}
.aviso:hover{background:#FAFCFB;text-decoration:none}
.aviso-icone{width:28px;height:28px;border-radius:8px;background:var(--primaria-clara);color:var(--primaria-escura);
             display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}
.aviso-urgente .aviso-icone{background:var(--perigo-claro);color:var(--perigo)}
.aviso strong{display:block;font-size:13.2px;font-weight:600;line-height:1.35}
.aviso-texto{display:block;font-size:12px;color:var(--tinta-3);margin-top:2px}

.item-painel{display:flex;align-items:center;gap:11px;padding:11px 16px;font-size:13.5px;color:var(--tinta);
             transition:var(--transicao)}
.item-painel:hover{background:var(--fundo);text-decoration:none}
.item-painel span:first-child{width:18px;text-align:center;color:var(--tinta-3)}
.item-sair{color:var(--perigo)}
.item-sair span:first-child{color:var(--perigo)}
.painel-separador{height:1px;background:var(--linha);margin:4px 0}

/* ---------- cartões e grades ---------- */
.grade{display:grid;gap:16px}
.grade-4{grid-template-columns:repeat(4,1fr)}
.grade-3{grid-template-columns:repeat(3,1fr)}
.grade-2{grid-template-columns:repeat(2,1fr)}
.cartao{background:var(--cartao);border:1px solid var(--linha);border-radius:var(--raio);
        box-shadow:var(--sombra);padding:20px 22px}
.cartao h2{font-size:15px;margin:0 0 15px;font-weight:600}
a.cartao{color:inherit;transition:var(--transicao)}
a.cartao:hover{border-color:var(--linha-forte);box-shadow:var(--sombra-alta);transform:translateY(-1px);text-decoration:none}

.kpi .kpi-rotulo{font-size:11.5px;color:var(--tinta-3);text-transform:uppercase;letter-spacing:.07em;font-weight:700}
.kpi .kpi-valor{font-family:'IBM Plex Mono',monospace;font-size:25px;font-weight:600;margin-top:7px;
                font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1.15}
.kpi .kpi-extra{font-size:12px;color:var(--tinta-3);margin-top:5px}
.kpi-perigo .kpi-valor{color:var(--perigo)}
.kpi-ok .kpi-valor{color:var(--primaria)}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 17px;border-radius:var(--raio-p);
     border:1px solid transparent;font-family:'Inter',sans-serif;font-size:13.8px;font-weight:600;
     cursor:pointer;line-height:1.35;transition:var(--transicao)}
.btn:hover{text-decoration:none}
.btn-primario{background:var(--primaria);color:#fff;box-shadow:0 1px 3px rgba(18,134,111,.3)}
.btn-primario:hover{background:var(--primaria-escura);box-shadow:0 3px 10px rgba(18,134,111,.32)}
.btn-contorno{background:#fff;border-color:var(--linha-forte);color:var(--tinta)}
.btn-contorno:hover{border-color:var(--primaria);color:var(--primaria);background:var(--primaria-clara)}
.btn-perigo{background:#fff;border-color:#EFD5D5;color:var(--perigo)}
.btn-perigo:hover{background:var(--perigo);color:#fff;border-color:var(--perigo)}
.btn-mini{padding:5px 11px;font-size:12.5px;border-radius:8px}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* ---------- tabelas ---------- */
.tabela-envolve{overflow-x:auto;background:var(--cartao);border:1px solid var(--linha);
                border-radius:var(--raio);box-shadow:var(--sombra)}
table.tabela{width:100%;border-collapse:collapse;font-size:13.8px}
.tabela th{background:#FAFCFB;text-align:left;padding:11px 16px;font-size:11px;text-transform:uppercase;
           letter-spacing:.07em;color:var(--tinta-3);font-weight:700;border-bottom:1px solid var(--linha);white-space:nowrap}
.tabela td{padding:12px 16px;border-bottom:1px solid var(--linha);vertical-align:middle}
.tabela tr:last-child td{border-bottom:0}
.tabela tr:hover td{background:#FAFCFB}
.tabela .num{text-align:right;font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- selos ---------- */
.selo{display:inline-block;padding:3px 10px;border-radius:99px;font-size:11.5px;font-weight:600;
      white-space:nowrap;letter-spacing:.01em}
.selo-ativo,.selo-paga,.selo-quitado,.selo-aprovada{background:var(--primaria-clara);color:var(--primaria-escura)}
.selo-atrasado,.selo-atrasada,.selo-negativado,.selo-vencida{background:var(--perigo-claro);color:var(--perigo)}
.selo-aberta,.selo-pendente,.selo-trial{background:var(--aviso-claro);color:var(--aviso)}
.selo-renegociado,.selo-renegociada,.selo-parcial{background:#E9EDF8;color:#3B5AA6}
.selo-cancelado,.selo-cancelada,.selo-inativo,.selo-rascunho{background:#EEF2F1;color:var(--tinta-2)}

/* ---------- formulários ---------- */
.form-grade{display:grid;grid-template-columns:repeat(12,1fr);gap:15px 16px}
.campo{display:flex;flex-direction:column;gap:6px}
.c-12{grid-column:span 12}.c-11{grid-column:span 11}.c-10{grid-column:span 10}.c-9{grid-column:span 9}
.c-8{grid-column:span 8}.c-7{grid-column:span 7}.c-6{grid-column:span 6}.c-5{grid-column:span 5}
.c-4{grid-column:span 4}.c-3{grid-column:span 3}.c-2{grid-column:span 2}.c-1{grid-column:span 1}
.campo label{font-size:12.5px;font-weight:600;color:var(--tinta)}
.campo .dica{font-size:11.5px;color:var(--tinta-3);line-height:1.45}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=month],
input[type=number],input[type=tel],input[type=file],select,textarea{
  padding:9px 12px;border:1px solid var(--linha-forte);border-radius:var(--raio-p);font:inherit;
  font-size:13.8px;background:#fff;color:var(--tinta);width:100%;transition:var(--transicao)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primaria);
  box-shadow:0 0 0 3px rgba(18,134,111,.14)}
input:disabled,select:disabled{background:var(--fundo);color:var(--tinta-3)}
.acoes-form{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
code{background:var(--fundo);padding:2px 6px;border-radius:5px;font-family:'IBM Plex Mono',monospace;font-size:12px}

/* ---------- flash / avisos ---------- */
.flash{padding:12px 16px;border-radius:var(--raio-p);margin-bottom:18px;font-size:13.8px;font-weight:500;
       display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.flash-ok{background:var(--primaria-clara);color:var(--primaria-escura);border:1px solid #C6E4DC}
.flash-erro{background:var(--perigo-claro);color:var(--perigo);border:1px solid #EFD0D0}
.flash-aviso{background:var(--aviso-claro);color:var(--aviso);border:1px solid #F2DFB8}
.aviso-compliance{background:var(--aviso-claro);border:1px solid #F2DFB8;border-radius:var(--raio-p);
                  padding:12px 16px;font-size:13px;color:#7A5A16;margin-bottom:16px;line-height:1.55}

/* ---------- utilitários ---------- */
.barra-acoes{display:flex;align-items:center;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.barra-acoes .espaco{flex:1}
.busca{display:flex;gap:8px;flex-wrap:wrap}
.busca input,.busca select{width:auto;min-width:190px}
.mt{margin-top:20px}
.texto-2{color:var(--tinta-2)}
.centro{text-align:center}
.vazio{padding:44px 20px;text-align:center;color:var(--tinta-3)}
.vazio strong{display:block;font-size:15.5px;color:var(--tinta);margin-bottom:6px;font-family:'Sora',sans-serif}

/* ---------- login ---------- */
.pagina-login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;
  background:radial-gradient(circle at 20% 10%,var(--mata-3) 0%,transparent 55%),
             linear-gradient(160deg,var(--mata) 0%,var(--mata-2) 60%,#0E332C 100%)}
.caixa-login{background:#fff;border-radius:18px;box-shadow:0 24px 64px rgba(0,0,0,.3);
             padding:38px 36px;width:100%;max-width:404px}
.caixa-login .marca{padding:0 0 4px;font-size:25px}
.caixa-login .marca-esc{color:var(--mata)}
.caixa-login .sub-login{color:var(--tinta-3);font-size:13.5px;margin:2px 0 24px}
.caixa-login .campo{margin-bottom:15px}
.caixa-login .btn{width:100%;padding:12px}

/* ---------- impressão ---------- */
@media print{
  .sidebar,.topo,.rodape-app,.barra-acoes,.btn,.flash,.cortina{display:none!important}
  .principal{padding:0;max-width:none}
  body{background:#fff}
  .cartao,.tabela-envolve{box-shadow:none;border:1px solid #ddd;break-inside:avoid}
}

/* ---------- responsivo ---------- */
@media (max-width:1180px){.grade-4{grid-template-columns:repeat(2,1fr)}.grade-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:860px){
  .sidebar{position:fixed;left:-260px;transition:left .22s cubic-bezier(.4,0,.2,1);box-shadow:var(--sombra-alta)}
  .sidebar.aberta{left:0}
  .btn-menu{display:block}
  .principal{padding:18px 16px 32px}
  .topo{padding:0 16px}
  .relogio{display:none}
  .usuario-info{display:none}
  .grade-2,.grade-3,.grade-4{grid-template-columns:1fr}
  .c-1,.c-2,.c-3,.c-4,.c-5,.c-6,.c-7,.c-8,.c-9,.c-10,.c-11{grid-column:span 12}
  .busca input,.busca select{min-width:0;width:100%}
  .busca{width:100%}
  .painel{position:fixed;top:64px;left:12px;right:12px;width:auto;min-width:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ============================================================
   Simulação e novo contrato — telas de decisão
   ============================================================ */
.painel-sim{display:grid;grid-template-columns:1.05fr .95fr;gap:20px;align-items:start}
@media (max-width:980px){.painel-sim{grid-template-columns:1fr}}

/* controle segmentado (método de cálculo) */
.segmentado{display:flex;background:var(--fundo);border:1px solid var(--linha);border-radius:var(--raio-p);padding:3px;gap:3px}
.segmentado label{flex:1;position:relative;cursor:pointer}
.segmentado input{position:absolute;opacity:0;pointer-events:none}
.segmentado span{display:block;text-align:center;padding:8px 10px;border-radius:8px;font-size:13px;
                 font-weight:600;color:var(--tinta-2);transition:var(--transicao)}
.segmentado input:checked + span{background:#fff;color:var(--primaria-escura);box-shadow:var(--sombra)}
.segmentado label:hover span{color:var(--tinta)}

/* campo com controle deslizante */
.campo-faixa .topo-faixa{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.campo-faixa .saida{font-family:'IBM Plex Mono',monospace;font-size:16px;font-weight:600;color:var(--primaria-escura)}
input[type=range]{width:100%;height:5px;border-radius:99px;background:var(--linha);appearance:none;
                  padding:0;border:0;margin:10px 0 2px;cursor:pointer}
input[type=range]::-webkit-slider-thumb{appearance:none;width:20px;height:20px;border-radius:50%;
  background:var(--primaria);border:3px solid #fff;box-shadow:0 1px 5px rgba(10,38,33,.28);cursor:pointer}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--primaria);
  border:3px solid #fff;box-shadow:0 1px 5px rgba(10,38,33,.28);cursor:pointer;border-color:#fff}
.faixa-limites{display:flex;justify-content:space-between;font-size:11px;color:var(--tinta-3)}

/* cartão de resultado */
.resultado-sim{background:linear-gradient(155deg,var(--mata) 0%,var(--mata-2) 65%,var(--mata-3) 100%);
               border-radius:var(--raio);padding:26px;color:#fff;position:sticky;top:84px;
               box-shadow:0 14px 36px rgba(10,38,33,.22)}
.resultado-sim .rotulo{font-size:11.5px;text-transform:uppercase;letter-spacing:.09em;color:#8FB3AB;font-weight:700}
.resultado-sim .parcela-grande{font-family:'IBM Plex Mono',monospace;font-size:40px;font-weight:600;
                               line-height:1.05;margin:8px 0 2px;letter-spacing:-.03em}
.resultado-sim .parcela-obs{font-size:13px;color:#B7D0CA}
.resultado-linhas{margin-top:14px;border-top:1px solid rgba(255,255,255,.12);padding-top:13px;display:grid;gap:11px}
.resultado-linha{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13.5px;color:#C9DCD7}
.resultado-linha strong{font-family:'IBM Plex Mono',monospace;color:#fff;font-weight:600;font-size:14.5px}
.resultado-linha .destaque-ouro{color:var(--ouro)}

/* barra de composição principal x juros */
.composicao{margin-top:20px}
.composicao-barra{display:flex;height:10px;border-radius:99px;overflow:hidden;background:rgba(255,255,255,.12)}
.composicao-principal{background:#3FBF9C}
.composicao-juros{background:var(--ouro)}
.composicao-legenda{display:flex;gap:16px;margin-top:9px;font-size:11.5px;color:#B7D0CA;flex-wrap:wrap}
.composicao-legenda i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:0}

/* tabela de parcelas da simulação */
.tabela-parcelas{max-height:340px;overflow-y:auto}
.tabela-parcelas .tabela th{position:sticky;top:0;z-index:1}
.tabela-parcelas::-webkit-scrollbar{width:8px}
.tabela-parcelas::-webkit-scrollbar-thumb{background:var(--linha-forte);border-radius:99px}

/* resumo do cliente no formulário de contrato */
.cartao-cliente{display:flex;gap:14px;align-items:center;background:var(--fundo);border:1px solid var(--linha);
                border-radius:var(--raio-p);padding:14px 16px;margin-bottom:4px}
.cartao-cliente .inicial{width:42px;height:42px;border-radius:12px;background:var(--primaria-clara);
  color:var(--primaria-escura);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px;flex-shrink:0}
.cartao-cliente .dados{flex:1;min-width:0;line-height:1.4}
.cartao-cliente .dados strong{display:block;font-size:14px}
.cartao-cliente .dados span{font-size:12.5px;color:var(--tinta-2)}

/* etapas do formulário */
.etapa{display:flex;align-items:center;gap:10px;margin:26px 0 14px}
.etapa:first-of-type{margin-top:4px}
.etapa-num{width:26px;height:26px;border-radius:50%;background:var(--mata);color:#fff;flex-shrink:0;
           display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;
           font-family:'IBM Plex Mono',monospace}
.etapa h2{margin:0;font-size:15.5px}
.etapa .etapa-dica{font-size:12.5px;color:var(--tinta-3);margin-left:auto;text-align:right}

/* ============================================================
   Login em duas colunas + PWA
   ============================================================ */
.tela-login{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr}
.login-marca{background:
    radial-gradient(circle at 18% 12%,rgba(23,73,63,.9) 0%,transparent 55%),
    linear-gradient(155deg,var(--mata) 0%,var(--mata-2) 62%,#0E332C 100%);
  color:#fff;padding:48px 52px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.login-marca::after{content:'';position:absolute;right:-160px;bottom:-160px;width:440px;height:440px;
  border-radius:50%;background:radial-gradient(circle,rgba(232,169,61,.13),transparent 66%)}
.login-marca > *{position:relative;z-index:1}
.login-topo{font-family:'Sora',sans-serif;font-weight:700;font-size:23px;letter-spacing:.02em}
.login-topo b{color:var(--ouro)}
.login-corpo{flex:1;display:flex;flex-direction:column;justify-content:center;max-width:460px;padding:36px 0}
.login-corpo h2{font-size:33px;line-height:1.2;margin:0 0 14px;color:#fff}
.login-corpo h2 em{font-style:normal;color:var(--ouro)}
.login-corpo p.sub{color:#B7D0CA;font-size:16px;margin:0 0 30px}
.login-lista{display:grid;gap:15px;margin:0;padding:0;list-style:none}
.login-lista li{display:flex;gap:13px;align-items:flex-start;font-size:14.5px;color:#D6E7E2;line-height:1.5}
.login-lista .marcador{width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.09);
  color:var(--ouro);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:13px}
.login-lista strong{color:#fff;display:block;font-weight:600}
.login-rodape{font-size:12.5px;color:#7E9F98;border-top:1px solid rgba(255,255,255,.1);padding-top:18px}

.login-form{display:flex;align-items:center;justify-content:center;padding:40px 32px;background:var(--cartao)}
.login-form-caixa{width:100%;max-width:392px}
.login-form-caixa h1{font-size:26px;margin:0 0 6px}
.login-form-caixa .oi{color:var(--tinta-3);font-size:14px;margin:0 0 26px}
.login-form-caixa .campo{margin-bottom:16px}
.login-form-caixa .btn{width:100%;padding:12px}
.login-links{display:flex;justify-content:space-between;gap:12px;margin-top:16px;font-size:13px;flex-wrap:wrap}

.instalar-app{display:none;align-items:center;gap:12px;margin-top:24px;padding:14px 16px;
  border:1px dashed var(--linha-forte);border-radius:var(--raio);background:var(--fundo)}
.instalar-app.visivel{display:flex}
.instalar-app .icone-app{width:38px;height:38px;border-radius:10px;flex-shrink:0}
.instalar-app .txt{flex:1;line-height:1.4}
.instalar-app .txt strong{display:block;font-size:13.5px}
.instalar-app .txt span{font-size:12px;color:var(--tinta-3)}
.instalar-app .btn{width:auto;padding:8px 14px;font-size:13px}

.dica-ios{display:none;margin-top:16px;font-size:12.5px;color:var(--tinta-3);background:var(--fundo);
  border-radius:var(--raio-p);padding:12px 14px;line-height:1.55}
.dica-ios.visivel{display:block}

@media (max-width:900px){
  .tela-login{grid-template-columns:1fr}
  .login-marca{padding:30px 26px;min-height:auto}
  .login-corpo{padding:20px 0}
  .login-corpo h2{font-size:26px}
  .login-lista li:nth-child(n+3){display:none}
  .login-rodape{display:none}
  .login-form{padding:30px 22px}
}

/* faixa de notificações no app */
.faixa-push{display:none;align-items:center;gap:12px;background:var(--primaria-clara);
  border:1px solid #C6E4DC;border-radius:var(--raio-p);padding:12px 16px;margin-bottom:18px;font-size:13.5px}
.faixa-push.visivel{display:flex}
.faixa-push .btn{padding:7px 14px;font-size:13px}

/* ============================================================
   Painel master (MagoWeb) — login em duas colunas
   ============================================================ */
.tela-master{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr}
.master-marca{background:
    radial-gradient(circle at 22% 15%,rgba(232,169,61,.13) 0%,transparent 55%),
    linear-gradient(150deg,#07201C 0%,var(--mata) 55%,var(--mata-2) 100%);
  color:#fff;padding:48px 52px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.master-marca::after{content:'';position:absolute;left:-120px;bottom:-180px;width:460px;height:460px;
  border-radius:50%;background:radial-gradient(circle,rgba(18,134,111,.22),transparent 68%)}
.master-marca > *{position:relative;z-index:1}
.master-topo{display:flex;align-items:center;gap:12px}
.master-topo .logo{font-family:'Sora',sans-serif;font-weight:700;font-size:23px;letter-spacing:.02em}
.master-topo .logo b{color:var(--ouro)}
.master-etiqueta{background:rgba(232,169,61,.14);border:1px solid rgba(232,169,61,.42);color:var(--ouro);
  font-size:10.5px;font-weight:700;letter-spacing:.1em;padding:4px 10px;border-radius:99px;text-transform:uppercase}
.master-corpo{flex:1;display:flex;flex-direction:column;justify-content:center;max-width:440px;padding:36px 0}
.master-corpo h2{font-size:31px;line-height:1.2;margin:0 0 14px;color:#fff}
.master-corpo h2 em{font-style:normal;color:var(--ouro)}
.master-corpo p.sub{color:#B7D0CA;font-size:15.5px;margin:0 0 30px}
.master-recursos{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.master-recursos li{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:#D6E7E2;line-height:1.5}
.master-recursos .mk{width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.08);
  color:var(--ouro);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:12.5px}
.master-recursos strong{display:block;color:#fff;font-weight:600}
.master-rodape{font-size:12px;color:#7E9F98;border-top:1px solid rgba(255,255,255,.1);padding-top:18px;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

.master-form{display:flex;align-items:center;justify-content:center;padding:40px 34px;background:var(--cartao)}
.master-form-caixa{width:100%;max-width:376px}
.master-cadeado{width:46px;height:46px;border-radius:13px;background:var(--mata);color:var(--ouro);
  display:flex;align-items:center;justify-content:center;font-size:21px;margin-bottom:18px}
.master-form-caixa h1{font-size:25px;margin:0 0 6px}
.master-form-caixa .oi{color:var(--tinta-3);font-size:14px;margin:0 0 26px}
.master-form-caixa .campo{margin-bottom:16px}
.master-form-caixa .btn{width:100%;padding:12px}
.master-nota{margin-top:20px;font-size:11.5px;color:var(--tinta-3);background:var(--fundo);
  border-radius:var(--raio-p);padding:12px 14px;line-height:1.55}

@media (max-width:900px){
  .tela-master{grid-template-columns:1fr}
  .master-marca{padding:28px 24px}
  .master-corpo{padding:18px 0}
  .master-corpo h2{font-size:25px}
  .master-recursos li:nth-child(n+4){display:none}
  .master-rodape{display:none}
  .master-form{padding:30px 22px}
}

/* faixa de acesso de suporte (master dentro do painel do assinante) */
.faixa-suporte{display:flex;align-items:center;gap:12px;background:#2A1E05;color:#F5E4C3;
  border:1px solid #6B5417;border-radius:var(--raio-p);padding:11px 16px;margin-bottom:18px;font-size:13.5px}
.faixa-suporte .btn{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25);color:#fff}
.faixa-suporte .btn:hover{background:rgba(255,255,255,.2);color:#fff}

/* ---------- escolha do tipo de empréstimo e do cálculo ---------- */
.tipos-emprestimo{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:700px){.tipos-emprestimo{grid-template-columns:1fr}}
.tipo-op{display:block;position:relative;cursor:pointer;height:100%}
.tipo-op input{position:absolute;opacity:0;pointer-events:none}
.tipo-op .caixa{display:flex;flex-direction:column;gap:5px;height:100%;
  border:1.5px solid var(--linha);border-radius:12px;padding:16px;transition:var(--transicao)}
.tipo-op:hover .caixa{border-color:#B9CDC8}
.tipo-op input:checked + .caixa{border-color:var(--primaria);background:#F1F7F5;
  box-shadow:0 0 0 3px rgba(18,134,111,.12)}
.tipo-op .ico{font-size:20px;color:var(--primaria);line-height:1}
.tipo-op .nome{font-weight:700;font-size:14.5px}
.tipo-op .obs{font-size:12.5px;color:var(--tinta-2);line-height:1.45}

.modos-calculo{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width:860px){.modos-calculo{grid-template-columns:1fr}}
.modo-op{display:block;position:relative;cursor:pointer;height:100%}
.modo-op input{position:absolute;opacity:0;pointer-events:none}
.modo-op .caixa{display:flex;flex-direction:column;gap:4px;height:100%;
  border:1.5px solid var(--linha);border-radius:11px;padding:12px 13px;transition:var(--transicao)}
.modo-op:hover .caixa{border-color:#B9CDC8}
.modo-op input:checked + .caixa{border-color:var(--primaria);background:#F1F7F5;
  box-shadow:0 0 0 3px rgba(18,134,111,.12)}
.modo-op strong{font-size:13.5px;line-height:1.3}
.modo-op span{font-size:11.5px;color:var(--tinta-2);line-height:1.45}

/* ---------- seções com ícone (tela de empréstimo) ---------- */
.etapa-ico{width:32px;height:32px;border-radius:9px;background:var(--primaria-clara);color:var(--primaria-escura);
  display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}

/* ---------- quatro destaques do resultado ---------- */
.destaques{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:22px}
.destaque{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);
  border-radius:11px;padding:11px 13px;display:flex;flex-direction:column;gap:3px}
.destaque .d-rotulo{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:#8FB3AB;font-weight:700}
.destaque .d-valor{font-family:'IBM Plex Mono',monospace;font-size:15.5px;font-weight:600;color:#fff;
  letter-spacing:-.01em;line-height:1.2}
.destaque-ouro{background:rgba(232,169,61,.13);border-color:rgba(232,169,61,.3)}
.destaque-ouro .d-valor{color:var(--ouro)}
@media (max-width:520px){.destaques{grid-template-columns:1fr}}

/* ---------- tabela do plano de pagamento ---------- */
.tabela-plano thead th{background:var(--mata);color:#D6E7E2;border-bottom:0;
  font-size:10.5px;letter-spacing:.08em}
.tabela-plano tbody tr:nth-child(even) td{background:#FAFCFB}
.tabela-plano tbody tr:hover td{background:var(--primaria-clara)}
.tabela-plano td:first-child{font-family:'IBM Plex Mono',monospace;color:var(--tinta-2);width:44px}

/* ---------- dias da semana sem cobrança ---------- */
.dias-semana{display:flex;gap:7px;flex-wrap:wrap}
.dia-op{position:relative;cursor:pointer}
.dia-op input{position:absolute;opacity:0;pointer-events:none}
.dia-op span{display:block;min-width:52px;text-align:center;padding:9px 10px;border-radius:10px;
  border:1.5px solid var(--linha);font-size:13px;font-weight:600;color:var(--tinta-2);transition:var(--transicao)}
.dia-op:hover span{border-color:#B9CDC8}
.dia-op input:checked + span{background:var(--perigo-claro);border-color:#E5B4B4;color:var(--perigo)}

/* ---------- opções de recebimento ---------- */
.opcoes-receb{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:6px}
@media (max-width:860px){.opcoes-receb{grid-template-columns:1fr}}
.opcao{display:block;position:relative;cursor:pointer;height:100%}
.opcao input{position:absolute;opacity:0;pointer-events:none}
.opcao .caixa{display:flex;flex-direction:column;gap:4px;height:100%;
  border:1.5px solid var(--linha);border-radius:12px;padding:13px 14px;transition:var(--transicao)}
.opcao:hover .caixa{border-color:#B9CDC8}
.opcao input:checked + .caixa{border-color:var(--primaria);background:#F1F7F5;
  box-shadow:0 0 0 3px rgba(18,134,111,.12)}
.opcao .op-ico{font-size:17px;color:var(--primaria);line-height:1}
.opcao .op-nome{font-weight:700;font-size:13.5px}
.opcao .op-obs{font-size:11.5px;color:var(--tinta-2);line-height:1.45}
.opcao-off{opacity:.5;cursor:not-allowed}
.opcao-off .caixa{background:var(--fundo)}
.selo-perda{background:#EDE7F6;color:#5B3FA8}
.db-atual{display:inline-block;margin-left:8px;font-size:11.5px;color:var(--tinta-3);
  background:var(--fundo);border:1px solid var(--linha);border-radius:6px;padding:1px 7px}
.db-atual.banco-divergente{background:var(--perigo-claro);border-color:#EFD0D0;color:var(--perigo);font-weight:600}