/*!*************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./app/analytics/analytics.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************/
/* Scoped to .analytics-scope only — reuses the app's existing --leaf /
   --ink / --line tokens from globals.css, adds a few local-only ones. */
.analytics-scope {
  --a-muted: #6b7d72;
  --a-ink2: #3c4f45;
  --a-good: #1d7a4f;
  --a-warning: #c9850d;
  --a-critical: #b23a3a;
  --a-line: var(--line);
}

.analytics-scope .pghead { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.analytics-scope .pghead h1 { font-size: 21px; color: var(--leaf-dark); }
.analytics-scope .pghead .sub { color: var(--a-ink2); font-size: 13px; margin-top: 4px; }
.analytics-scope .pghead .spacer { flex: 1 1; }

.analytics-scope .g { display: grid; grid-gap: 14px; gap: 14px; }
.analytics-scope .g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.analytics-scope .g5 { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }

.analytics-scope .tile { background: var(--card); border: 1px solid var(--a-line); border-radius: 10px; padding: 14px; box-shadow: 0 1px 2px rgba(16,22,19,.05); }
.analytics-scope .tile .k { font-size: 11.5px; font-weight: 640; color: var(--a-ink2); }
.analytics-scope .tile .v { font-size: 24px; font-weight: 700; letter-spacing: -.02em; margin-top: 6px; color: var(--leaf-dark); }

.analytics-scope .chart-card { background: var(--card); border: 1px solid var(--a-line); border-radius: 10px; padding: 16px; box-shadow: 0 1px 2px rgba(16,22,19,.05); }
.analytics-scope .chart-card h3 { font-size: 13.5px; font-weight: 670; color: var(--leaf-dark); margin-bottom: 2px; }
.analytics-scope .chart-card .cs { font-size: 11.5px; color: var(--a-muted); margin-bottom: 12px; }
.analytics-scope .chart-empty { color: var(--a-muted); font-size: 12.5px; padding: 20px 0; text-align: center; }

.analytics-scope .chart-svg { width: 100%; height: auto; display: block; overflow: visible; }
.analytics-scope .chart-svg .ax { font-size: 10.5px; fill: var(--a-muted); font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.analytics-scope .chart-svg .lb { font-size: 12px; fill: var(--a-ink2); font-weight: 550; }
.analytics-scope .chart-svg .vl { font-size: 12px; fill: var(--ink); font-weight: 670; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.analytics-scope .chart-svg .axline { stroke: var(--a-line); stroke-width: 1; }
.analytics-scope .chart-row rect { transition: opacity .1s; }
.analytics-scope .chart-row:hover rect { opacity: .82; }

.analytics-scope .tag { display: inline-flex; align-items: center; gap: 5px; border-radius: 6px; padding: 2px 8px; font-size: 11px; font-weight: 650; border: 1px solid; white-space: nowrap; }
.analytics-scope .tag i { width: 7px; height: 7px; border-radius: 2px; }
.analytics-scope .t-good { background: #e9f7e9; border-color: #bfe6bf; color: #075d07; }
.analytics-scope .t-good i { background: var(--a-good); }
.analytics-scope .t-muted { background: #f1f2f1; border-color: #e0e3e1; color: #4a524f; }
.analytics-scope .t-muted i { background: var(--a-muted); }

.analytics-scope .error { background: #fbe9e9; border: 1px solid #efc3c3; color: var(--a-critical); border-radius: 8px; padding: 10px 12px; font-size: 12.5px; }

