/* =====================================================================
   LabMoney 2026 - design system (pedido do João, 19/10/2026)
   Escuro = data-theme "futuristic" (padrão) · Claro = "light" / "classic"
   Carrega DEPOIS do style.css e manda nele. Para desligar: tirar do index.html.
   ===================================================================== */

/* ---------- 1. Tokens ---------- */
body[data-theme] {
  /* superfícies e tinta (escuro: grafite azulado) */
  --lab-bg: #0d1016;
  --lab-s1: #141820;
  --lab-s2: #1a1f29;
  --lab-s3: #222835;
  --lab-line: rgba(148, 163, 190, .09);
  --lab-line2: rgba(148, 163, 190, .16);
  --lab-ink: #eceef3;
  --lab-ink2: #a3acbc;
  --lab-ink3: #6f798b;
  /* acento de interação (um só) */
  --lab-accent: #8d9cff;
  --lab-accent-2: #a9b4ff;
  --lab-accent-bg: rgba(141, 156, 255, .12);
  --lab-on-accent: #0d1016;
  /* semânticas */
  --lab-pos: #3fca82;
  --lab-pos-bg: rgba(63, 202, 130, .12);
  --lab-neg: #f26b6e;
  --lab-neg-bg: rgba(242, 107, 110, .12);
  --lab-warn: #f0b44c;
  --lab-warn-bg: rgba(240, 180, 76, .13);
  /* séries dos gráficos */
  --lab-rec: #3987e5;
  --lab-custo: #d95926;
  --lab-grid: rgba(148, 163, 190, .08);
  --lab-axis: rgba(148, 163, 190, .22);
  --lab-shadow: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 12px 32px -18px rgba(0, 0, 0, .7);
  --lab-pop: 0 24px 64px -24px rgba(0, 0, 0, .8), 0 0 0 1px rgba(148, 163, 190, .14);
  /* tipografia e forma */
  --lab-font: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --r-lg: 16px;
  --r-md: 12px;
  --r-sm: 8px;
  color-scheme: dark;

  /* tokens antigos apontando para os novos (os estilos escritos no código passam a seguir o tema) */
  --bg: var(--lab-bg);
  --bg2: var(--lab-s1);
  --bg3: var(--lab-s2);
  --card: var(--lab-s1);
  --card2: var(--lab-s2);
  --border: var(--lab-line2);
  --text: var(--lab-ink);
  --text2: var(--lab-ink2);
  --accent: var(--lab-accent);
  --accent2: var(--lab-accent-2);
  --green: var(--lab-pos);
  --red: var(--lab-neg);
  --yellow: var(--lab-warn);
  --radius: var(--r-md);
  --shadow: var(--lab-shadow);
}
body[data-theme="light"],
body[data-theme="classic"] {
  --lab-bg: #f3f4f7;
  --lab-s1: #ffffff;
  --lab-s2: #f6f7f9;
  --lab-s3: #eceef2;
  --lab-line: rgba(17, 24, 39, .07);
  --lab-line2: rgba(17, 24, 39, .12);
  --lab-ink: #111622;
  --lab-ink2: #4a5466;
  --lab-ink3: #848d9d;
  --lab-accent: #3e52d6;
  --lab-accent-2: #3243b8;
  --lab-accent-bg: rgba(62, 82, 214, .09);
  --lab-on-accent: #ffffff;
  --lab-pos: #11804a;
  --lab-pos-bg: rgba(17, 128, 74, .09);
  --lab-neg: #cf3434;
  --lab-neg-bg: rgba(207, 52, 52, .08);
  --lab-warn: #a86a10;
  --lab-warn-bg: rgba(212, 140, 20, .12);
  --lab-rec: #2a78d6;
  --lab-custo: #eb6834;
  --lab-grid: rgba(17, 24, 39, .06);
  --lab-axis: rgba(17, 24, 39, .2);
  --lab-shadow: 0 1px 2px rgba(17, 24, 39, .04), 0 8px 24px -16px rgba(17, 24, 39, .18);
  --lab-pop: 0 24px 64px -24px rgba(17, 24, 39, .35), 0 0 0 1px rgba(17, 24, 39, .08);
  color-scheme: light;
}

/* ---------- 2. Base e tipografia ---------- */
body[data-theme] {
  background: var(--lab-bg) !important;
  color: var(--lab-ink);
  font-family: var(--lab-font);
  font-size: 13.5px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "ss01", "cv11";
}
body[data-theme] button,
body[data-theme] input,
body[data-theme] select,
body[data-theme] textarea { font-family: inherit; }
body[data-theme] ::selection { background: var(--lab-accent-bg); }
body[data-theme] :focus-visible { outline: 2px solid var(--lab-accent); outline-offset: 2px; border-radius: 6px; }
body[data-theme] [style*="text-transform:uppercase"],
body[data-theme] [style*="text-transform: uppercase"] { text-transform: none !important; letter-spacing: 0 !important; }
.lab-i { width: 18px; height: 18px; flex: none; display: inline-block; vertical-align: -3.5px; }
.lab-emo { display: inline-flex; align-items: center; vertical-align: -3px; }
.lab-emo .lab-i { width: 1.15em; height: 1.15em; vertical-align: 0; }
.lab-emo.lab-seta .lab-i { width: 1em; height: 1em; }
.lab-c-pos { color: var(--lab-pos); }
.lab-c-neg { color: var(--lab-neg); }
.lab-c-warn { color: var(--lab-warn); }
.lab-c-pos .lab-i, .lab-c-neg .lab-i, .lab-c-warn .lab-i { width: .95em; height: .95em; }
@media (prefers-reduced-motion: reduce) { body[data-theme] * { transition: none !important; animation: none !important; } }

