:root[data-theme="dark"]{
    /* Cutuca — tema escuro: fundo Tinta, destaque Laranja Cutuca */
    --bg:#16111e; --panel:#1f1829; --panel-2:#281f34;
    --panel-border:#342a43; --texto:#f4eff6; --texto-muted:#a79fb6;
    --sinal:#ff6a33; --sinal-dim:rgba(255,106,51,0.16);
    --receita:#2fc48b; --receita-dim:rgba(47,196,139,0.14);
    --alerta:#f25c6e; --alerta-dim:rgba(242,92,110,0.16);
    --overlay:rgba(10,6,14,0.65);
  }
  :root[data-theme="light"]{
    /* Cutuca — tema claro: fundo creme, texto Tinta */
    --bg:#fff8f1; --panel:#ffffff; --panel-2:#f6f0f4;
    --panel-border:#ece2e6; --texto:#231a33; --texto-muted:#6b6478;
    --sinal:#d9480f; --sinal-dim:rgba(255,90,31,0.12);
    --receita:#178a5e; --receita-dim:rgba(31,169,113,0.10);
    --alerta:#d23a4f; --alerta-dim:rgba(210,58,79,0.10);
    --overlay:rgba(35,26,51,0.45);
  }
  :root{
    --font-display:'Fredoka',sans-serif;
    --font-body:'Figtree',sans-serif;
    --font-mono:'IBM Plex Mono',monospace;
    --radius:10px; --sidebar-w:230px;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;height:100%;overflow-x:hidden;}
  body{
    background:var(--bg);color:var(--texto);font-family:var(--font-body);
    line-height:1.4;-webkit-font-smoothing:antialiased;
    transition:background 0.2s,color 0.2s;
  }
  button,input{font-family:inherit;color:inherit;}
  a{color:inherit;}

  /* ============ LOGIN ============ */
  #loginScreen{
    position:fixed;inset:0;background:var(--bg);display:flex;
    align-items:center;justify-content:center;z-index:200;padding:20px;
  }
  .login-card{
    width:100%;max-width:340px;background:var(--panel);border:1px solid var(--panel-border);
    border-radius:14px;padding:32px 28px;text-align:center;
  }
  .login-logo{display:block;width:150px;height:auto;margin:0 auto 10px;}
  .logo-escuro{display:none !important;}
  :root[data-theme="dark"] .logo-claro{display:none !important;}
  :root[data-theme="dark"] .logo-escuro{display:block !important;}
  .login-card h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .login-card p{color:var(--texto-muted);font-size:0.82rem;margin:0 0 22px;}
  .field{text-align:left;margin-bottom:14px;}
  .field label{display:block;font-size:0.72rem;color:var(--texto-muted);text-transform:uppercase;letter-spacing:0.04em;margin-bottom:5px;}
  .field-hint{margin:6px 0 0;font-size:0.74rem;color:var(--texto-muted);}
  .field input{
    width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--panel-border);
    background:var(--panel-2);color:var(--texto);font-size:0.9rem;
  }
  .field input:focus-visible{outline:2px solid var(--sinal);outline-offset:1px;}
  .field textarea{
    width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--panel-border);
    background:var(--panel-2);color:var(--texto);font-size:0.9rem;font-family:inherit;
    resize:vertical;min-height:110px;line-height:1.5;
  }
  .field textarea:focus-visible{outline:2px solid var(--sinal);outline-offset:1px;}
  .field-toggle{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;}
  .field-toggle input{width:auto;accent-color:var(--sinal);}
  .field-vars{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
  .field-vars code{
    background:var(--panel-2);border:1px solid var(--panel-border);color:var(--sinal);
    padding:3px 7px;border-radius:6px;font-size:0.74rem;cursor:pointer;
  }
  .field-vars code:hover{background:var(--panel-border);}

  .template-card{
    background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);
    padding:14px 18px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;
    gap:12px;flex-wrap:wrap;cursor:pointer;
  }
  .template-card:hover{background:var(--panel-2);}
  .template-card.inativo{opacity:0.55;}
  .template-card-info{display:flex;flex-direction:column;gap:3px;min-width:0;}
  .template-card-titulo{font-weight:600;}
  .template-card-tag{font-weight:400;font-size:0.76rem;color:var(--texto-muted);margin-left:8px;}
  .template-card-preview{font-size:0.78rem;color:var(--texto-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:520px;}
  .template-card-status{font-size:0.72rem;font-weight:600;text-transform:uppercase;letter-spacing:0.03em;padding:3px 9px;border-radius:20px;flex:none;}
  .template-card-status.ativo{background:var(--receita-dim);color:var(--receita);}
  .template-card-status.inativo{background:var(--panel-2);color:var(--texto-muted);}
  .btn-primary{
    width:100%;padding:11px;border:none;border-radius:8px;background:var(--sinal);
    color:#1a1422;font-weight:600;font-size:0.9rem;cursor:pointer;margin-top:4px;
    transition:filter 0.15s;
  }
  .btn-primary:hover{filter:brightness(1.08);}
  .btn-primary:focus-visible{outline:2px solid var(--sinal);outline-offset:2px;}
  .btn-link{
    display:block;width:100%;background:none;border:none;color:var(--texto-muted);
    font-size:0.8rem;padding:10px 0 0;cursor:pointer;text-decoration:underline;
  }
  .btn-link:hover{color:var(--texto);}
  .btn-link:focus-visible{outline:2px solid var(--sinal);outline-offset:2px;}
  .login-erro{color:var(--alerta);font-size:0.78rem;margin:-4px 0 10px;text-align:left;}
  .login-msg{color:var(--receita);font-size:0.78rem;margin:-4px 0 10px;text-align:left;}
  .login-hint{margin-top:16px;font-size:0.7rem;color:var(--texto-muted);}

  /* ============ APP SHELL ============ */
  #app{display:none;min-height:100vh;}
  #app.ativo{display:flex;}

  .sidebar{
    width:var(--sidebar-w);flex:none;background:var(--panel);border-right:1px solid var(--panel-border);
    display:flex;flex-direction:column;padding:18px 12px;position:sticky;top:0;height:100vh;
  }
  .sidebar-brand{display:flex;align-items:center;gap:10px;padding:4px 8px 20px;}
  .sidebar-brand img{height:30px;width:auto;display:block;}
  .topo-logo{height:24px;width:auto;display:block;}
  .nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;flex:1;min-height:0;overflow-y:auto;}
  .btn-sair-topo{margin-left:auto;}
  .nav-item{
    display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;
    font-size:0.85rem;cursor:pointer;color:var(--texto-muted);background:none;border:none;
    width:100%;text-align:left;
  }
  .nav-item svg{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:2;}
  .nav-item:hover{background:var(--panel-2);color:var(--texto);}
  .nav-item.active{background:var(--sinal-dim);color:var(--sinal);font-weight:600;}
  .nav-item:focus-visible{outline:2px solid var(--sinal);outline-offset:1px;}
  .sidebar-foot{border-top:1px solid var(--panel-border);padding-top:12px;display:flex;flex-direction:column;gap:2px;}

  .main{flex:1;min-width:0;padding:22px 26px 60px;}
  .mobile-topbar{display:none;}

  .topbar{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:14px;margin-bottom:24px;}
  .topbar h1{font-family:var(--font-display);font-size:1.35rem;font-weight:600;margin:0;letter-spacing:-0.01em;}
  .topbar .sub{margin:2px 0 0;color:var(--texto-muted);font-size:0.83rem;}
  .status{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .badge-demo{
    font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.03em;background:var(--sinal-dim);
    color:var(--sinal);border:1px solid rgba(255,90,31,0.35);padding:4px 9px;border-radius:20px;text-transform:uppercase;
  }
  .updated{font-size:0.76rem;color:var(--texto-muted);font-family:var(--font-mono);}
  .btn-icon{
    background:var(--panel);border:1px solid var(--panel-border);color:var(--texto);
    width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;
  }
  .btn-icon:hover{background:var(--panel-2);}
  .btn-icon:focus-visible{outline:2px solid var(--sinal);outline-offset:2px;}
  .btn-icon svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}
  .btn-icon.is-loading svg{animation:spin 0.8s linear infinite;}

  /* ============ views ============ */
  .view{display:none;}
  .view.active{display:block;}

  .grid-section{margin-bottom:26px;}
  .section-title{font-family:var(--font-display);font-size:0.76rem;font-weight:600;text-transform:uppercase;letter-spacing:0.09em;color:var(--texto-muted);margin:0 0 12px;}

  .urgencia{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:22px;}
  .urg-item{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:16px 16px 14px;position:relative;overflow:hidden;}
  .urg-item::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;}
  .urg-hoje::before{background:var(--alerta);}
  .urg-amanha::before{background:linear-gradient(var(--alerta),var(--sinal));}
  .urg-3d::before{background:var(--sinal);}
  .urg-7d::before{background:rgba(255,90,31,0.45);}
  .urg-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--texto-muted);margin-bottom:8px;}
  .urg-item.tem-urgencia .urg-dot{background:var(--alerta);}
  .urg-hoje.tem-urgencia .urg-dot,.urg-amanha.tem-urgencia .urg-dot{animation:pulse 1.6s ease-in-out infinite;}
  .urg-num{display:block;font-family:var(--font-mono);font-size:1.8rem;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.1;}
  .urg-label{font-size:0.74rem;color:var(--texto-muted);text-transform:uppercase;letter-spacing:0.04em;}

  .cards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
  .cards-grid-3{grid-template-columns:repeat(3,1fr);}
  .cards-grid-4{grid-template-columns:repeat(4,1fr);}
  .cards-grid-5{grid-template-columns:repeat(5,1fr);}
  .cards-grid-2{grid-template-columns:repeat(2,1fr);}
  .card-clicavel{cursor:pointer;text-align:left;font-family:inherit;color:inherit;width:100%;transition:border-color 0.15s,background 0.15s;}
  .card-clicavel:hover{border-color:var(--alerta);background:var(--alerta-dim);}
  .card-clicavel:focus-visible{outline:2px solid var(--alerta);outline-offset:2px;}
  .card{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:14px 14px 12px;display:flex;flex-direction:column;gap:6px;min-width:0;}
  .card-num{overflow-wrap:break-word;}
  .card-num{font-family:var(--font-mono);font-size:1.35rem;font-weight:600;font-variant-numeric:tabular-nums;}
  .card-label{font-size:0.71rem;color:var(--texto-muted);text-transform:uppercase;letter-spacing:0.03em;}
  .card-sub{font-size:0.7rem;color:var(--texto-muted);margin-top:-2px;}
  .delta{font-family:var(--font-mono);font-size:0.72rem;font-weight:600;}
  .delta.up{color:var(--receita);}
  .delta.down{color:var(--alerta);}
  .delta.flat{color:var(--texto-muted);}
  .mini-list li.credito-baixo{color:var(--alerta);font-weight:600;}
  .mini-list li.credito-baixo .mini-num{color:var(--alerta);}

  .meta-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:16px;max-width:480px;}
  .meta-topo{display:flex;justify-content:space-between;align-items:baseline;font-size:0.85rem;margin-bottom:10px;}
  .meta-pct{font-family:var(--font-mono);font-weight:600;color:var(--sinal);}
  .meta-barra-fundo{background:var(--panel-2);border-radius:20px;height:10px;overflow:hidden;}
  .meta-barra{background:linear-gradient(90deg,var(--sinal),var(--receita));height:100%;width:0%;transition:width 0.4s;}

  .servidor-financeiro-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:14px;}
  .servidor-financeiro-card .nome{font-family:var(--font-display);font-weight:600;margin-bottom:8px;}
  .servidor-financeiro-card .linha{display:flex;justify-content:space-between;font-size:0.8rem;padding:3px 0;color:var(--texto-muted);}
  .servidor-financeiro-card .linha strong{font-family:var(--font-mono);color:var(--texto);}
  .servidor-financeiro-card .linha.lucro strong{color:var(--receita);}

  .btn-exportar{
    background:var(--panel);border:1px solid var(--panel-border);color:var(--texto);
    padding:8px 14px;border-radius:8px;font-size:0.8rem;font-weight:600;cursor:pointer;
    display:flex;align-items:center;gap:6px;
  }
  .btn-exportar:hover{background:var(--panel-2);}
  .btn-exportar svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;}

  .print-only{display:none;}
  @media print{
    html,body{height:auto !important; overflow:visible !important;}
    #app,#sidebarBackdrop,.modal-overlay{display:none !important;}
    .print-only{display:block !important;}
    body{background:#fff;color:#000;margin:0;}
    .print-header{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid #000;padding-bottom:8px;margin-bottom:16px;font-family:sans-serif;}
    .print-header strong{font-size:1.3rem;}
    .print-section{margin-bottom:22px;page-break-inside:avoid;}
    .print-section h2{font-size:1rem;border-bottom:1px solid #ccc;padding-bottom:4px;margin-bottom:8px;font-family:sans-serif;}
    .print-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:6px;}
    .print-kpi{border:1px solid #ccc;border-radius:6px;padding:8px;font-family:sans-serif;}
    .print-kpi .num{font-size:1.1rem;font-weight:700;}
    .print-kpi .label{font-size:0.68rem;color:#555;text-transform:uppercase;}
    .print-table{width:100%;border-collapse:collapse;font-family:sans-serif;font-size:0.8rem;margin-bottom:6px;}
    .print-table th,.print-table td{border:1px solid #ccc;padding:5px 8px;text-align:left;}
    .print-conta img{max-width:100%;height:auto;border:1px solid #ccc;border-radius:6px;margin-bottom:14px;}
  }
  .card-alerta{border-color:rgba(232,93,81,0.4);}
  .card-alerta .card-num{color:var(--alerta);}
  .card-receita .card-num{color:var(--receita);}
  .card-list{grid-column:span 1;}
  .mini-list{list-style:none;margin:2px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;}
  .mini-list li{display:flex;justify-content:space-between;font-size:0.79rem;}
  .mini-list .mini-num{font-family:var(--font-mono);color:var(--texto);font-weight:600;}

  .grafico-section .chart-box{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:16px;height:270px;}
  .chart-box-sm{height:230px;}
  .dual-chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  @media (max-width: 720px){.dual-chart-grid{grid-template-columns:1fr;}}

  .alerta-banner{background:var(--alerta-dim);border:1px solid rgba(232,93,81,0.4);color:var(--texto);padding:12px 14px;border-radius:var(--radius);font-size:0.84rem;margin-bottom:12px;}
  .alerta-banner strong{color:var(--alerta);}

  /* próximos vencimentos */
  .venc-table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);overflow:hidden;}
  .table-scroll{overflow-x:auto;border-radius:var(--radius);}
  .venc-scroll-y{max-height:420px;overflow-y:auto;}
  .venc-table th{text-align:left;font-size:0.7rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--texto-muted);padding:10px 14px;border-bottom:1px solid var(--panel-border);background:var(--panel);position:sticky;top:0;}
  .venc-table td{padding:11px 14px;font-size:0.86rem;border-bottom:1px solid var(--panel-border);cursor:pointer;}
  .venc-table tbody tr:last-child td{border-bottom:none;}
  .venc-table tbody tr{transition:background 0.12s;}
  .venc-table tbody tr.venc-ok:nth-child(even){background:var(--panel-2);}
  .venc-table tbody tr:hover{background:var(--panel-border);}
  .venc-table .venc-dias{font-family:var(--font-mono);text-align:right;}
  .venc-urgente td{color:var(--alerta);}
  .venc-urgente td:first-child{border-left:3px solid var(--alerta);}
  .venc-urgente{background:rgba(232,93,81,0.06);}
  .venc-atencao td{color:var(--sinal);}
  .venc-atencao td:first-child{border-left:3px solid var(--sinal);}
  .venc-atencao{background:rgba(255,90,31,0.06);}
  .venc-ok td:first-child{border-left:3px solid transparent;}
  .venc-table td.venc-vazio{padding:24px;text-align:center;color:var(--texto-muted);font-size:0.85rem;cursor:default;}

  /* placeholder "em construção" */
  .placeholder-card{background:var(--panel);border:1px dashed var(--panel-border);border-radius:var(--radius);padding:26px 24px;}
  .placeholder-card h3{font-family:var(--font-display);margin:0 0 6px;font-size:1.05rem;}
  .placeholder-card p{color:var(--texto-muted);font-size:0.85rem;margin:0 0 14px;}
  .placeholder-card ul{margin:0;padding-left:18px;color:var(--texto-muted);font-size:0.84rem;display:flex;flex-direction:column;gap:5px;}
  .tag-em-breve{display:inline-block;font-family:var(--font-mono);font-size:0.66rem;text-transform:uppercase;letter-spacing:0.04em;background:var(--sinal-dim);color:var(--sinal);padding:3px 8px;border-radius:20px;margin-bottom:12px;}

  /* configurações: seletor de tema */
  .field select{
    width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--panel-border);
    background:var(--panel-2);color:var(--texto);font-size:0.9rem;
  }
  .field select:focus-visible,.field input:focus-visible{outline:2px solid var(--sinal);outline-offset:1px;}

  .form-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:22px;max-width:440px;}
  .field-row{display:flex;gap:12px;}
  .field-row .field{flex:1;}
  .field-row .field-sm{flex:0 0 110px;}
  .logo-upload{display:flex;align-items:center;gap:12px;}
  .logo-preview{
    width:52px;height:52px;border-radius:10px;background:var(--panel-2);border:1px solid var(--panel-border);
    display:flex;align-items:center;justify-content:center;font-size:0.62rem;color:var(--texto-muted);
    overflow:hidden;flex:none;text-align:center;
  }
  .logo-preview img{width:100%;height:100%;object-fit:cover;}
  .btn-inline{width:auto;padding:9px 16px;margin:6px 8px 0 0;display:inline-block;}
  .btn-secondary{background:var(--panel-2);border:1px solid var(--panel-border);color:var(--texto);border-radius:8px;font-size:0.82rem;font-weight:600;cursor:pointer;}
  .btn-secondary:hover{background:var(--panel-border);}
  .btn-secondary:focus-visible{outline:2px solid var(--sinal);outline-offset:2px;}
  .filtros-mov{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px;}
  .filtros-mov select,.filtros-mov input{
    padding:8px 10px;border-radius:8px;border:1px solid var(--panel-border);
    background:var(--panel);color:var(--texto);font-size:0.82rem;
  }
  .mov-entrada{color:var(--receita);}
  .mov-saida{color:var(--alerta);}
  .mov-totais{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;font-size:0.85rem;font-family:var(--font-mono);}
  .mov-totais strong{font-weight:600;}
  .btn-baixar{background:var(--receita-dim);border:1px solid rgba(52,195,166,0.4);color:var(--receita);
    padding:5px 10px;border-radius:6px;font-size:0.75rem;font-weight:600;cursor:pointer;}
  .btn-baixar:hover{filter:brightness(1.1);}
  .btn-excluir{background:var(--alerta-dim);border:1px solid rgba(232,93,81,0.4);color:var(--alerta);
    padding:5px 10px;border-radius:6px;font-size:0.75rem;font-weight:600;cursor:pointer;}
  .btn-excluir:hover{filter:brightness(1.1);}
  .relatorio-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:18px;display:flex;flex-direction:column;gap:10px;}
  .relatorio-card h3{font-family:var(--font-display);font-size:0.95rem;margin:0;}
  .relatorio-card p{font-size:0.8rem;color:var(--texto-muted);margin:0;flex:1;}

  .servidor-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:18px;margin-bottom:16px;}
  .provedor-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);padding:14px 18px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;cursor:pointer;}
  .provedor-card:hover{background:var(--panel-2);}
  .provedor-card-nome{font-weight:600;}
  .provedor-card-taxa{font-family:var(--font-mono);color:var(--texto-muted);font-size:0.82rem;}
  .provedor-card.inativo{opacity:0.55;}
  .servidor-card-topo{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:12px;}
  .servidor-card-nome{font-family:var(--font-display);font-size:1.1rem;font-weight:600;}
  .servidor-card-info{font-size:0.78rem;color:var(--texto-muted);margin-top:2px;}
  .servidor-card-info a{color:var(--sinal);}
  .servidor-card-acoes{display:flex;gap:6px;flex-wrap:wrap;}
  .servidor-card-acoes button{
    background:var(--panel-2);border:1px solid var(--panel-border);color:var(--texto);
    padding:6px 10px;border-radius:7px;font-size:0.74rem;font-weight:600;cursor:pointer;
  }
  .servidor-card-acoes button:hover{background:var(--panel-border);}
  .servidor-card-acoes button.perigo{background:var(--alerta-dim);border-color:rgba(232,93,81,0.4);color:var(--alerta);}
  .subsecao{margin-top:14px;}
  .subsecao-topo{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
  .subsecao-titulo{font-size:0.72rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--texto-muted);font-weight:600;}
  .mini-btn{background:none;border:1px solid var(--panel-border);color:var(--sinal);padding:3px 9px;border-radius:6px;font-size:0.72rem;font-weight:600;cursor:pointer;}
  .mini-btn:hover{background:var(--sinal-dim);}
  .plano-row{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-radius:7px;background:var(--panel-2);margin-bottom:6px;cursor:pointer;font-size:0.82rem;}
  .plano-row:hover{background:var(--panel-border);}
  .plano-row .plano-valores{font-family:var(--font-mono);color:var(--texto-muted);font-size:0.76rem;}
  .pacote-chip{display:inline-flex;align-items:center;gap:6px;background:var(--panel-2);border:1px solid var(--panel-border);border-radius:20px;padding:4px 10px;font-size:0.76rem;margin:0 6px 6px 0;cursor:pointer;}
  .pacote-chip:hover{background:var(--panel-border);}
  .toast{
    position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);
    background:var(--panel);border:1px solid var(--panel-border);color:var(--texto);
    padding:12px 18px;border-radius:10px;font-size:0.85rem;box-shadow:0 8px 24px rgba(0,0,0,0.35);
    opacity:0;pointer-events:none;transition:opacity 0.2s,transform 0.2s;z-index:300;max-width:90vw;text-align:center;
  }
  .toast.mostrar{opacity:1;transform:translateX(-50%) translateY(0);}
  .theme-options{display:flex;gap:10px;flex-wrap:wrap;}
  .theme-opt,.toggle-opt{display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:8px;border:1px solid var(--panel-border);background:var(--panel);cursor:pointer;font-size:0.85rem;}
  .theme-opt svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;}
  .theme-opt.active,.toggle-opt.active{border-color:var(--sinal);color:var(--sinal);background:var(--sinal-dim);}
  .theme-opt:focus-visible,.toggle-opt:focus-visible{outline:2px solid var(--sinal);outline-offset:2px;}

  /* ============ modal ============ */
  .modal-overlay{position:fixed;inset:0;background:var(--overlay);display:none;align-items:center;justify-content:center;z-index:150;padding:20px;will-change:transform;transform:translateZ(0);overflow-y:auto;}
  .modal-overlay.aberto{display:flex;}
  .modal-box{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--panel-border);border-radius:14px;padding:24px;}
  .modal-box h3{font-family:var(--font-display);margin:0 0 4px;font-size:1.1rem;}
  .modal-box .modal-sub{color:var(--texto-muted);font-size:0.8rem;margin:0 0 18px;}
  .modal-field{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--panel-border);font-size:0.85rem;}
  .modal-field span:first-child{color:var(--texto-muted);}
  .modal-field span:last-child{font-family:var(--font-mono);}
  .modal-actions{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap;}
  .modal-actions button{
    flex:1;min-width:100px;padding:9px 10px;border-radius:8px;border:1px solid var(--panel-border);
    background:var(--panel-2);cursor:pointer;font-size:0.82rem;font-weight:600;
  }
  .modal-actions button.principal{background:var(--sinal);border-color:var(--sinal);color:#1a1422;}
  /* O X acompanha a rolagem em janelas compridas (celular) */
  .modal-close{position:sticky;top:6px;float:right;margin:-12px -12px 0 8px;z-index:5;width:36px;height:36px;
    display:flex;align-items:center;justify-content:center;background:var(--panel);border:1px solid var(--panel-border);
    border-radius:50%;color:var(--texto-muted);cursor:pointer;padding:0;box-shadow:0 2px 8px rgba(0,0,0,0.12);}
  .modal-close:hover{color:var(--texto);}
  .modal-box{position:relative;}
  /* janela mais alta que a tela: começa no topo (antes o topo ficava cortado e não dava pra rolar até ele) */
  .modal-overlay{align-items:flex-start;}
  .modal-overlay > .modal-box{margin:auto 0;}
  .field-row > .field{min-width:0;}
  .field input, .field select{min-width:0;max-width:100%;box-sizing:border-box;}
  @media (max-width: 640px){ .field-row{flex-wrap:wrap;} .field-row > .field{flex:1 1 40%;} }
  .modal-note{margin-top:14px;font-size:0.72rem;color:var(--texto-muted);}

  .foot{margin-top:10px;color:var(--texto-muted);font-size:0.71rem;}
  .foot code{font-family:var(--font-mono);background:var(--panel);padding:2px 6px;border-radius:4px;}

  @keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
  @keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(232,93,81,0.5);}50%{box-shadow:0 0 0 5px rgba(232,93,81,0);}}
  @media (prefers-reduced-motion: reduce){.btn-icon.is-loading svg{animation:none;}.urg-item.tem-urgencia .urg-dot{animation:none;}}

  @media (max-width: 900px){
    .cards-grid-5{grid-template-columns:repeat(3,1fr);}
    .sidebar{position:fixed;left:0;top:0;z-index:120;transform:translateX(-100%);transition:transform 0.2s;box-shadow:0 0 30px rgba(0,0,0,0.3);}
    .sidebar.aberta{transform:translateX(0);}
    .main{padding:16px 16px 50px;}
    .mobile-topbar{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
    #sidebarBackdrop{position:fixed;inset:0;background:var(--overlay);z-index:110;display:none;}
    #sidebarBackdrop.aberta{display:block;}
  }
  @media (max-width: 640px){
    .urgencia{grid-template-columns:repeat(2,1fr);}
    .cards-grid,.cards-grid-3,.cards-grid-4,.cards-grid-5{grid-template-columns:repeat(2,1fr);}
    .venc-table:not(.rv-table) th:nth-child(2),.venc-table:not(.rv-table) td:nth-child(2){display:none;}
  }

  /* ---------------- WHATSAPP ---------------- */
  .wpp-status-card{
    background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);
    padding:20px 22px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:18px;
  }
  .wpp-status-dot{
    width:14px;height:14px;border-radius:50%;flex:none;background:var(--texto-muted);
    box-shadow:0 0 0 4px var(--panel-2);
  }
  .wpp-status-dot.ok{background:var(--receita);box-shadow:0 0 0 4px var(--receita-dim);}
  .wpp-status-dot.pendente{background:#e0a72e;box-shadow:0 0 0 4px rgba(224,167,46,0.16);animation:pulse-wpp 1.6s infinite;}
  .wpp-status-dot.off{background:var(--alerta);box-shadow:0 0 0 4px var(--alerta-dim);}
  @keyframes pulse-wpp{0%,100%{opacity:1;}50%{opacity:0.4;}}
  .wpp-status-info{flex:1;min-width:180px;}
  .wpp-status-titulo{font-family:var(--font-display);font-size:1.15rem;font-weight:600;line-height:1.3;}
  .wpp-status-sub{font-size:0.8rem;color:var(--texto-muted);margin-top:2px;}
  .wpp-status-sub strong{color:var(--texto);font-family:var(--font-mono);font-weight:600;}
  .wpp-acoes{display:flex;gap:8px;flex-wrap:wrap;}
  .wpp-acoes[hidden]{display:none;}
  .wpp-btn{
    display:inline-flex;align-items:center;gap:7px;background:var(--panel-2);border:1px solid var(--panel-border);
    color:var(--texto);border-radius:9px;font-size:0.82rem;font-weight:600;cursor:pointer;padding:9px 14px;
    transition:background 0.15s,border-color 0.15s;
  }
  .wpp-btn:hover{background:var(--panel-border);}
  .wpp-btn:disabled{opacity:0.55;cursor:default;}
  .wpp-btn.perigo{background:var(--alerta-dim);border-color:rgba(232,93,81,0.4);color:var(--alerta);}
  .wpp-btn.perigo:hover{filter:brightness(1.08);}
  .wpp-btn .ic{font-size:1rem;line-height:1;}

  .wpp-qr-card{
    background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);
    padding:26px;text-align:center;margin-bottom:18px;
  }
  .wpp-qr-card .modal-note{max-width:440px;margin:0 auto 18px;}
  .wpp-qr-wrap{
    width:272px;height:272px;margin:0 auto 18px;border-radius:12px;background:#fff;
    display:flex;align-items:center;justify-content:center;overflow:hidden;
    box-shadow:0 2px 14px rgba(0,0,0,0.12);
  }
  .wpp-qr-wrap img{width:100%;height:100%;object-fit:contain;display:block;image-rendering:pixelated;}
  .wpp-qr-wrap img[hidden]{display:none;}
  .wpp-qr-vazio{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px;color:#5d6574;font-size:0.85rem;text-align:center;}
  .wpp-qr-vazio[hidden]{display:none;}
  .wpp-qr-vazio strong{color:#1f1829;font-size:0.95rem;}
  .wpp-qr-spin{width:34px;height:34px;border-radius:50%;border:3px solid #e1e4ea;border-top-color:#ff5a1f;animation:spin 0.9s linear infinite;}
  .wpp-qr-spin[hidden]{display:none;}
  .wpp-qr-dica{font-size:0.78rem;color:var(--texto-muted);margin:-8px 0 14px;}
  .wpp-qr-dica[hidden]{display:none;}
  .wpp-qr-wrap.vazio{color:var(--texto-muted);font-size:0.78rem;padding:12px;}

  .wpp-form-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
  .wpp-form-row input[type="text"]{
    flex:1;min-width:200px;padding:10px 12px;border-radius:8px;border:1px solid var(--panel-border);
    background:var(--panel-2);color:var(--texto);font-size:0.86rem;
  }

  /* ---------- STATUS PILLS (Serviços & Renovações, Disparos, Logs) ---------- */
  .status-pill{
    display:inline-block;padding:3px 10px;border-radius:999px;font-size:0.74rem;font-weight:600;
    white-space:nowrap;
  }
  .status-pago, .status-disparo-sucesso{ background:var(--receita-dim,rgba(70,180,120,0.15)); color:var(--receita,#3fb27f); }
  .status-pendente, .status-disparo-na_fila{ background:rgba(230,180,60,0.15); color:#c99a2e; }
  .status-cancelado, .status-disparo-falha{ background:var(--alerta-dim,rgba(232,93,81,0.15)); color:var(--alerta,#e85d51); }
  .status-disparo-reenviando{ background:rgba(90,140,230,0.15); color:#5a8ce6; }
  .status-log-erro{ background:var(--alerta-dim,rgba(232,93,81,0.15)); color:var(--alerta,#e85d51); }
  .status-log-aviso{ background:rgba(230,180,60,0.15); color:#c99a2e; }
  .status-log-info{ background:rgba(120,130,150,0.15); color:var(--texto-muted); }

  .disparo-erro{ max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:0.78rem; color:var(--texto-muted); }
  .log-row-clicavel{ cursor:pointer; }
  .log-row-clicavel:hover{ background:var(--panel-2); }
  .wpp-form-row input[type="text"]:focus-visible{outline:2px solid var(--sinal);outline-offset:1px;}
  #erroCarregamento[hidden]{ display:none !important; }
  #erroCarregamento:not([hidden]){ display:flex; }

/* =====================================================================
   REVENDEDOR (fase 2)
   ===================================================================== */
body.modo-revenda [data-so-admin]{display:none !important;}
body:not(.modo-revenda) [data-so-revenda]{display:none !important;}
body.rv-bloqueado .nav-list li:not([data-rv-bloqueado-ok]){display:none !important;}

.login-revenda-links{margin-top:14px;padding-top:12px;border-top:1px solid var(--panel-border);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;justify-content:center;font-size:0.82rem;color:var(--texto-muted);}
.login-revenda-links .btn-link{margin:0;padding:2px 0;}
.rvf-explica{font-size:0.84rem;color:var(--texto-muted);margin:0 0 14px;line-height:1.45;}

.rv-aviso{margin:0 0 14px;padding:10px 14px;border-radius:10px;font-size:0.88rem;line-height:1.4;
  background:var(--sinal-dim);border:1px solid var(--sinal);color:var(--texto);display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.rv-aviso.rv-aviso-alerta{background:rgba(232,93,81,0.12);border-color:var(--alerta);}
.rv-aviso button{margin-left:auto;}
.rv-aviso[hidden]{display:none;}

.pix-qr{display:flex;justify-content:center;}
.pix-qr img{width:220px;height:220px;max-width:100%;background:#fff;padding:8px;border-radius:10px;image-rendering:pixelated;}
.rvc-pacotes{display:flex;flex-direction:column;gap:8px;margin:6px 0 10px;}
.rvc-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--panel-border);
  border-radius:10px;background:var(--panel-2);cursor:pointer;font:inherit;color:inherit;text-align:left;width:100%;}
.rvc-item:hover{border-color:var(--sinal);}
.rvc-item strong{font-size:0.95rem;}
.rvc-item span{color:var(--texto-muted);font-size:0.8rem;}
.rv-badge{display:inline-block;font-size:0.7rem;padding:1px 6px;border-radius:999px;border:1px solid var(--panel-border);color:var(--texto-muted);margin-left:4px;vertical-align:middle;}

/* ---------- bolinhas de novidade (Bugs, Tutoriais, menu do celular) ---------- */
.nav-badge{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--alerta,#e5484d);color:#fff;font-size:0.68rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;line-height:1;}
.nav-badge[hidden]{display:none;}
.nav-badge-novo{background:var(--sinal,#ff5a1f);color:#1a1422;text-transform:uppercase;letter-spacing:0.03em;}
#btnMenu{position:relative;}
.menu-dot{position:absolute;top:5px;right:5px;width:9px;height:9px;border-radius:50%;background:var(--alerta,#e5484d);box-shadow:0 0 0 2px var(--panel,#1f1829);}
.menu-dot[hidden]{display:none;}
.bug-nova{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:10px;background:var(--alerta,#e5484d);color:#fff;font-size:0.68rem;font-weight:700;vertical-align:middle;}
tr.bug-nao-lido td{font-weight:600;}
/* ---------- tutoriais ---------- */
.tut-frame-wrap{border:1px solid var(--panel-border);border-radius:12px;overflow:hidden;background:var(--panel);}
#tutFrame{display:block;width:100%;height:calc(100vh - 170px);min-height:520px;border:0;background:transparent;}
@media (max-width: 820px){ #tutFrame{height:calc(100vh - 150px);} }
/* ---------- perfil / troca de número ---------- */
.rv-lista-aviso{margin:0 0 14px;padding-left:18px;font-size:0.85rem;color:var(--texto-muted);display:flex;flex-direction:column;gap:4px;}
.rvf-alerta{font-size:0.8rem;color:var(--alerta);margin:0 0 10px;}
.campo-codigo{letter-spacing:0.25em;text-transform:uppercase;font-family:var(--font-mono);}
.email-ok{color:var(--receita);font-weight:600;}

/* ---------- rodapé legal (marca e direitos) ---------- */
.rodape-legal{margin:36px 0 0;padding:16px 0 0;border-top:1px solid var(--panel-border);font-size:0.72rem;line-height:1.5;color:var(--texto-muted);text-align:center;}
.rodape-legal strong{color:var(--texto);font-weight:600;}
.login-card .rodape-legal{margin-top:18px;padding-top:12px;font-size:0.66rem;}

/* ---------- planos (Minha assinatura) ---------- */
.rva-plano-atual{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px;padding:12px 16px;border:1px solid var(--panel-border);border-radius:12px;background:var(--panel);}
.rva-plano-atual > div{display:flex;flex-direction:column;gap:2px;}
.rva-plano-rotulo{font-size:0.74rem;text-transform:uppercase;letter-spacing:.06em;color:var(--texto-muted);}
.rva-plano-atual strong{font-family:'Fredoka',var(--font-display,sans-serif);font-weight:600;font-size:1.15rem;}
.rva-plano-extra{font-size:0.82rem;color:var(--texto-muted);}
.rva-ia-selo{font-size:0.8rem;font-weight:600;padding:5px 10px;border-radius:999px;background:rgba(47,196,139,.14);color:var(--receita);}
.rva-ia-selo[hidden]{display:none;}
#rvaPendente{margin:12px 0 0;}
.rva-periodos{display:inline-flex;gap:4px;padding:4px;border-radius:12px;background:var(--panel-2);border:1px solid var(--panel-border);margin:0 0 14px;flex-wrap:wrap;}
.rva-periodos button{border:0;background:transparent;color:var(--texto-muted);font:inherit;font-size:0.86rem;font-weight:600;padding:7px 14px;border-radius:9px;cursor:pointer;}
.rva-periodos button.ativo{background:var(--sinal);color:#231a33;}
.rva-planos{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;}
.rva-card{display:flex;flex-direction:column;gap:8px;padding:16px;border:1px solid var(--panel-border);border-radius:14px;background:var(--panel);position:relative;}
.rva-card.atual{border-color:var(--sinal);box-shadow:0 0 0 1px var(--sinal) inset;}
.rva-card h3{margin:0;font-family:'Fredoka',var(--font-display,sans-serif);font-weight:600;font-size:1.1rem;}
.rva-card .rva-preco{font-family:'IBM Plex Mono',monospace;font-size:1.3rem;font-weight:600;}
.rva-card .rva-preco small{font-family:inherit;font-size:0.78rem;color:var(--texto-muted);font-weight:400;}
.rva-card ul{margin:0;padding:0 0 0 18px;font-size:0.84rem;color:var(--texto-muted);line-height:1.5;}
.rva-card .rva-selo{position:absolute;top:12px;right:12px;font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:3px 8px;border-radius:999px;background:var(--sinal-dim);color:var(--sinal);}
.rva-card label.rva-ia{display:flex;gap:8px;align-items:flex-start;font-size:0.84rem;padding:8px 10px;border-radius:10px;background:var(--panel-2);cursor:pointer;}
.rva-card label.rva-ia input{margin-top:3px;}
.rva-card button{margin-top:auto;}
.rva-card .rva-indisp{font-size:0.8rem;color:var(--texto-muted);margin-top:auto;}
.rvt-linhas{display:flex;flex-direction:column;gap:6px;margin:12px 0;padding:12px 14px;border-radius:12px;background:var(--panel-2);}
.rvt-linhas div{display:flex;justify-content:space-between;gap:12px;font-size:0.9rem;}
.rvt-linhas div.total{border-top:1px solid var(--panel-border);padding-top:8px;margin-top:2px;font-weight:700;font-size:1rem;}
.rvt-linhas span.num{font-family:'IBM Plex Mono',monospace;white-space:nowrap;}
.rvt-linhas span:last-child{text-align:right;}
.rva-card button{width:100%;padding:10px 14px;}
.rva-card button.rva-btn-atual{background:transparent;color:var(--texto-muted);border:1px solid var(--panel-border);cursor:default;}
.field[hidden], .field-row[hidden], label[hidden]{display:none !important;}
.mini-list[hidden]{display:none;}
