:root{
  --bg:#0a0e13; --panel:#111820; --panel-2:#161f2a; --line:#223040;
  --text:#dbe6ef; --muted:#7c8ba0; --accent:#29b6f6; --accent-dim:#134a63;
  --accent-teks:#04222f;
  --ok:#2ecc71; --warn:#ffb300; --fail:#e5484d;
  --konsol-1:#0d141b; --konsol-2:#0a0e13;
  --garis-pindai:rgba(41,182,246,0.035);
  --zebra:rgba(255,255,255,0.015);
  --bayang:0 10px 30px rgba(0,0,0,0.45);
  --kaca:rgba(255,255,255,0.04);
  --font-display:'Space Grotesk',sans-serif;
  --font-body:'IBM Plex Sans',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
}
html[data-tema="terang"]{
  --bg:#eef2f6; --panel:#ffffff; --panel-2:#f4f7fa; --line:#ccd6e0;
  --text:#16202b; --muted:#5b6b7d; --accent:#0277bd; --accent-dim:#b9dcf0;
  --accent-teks:#ffffff;
  --ok:#1b8a4b; --warn:#a86500; --fail:#c62828;
  --konsol-1:#ffffff; --konsol-2:#e7eef4;
  --garis-pindai:rgba(2,119,189,0.045);
  --zebra:rgba(0,0,0,0.022);
  --bayang:0 10px 30px rgba(22,32,43,0.16);
  --kaca:rgba(22,32,43,0.04);
}
*{box-sizing:border-box;}
/* Latar seluruh dashboard: satu foto Kepulauan Indonesia dari orbit malam
   yang menempel di tepi peramban (fixed) dan tidak ikut menggulir bersama
   isinya. Sekarang memakai pseudo-element supaya bisa dicerahkan lewat
   `filter: brightness()` — sama seperti latar layar masuk. Tint di atasnya
   dibuat tipis biar warna foto tetap keluar; --bg dipasang sebagai jaring
   pengaman bila gambarnya tidak sampai. */
body{margin:0;color:var(--text);font-family:var(--font-body);
     -webkit-font-smoothing:antialiased;
     background:var(--bg);}
body::before{
  content:''; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:url('/images/indonesia-orbit-bg.png') center center / cover no-repeat;
  filter:brightness(1.35) saturate(1.12) contrast(1.02);
}
body::after{
  content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg,
    rgba(6,12,26,.35) 0%,
    rgba(6,12,26,.15) 40%,
    rgba(4,7,16,.55) 100%);
}
html[data-tema="terang"] body::after{
  background:linear-gradient(180deg,
    rgba(238,242,246,.55) 0%,
    rgba(238,242,246,.25) 40%,
    rgba(238,242,246,.65) 100%);
}
h1,h2,h3,h4{font-family:var(--font-display);margin:0;font-weight:600;letter-spacing:-.01em;}
::-webkit-scrollbar{height:8px;width:8px;}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px;}
button{font:inherit;}