/* ---------- 3. Menu lateral ---------- */
body[data-theme] .sidebar {
  width: 232px !important;
  background: var(--lab-bg) !important;
  border-right: 1px solid var(--lab-line) !important;
  padding: 18px 12px 12px !important;
  backdrop-filter: none !important;
  display: flex; flex-direction: column;
}
body[data-theme] .sidebar-logo { border: 0 !important; padding: 2px 10px 22px !important; margin: 0 !important; text-align: left !important; }
body[data-theme] .sidebar-logo img { max-height: 30px; max-width: 150px; display: block; }
.lab-wordmark { font-weight: 650; font-size: 17px; letter-spacing: -.02em; color: var(--lab-ink); }
.lab-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; overflow-y: auto; }
body[data-theme] .nav-item {
  display: flex; align-items: center; gap: 11px;
  margin: 0 !important; padding: 8px 10px !important;
  border-radius: var(--r-sm) !important;
  color: var(--lab-ink2) !important; font-size: 13.5px; font-weight: 450;
  background: transparent !important; box-shadow: none !important;
  text-decoration: none; transition: background .15s, color .15s;
}
body[data-theme] .nav-item .lab-i { color: var(--lab-ink3); }
body[data-theme] .nav-item:hover { background: var(--lab-s2) !important; color: var(--lab-ink) !important; }
body[data-theme] .nav-item.active { background: var(--lab-s2) !important; color: var(--lab-ink) !important; font-weight: 550; position: relative; }
body[data-theme] .nav-item.active .lab-i { color: var(--lab-accent); }
body[data-theme] .nav-item.active::before { content: ""; position: absolute; left: -12px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--lab-accent); }
.lab-side-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 6px 2px; border-top: 1px solid var(--lab-line); margin-top: 10px; }
.lab-user { display: flex; align-items: center; gap: 9px; min-width: 0; }
.lab-avatar { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--lab-accent-bg); color: var(--lab-accent); font-weight: 600; font-size: 12px; flex: none; }
.lab-user-nome { font-size: 13px; color: var(--lab-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lab-iconbtn {
  width: 34px; height: 34px; display: inline-grid; place-items: center; flex: none;
  border-radius: var(--r-sm); border: 1px solid var(--lab-line2); background: var(--lab-s1);
  color: var(--lab-ink2); cursor: pointer; transition: background .15s, color .15s;
}
.lab-iconbtn:hover { background: var(--lab-s2); color: var(--lab-ink); }
body[data-theme] .sidebar-close { background: none; border: 0; color: var(--lab-ink2); top: 14px; right: 12px; }
body[data-theme] .main { margin-left: 232px !important; padding: 22px 32px 48px !important; max-width: none !important; }
@media (min-width: 769px) { body[data-theme].sidebar-collapsed .main { margin-left: 0 !important; } }
@media (max-width: 900px) {
  body[data-theme] .sidebar { transform: translateX(-100%); box-shadow: var(--lab-pop); }
  body[data-theme] .sidebar.open { transform: translateX(0); }
  body[data-theme] .main { margin-left: 0 !important; padding: 14px 16px 40px !important; }
}

/* ---------- 4. Topo ---------- */
body[data-theme] .header.lab-top { display: flex; align-items: center; gap: 14px; margin: 0 0 18px !important; padding: 0 !important; flex-wrap: nowrap; }
body[data-theme] .header.lab-top h1 { font-size: 22px; font-weight: 650; letter-spacing: -.02em; flex: 1; min-width: 0; display: block !important; }
body[data-theme] .header .header-actions { display: flex; align-items: center; gap: 10px; }
body[data-theme] .header-cotacoes { display: flex !important; gap: 8px; margin: 0 !important; }
.lab-cot { display: grid; grid-template-columns: auto auto; column-gap: 7px; align-items: baseline; padding: 6px 12px; border-radius: var(--r-sm); background: var(--lab-s1); border: 1px solid var(--lab-line); }
.lab-cot-sim { font-size: 12px; color: var(--lab-ink3); font-weight: 500; }
.lab-cot-v { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.lab-cot-r { grid-column: 1 / -1; font-size: 11px; color: var(--lab-ink3); line-height: 1.2; }
body[data-theme] .hamburger {
  width: 36px !important; height: 36px !important; border-radius: var(--r-sm) !important;
  background: var(--lab-s1) !important; border: 1px solid var(--lab-line2) !important; color: var(--lab-ink2) !important;
  display: none; place-items: center; cursor: pointer; padding: 0; position: static !important;
}
@media (min-width: 769px) { body[data-theme].sidebar-collapsed .hamburger { display: grid !important; } }
@media (max-width: 900px) {
  body[data-theme] .hamburger { display: grid !important; }
  body[data-theme] .header.lab-top h1 { font-size: 18px; }
  .lab-cot { padding: 5px 9px; }
  .lab-cot-r { display: none; }
}
@media (max-width: 420px) { .lab-cot-sim { display: none; } .lab-cot-v { font-size: 13px; } }

/* ---------- 5. Filtros e controles ---------- */
body[data-theme] .filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 22px !important; }
body[data-theme] .filter-btns { display: inline-flex !important; gap: 2px !important; padding: 3px; background: var(--lab-s1); border: 1px solid var(--lab-line); border-radius: 10px; flex-wrap: wrap; }
body[data-theme] .filter-btn {
  border: 0 !important; background: transparent !important; color: var(--lab-ink2) !important;
  padding: 6px 12px !important; border-radius: 7px !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.2;
}
body[data-theme] .filter-btn:hover { color: var(--lab-ink) !important; background: var(--lab-s2) !important; }
body[data-theme] .filter-btn.active { background: var(--lab-s3) !important; color: var(--lab-ink) !important; box-shadow: 0 1px 0 rgba(255, 255, 255, .04) inset, 0 1px 2px rgba(0, 0, 0, .2); }
body[data-theme] input[type="date"],
body[data-theme] input[type="text"],
body[data-theme] input[type="email"],
body[data-theme] input[type="password"],
body[data-theme] input[type="number"],
body[data-theme] input:not([type]),
body[data-theme] select,
body[data-theme] textarea {
  background: var(--lab-s1) !important; color: var(--lab-ink) !important;
  border: 1px solid var(--lab-line2) !important; border-radius: var(--r-sm) !important;
  padding: 7px 11px !important; font-size: 13px !important; min-height: 36px; box-shadow: none !important;
  transition: border-color .15s;
}
body[data-theme] input:focus, body[data-theme] select:focus, body[data-theme] textarea:focus { outline: none; border-color: var(--lab-accent) !important; box-shadow: 0 0 0 3px var(--lab-accent-bg) !important; }
body[data-theme] input[type="date"]::-webkit-calendar-picker-indicator { opacity: .55; filter: invert(var(--lab-cal-inv, 1)); cursor: pointer; }
body[data-theme="light"], body[data-theme="classic"] { --lab-cal-inv: 0; }
body[data-theme] input[type="checkbox"], body[data-theme] input[type="radio"] { accent-color: var(--lab-accent); }

body[data-theme] .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  min-height: 36px; padding: 7px 15px !important; border-radius: var(--r-sm) !important;
  font-size: 13px !important; font-weight: 550 !important; letter-spacing: 0; border: 1px solid transparent !important;
  box-shadow: none !important; transition: background .15s, border-color .15s, color .15s;
}
body[data-theme] .btn-primary { background: var(--lab-accent) !important; color: var(--lab-on-accent) !important; }
body[data-theme] .btn-primary:hover { background: var(--lab-accent-2) !important; }
body[data-theme] .btn-outline { background: var(--lab-s1) !important; color: var(--lab-ink) !important; border-color: var(--lab-line2) !important; }
body[data-theme] .btn-outline:hover { background: var(--lab-s2) !important; }
body[data-theme] .btn-danger { background: var(--lab-neg-bg) !important; color: var(--lab-neg) !important; border-color: transparent !important; }
body[data-theme] .btn-danger:hover { background: var(--lab-neg) !important; color: #fff !important; }
body[data-theme] .btn-sm { min-height: 30px; padding: 4px 10px !important; font-size: 12.5px !important; }
/* "Atualizar GAM" é ação de manutenção, não de perigo */
body[data-theme] .filters .btn-danger { background: transparent !important; color: var(--lab-ink2) !important; border-color: var(--lab-line2) !important; }
body[data-theme] .filters .btn-danger:hover { background: var(--lab-s2) !important; color: var(--lab-ink) !important; }
@media (max-width: 700px) {
  body[data-theme] .filters input[type="date"], body[data-theme] .filters select { flex: 1 1 140px; width: auto !important; }
  body[data-theme] .filters .btn { flex: 1 1 auto; }
}

.lab-btn-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px;
  border: 1px solid var(--lab-line2); background: var(--lab-s1); color: var(--lab-ink2);
  font-size: 12px; font-weight: 550; cursor: pointer; white-space: nowrap; transition: all .15s;
}
.lab-btn-chip .lab-i { width: 14px; height: 14px; vertical-align: 0; color: var(--lab-accent); }
.lab-btn-chip:hover { border-color: var(--lab-accent); color: var(--lab-ink); background: var(--lab-accent-bg); }
.lab-tabs { display: inline-flex; gap: 2px; padding: 3px; border-radius: 10px; background: var(--lab-s2); border: 1px solid var(--lab-line); flex-wrap: wrap; }
.lab-tab { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 0; border-radius: 7px; background: transparent; color: var(--lab-ink2); font-size: 13px; font-weight: 500; cursor: pointer; }
.lab-tab .lab-i { width: 15px; height: 15px; vertical-align: 0; }
.lab-tab:hover { color: var(--lab-ink); }
.lab-tab.on { background: var(--lab-s1); color: var(--lab-ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .18); }
.lab-tab.on .lab-i { color: var(--lab-accent); }
.lab-badge { display: inline-flex; align-items: center; gap: 6px; padding: 2px 9px 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 550; background: var(--lab-s2); color: var(--lab-ink2); white-space: nowrap; }
.lab-badge i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.lab-badge.pos { background: var(--lab-pos-bg); color: var(--lab-pos); }
.lab-badge.warn { background: var(--lab-warn-bg); color: var(--lab-warn); }
.lab-badge.neg { background: var(--lab-neg-bg); color: var(--lab-neg); }
body[data-theme] .badge { border-radius: 999px; font-weight: 550; padding: 2px 9px; }

/* ---------- 6. Seções (sanfona) ---------- */
body[data-theme] .section { margin-bottom: 28px !important; }
body[data-theme] .sec-toggle.lab-sec {
  width: 100%; display: flex; align-items: center; gap: 9px;
  background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  padding: 4px 0 12px !important; margin: 0 !important;
  font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: var(--lab-ink); cursor: pointer; text-align: left;
}
.lab-sec .lab-i { color: var(--lab-ink3); width: 17px; height: 17px; }
.lab-sec .lab-sec-arr { width: 15px; height: 15px; transition: transform .18s; }
.lab-sec.open .lab-sec-arr { transform: rotate(90deg); }
.lab-sec:hover .lab-sec-arr { color: var(--lab-ink); }

/* ---------- 7. Resumo do período (o elemento principal da tela) ---------- */
.lab-hero { background: var(--lab-s1); border: 1px solid var(--lab-line); border-radius: var(--r-lg); box-shadow: var(--lab-shadow); padding: 24px 26px 18px; margin-bottom: 30px; }
.lab-hero-top { display: grid; grid-template-columns: minmax(250px, 1fr) 2.3fr; gap: 28px; align-items: start; }
.lab-lbl { font-size: 12.5px; color: var(--lab-ink2); font-weight: 500; margin-bottom: 6px; }
.lab-hero-num { font-size: clamp(36px, 3.6vw, 52px); font-weight: 600; letter-spacing: -.035em; line-height: 1.02; margin-bottom: 10px; color: var(--lab-ink); white-space: nowrap; }
.lab-hero-num.neg { color: var(--lab-neg); }
.lab-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-left: 1px solid var(--lab-line); }
.lab-stat { padding: 2px 0 2px 20px; min-width: 0; }
.lab-stat + .lab-stat { border-left: 1px solid var(--lab-line); }
.lab-stat-v { font-size: 22px; font-weight: 600; letter-spacing: -.02em; line-height: 1.15; margin-bottom: 6px; white-space: nowrap; }
.lab-stat-v.pos { color: var(--lab-pos); }
.lab-stat-v.neg { color: var(--lab-neg); }
.lab-cap { font-size: 11.5px; color: var(--lab-ink3); margin-top: 5px; line-height: 1.35; }
.lab-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 550; color: var(--lab-ink2); white-space: nowrap; }
.lab-delta .lab-i { width: 13px; height: 13px; vertical-align: 0; stroke-width: 2.25; }
.lab-delta.pos { color: var(--lab-pos); }
.lab-delta.neg { color: var(--lab-neg); }
.lab-delta-c { color: var(--lab-ink3); font-weight: 450; }
.lab-spread { margin: 22px 0 4px; }
.lab-spread-bar { display: flex; gap: 2px; height: 10px; border-radius: 6px; overflow: hidden; background: var(--lab-s2); }
.lab-spread-bar span { display: block; height: 100%; }
.sp-custo { background: var(--lab-custo); border-radius: 6px 0 0 6px; }
.sp-lucro { background: var(--lab-pos); border-radius: 0 6px 6px 0; }
.sp-falta { background: var(--lab-neg); border-radius: 0 6px 6px 0; }
.lab-spread-txt { margin-top: 9px; font-size: 13px; color: var(--lab-ink2); }
.lab-spread-txt b { color: var(--lab-ink); font-weight: 600; }
.lab-spread-txt b.pos { color: var(--lab-pos); }
.lab-spread-txt b.neg { color: var(--lab-neg); }
.lab-chart-wrap { margin-top: 22px; border-top: 1px solid var(--lab-line); padding-top: 18px; }
.lab-chart-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.lab-h2 { font-size: 14px; font-weight: 600; }
.lab-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12px; color: var(--lab-ink2); }
.lab-legend span { display: inline-flex; align-items: center; gap: 7px; }
.lk-line { display: inline-block; width: 14px; height: 2px; border-radius: 2px; background: var(--lab-ink3); }
.lk-line.rec { background: var(--lab-rec); }
.lk-line.custo { background: var(--lab-custo); }
.lk-bar { display: inline-block; width: 8px; height: 11px; border-radius: 2px 2px 0 0; background: linear-gradient(var(--lab-pos) 0 50%, var(--lab-neg) 50% 100%); }
.lab-tip .lk-bar { background: var(--lab-pos); }
.lab-tip .lk-bar.neg { background: var(--lab-neg); }
.lab-chart { position: relative; min-height: 220px; }
.lab-chart-vazio { display: grid; place-items: center; height: 220px; color: var(--lab-ink3); font-size: 13px; }
.lab-svg { display: block; overflow: visible; }
.lab-svg .g-grid { stroke: var(--lab-grid); stroke-width: 1; }
.lab-svg .g-base { stroke: var(--lab-axis); stroke-width: 1; }
.lab-svg .g-tick { fill: var(--lab-ink3); font-size: 11px; font-variant-numeric: tabular-nums; font-family: var(--lab-font); }
.lab-svg .g-bar.pos { fill: var(--lab-pos); opacity: .85; }
.lab-svg .g-bar.neg { fill: var(--lab-neg); opacity: .85; }
.lab-svg .g-bar.fora { opacity: .28; }
.lab-svg .g-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.lab-svg .g-line.rec { stroke: var(--lab-rec); }
.lab-svg .g-line.custo { stroke: var(--lab-custo); }
.lab-svg .g-end { stroke: var(--lab-s1); stroke-width: 2; }
.lab-svg .g-end.rec { fill: var(--lab-rec); }
.lab-svg .g-end.custo { fill: var(--lab-custo); }
.lab-svg .g-cross { stroke: var(--lab-ink3); stroke-width: 1; pointer-events: none; }
.lab-svg .g-hit { fill: transparent; cursor: crosshair; outline: none; }
.lab-tip { position: absolute; z-index: 5; min-width: 220px; padding: 10px 12px; border-radius: 10px; background: var(--lab-s3); box-shadow: var(--lab-pop); pointer-events: none; font-size: 12.5px; }
.lab-tip-h { font-size: 12px; color: var(--lab-ink2); margin-bottom: 6px; }
.lab-tip-r { display: grid; grid-template-columns: 14px auto 1fr; align-items: center; gap: 8px; padding: 2px 0; }
.lab-tip-r b { font-weight: 600; font-variant-numeric: tabular-nums; }
.lab-tip-r b.pos { color: var(--lab-pos); }
.lab-tip-r b.neg { color: var(--lab-neg); }
.lab-tip-r span { color: var(--lab-ink2); }
.lab-tabela { margin-top: 6px; }
.lab-tabela summary { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--lab-ink2); cursor: pointer; padding: 4px 0; list-style: none; }
.lab-tabela summary::-webkit-details-marker { display: none; }
.lab-tabela summary .lab-i { width: 15px; height: 15px; vertical-align: 0; }
.lab-tabela summary:hover { color: var(--lab-ink); }
.lab-tabela[open] summary { margin-bottom: 8px; }
.lab-tabela > div { max-height: 340px; overflow: auto; }
.lab-mini td.pos { color: var(--lab-pos); }
.lab-mini td.neg { color: var(--lab-neg); }
.lab-mini tr.fora td { color: var(--lab-ink3); }
@media (max-width: 1280px) {
  .lab-hero-top { grid-template-columns: 1fr; gap: 18px; }
  .lab-stats { border-left: 0; border-top: 1px solid var(--lab-line); padding-top: 16px; }
  .lab-stat:first-child { padding-left: 0; }
}
@media (max-width: 760px) {
  .lab-hero { padding: 18px 16px 12px; border-radius: var(--r-md); }
  .lab-stats { grid-template-columns: 1fr 1fr; row-gap: 16px; }
  .lab-stat { padding-left: 14px; }
  .lab-stat:nth-child(odd) { padding-left: 0; border-left: 0 !important; }
  .lab-stat-v { font-size: 19px; }
  .lab-legend { gap: 10px; }
}

