/* LogyPhone Financeira — tokens e base. Painel: ver regras .lp-* abaixo. */
:root {
  --font-anthropic-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-anthropic-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --cds-font-size-caption: 0.8125rem;
  --cds-font-size-body: 0.9375rem;
  --cds-font-size-heading: 1.125rem;
  --cds-font-size-title: 1.75rem;
  --cds-font-weight-medium: 600;
  --cds-gap-xs: 4px; --cds-gap-sm: 8px; --cds-gap-md: 16px; --cds-gap-lg: 24px; --cds-gap-xl: 40px;
  --cds-pad-xs: 4px; --cds-pad-sm: 8px; --cds-pad-md: 12px; --cds-pad-lg: 20px; --cds-pad-xl: 32px;
  --cds-radius: 10px;
  --cds-dur-slow: 240ms;

  --color-bg: #f6f7f9;
  --color-panel: #ffffff;
  --color-fg: #17202e;
  --color-fg-muted: #5f6b7c;
  --color-border-line: #e1e5eb;
  --color-ok: #1f7a4d;
  --color-warn: #a35f00;
  --color-bad: #b42318;
  --cds-chart-grid: #eceff3;
  --cds-chart-axis: #c4ccd6;
  --cds-chart-muted: #b7c0cc;
  --cds-chart-status-critical: #d9534f;
  --cds-surface-popover: #ffffff;
  --cds-border: #dfe4ea;
  --cds-shadow-popover: 0 6px 24px rgba(16, 24, 40, .12);
  --cds-text-secondary: #5f6b7c;
  --lp-accent: #1f4f8f;
}
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #0f141b;
    --color-panel: #161d27;
    --color-fg: #e7ecf3;
    --color-fg-muted: #98a4b5;
    --color-border-line: #263142;
    --color-ok: #4cc38a;
    --color-warn: #e3a440;
    --color-bad: #ff7b72;
    --cds-chart-grid: #1f2936;
    --cds-chart-axis: #3a4759;
    --cds-chart-muted: #4b596c;
    --cds-chart-status-critical: #ef6b65;
    --cds-surface-popover: #1c2531;
    --cds-border: #2c3848;
    --cds-shadow-popover: 0 6px 24px rgba(0, 0, 0, .45);
    --cds-text-secondary: #98a4b5;
    --lp-accent: #7fb0ff;
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--color-bg); color: var(--color-fg);
  font-family: var(--font-anthropic-sans); font-size: var(--cds-font-size-body); line-height: 1.45;
}
[hidden] { display: none !important; }
.dash-skeleton { color: transparent !important; background: var(--cds-chart-grid); border-radius: 6px; display: inline-block; min-width: 3ch; }

