:root {
  --bg-0:#0b0d10;        /* obsidian */
  --bg-1:#11141a;
  --card:#131821;
  --text:#f2f6f8;        /* pale silver */
  --muted:#a9b6c0;
  --accent:#1be37f;      /* emerald */
  --accent-2:#2fd0a7;    /* teal-emerald */
  --warn:#f9b64c;        /* amber */
  --neg:#ff6262;         /* coral-red */
  --grid:#2b313a;
  --kpi:#0f141c;
  --badge:#0f1b15;
}

/* subtle 'scale' texture */
body {
  background: radial-gradient(80rem 80rem at 20% -10%, #0e1217, transparent 40%),
              repeating-linear-gradient(135deg, rgba(255,255,255,.02) 0 4px, rgba(255,255,255,0) 4px 8px),
              var(--bg-0);
  color: var(--text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
}

/* navbar */
.navbar-dark { background: linear-gradient(180deg, #0c1117, #0b0d10 60%); border-bottom:1px solid #121821; }
.navbar-brand { letter-spacing:.3px; font-weight:700; }

/* cards / kpis */
.kpi-card{ background: var(--kpi)!important; border-radius:16px; border:1px solid #1a2130; }
.kpi-label{ color: var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; }
.kpi-value{ color: var(--text); font-weight:800; font-size:1.25rem; }
.kpi-sub  { color: var(--muted); font-size:.75rem; }

/* buttons */
.btn-primary { background: var(--accent); border-color: var(--accent); color:#04130a; font-weight:600; }
.btn-outline-secondary{ color: var(--text); border-color:#2a3240; }
.btn-secondary{ background:#1a2431; border-color:#2a3240 }

/* tables */
.dash-table-container .row{ color:var(--text); }
table, .dash-table-container{ background: var(--card) !important; }
.dash-table-container .previous-next-container button{ background:#1a2230; color:var(--text) }

/* plotly tweaks */
.js-plotly-plot .gtitle{ fill: var(--text) !important; }
.js-plotly-plot .xtick text, .js-plotly-plot .ytick text { fill: var(--muted) !important; }
.js-plotly-plot .legendtext { fill: var(--text) !important; }

/* badges / legend pills */
.badge-reptile { background: var(--badge); border:1px solid #153424; color:#7cf5b6; }
/* legibility accents for dark */
label, .text-muted { color: var(--muted) !important; }
.js-plotly-plot .xtick text, .js-plotly-plot .ytick text { fill: var(--muted) !important; }
/* legibility accents for dark */
label, .text-muted { color: var(--muted) !important; }
.js-plotly-plot .xtick text, .js-plotly-plot .ytick text { fill: var(--muted) !important; }