/* ---------- 8. Indicadores detalhados (blocos antigos, agora sem caixas pesadas) ---------- */
body[data-theme] .kpi-blocks { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px !important; margin: 0 !important; }
body[data-theme] .kpi-block,
body[data-theme] .kpi-block.kpi-block-gam,
body[data-theme] .kpi-block.kpi-block-fb,
body[data-theme] .kpi-block.kpi-block-roas,
body[data-theme] .kpi-block.kpi-block-adsense {
  background: var(--lab-s1) !important; border: 1px solid var(--lab-line) !important; border-radius: var(--r-lg) !important;
  box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; padding: 18px 20px !important;
}
body[data-theme] .kpi-block::before { display: none !important; }
body[data-theme] .kpi-block-header { border: 0 !important; padding: 0 !important; margin: 0 0 12px !important; }
body[data-theme] .kpi-block-dot { width: 8px !important; height: 8px !important; border-radius: 50% !important; }
body[data-theme] .kpi-block-gam .kpi-block-dot { background: var(--lab-rec) !important; }
body[data-theme] .kpi-block-fb .kpi-block-dot { background: var(--lab-custo) !important; }
body[data-theme] .kpi-block-roas .kpi-block-dot { background: var(--lab-pos) !important; }
body[data-theme] .kpi-blocks .kpi-block .kpi-block-header .kpi-block-title,
body[data-theme] .kpi-block-title { font-size: 13.5px !important; font-weight: 600 !important; letter-spacing: -.005em !important; color: var(--lab-ink) !important; text-transform: none !important; }
body[data-theme] .kpi-block-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 0 !important; }
body[data-theme] .kpi-block .kpi-card,
body[data-theme] .kpi-block.kpi-block-gam .kpi-card,
body[data-theme] .kpi-block.kpi-block-fb .kpi-card,
body[data-theme] .kpi-block.kpi-block-roas .kpi-card {
  background: transparent !important; border: 0 !important; border-top: 1px solid var(--lab-line) !important; border-radius: 0 !important;
  box-shadow: none !important; padding: 10px 2px !important; transform: none !important; backdrop-filter: none !important;
}
body[data-theme] .kpi-block .kpi-card:hover { background: transparent !important; }
body[data-theme] .kpi-label { font-size: 12px !important; color: var(--lab-ink2) !important; text-transform: none !important; letter-spacing: 0 !important; opacity: 1 !important; margin-bottom: 3px !important; font-weight: 450; }
body[data-theme] .kpi-value { font-size: 18px !important; font-weight: 600 !important; letter-spacing: -.015em; font-variant-numeric: tabular-nums; }
body[data-theme] .kpi-value.positive { color: var(--lab-pos) !important; }
body[data-theme] .kpi-value.negative { color: var(--lab-neg) !important; }
/* já aparecem no resumo de cima: não repetir */
body[data-theme] .lab-hero ~ .section .kpi-block .kpi-card[data-kpi="liquido"],
body[data-theme] .lab-hero ~ .section .kpi-block .kpi-card[data-kpi="roi"],
body[data-theme] .lab-hero ~ .section .kpi-block .kpi-card[data-kpi="receita_bruta"],
body[data-theme] .lab-hero ~ .section .kpi-block .kpi-card[data-kpi="fb_com_imposto"] { display: none !important; }
body[data-theme] .kpi-grid .kpi-card { background: var(--lab-s1); border: 1px solid var(--lab-line); border-radius: var(--r-md); box-shadow: none; }
body[data-theme] .kpi-grid .kpi-card:hover { transform: none; border-color: var(--lab-line2); }
@media (max-width: 1100px) { body[data-theme] .kpi-blocks { grid-template-columns: 1fr 1fr !important; } }
@media (max-width: 700px) { body[data-theme] .kpi-blocks { grid-template-columns: 1fr !important; } }

