:root {
    --paper:#f6f2e7; --paper-card:#fffdf7; --ink:#3b3327; --ink-soft:#6b6252;
    --header-a:#5b7553; --header-b:#3f5c3a;
    --line:#ddd2b0; --line-soft:#eae1c6;
    --company-bg:#e9dfc2; --subtotal-bg:#f1e6c4; --total-bg:#e3d19b; --acumulado-bg:#fbe6b8;
    --positivo:#2e7d46; --negativo:#b3462e;
    --tab-active:#5b7553;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif; background:var(--paper); color:var(--ink); font-size:14px; }
.container { max-width:1600px; margin:0 auto; padding-bottom:50px; }

.header { background:linear-gradient(135deg,var(--header-a),var(--header-b)); color:#fdfbf3; padding:20px 25px; text-align:center; }
.header h1 { font-size:20px; margin-bottom:4px; }
.header p { font-size:12.5px; opacity:.9; }

.controls { background:var(--paper-card); padding:11px 25px; display:flex; gap:16px; align-items:center; flex-wrap:wrap; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:30; box-shadow:0 1px 4px rgba(59,51,39,.08); }
.ctrl { display:flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; color:var(--ink-soft); }
.ctrl select, .ctrl input[type=month], .ctrl input[type=number], .ctrl input[type=text] { padding:5px 8px; border:1px solid var(--line); border-radius:5px; font-size:12.5px; background:#fff; color:var(--ink); }
.btn { background:var(--header-a); color:#fff; border:none; padding:7px 14px; border-radius:5px; cursor:pointer; font-size:12.5px; font-weight:700; }
.btn:hover { background:var(--header-b); }
.btn.secundario { background:#fff; color:var(--header-b); border:1px solid var(--header-a); }
.btn:disabled { opacity:.5; cursor:not-allowed; }

.badge-mode { padding:5px 12px; border-radius:20px; font-size:11.5px; font-weight:700; }
.badge-mode.on { background:#fbe6b8; color:#7a5300; border:1px solid #e0b45c; }
.badge-mode.off { background:#eae1c6; color:#6b6252; border:1px solid var(--line); }
.badge-mode.edit { background:#f6d9d0; color:#7a2e12; border:1px solid #d98a6f; }

.main-tabs { display:flex; background:var(--paper-card); border-bottom:1px solid var(--line); flex-wrap:wrap; }
.main-tab-btn { padding:12px 18px; border:none; background:none; cursor:pointer; font-size:12.8px; font-weight:700; color:var(--ink-soft); border-bottom:3px solid transparent; }
.main-tab-btn.active { color:var(--tab-active); border-bottom-color:var(--tab-active); background:var(--paper); }
.main-tab-btn:hover { color:var(--tab-active); }
.main-panel { display:none; padding:18px 25px; }
.main-panel.active { display:block; }

.sub-tabs { display:flex; gap:8px; padding:14px 25px 0; flex-wrap:wrap; }
.sub-tab-btn { padding:7px 16px; border:1px solid var(--line); background:#fff; border-radius:20px; cursor:pointer; font-size:12px; font-weight:700; color:var(--ink-soft); }
.sub-tab-btn.active { background:var(--header-a); border-color:var(--header-a); color:#fff; }

.panel-card { background:var(--paper-card); border-radius:8px; box-shadow:0 1px 4px rgba(59,51,39,.08); padding:18px 20px; margin:18px 25px; }
.panel-card h3 { font-size:14.5px; margin-bottom:12px; color:#4a5c42; }

.origin-badge { display:inline-flex; align-items:center; gap:6px; background:#eef2e2; color:#425c3b; padding:6px 13px; border-radius:20px; font-size:11.5px; font-weight:700; margin-bottom:14px; border:1px solid #cddab8; }
.origin-badge.adm { background:#f3ece0; color:#6b4f2d; border-color:#e0cba8; }

table { width:100%; border-collapse:collapse; font-size:12.5px; }
th, td { padding:6px 9px; text-align:right; border-bottom:1px solid var(--line-soft); font-variant-numeric:tabular-nums; white-space:nowrap; }
th { background:#efe8d3; font-weight:700; color:var(--ink-soft); font-variant-numeric:normal; }
td:first-child, th:first-child { text-align:left; position:sticky; left:0; background:var(--paper-card); z-index:2; min-width:150px; font-variant-numeric:normal; }
th:first-child { background:#efe8d3; z-index:3; }
.table-scroll { overflow-x:auto; }

.company-row td { background:var(--company-bg); font-weight:800; color:#4a4127; text-align:left; border-top:2px solid #b6a468; }
.subtotal-row td { background:var(--subtotal-bg); font-weight:700; }
.subtotal-col { background:var(--subtotal-bg) !important; font-weight:700; }
.total-row td { background:var(--total-bg); font-weight:800; border-top:2px solid #a68f4c; color:#4a3d15; }
.acumulado-row td { background:var(--acumulado-bg); font-weight:800; color:#7a5300; }

.saldo-inicial-box { background:#fbf8ef; border:1px dashed var(--line); border-radius:6px; padding:10px 14px; margin-bottom:16px; font-size:12.5px; display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.saldo-inicial-box b { color:#4a5c42; }

.positivo { color:var(--positivo); font-weight:600; }
.negativo { color:var(--negativo); font-weight:600; }
.vazio { color:#b9ad8f; }

.empty-msg { padding:30px; text-align:center; color:#b9ad8f; font-style:italic; font-size:13px; }
.note { background:#fbf3de; border-left:4px solid #cba135; padding:10px 14px; border-radius:5px; font-size:12px; margin:14px 0; line-height:1.5; color:#5c4600; }

.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; margin-bottom:14px; }
.campo label { display:block; font-size:11.5px; font-weight:700; color:var(--ink-soft); margin-bottom:4px; }
.campo input, .campo select { width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:5px; font-size:13px; }

td input.cell-edit { width:90px; padding:3px 5px; border:1px solid var(--header-a); border-radius:4px; font-size:12px; text-align:right; font-variant-numeric:tabular-nums; }
td input.cell-edit:disabled { border:none; background:transparent; color:inherit; }

.kpi-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.kpi-card { background:#fff; border:1px solid var(--line); border-radius:8px; padding:14px 16px; }
.kpi-card .kpi-label { font-size:11.5px; color:var(--ink-soft); font-weight:700; margin-bottom:6px; }
.kpi-card .kpi-value { font-size:19px; font-weight:800; margin-bottom:4px; }
.kpi-card .kpi-delta { font-size:11.5px; font-weight:700; }

#toast { position:fixed; bottom:20px; right:20px; z-index:999; display:flex; flex-direction:column; gap:8px; }
.toast-msg { background:#3b3327; color:#fdfbf3; padding:10px 16px; border-radius:6px; font-size:12.5px; box-shadow:0 3px 10px rgba(0,0,0,.2); animation:fadein .2s; }
.toast-msg.erro { background:#7a2e12; }
@keyframes fadein { from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);} }

/* Login page */
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; }
.login-card { background:var(--paper-card); border-radius:10px; box-shadow:0 4px 20px rgba(59,51,39,.15); padding:34px 30px; width:100%; max-width:380px; }
.login-card h1 { font-size:18px; margin-bottom:6px; color:var(--header-b); text-align:center; }
.login-card p { font-size:12px; color:var(--ink-soft); text-align:center; margin-bottom:22px; }
.login-card label { display:block; font-size:12px; font-weight:700; color:var(--ink-soft); margin-bottom:5px; margin-top:14px; }
.login-card input { width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:6px; font-size:13.5px; }
.login-card .btn { width:100%; margin-top:20px; padding:10px; font-size:13px; }
.login-error { color:var(--negativo); font-size:12px; margin-top:10px; text-align:center; min-height:16px; }

.top-user-bar { display:flex; justify-content:flex-end; padding:6px 25px; font-size:11.5px; color:var(--ink-soft); gap:10px; align-items:center; }
.top-user-bar a, .top-user-bar button.link { color:var(--header-b); font-weight:700; text-decoration:none; background:none; border:none; cursor:pointer; font-size:11.5px; }

@media print {
  .controls, .main-tabs, .sub-tabs, #toast, .top-user-bar { display:none !important; }
}

/* Telas estreitas (celular) — mesma estrutura, mais compacta e com abas
   roláveis em vez de quebrar linha. Tabelas continuam roláveis na horizontal
   (.table-scroll), só ficam mais enxutas para caber mais coluna por vez. */
@media (max-width: 640px) {
  .header { padding:14px 16px; }
  .header h1 { font-size:16px; }
  .header p { font-size:10.5px; }

  .top-user-bar { padding:6px 14px; font-size:11px; flex-wrap:wrap; justify-content:space-between; }

  .controls { padding:9px 14px; gap:10px; }
  .ctrl { font-size:11.5px; }

  .panel-card { margin:12px 12px; padding:12px 14px; }

  .main-tabs { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .main-tab-btn { flex:0 0 auto; padding:11px 13px; font-size:11.5px; white-space:nowrap; }

  .sub-tabs { padding:12px 14px 0; }

  table { font-size:11px; }
  th, td { padding:5px 6px; }
  td:first-child, th:first-child { min-width:96px; max-width:120px; font-size:10.5px; }

  .form-grid { grid-template-columns:1fr; }
  .saldo-inicial-box { padding:9px 12px; font-size:11.5px; }

  td input.cell-edit { width:76px; font-size:11px; }
}