/* Design tokens, CSS reset, typography dasar — dipakai Index.html & Admin.html */
  :root{
    --bg:#060309;
    --surface:#1A1A1D;
    --surface-2:#242428;
    --ink:#FFFFFF;
    --ink-dim:#C8C8C8;
    --maroon:#6D1F2B;
    --maroon-bright:#8C2C3B;
    --maroon-glow:rgba(140,44,59,.35);
    /* aksen IMORTAL — dipakai buat elemen "pop" (angka progres, ikon nav aktif) dengan efek
       glow; disamakan persis dengan nuansa --maroon yang sudah ada (bukan warna baru). */
    --nova:var(--maroon-bright);
    --nova-soft:var(--maroon-light);
    --nova-glow:var(--maroon-glow);
    /* turunan maroon (tint/muda/tua) + gradasi -- nilai default di sini dituning utk latar
       gelap, override lengkap ada di blok light mode (lihat di bawah) yang jadi tujuan utama
       penambahan token ini. */
    --maroon-tint:rgba(140,44,59,.18);
    --maroon-light:#C4677A;
    --maroon-dark:#3A0F16;
    --gradient-maroon:linear-gradient(135deg,var(--maroon-bright),var(--maroon));
    --rule:#333333;
    --success:#3ECF8E;
    --warning:#F2B134;
    --danger:#E2574C;
    --danger-soft:#f0968d;
    --warning-soft:#f2c766;
    --success-tint:rgba(62,207,142,.16);
    --warning-tint:rgba(242,177,52,.16);
    --danger-tint:rgba(226,87,76,.16);
    /* Diperluas dari 3 (success/warning/danger) jadi 5 warna status -- badge admin sebelumnya
       numpang --maroon-bright buat status "Disetujui" (bentrok visual sama tombol/aksen brand
       yang JUGA maroon di mana-mana) dan gold/amber buat "Tampilkan di Landing" (mirip banget
       sama --warning kuning). --info (biru) & --accent-purple (ungu) khusus dipakai badge status
       biar tiap makna punya warna sendiri yang tidak dobel arti, lihat css/admin-panel.css. */
    --info:#4A9EFF;
    --info-soft:#8AC0FF;
    --info-tint:rgba(74,158,255,.16);
    --accent-purple:#A78BFA;
    --accent-purple-soft:#C9B8FC;
    --accent-purple-tint:rgba(167,139,250,.18);
    --shadow-sm:0 2px 10px rgba(0,0,0,.28);
    --shadow-md:0 12px 28px rgba(0,0,0,.4);
    --shadow-lg:0 24px 60px rgba(0,0,0,.55);
    --ease:cubic-bezier(.16,1,.3,1);
    --ease-bounce:cubic-bezier(.34,1.56,.64,1);
    /* dipakai LIGHT mode saja sekarang (lihat override di bawah) — dark mode pakai --nebula1..4 */
    --glow1:rgba(140,44,59,.52);
    --glow2:rgba(109,31,43,.44);
    --glow3:rgba(140,44,59,.36);
    --glow4:rgba(80,25,35,.32);
    /* nebula galaxy — dark mode saja, ungu/maroon/biru/ungu (corner-blob, statis, screen blend).
       Alpha diredupkan biar hitam tetap dominan (galaxy cuma aksen halus di pojok, bukan
       elemen utama yang bersaing sama konten). */
    --nebula1:rgba(124,58,220,.045);
    --nebula2:rgba(140,32,42,.04);
    --nebula3:rgba(40,90,210,.04);
    --nebula4:rgba(150,35,150,.022);
    --grain-opacity:.05;
    /* ---------- "kaca" (glass) design tokens — tema utama semua kartu/tombol/input.
       Dark mode: gelembung kaca tembus pandang di atas nebula. Light mode: balik solid
       (lihat override di bawah) — background terang bikin blur transparan kurang cocok/berat. */
    --glass-bg:
      radial-gradient(ellipse 130% 70% at 18% -12%, rgba(255,255,255,.32), transparent 55%),
      radial-gradient(ellipse 90% 50% at 85% 105%, rgba(255,150,220,.15), transparent 60%),
      rgba(13, 5, 17, 0.78);
    --glass-border:rgba(255, 150, 220, 0.24);
    --glass-blur:blur(52px);
    --glass-shadow:0 28px 74px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.25), inset 0 0 32px rgba(255,255,255,.06);
    /* varian lebih ringan — sheen "gelembung" yang sama persis (highlight radial kiri-atas)
       cuma opacity & blur sedikit lebih tipis, dipakai kartu kecil/berulang (list item, stat)
       biar tetap kebaca sebagai gelembung kaca tapi blur tidak menumpuk berat. */
    --glass-bg-soft:
      radial-gradient(ellipse 130% 70% at 18% -12%, rgba(255,255,255,.26), transparent 55%),
      radial-gradient(ellipse 90% 50% at 85% 105%, rgba(255,150,220,.12), transparent 60%),
      rgba(13, 5, 17, 0.64);
    --glass-border-soft:rgba(255, 150, 220, 0.19);
    --glass-blur-soft:blur(42px);
    /* varian tint maroon — tombol primary/save. Gradasi (--gradient-maroon), bukan solid --
       sebelumnya rgba(175,22,42,.58) flat, beda sendiri dari light/simple mode yang sudah
       gradasi & landing page (.lp-btn-primary) yang juga gradasi sejak awal. */
    --glass-accent-bg:var(--gradient-maroon);
    --glass-accent-border:rgba(255,150,220,.18);
    --glass-accent-blur:blur(14px);
    /* varian input — translusen tipis, tanpa blur berat (blur di elemen kecil merusak keterbacaan teks di dalamnya) */
    --glass-input-bg:rgba(255,255,255,.055);
    --glass-input-border:rgba(255,255,255,.14);
    --glass-input-blur:blur(6px);
    font-family:'Inter',sans-serif;
  }
  :root[data-theme="light"]{
    /* Netral bersih -- sebelumnya condong krem/coklat (#F6F1EE bg, #241A17/#6B5B56 teks), diganti
       skala netral yang cuma sedikit hangat (bukan abu-abu dingin polos, tetap terasa "Morosangar")
       tapi dominan putih/hitam supaya tidak terlihat kusam di layar terang. */
    --bg:#FAFAF9;
    --surface:#FFFFFF;
    --surface-2:#F5F5F4;
    --ink:#1C1917;
    --ink-dim:#78716C;
    --rule:#E7E5E4;
    /* turunan maroon versi mode terang -- tint (latar badge halus), muda (aksen/ikon sekunder),
       tua (gradasi & teks kontras tinggi di atas tint). --maroon & --maroon-bright brand utama
       tidak diubah. */
    --maroon-glow:rgba(140,44,59,.22);
    --maroon-tint:#F9E5E8;
    --maroon-light:#B54D5F;
    --maroon-dark:#431018;
    --gradient-maroon:linear-gradient(135deg,var(--maroon-bright),var(--maroon-dark));
    /* konteks (sukses/peringatan/bahaya) sengaja dijauhkan dari nuansa merah-maroon brand supaya
       "status" tidak ketukar visual sama "aksi utama" -- --success & --warning sebelumnya tidak
       pernah di-override di sini (ikut nilai dark mode neon), sekarang dituning utk kontras di
       atas putih. */
    --success:#157F3D;
    --warning:#B45309;
    --danger:#D6362B;
    --danger-soft:#8C2620;
    --warning-soft:#8A5A06;
    --success-tint:#E3F5E9;
    --warning-tint:#FBEDD9;
    --danger-tint:#FBE6E4;
    --info:#1D4ED8;
    --info-soft:#3B6FE0;
    --info-tint:#E4ECFC;
    --accent-purple:#7C3AED;
    --accent-purple-soft:#9061F0;
    --accent-purple-tint:#EEE6FD;
    --shadow-sm:0 2px 10px rgba(80,60,55,.10);
    --shadow-md:0 12px 28px rgba(80,60,55,.14);
    --shadow-lg:0 24px 60px rgba(80,60,55,.20);
    --glow1:rgba(140,44,59,.16);
    --glow2:rgba(109,31,43,.13);
    --glow3:rgba(140,44,59,.10);
    --glow4:rgba(80,25,35,.09);
    --grain-opacity:.035;
    /* kaca balik solid di light mode — permukaan terang bikin efek blur transparan kurang terbaca */
    --glass-bg:var(--surface);
    --glass-border:var(--rule);
    --glass-blur:none;
    --glass-shadow:var(--shadow-sm);
    --glass-bg-soft:var(--surface);
    --glass-border-soft:var(--rule);
    --glass-blur-soft:none;
    --glass-accent-bg:var(--gradient-maroon);
    --glass-accent-border:transparent;
    --glass-accent-blur:none;
    --glass-input-bg:var(--surface-2);
    --glass-input-border:var(--rule);
    --glass-input-blur:none;
  }
  /* ---------- Mode ke-3: Gelap Simple -- flat/minimalis, TANPA efek kaca (blur+transparansi)
     sama sekali. Override POLA-nya SAMA PERSIS light mode di atas (glass-bg -> var(--surface),
     blur -> none, dst) -- bedanya di sini --surface/--rule/--shadow-sm TIDAK disentuh (tetap
     nilai gelap default :root), jadi hasilnya solid GELAP datar, bukan solid putih kayak light. */
  :root[data-theme="simple"]{
    --glass-bg:var(--surface);
    --glass-border:var(--rule);
    --glass-blur:none;
    --glass-shadow:var(--shadow-sm);
    --glass-bg-soft:var(--surface);
    --glass-border-soft:var(--rule);
    --glass-blur-soft:none;
    --glass-accent-bg:var(--gradient-maroon);
    --glass-accent-border:transparent;
    --glass-accent-blur:none;
    --glass-input-bg:var(--surface-2);
    --glass-input-border:var(--rule);
    --glass-input-blur:none;
  }
  *{box-sizing:border-box;transition:background-color .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease);}
  html{margin:0;padding:0;background:var(--bg);transition:background .4s var(--ease);}
  body{margin:0;padding:0;padding-top:env(safe-area-inset-top);background:transparent;color:var(--ink);min-height:100vh;transition:color .4s var(--ease);}
  h1,h2,h3{font-family:'Fraunces',serif;font-weight:600;margin:0;}
  .mono{font-family:'IBM Plex Mono',monospace;}
  button{font-family:inherit;cursor:pointer;transition:transform .15s var(--ease),background .2s var(--ease),box-shadow .25s var(--ease),border-color .2s var(--ease),opacity .2s var(--ease);}
  button:active{transform:scale(.96);}
  input,textarea{font-family:inherit;}
  textarea{resize:vertical;}