/* ---------- 9. Ad Managers (cartões escritos no código: ajustados aqui) ---------- */
body[data-theme] .section > div[style*="grid-template-columns:repeat(auto-fit,minmax(200px"] { gap: 10px !important; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important; }
body[data-theme] div[onclick^="filterByAM"] {
  background: var(--lab-s1) !important; border: 1px solid var(--lab-line) !important; border-radius: var(--r-md) !important;
  text-align: left !important; padding: 14px 16px !important; position: relative; transition: border-color .15s;
}
body[data-theme] div[onclick^="filterByAM"]:hover { border-color: var(--lab-line2) !important; }
body[data-theme] div[onclick^="filterByAM"][style*="solid var(--accent)"] { border-color: var(--lab-accent) !important; box-shadow: 0 0 0 3px var(--lab-accent-bg); }
body[data-theme] div[onclick^="filterByAM"] > div:first-child { font-size: 13.5px !important; font-weight: 600 !important; margin-bottom: 8px !important; }
body[data-theme] div[onclick^="filterByAM"] > div:nth-child(2) { font-size: 24px !important; font-weight: 600 !important; letter-spacing: -.02em; }
body[data-theme] div[onclick^="filterByAM"] > div:nth-child(3) { font-size: 13px !important; font-weight: 500 !important; }
body[data-theme] div[onclick^="filterByAM"] > div:nth-child(4) { margin-top: 10px !important; padding-top: 8px; border-top: 1px solid var(--lab-line); font-size: 11px !important; color: var(--lab-ink3) !important; font-weight: 500 !important; }

