*{box-sizing:border-box}
:root{--nav:#0b2638;--nav2:#154b6b;--blue:#1f6d9d;--blue2:#2e83b7;--ice:#eef5f9;--line:#cbd8e1;--ink:#1c2d38;--muted:#6c7b86;--white:#fff;--green:#2f7d59;--yellow:#fff3bf;--gold:#a66b08;--red:#b63c3c;--shadow:0 6px 22px rgba(15,45,65,.08)}
html,body{margin:0;background:#f2f5f7;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:14px}
.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:linear-gradient(180deg,var(--nav),#09202e);color:#fff;z-index:20;box-shadow:6px 0 20px #09202e22}
.brand{padding:24px 20px 18px;border-bottom:1px solid #fff1}.brand b{font-size:19px;display:block}.brand small{color:#a9bfcd}
.nav{padding:14px 10px}.nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:8px;margin:2px 0;color:#dce8ef;text-decoration:none;font-weight:600}.nav a:hover,.nav a.active{background:var(--nav2);color:#fff}
/* Ícones do menu lateral: alteração visual isolada, sem interferir nas rotas ou regras do sistema. */
.nav a .nav-icon{width:28px;min-width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;font-size:20px;line-height:1;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}.nav a .nav-label{display:inline-block}.nav a.active .nav-icon{filter:drop-shadow(0 1px 2px rgba(0,0,0,.18))}
.bottom{position:absolute;bottom:0;left:0;right:0;padding:10px;border-top:1px solid #fff1}
.main{margin-left:250px;min-height:100vh}.top{height:68px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:10}.crumb{color:var(--muted)}.user{display:flex;align-items:center;gap:8px;font-weight:700}.avatar{width:34px;height:34px;border-radius:50%;background:#dbeaf3;color:var(--nav);display:grid;place-items:center}
.content{padding:25px 28px;max-width:1800px}.hero{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px}.hero h1{margin:0;font-size:28px;color:var(--nav)}.hero p{margin:5px 0 0;color:var(--muted)}
.actions{display:flex;gap:8px}.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:7px;padding:9px 13px;background:#fff;color:var(--ink);text-decoration:none;font-weight:700;cursor:pointer}.btn.primary{background:var(--blue);color:#fff;border-color:var(--blue)}.btn.green{background:var(--green);color:#fff;border-color:var(--green)}.btn.light{background:var(--ice)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.kpi{background:#fff;border:1px solid var(--line);border-radius:10px;padding:15px;box-shadow:var(--shadow)}.kpi span{display:block;color:var(--muted);font-size:12px}.kpi b{display:block;font-size:23px;color:var(--nav);margin-top:5px}
.sheet{background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:18px}.sheet-head{background:linear-gradient(180deg,#f8fbfd,#e8f1f6);border-bottom:1px solid var(--line);padding:12px 15px;display:flex;justify-content:space-between;align-items:center}.sheet-head strong{color:var(--nav);letter-spacing:.2px}.sheet-body{padding:15px}
.table-scroll{overflow:auto}.sheet-table{width:100%;border-collapse:collapse;min-width:900px}.sheet-table th{background:var(--nav);color:#fff;text-transform:uppercase;font-size:11px;letter-spacing:.3px;position:sticky;top:0}.sheet-table td,.sheet-table th{padding:8px 9px;border:1px solid var(--line);vertical-align:middle}.sheet-table tbody tr:nth-child(even) td{background:#f8fbfd}.sheet-table tbody tr:hover td{background:#eaf5fb}.sheet-table .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.sheet-table tfoot td{background:#e4f0f6;font-weight:800;color:var(--nav)}
.badge{display:inline-block;padding:4px 8px;border-radius:14px;background:#e7f1f7;color:var(--blue);font-size:11px;font-weight:800}.badge.green{background:#e6f3eb;color:var(--green)}.badge.gold{background:#fff1c9;color:var(--gold)}
.filters{display:grid;grid-template-columns:160px 160px minmax(250px,1fr) auto;gap:8px;align-items:end}.field label{display:block;font-size:11px;color:var(--muted);font-weight:800;text-transform:uppercase;margin-bottom:4px}.field input,.field select,.field textarea{width:100%;padding:9px;border:1px solid #b9cad5;border-radius:6px;background:#fff;font:inherit}
.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.form-grid .wide{grid-column:1/-1}.form-grid label{font-size:12px;font-weight:800;color:#51636e}.form-grid input,.form-grid select,.form-grid textarea{margin-top:5px}
.notice{background:#e8f4ed;border:1px solid #b8dbc6;color:#276143;padding:10px 12px;border-radius:7px;margin-bottom:14px}
.empty{padding:35px;text-align:center;color:var(--muted)}
/* Papelzinhos: comprovante individual, como na planilha */
.receipts{display:grid;grid-template-columns:repeat(3,minmax(280px,1fr));gap:16px}.receipt{background:#fff;border:1px solid #b9c8d2;border-radius:8px;box-shadow:0 4px 14px #173b4d12;overflow:hidden;position:relative}.receipt-head{background:var(--nav);color:#fff;text-align:center;padding:10px;font-size:13px;font-weight:900;letter-spacing:.5px}.receipt-name{text-align:center;padding:11px 10px 8px;font-size:18px;font-weight:900;color:var(--nav);border-bottom:1px solid var(--line)}.receipt-body{padding:8px 12px}.receipt-row{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed #cdd8df}.receipt-row span:first-child{color:#5e6f7a;font-weight:700}.receipt-row span:last-child{font-weight:700}.receipt-total{margin:10px 0 0;padding:10px;background:#eef5f9;border:1px solid var(--line);display:flex;justify-content:space-between;font-weight:900}.receipt-pay{padding:11px 12px;background:#e4f2e9;border-top:1px solid #c4ddcd;display:flex;justify-content:space-between;align-items:center}.receipt-pay strong{font-size:19px;color:var(--green)}.receipt-note{padding:8px 12px;font-size:11px;color:var(--muted);min-height:28px}
.login{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 20% 20%,#2e83b7,#0b2638 60%)}.login-card{width:400px;background:#fff;border-radius:14px;padding:38px;box-shadow:0 25px 60px #0004}.login-card h1{color:var(--nav);margin-top:0}.login-card input{width:100%;padding:11px;margin:5px 0;border:1px solid #b9cad5;border-radius:7px}
.chat{height:410px;overflow:auto;border:1px solid var(--line);padding:12px;border-radius:7px;background:#f8fafb}.user-msg,.bot-msg{padding:10px;margin:7px 0;border:1px solid var(--line);border-radius:7px;white-space:pre-wrap}.user-msg{background:#eaf4fa}.bot-msg{background:#fff5d9}
@media(max-width:1050px){.sidebar{width:205px}.main{margin-left:205px}.kpis{grid-template-columns:repeat(2,1fr)}.receipts{grid-template-columns:repeat(2,minmax(280px,1fr))}.filters{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.sidebar{position:static;width:100%;height:auto}.main{margin-left:0}.bottom{position:static}.content{padding:15px}.top{position:static}.hero{display:block}.actions{margin-top:10px}.kpis,.receipts,.filters,.form-grid{grid-template-columns:1fr}}

/* compatibilidade v2.1 */
.panel{background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);margin-bottom:18px;overflow:hidden}.panel h2{margin:0;padding:12px 15px;background:linear-gradient(180deg,#f8fbfd,#e8f1f6);border-bottom:1px solid var(--line);font-size:14px;color:var(--nav)}.panel .form-grid{padding:15px}.panel .toolbar{padding:12px 15px}.panel table{width:100%;border-collapse:collapse}.panel th{background:var(--nav);color:#fff}.panel th,.panel td{padding:8px 9px;border:1px solid var(--line)}.panel tr:nth-child(even) td{background:#f8fbfd}.btn-secondary{display:inline-flex;align-items:center;padding:9px 13px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);text-decoration:none;font-weight:700}.danger{background:var(--red)!important;color:#fff!important;border-color:var(--red)!important}

/* ===== v2.3 RESPONSIVO ===== */
html{overflow-x:hidden}
img,video,iframe{max-width:100%;height:auto}
button,.btn{max-width:100%}
.table-scroll{-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.sheet-table{min-width:760px}
@media (max-width:1200px){
  .sidebar{width:220px}
  .main{margin-left:220px}
  .content{padding:22px}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .receipts{grid-template-columns:repeat(2,minmax(260px,1fr))}
}
@media (max-width:900px){
  .sidebar{position:relative;left:auto;top:auto;width:100%;height:auto;display:block}
  .brand{padding:16px 18px}
  .nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:8px}
  .nav a{margin:0;padding:10px;font-size:13px}
  .bottom{position:static;padding:8px}
  .bottom a{margin:0}
  .main{margin-left:0;min-width:0}
  .top{height:auto;min-height:58px;padding:10px 16px;gap:10px}
  .content{padding:16px}
  .hero{align-items:flex-start;gap:12px}
  .hero h1{font-size:24px}
  .filters{grid-template-columns:1fr 1fr}
  .form-grid{grid-template-columns:1fr 1fr}
  .form-grid .wide{grid-column:1/-1}
  .sheet-body{padding:12px}
  .kpi{min-width:0}
}
@media (max-width:640px){
  body{font-size:13px}
  .brand{text-align:center}
  .brand b{font-size:17px}
  .nav{grid-template-columns:1fr 1fr}
  .nav a{justify-content:center;text-align:center}
  .top{flex-direction:column;align-items:flex-start}
  .user{align-self:flex-end}
  .content{padding:12px}
  .hero{display:block;margin-bottom:14px}
  .hero h1{font-size:22px}
  .hero p{font-size:12px}
  .actions{display:grid;grid-template-columns:1fr 1fr;width:100%;margin-top:10px}
  .actions .btn{width:100%}
  .kpis{grid-template-columns:1fr 1fr;gap:8px}
  .kpi{padding:11px}.kpi b{font-size:18px}
  .filters{grid-template-columns:1fr}
  .filters>div,.filters>.field,.filters>button,.filters>.btn{width:100%}
  .searchbox{min-width:0;width:100%}
  .form-grid{grid-template-columns:1fr}
  .form-grid .wide{grid-column:auto}
  .sheet{border-radius:7px}
  .sheet-head{padding:10px 12px;gap:8px;align-items:flex-start}
  .sheet-head strong{font-size:12px}
  .sheet-table{min-width:720px}
  .receipts{grid-template-columns:1fr;gap:12px}
  .receipt{max-width:none}
  .receipt-name{font-size:17px}
  .login-card{width:calc(100% - 28px);padding:28px}
}
@media (max-width:380px){
  .nav{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr}
  .actions{grid-template-columns:1fr}
  .content{padding:9px}
  .top{padding:9px 11px}
}
@media (orientation:landscape) and (max-height:600px) and (max-width:900px){
  .sidebar{position:relative}
  .nav{grid-template-columns:repeat(4,minmax(0,1fr))}
  .content{padding:12px 16px}
}
@media print{
  .sidebar,.top,.hero .actions,.filters,.btn{display:none!important}
  .main{margin:0!important}
  .content{padding:0!important}
  .sheet{box-shadow:none;border:0}
  .receipts{grid-template-columns:repeat(2,1fr)}
}

/* ===== MOBILE GLOBAL v5.27 ===== */
html,body{width:100%;overflow-x:hidden}
@media(max-width:900px){
.sidebar{position:relative;inset:auto;width:100%;height:auto}.main{margin-left:0!important;width:100%;min-width:0}
.nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:7px}.nav a{margin:0;text-align:center;padding:10px 6px;font-size:12px}
.bottom{position:static}.top{height:auto;min-height:58px;padding:10px 14px;flex-wrap:wrap}.content{padding:14px;width:100%;min-width:0}
.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.filters{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr 1fr}
.table-scroll,.panel,.sheet{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.sheet-table,.panel table{min-width:720px}
}
@media(max-width:600px){
.nav{grid-template-columns:1fr 1fr}.content{padding:10px}.hero{display:block}.hero h1{font-size:21px}
.actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.kpis{grid-template-columns:1fr 1fr}.filters,.form-grid{grid-template-columns:1fr}
.receipts{grid-template-columns:1fr}.sheet-table,.panel table{min-width:680px}
}
@media(max-width:380px){.nav{grid-template-columns:1fr}.kpis,.actions{grid-template-columns:1fr}}

/* ===== v3.0 MOBILE + PWA ===== */
.mobile-menu-btn{display:none;position:fixed;left:12px;top:10px;width:42px;height:42px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--nav);font-size:22px;font-weight:900;z-index:60;box-shadow:var(--shadow);cursor:pointer}
.sidebar-overlay{display:none}
.pwa-install-btn{position:fixed;right:14px;bottom:14px;z-index:55;border:0;border-radius:999px;padding:11px 15px;background:var(--blue);color:#fff;font-weight:800;box-shadow:0 8px 24px #0b263855;cursor:pointer}
.bulk-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr 150px;gap:8px;align-items:end}
.bulk-grid .field{min-width:0}
.bulk-row{padding:10px 0;border-bottom:1px solid #e1e8ed}
.bulk-row:last-child{border-bottom:0}
@media(max-width:900px){
  .mobile-menu-btn{display:block}
  .sidebar{position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:min(88vw,310px)!important;height:100vh!important;margin:0!important;transform:translateX(-105%);transition:transform .22s ease;z-index:50;overflow:auto;box-shadow:10px 0 30px #09202e55}
  .sidebar.mobile-open{transform:translateX(0)}
  .sidebar-overlay{display:block;position:fixed;inset:0;background:#0006;z-index:45;opacity:0;pointer-events:none;transition:opacity .22s ease}
  .sidebar-overlay.show{opacity:1;pointer-events:auto}
  .main{margin-left:0!important;min-width:0}
  .top{padding-left:66px!important}
  .bulk-grid{grid-template-columns:1fr 1fr}
  .bulk-grid .bulk-desc{grid-column:1/-1}
}
@media(max-width:560px){
  .content{padding:11px!important}
  .actions{grid-template-columns:1fr!important}
  .bulk-grid{grid-template-columns:1fr}
  .bulk-grid .bulk-desc{grid-column:auto}
  .pwa-install-btn{bottom:10px;right:10px}
}
@media print{.mobile-menu-btn,.sidebar-overlay,.pwa-install-btn{display:none!important}}

/* ===== v3.1 MOBILE EM TODO O SISTEMA ===== */
@media(max-width:900px){
  .content{width:100%;max-width:100%;overflow-x:hidden}
  .hero h1{line-height:1.15}
  .sheet,.panel{max-width:100%;}
  .sheet-body{max-width:100%;}
  .sheet>table,.panel>table{display:block;overflow-x:auto;width:100%;-webkit-overflow-scrolling:touch}
  .panel{overflow-x:auto}
  input,select,textarea,button{max-width:100%;font-size:16px!important}
  .field input,.field select,.field textarea{min-height:42px}
  .btn{min-height:42px}
  .actions{flex-wrap:wrap}
  .form-grid,.filters{min-width:0}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:560px){
  .cards{grid-template-columns:1fr!important}
  .sheet-head{flex-wrap:wrap}
  .sheet-head .badge{margin-left:0}
  .table-scroll{width:100%;max-width:100%}
  .table-scroll .sheet-table{min-width:680px}
  .bulk-grid{gap:7px}
  .bulk-row{padding:12px 0}
  .bulk-row .btn{width:100%}
}

/* ===== MOBILE EDITABLE LAYOUT — GLOBAL =====
   Em telas pequenas, áreas de edição passam de colunas horizontais
   para blocos verticais, evitando campos escondidos para a direita.
   Não altera regras, cálculos ou dados. */
@media (max-width: 700px){
  /* Grids de formulários editáveis, inclusive os que usam style inline */
  .mobile-edit-grid,
  .mobile-edit-grid[style]{
    grid-template-columns:1fr !important;
    width:100% !important;
    min-width:0 !important;
  }
  .mobile-edit-grid > *{min-width:0 !important;width:100% !important;}
  .mobile-edit-grid .field{width:100% !important;min-width:0 !important;}

  /* Tabelas que possuem campos de edição: cada linha vira um cartão vertical */
  table.mobile-edit-stack{
    min-width:0 !important;
    width:100% !important;
    border-collapse:separate !important;
    border-spacing:0 !important;
  }
  table.mobile-edit-stack > thead{display:none !important;}
  table.mobile-edit-stack > tbody,
  table.mobile-edit-stack > tbody > tr,
  table.mobile-edit-stack > tbody > tr > td{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
  }
  table.mobile-edit-stack > tbody > tr{
    margin:0 0 12px !important;
    padding:10px !important;
    background:#fff !important;
    border:1px solid var(--line) !important;
    border-radius:9px !important;
    box-shadow:0 2px 8px rgba(15,45,65,.05) !important;
  }
  table.mobile-edit-stack > tbody > tr > td{
    padding:8px 2px !important;
    border:0 !important;
    border-bottom:1px solid #edf1f3 !important;
    text-align:left !important;
    white-space:normal !important;
    overflow:visible !important;
  }
  table.mobile-edit-stack > tbody > tr > td:last-child{border-bottom:0 !important;}
  table.mobile-edit-stack > tbody > tr > td::before{
    content:attr(data-mobile-label);
    display:block;
    margin:0 0 4px;
    color:var(--muted);
    font-size:10px;
    line-height:1.2;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.2px;
  }
  table.mobile-edit-stack > tbody > tr > td[data-mobile-label=""]::before,
  table.mobile-edit-stack > tbody > tr > td[data-mobile-label="-" ]::before{display:none;}
  table.mobile-edit-stack input,
  table.mobile-edit-stack select,
  table.mobile-edit-stack textarea{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  table.mobile-edit-stack .num{text-align:left !important;}
  table.mobile-edit-stack .money-input{width:100% !important;max-width:100% !important;}
  table.mobile-edit-stack .money-input input{width:100% !important;}

  /* Formulários que ficam dentro de uma célula de tabela */
  table.mobile-edit-stack td > form,
  table.mobile-edit-stack td form.mobile-edit-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    min-width:0 !important;
  }

  /* Cards de edição/configuração específicos que usam grids inline */
  [data-mobile-edit-grid]{
    grid-template-columns:1fr !important;
    width:100% !important;
    min-width:0 !important;
  }
}

@media (max-width: 430px){
  table.mobile-edit-stack > tbody > tr{padding:8px !important;margin-bottom:10px !important;}
  table.mobile-edit-stack > tbody > tr > td{padding:7px 1px !important;}
  .mobile-edit-grid .btn,
  .mobile-edit-grid button{width:100% !important;}
}