/* Barra superior */
.topo {
  position: sticky; top: 0; z-index: 5; background: var(--color-panel); border-bottom: 1px solid var(--color-border-line);
  padding-block: 10px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px));
}
.topo-in { max-width: 1280px; margin-inline: auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.marca { font-weight: 600; letter-spacing: .01em; }
.marca span { color: var(--lp-accent); }
.topo-info { margin-left: auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.btn {
  font: inherit; font-size: var(--cds-font-size-caption); padding: 6px 12px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--color-border-line); background: transparent; color: var(--color-fg);
}
.btn:focus-visible, .campo input:focus-visible { outline: 2px solid var(--lp-accent); outline-offset: 2px; }
.btn-prim { background: var(--lp-accent); border-color: var(--lp-accent); color: #fff; font-size: var(--cds-font-size-body); padding: 10px 16px; border-radius: 8px; width: 100%; }
@media (prefers-color-scheme: dark) { .btn-prim { color: #0f141b; } }

main#dash-root {
  padding-block: 24px 48px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px));
}

/* Login */
.login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.login {
  width: 100%; max-width: 380px; background: var(--color-panel); border: 1px solid var(--color-border-line);
  border-radius: 14px; padding: 28px; display: flex; flex-direction: column; gap: 16px;
}
.login h1 { margin: 0; font-family: var(--font-anthropic-serif); font-weight: 400; font-size: 1.6rem; }
.login p { margin: 0; color: var(--color-fg-muted); font-size: var(--cds-font-size-caption); }
.campo { display: flex; flex-direction: column; gap: 6px; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.campo input {
  font: inherit; font-size: var(--cds-font-size-body); padding: 10px 12px; border-radius: 8px;
  border: 1px solid var(--color-border-line); background: var(--color-bg); color: var(--color-fg);
}
.erro { color: var(--color-bad); font-size: var(--cds-font-size-caption); min-height: 1.2em; }
.carregando { display: flex; align-items: center; gap: 10px; color: var(--color-fg-muted); padding: 40px 0; justify-content: center; }
.aviso-erro { max-width: 1280px; margin: 0 auto 16px; border: 1px solid var(--color-bad); color: var(--color-bad); border-radius: 10px; padding: 12px 16px; }

/* ---- Painel ---- */

.lp{font-family:var(--font-anthropic-sans);display:flex;flex-direction:column;gap:var(--cds-gap-lg);max-width:1280px;margin-inline:auto}
.lp h1{font-family:var(--font-anthropic-serif);font-weight:400;font-size:var(--cds-font-size-title);margin:0;text-wrap:balance}
.lp-take{color:var(--color-fg-muted);margin:6px 0 0;max-width:72ch;font-size:var(--cds-font-size-body)}
.lp-take span{color:var(--color-fg);font-variant-numeric:tabular-nums}
.lp-note{border:1px dashed var(--color-border-line);border-radius:var(--cds-radius);padding:var(--cds-pad-md) var(--cds-pad-lg);font-size:var(--cds-font-size-caption);color:var(--color-fg-muted);line-height:1.5}
.lp-note strong{color:var(--color-fg);font-weight:var(--cds-font-weight-medium)}
.lp-note p{margin:0}
.lp-note p+p{margin-top:6px}
.lp-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,11.5rem),1fr));gap:var(--cds-gap-md)}
.lp-kpi,.lp-card{background:var(--color-panel);border:1px solid var(--color-border-line);border-radius:var(--cds-radius);padding:var(--cds-pad-lg);min-width:0}
.lp-kpi{display:flex;flex-direction:column;gap:4px}
.lp-lab{font-size:var(--cds-font-size-caption);color:var(--color-fg-muted)}
.lp-num{font-family:var(--font-anthropic-serif);font-weight:400;font-size:var(--cds-font-size-title);font-variant-numeric:tabular-nums;line-height:1.15}
.lp-sub{font-size:var(--cds-font-size-caption);color:var(--color-fg-muted);font-variant-numeric:tabular-nums}
.lp-card h2{font-size:var(--cds-font-size-heading);font-weight:var(--cds-font-weight-medium);margin:0}
.lp-card .lp-hint{font-size:var(--cds-font-size-caption);color:var(--color-fg-muted);margin:4px 0 var(--cds-gap-md)}
.lp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr));gap:var(--cds-gap-md)}
.lp-chart{position:relative;min-height:240px}
.lp-chart.tall{min-height:260px}
.lp-svg text{font-size:var(--cds-font-size-caption);fill:var(--color-fg-muted);font-family:var(--font-anthropic-sans)}
.lp-tip{position:absolute;pointer-events:none;background:var(--cds-surface-popover);border:1px solid var(--cds-border);border-radius:var(--cds-radius);box-shadow:var(--cds-shadow-popover);padding:var(--cds-pad-xs) var(--cds-pad-sm);font-size:var(--cds-font-size-caption);white-space:nowrap;z-index:2;font-variant-numeric:tabular-nums}
.lp-tip .h{color:var(--cds-text-secondary);margin-bottom:2px}
.lp-tip .sw{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;vertical-align:middle}
.lp-legend{display:flex;gap:var(--cds-gap-md);flex-wrap:wrap;font-size:var(--cds-font-size-caption);color:var(--color-fg-muted);margin-bottom:var(--cds-gap-sm)}
.lp-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.lp-fail{display:flex;align-items:center;justify-content:center;gap:8px;min-height:inherit;color:var(--color-fg-muted);font-size:var(--cds-font-size-caption)}
.lp-fail::before{content:"";width:.375rem;height:.375rem;border-radius:50%;background:var(--color-bad)}
.lp-risk{display:flex;flex-direction:column}
.lp-risk-row{display:grid;grid-template-columns:auto 1fr auto;gap:var(--cds-gap-sm) var(--cds-gap-md);align-items:baseline;padding:var(--cds-pad-sm) 0;border-top:1px solid var(--color-border-line)}
.lp-risk-row:first-child{border-top:0;padding-top:0}
.lp-dot{width:.5rem;height:.5rem;border-radius:50%;align-self:center}
.lp-dot.warn{background:var(--color-warn)}
.lp-dot.bad{background:var(--color-bad)}
.lp-dot.info{background:var(--cds-chart-muted)}
.lp-risk-t{min-width:0}
.lp-risk-t b{font-weight:var(--cds-font-weight-medium)}
.lp-risk-t div{font-size:var(--cds-font-size-caption);color:var(--color-fg-muted)}
.lp-risk-v{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.lp-risk-v .big{font-family:var(--font-anthropic-serif);font-size:var(--cds-font-size-heading)}
.lp-risk-v div{font-size:var(--cds-font-size-caption);color:var(--color-fg-muted)}
.lp-hbars{display:flex;flex-direction:column;gap:6px;min-height:240px}
.lp-hbar{display:grid;grid-template-columns:minmax(0,9rem) 1fr auto;gap:var(--cds-gap-sm);align-items:center;font-size:var(--cds-font-size-caption)}
.lp-hbar .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lp-hbar .tr{height:14px;border-radius:4px;background:var(--cds-chart-grid);overflow:hidden}
.lp-hbar .fl{height:100%;border-radius:4px;background:var(--lp-c)}
.lp-hbar .vl{font-variant-numeric:tabular-nums;color:var(--color-fg-muted);min-width:5.5rem;text-align:right}
.lp-tools{display:flex;flex-wrap:wrap;gap:var(--cds-gap-sm);align-items:center;margin-bottom:var(--cds-gap-md)}
.lp-chip{font:inherit;font-size:var(--cds-font-size-caption);padding:4px 10px;border-radius:999px;border:1px solid var(--color-border-line);background:transparent;color:var(--color-fg);cursor:pointer}
.lp-chip[aria-pressed="true"]{background:var(--color-fg);color:var(--color-bg);border-color:var(--color-fg)}
.lp-chip:focus-visible,.lp-sort:focus-visible,.lp-search:focus-visible{outline:2px solid var(--color-fg);outline-offset:2px}
.lp-search{font:inherit;font-size:var(--cds-font-size-caption);padding:6px 10px;border-radius:var(--cds-radius);border:1px solid var(--color-border-line);background:var(--color-bg);color:var(--color-fg);flex:1 1 14rem;min-width:0;max-width:22rem}
.lp-count{font-size:var(--cds-font-size-caption);color:var(--color-fg-muted);margin-left:auto;font-variant-numeric:tabular-nums}
.lp-tbox{max-height:520px;overflow:auto;border-top:1px solid var(--color-border-line)}
.lp-table{width:100%;border-collapse:collapse;font-size:var(--cds-font-size-caption);font-variant-numeric:tabular-nums}
.lp-table th{position:sticky;top:0;background:var(--color-panel);text-align:left;font-weight:var(--cds-font-weight-medium);border-bottom:1px solid var(--color-border-line);padding:0;white-space:nowrap;z-index:1}
.lp-table th.n,.lp-table td.n{text-align:right}
.lp-sort{font:inherit;background:none;border:0;color:var(--color-fg-muted);padding:8px 10px;cursor:pointer;width:100%;text-align:inherit}
.lp-table th[aria-sort] .lp-sort{color:var(--color-fg)}
.lp-table td{padding:7px 10px;border-bottom:1px solid var(--color-border-line);white-space:nowrap}
.lp-table td.cl{white-space:normal;min-width:12rem}
.lp-pill{display:inline-block;padding:1px 8px;border-radius:999px;border:1px solid var(--color-border-line)}
.lp-pill.a{color:var(--color-fg)}
.lp-pill.q{color:var(--color-ok)}
.lp-pill.r{color:var(--color-warn)}
.lp-pill.x{color:var(--color-fg-muted)}
.lp-table td.wr{white-space:normal;min-width:14rem;color:var(--color-fg-muted)}
.lp-no{color:var(--color-warn)}
.lp-old{color:var(--color-bad)}
.lp-mes{margin-top:var(--cds-gap-md);padding-top:var(--cds-pad-lg);border-top:1px solid var(--color-border-line);display:flex;flex-direction:column;gap:var(--cds-gap-md)}
.lp-mes-head{display:flex;flex-wrap:wrap;gap:var(--cds-gap-sm);align-items:center;justify-content:space-between}
.lp-mes-head h3{margin:0;font-family:var(--font-anthropic-serif);font-weight:400;font-size:var(--cds-font-size-title)}
.lp-mes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));gap:var(--cds-gap-md)}
.lp-st{display:flex;flex-direction:column;gap:2px;min-width:0}
.lp-stv{font-family:var(--font-anthropic-serif);font-size:var(--cds-font-size-heading);font-variant-numeric:tabular-nums}
.lp-inad{border:1px dashed var(--color-border-line);border-radius:var(--cds-radius);padding:var(--cds-pad-md) var(--cds-pad-lg);font-size:var(--cds-font-size-caption);color:var(--color-fg-muted)}
.lp-inad-t{display:flex;align-items:center;gap:8px;color:var(--color-fg);font-size:var(--cds-font-size-body)}
.lp-inad-t b{font-weight:var(--cds-font-weight-medium)}
.lp-inad p{margin:6px 0 0;max-width:80ch;line-height:1.5}
.lp-chart .lp-bar,.lp-chart .lp-hit{cursor:pointer}
[data-dash-source-state=empty]{color:transparent}
[data-dash-source-state=refreshing]{opacity:.5;transition:opacity var(--cds-dur-slow)}
@media (max-width:640px){.lp-hide-sm{display:none}}

.lp-tabs{display:flex;gap:4px;border-bottom:1px solid var(--color-border-line)}
.lp-tab{font:inherit;font-size:var(--cds-font-size-body);background:none;border:0;border-bottom:2px solid transparent;color:var(--color-fg-muted);padding:8px 14px;cursor:pointer;margin-bottom:-1px}
.lp-tab[aria-selected="true"]{color:var(--color-fg);border-bottom-color:var(--color-fg);font-weight:var(--cds-font-weight-medium)}
.lp-tab:focus-visible{outline:2px solid var(--color-fg);outline-offset:2px}
.lp-page{display:flex;flex-direction:column;gap:var(--cds-gap-lg)}
.lp-faixas{display:flex;flex-direction:column;gap:6px}
.lp-pct{color:var(--color-bad)}
.lp-tel{font-variant-numeric:tabular-nums;white-space:nowrap}
.lp-mode{display:flex;flex-wrap:wrap;gap:var(--cds-gap-sm);align-items:center}