/* ---------- 10. Sites e grupos (cartões) ---------- */
body[data-theme] .table-wrap { overflow-x: auto; }
body[data-theme] div[onclick^="toggleGrupoDash"],
body[data-theme] div[onclick^="toggleSiteCard"] {
  background: var(--lab-s1) !important; border: 1px solid var(--lab-line) !important; border-radius: var(--r-md) !important;
  padding: 12px 16px !important; margin-bottom: 8px !important; transition: border-color .15s, background .15s; gap: 8px 10px !important;
}
body[data-theme] div[onclick^="toggleGrupoDash"] > strong,
body[data-theme] div[onclick^="toggleSiteCard"] > strong { flex: 1 1 230px !important; min-width: 200px; overflow-wrap: anywhere; }
body[data-theme] div[onclick^="toggleGrupoDash"] > div[style*="flex:0 0"],
body[data-theme] div[onclick^="toggleSiteCard"] > div[style*="flex:0 0"] { flex-shrink: 1 !important; min-width: 62px; }
body[data-theme] div[onclick^="toggleGrupoDash"]:hover,
body[data-theme] div[onclick^="toggleSiteCard"]:hover { border-color: var(--lab-line2) !important; background: var(--lab-s1) !important; }
body[data-theme] div[onclick^="toggleGrupoDash"] > strong,
body[data-theme] div[onclick^="toggleSiteCard"] > strong { color: var(--lab-ink) !important; font-weight: 600 !important; font-size: 13.5px !important; display: flex; align-items: center; gap: 7px; flex-wrap: nowrap; line-height: 1.3; }
body[data-theme] div[onclick^="toggleGrupoDash"] > strong .lab-emo,
body[data-theme] div[onclick^="toggleSiteCard"] > strong .lab-emo { color: var(--lab-ink3); }
body[data-theme] div[onclick^="toggleGrupoDash"] > strong .lab-emo.lab-seta,
body[data-theme] div[onclick^="toggleSiteCard"] > strong .lab-emo.lab-seta { color: var(--lab-ink3); }
body[data-theme] div[onclick^="toggleGrupoDash"] > strong .lab-c-pos,
body[data-theme] div[onclick^="toggleSiteCard"] > strong .lab-c-pos { color: var(--lab-pos); }
body[data-theme] div[onclick^="toggleGrupoDash"] > strong .lab-c-warn,
body[data-theme] div[onclick^="toggleSiteCard"] > strong .lab-c-warn { color: var(--lab-warn); }
body[data-theme] div[onclick^="toggleGrupoDash"] div[style*="font-size:10px;letter-spacing"],
body[data-theme] div[onclick^="toggleSiteCard"] div[style*="font-size:10px;letter-spacing"] { font-size: 11.5px !important; color: var(--lab-ink3) !important; font-weight: 450; }
body[data-theme] div[onclick^="toggleGrupoDash"] div[style*="font-size:13px;font-weight:700"],
body[data-theme] div[onclick^="toggleSiteCard"] div[style*="font-size:13px;font-weight:700"] { font-size: 14px !important; font-weight: 600 !important; font-variant-numeric: tabular-nums; }
body[data-theme] div[onclick^="toggleGrupoDash"] + div,
body[data-theme] div[onclick^="toggleSiteCard"] + div { background: var(--lab-s1) !important; border: 1px solid var(--lab-line) !important; border-radius: var(--r-md) !important; margin-top: -4px !important; padding: 6px 14px 8px !important; }
body[data-theme] tr:has(> td > div > div[onclick^="toggleGrupoDash"]):hover,
body[data-theme] tr:has(> td > div > div[onclick^="toggleSiteCard"]):hover { background: transparent !important; }
body[data-theme] td[colspan="13"] > div { margin: 0 0 8px !important; }

/* ---------- 11. Tabelas ---------- */
body[data-theme] table { font-size: 13px; border-collapse: collapse; }
body[data-theme] th {
  color: var(--lab-ink3) !important; font-size: 12px !important; font-weight: 500 !important;
  text-transform: none !important; letter-spacing: 0 !important; padding: 10px 12px !important;
  border-bottom: 1px solid var(--lab-line2) !important; background: transparent; white-space: nowrap;
}
body[data-theme] td { padding: 10px 12px !important; border-bottom: 1px solid var(--lab-line) !important; font-variant-numeric: tabular-nums; }
body[data-theme] tr:hover { background: var(--lab-s2); }
body[data-theme] tr:last-child > td { border-bottom: 0 !important; }
body[data-theme] tr[style*="border-top:2px solid var(--accent)"] { border-top: 1px solid var(--lab-line2) !important; background: var(--lab-s2) !important; }
body[data-theme] tr[style*="border-top:2px solid var(--accent)"] > td { font-weight: 600; }
body[data-theme] .roiTab th { font-size: 11.5px !important; padding: 9px 6px !important; white-space: normal; }
body[data-theme] .roiTab td { padding: 9px 6px !important; }

/* ---------- 12. Popups ---------- */
body[data-theme] .modal-overlay { background: rgba(5, 7, 12, .62) !important; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
body[data-theme="light"] .modal-overlay, body[data-theme="classic"] .modal-overlay { background: rgba(17, 22, 34, .32) !important; }
body[data-theme] .modal { background: var(--lab-s1) !important; border: 0 !important; border-radius: var(--r-lg) !important; box-shadow: var(--lab-pop) !important; padding: 24px 26px !important; }
body[data-theme] .modal h3 { font-size: 18px !important; font-weight: 600 !important; letter-spacing: -.015em; display: inline-flex; align-items: center; gap: 9px; }
body[data-theme] .modal h3 .lab-emo { color: var(--lab-accent); }
body[data-theme] .modal .btn-outline[onclick="closeModal()"] { width: 34px; padding: 0 !important; }
body[data-theme] .form-group label { font-size: 12.5px !important; color: var(--lab-ink2) !important; font-weight: 500; margin-bottom: 6px !important; }
body[data-theme] .modal div[style*="border:1px solid var(--accent)"][style*="border-radius:6px"] { border-color: transparent !important; background: var(--lab-accent-bg) !important; color: var(--lab-ink) !important; border-radius: var(--r-sm) !important; }
body[data-theme] .loading { color: var(--lab-ink3); }

/* ---------- 13. Login ---------- */
body[data-theme] .modal .form-group input { width: 100%; }

/* ---------- 14. Outras telas: herdam tokens; só ajustes de títulos ---------- */
body[data-theme] .section-title { font-size: 15px !important; font-weight: 600 !important; }
body[data-theme] .card, body[data-theme] .kpi-card { border-radius: var(--r-md); }

/* ---------- 15. Ajustes finos (camadas antigas do style.css) ---------- */
body[data-theme] .main { min-width: 0; }
body[data-theme] td[colspan="13"] { padding: 0 !important; border: 0 !important; }
body[data-theme] .table-wrap > table { min-width: 0 !important; table-layout: fixed; width: 100%; }
body[data-theme] .lab-cot-v { display: inline !important; }
body[data-theme] .lab-cot-sim, body[data-theme] .lab-cot-r { display: inline; }
@media (max-width: 900px) {
  body[data-theme] .filters { flex-direction: row !important; align-items: stretch !important; }
  body[data-theme] .filters input[type="date"], body[data-theme] .filters select { height: 38px !important; min-height: 38px !important; padding: 7px 10px !important; }
  body[data-theme] .filters .btn { width: auto !important; padding: 8px 14px !important; font-size: 13px !important; min-height: 38px; }
  body[data-theme] .filter-btns { width: 100%; }
  body[data-theme] .filter-btn { flex: 1 1 auto !important; text-align: center; padding: 7px 8px !important; }
  body[data-theme] .header.lab-top { padding: 0 !important; gap: 8px !important; }
  body[data-theme] th { font-size: 11.5px !important; }
}
@media (max-width: 420px) { body[data-theme] .lab-cot-sim, body[data-theme] .lab-cot-r { display: none !important; } }
@media (max-width: 760px) {
  body[data-theme] div[onclick^="toggleGrupoDash"][title],
  body[data-theme] div[onclick^="toggleSiteCard"][title] { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 10px !important; align-items: start !important; }
  body[data-theme] div[onclick^="toggleGrupoDash"][title] > strong,
  body[data-theme] div[onclick^="toggleSiteCard"][title] > strong { grid-column: 1 / 3; min-width: 0; align-self: center; }
  body[data-theme] div[onclick^="toggleGrupoDash"][title] > span,
  body[data-theme] div[onclick^="toggleSiteCard"][title] > span { grid-column: 3; justify-self: end; align-self: center; }
  body[data-theme] div[onclick^="toggleGrupoDash"] > div[style*="flex:0 0"],
  body[data-theme] div[onclick^="toggleSiteCard"] > div[style*="flex:0 0"] { min-width: 0 !important; }
  body[data-theme] .section > div[style*="grid-template-columns:repeat(auto-fit,minmax(200px"] { grid-template-columns: 1fr 1fr !important; }
  body[data-theme] .kpi-blocks .kpi-block .kpi-block-grid { grid-template-columns: 1fr 1fr !important; }
  body[data-theme] .kpi-blocks .kpi-block .kpi-label { font-size: 11.5px !important; }
}

/* ---------- 16. Cartões de site/grupo fechados em grade (colunas alinhadas entre cartões) ---------- */
body[data-theme] div[onclick^="toggleGrupoDash"][title],
body[data-theme] div[onclick^="toggleSiteCard"][title] {
  display: grid !important; align-items: center !important; column-gap: 14px !important; row-gap: 12px !important;
  grid-template-columns: minmax(190px, 1.8fr) 96px repeat(5, minmax(58px, .9fr)) minmax(118px, 1.45fr) minmax(92px, 1.1fr) minmax(92px, 1.1fr) minmax(70px, .8fr);
}
body[data-theme] div[onclick^="toggleGrupoDash"][title] > *,
body[data-theme] div[onclick^="toggleSiteCard"][title] > * { min-width: 0 !important; flex: none !important; }
body[data-theme] div[onclick^="toggleGrupoDash"][title] > strong,
body[data-theme] div[onclick^="toggleSiteCard"][title] > strong { min-width: 0 !important; }
@media (max-width: 1360px) and (min-width: 761px) {
  body[data-theme] div[onclick^="toggleGrupoDash"][title],
  body[data-theme] div[onclick^="toggleSiteCard"][title] { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  body[data-theme] div[onclick^="toggleGrupoDash"][title] > strong,
  body[data-theme] div[onclick^="toggleSiteCard"][title] > strong { grid-column: 1 / 5; }
  body[data-theme] div[onclick^="toggleGrupoDash"][title] > span,
  body[data-theme] div[onclick^="toggleSiteCard"][title] > span { grid-column: 5; justify-self: end; }
}

/* ---------- 17. Gráfico com métricas à escolha, filtro de grupo/site e recolher ---------- */
body[data-theme] {
  --lab-c1: #3987e5; --lab-c2: #d95926; --lab-c3: #199e70; --lab-c4: #c98500; --lab-c5: #d55181; --lab-c7: #9085e9;
}
body[data-theme="light"], body[data-theme="classic"] {
  --lab-c1: #2a78d6; --lab-c2: #eb6834; --lab-c3: #1baf7a; --lab-c4: #eda100; --lab-c5: #e87ba4; --lab-c7: #6250d6;
}
.lk-line.c1, .lab-svg .g-line.c1 { background: var(--lab-c1); stroke: var(--lab-c1); }
.lk-line.c2, .lab-svg .g-line.c2 { background: var(--lab-c2); stroke: var(--lab-c2); }
.lk-line.c3, .lab-svg .g-line.c3 { background: var(--lab-c3); stroke: var(--lab-c3); }
.lk-line.c4, .lab-svg .g-line.c4 { background: var(--lab-c4); stroke: var(--lab-c4); }
.lk-line.c5, .lab-svg .g-line.c5 { background: var(--lab-c5); stroke: var(--lab-c5); }
.lk-line.c7, .lab-svg .g-line.c7 { background: var(--lab-c7); stroke: var(--lab-c7); }
.lab-svg .g-line { background: none !important; }
.lab-svg .g-end.c1 { fill: var(--lab-c1); } .lab-svg .g-end.c2 { fill: var(--lab-c2); } .lab-svg .g-end.c3 { fill: var(--lab-c3); }
.lab-svg .g-end.c4 { fill: var(--lab-c4); } .lab-svg .g-end.c5 { fill: var(--lab-c5); } .lab-svg .g-end.c7 { fill: var(--lab-c7); }
.lab-hero { position: relative; }
.lab-hero-tog { position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; }
.lab-hero-top { padding-right: 34px; }
.lab-hero.fechado { padding-bottom: 22px; }
.lab-chart-head { align-items: center; }
.lab-h2-alvo { color: var(--lab-ink2); font-weight: 500; }
.lab-alvo { display: inline-flex; align-items: center; gap: 0; position: relative; }
.lab-alvo-ico { position: absolute; left: 10px; color: var(--lab-ink3); pointer-events: none; display: inline-flex; }
.lab-alvo-ico .lab-i { width: 15px; height: 15px; }
body[data-theme] .lab-alvo select { padding-left: 32px !important; min-width: 210px; max-width: 320px; }
.lab-mets { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 8px; }
.lab-met {
  display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--lab-line2); background: transparent; color: var(--lab-ink3); font-size: 12.5px; font-weight: 500;
  transition: background .15s, color .15s, border-color .15s;
}
.lab-met i { opacity: .35; }
.lab-met:hover { color: var(--lab-ink); border-color: var(--lab-ink3); }
.lab-met.on { background: var(--lab-s2); color: var(--lab-ink); border-color: var(--lab-line2); }
.lab-met.on i { opacity: 1; }
.lab-presets { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: 12px; color: var(--lab-ink3); margin-bottom: 6px; }
.lab-presets button { border: 0; background: none; padding: 2px 0; color: var(--lab-ink2); font-size: 12px; cursor: pointer; text-decoration: underline; text-decoration-color: var(--lab-line2); text-underline-offset: 3px; }
.lab-presets button:hover { color: var(--lab-accent); text-decoration-color: var(--lab-accent); }
.lab-painel + .lab-painel { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--lab-line); }
.lab-painel-t { font-size: 11.5px; color: var(--lab-ink3); margin: 2px 0 0 56px; }
.lab-chart.lab-carregando { opacity: .45; transition: opacity .2s; }
@media (max-width: 760px) {
  .lab-chart-head { flex-direction: column; align-items: stretch; }
  body[data-theme] .lab-alvo select { min-width: 0; max-width: none; width: 100%; }
  .lab-alvo { width: 100%; }
  .lab-painel-t { margin-left: 0; }
}
@media (max-width: 760px) {
  .lab-delta { white-space: normal; flex-wrap: wrap; }
  .lab-stat-v { white-space: normal; }
}

/* ---------- 18. Hora a hora ---------- */
.lab-chart-ctl { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.lab-tabs-sm .lab-tab { padding: 5px 11px; font-size: 12.5px; }
.lab-nota-hora { font-size: 11.5px; color: var(--lab-ink3); margin: 6px 0 2px; line-height: 1.45; }
@media (max-width: 760px) { .lab-chart-ctl { flex-direction: column; align-items: stretch; } .lab-tabs-sm { display: flex; } .lab-tabs-sm .lab-tab { flex: 1; justify-content: center; } }

/* ---------- 19. Logo clicável e ordenação dos projetos ---------- */
body[data-theme] .sidebar-logo { cursor: pointer; }
body[data-theme] .sidebar-logo:hover img, body[data-theme] .sidebar-logo:hover .lab-wordmark { opacity: .85; }
.lab-ordem {
  display: grid; align-items: end; column-gap: 14px; padding: 0 17px 8px;
  grid-template-columns: minmax(190px, 1.8fr) 96px repeat(5, minmax(58px, .9fr)) minmax(118px, 1.45fr) minmax(92px, 1.1fr) minmax(92px, 1.1fr) minmax(70px, .8fr);
}
.lab-ord { border: 0; background: none; padding: 2px 0; text-align: left; font-size: 11.5px; color: var(--lab-ink3); cursor: pointer; white-space: nowrap; font-family: inherit; }
.lab-ord i { font-style: normal; opacity: .45; }
.lab-ord b { color: var(--lab-accent); }
.lab-ord:hover, .lab-ord.on { color: var(--lab-ink); }
.lab-ord-sel { display: none; align-items: center; gap: 8px; font-size: 12.5px; color: var(--lab-ink2); margin: 0 0 10px; }
@media (max-width: 1360px) {
  .lab-ordem { display: none; }
  .lab-ord-sel { display: flex; }
  body[data-theme] .lab-ord-sel select { min-width: 0; flex: 1; max-width: 280px; }
}