/* ==========================================================================
   TOKENS — "Neo-Brutalist RT"
   Sumber tunggal untuk warna, tipografi, spasi, dan gerak.
   Ubah di sini, seluruh situs ikut. Jangan menulis hex mentah di berkas lain.

   Palet diambil dari aplikasi referensi (keuangan-rt-clone): kuning #FFD400,
   biru #2148F5, merah #E8353A, tinta hampir hitam, sudut tajam, border tebal,
   bayangan keras offset. Struktur berkas/komponen TIDAK diubah — hanya nilai
   token di sini, supaya seluruh situs ikut berubah tema tanpa menyentuh HTML.
   Rujukan keputusan: DECISIONS.md CP-19 (menggantikan CP-05 "Editorial Ledger").
   ========================================================================== */

:root {
  /* --- Warna: mode terang --------------------------------------------------
     Putih bersih, bukan kertas hangat. Kedalaman dibawa BORDER TEBAL dan
     bayangan keras offset, bukan garis rambut tipis seperti tema lama. */
  --paper:          #FFFFFF;
  --surface:        #FFFFFF;
  --surface-alt:    #F5F5F0;
  --surface-sunk:   #ECECE5;

  --ink:            #0A0A0A;
  --ink-2:          #38383A;
  --ink-3:          #5C5C5E;   /* ≥4.5:1 di atas --paper */

  --line:           #0A0A0A;   /* border struktural sekarang TINTA PENUH, bukan abu tipis */
  --line-soft:      #D6D6CE;   /* untuk pemisah internal yang sengaja diredam (mis. baris tabel) */
  --line-strong:    #0A0A0A;

  /* Latar footer — biru-navy nyaris hitam, diambil dari contoh warna yang
     diminta user. Dipisah dari --ink karena ini khusus latar .site-footer,
     bukan bagian palet neo-brutalist utama di atas. */
  --footer-bg:      #0D1117;

  /* Aksen utama: biru. Dipakai untuk tautan, tombol utama, fokus, dan
     pos "Iuran" — mencerminkan konvensi aplikasi referensi (I = biru). */
  --accent:         #2148F5;
  --accent-hover:   #1636C2;
  --accent-soft:    #E7ECFE;
  --accent-line:    #2148F5;

  /* Kuning brand — dipakai untuk sorotan/penekanan (bukan teks di atas
     putih; hanya sebagai isian dengan teks tinta di atasnya). */
  --highlight:      #FFD400;
  --highlight-ink:  #0A0A0A;

  --critical:       #E8353A;
  --critical-soft:  #FCE7E7;
  --critical-line:  #E8353A;

  /* Tiga pos dana — warna hanya penguat, tidak pernah satu-satunya
     penyampai makna (selalu didampingi huruf I/P/L, lihat komponen matrik).
     Iuran = biru, IPAL = kuning, Lelayu = merah, meniru badge aplikasi
     referensi. */
  --pos-iuran:      #2148F5;
  --pos-ipal:       #FFD400;
  --pos-lelayu:     #E8353A;
  --pos-iuran-soft: #E7ECFE;
  --pos-ipal-soft:  #FFF6D1;
  --pos-lelayu-soft:#FCE7E7;

  /* Kuning murni terlalu terang untuk jadi warna TEKS di atas putih (gagal
     kontras AA). Dipakai khusus di tempat pos-ipal muncul sebagai warna
     teks/ikon, bukan sebagai isian lencana — nilai ini sudah diverifikasi
     Bootstrap sebagai teks amber yang aman di atas putih (≥4.5:1). */
  --pos-ipal-ink:   #664D03;

  --focus:          #2148F5;
  --focus-ring:     0 0 0 2px var(--paper), 0 0 0 4px var(--focus);

  /* Latar bergerak lama (aurora blur + butiran kertas) DIMATIKAN — blur
     lembut bertentangan dengan bahasa neo-brutalist yang tegas dan datar.
     Elemen DOM-nya tetap ada (struktur tidak diubah), hanya opasitasnya
     dinolkan lewat token di sini. Kisi garis tetap ada, diredam halus. */
  --aurora-a:       #2148F5;
  --aurora-b:       #E8353A;
  --aurora-opacity: 0;
  --grid-opacity:   0.35;
  --grain-opacity:  0;

  /* --- Tipografi ---------------------------------------------------------- */
  --font-display: 'Archivo', 'Segoe UI', system-ui, sans-serif;
  --font-text:    'Inter', 'Segoe UI', system-ui, sans-serif;
  --font-num:     'JetBrains Mono', ui-monospace, 'Cascadia Mono', monospace;

  /* Basis 17px, bukan 16px — dinaikkan demi warga sepuh (CP-06).
     Semua ukuran memakai rem, jadi satu angka ini menggeser seluruh skala. */
  --fs-2xs:  0.71rem;
  --fs-xs:   0.77rem;
  --fs-sm:   0.88rem;
  --fs-base: 1rem;
  --fs-md:   1.18rem;
  --fs-lg:   1.53rem;
  --fs-xl:   clamp(1.75rem, 1.4rem + 1.6vw, 2.1rem);
  --fs-2xl:  clamp(2.1rem, 1.5rem + 3vw, 2.9rem);
  --fs-3xl:  clamp(2.6rem, 1.6rem + 5vw, 4.2rem);
  --fs-hero: clamp(2.9rem, 1.4rem + 7vw, 5.6rem);

  --lh-tight: 1.08;
  --lh-snug:  1.3;
  --lh-base:  1.6;
  --lh-loose: 1.75;

  --ls-display: -0.01em;   /* brutalist: tracking netral, bukan ketat editorial */
  --ls-tight:    0em;
  --ls-label:    0.1em;

  /* --- Spasi (kelipatan 4) ------------------------------------------------ */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.5rem;
  --sp-6:  2rem;
  --sp-7:  3rem;
  --sp-8:  4rem;
  --sp-9:  6rem;
  --sp-10: 8rem;

  --section-y: clamp(3rem, 2rem + 5vw, 6rem);
  --gutter:    clamp(1.15rem, 0.6rem + 2.6vw, 3rem);
  --measure:   68ch;
  --container: 1240px;
  --container-narrow: 860px;

  /* --- Bentuk --------------------------------------------------------------
     Sudut tajam di mana-mana — ciri utama neo-brutalist. Karena hampir
     semua komponen memakai variabel --r-*, mengubahnya di sini saja sudah
     menajamkan seluruh situs tanpa menyentuh components.css. */
  --r-sm:   0px;
  --r-md:   0px;
  --r-lg:   0px;
  --r-xl:   0px;
  --r-pill: 999px;   /* pil/lencana bulat tetap bulat — itu bahasa visual sendiri */

  /* Ketebalan border struktural (kartu, tombol, panel, tabel). */
  --bw-1: 1.5px;   /* pemisah internal ringan */
  --bw-2: 2px;      /* standar: kartu, tombol, input */
  --bw-3: 3px;      /* elemen hero/penekanan tinggi */

  /* Bayangan keras offset, bukan blur lembut. Memakai var(--ink) supaya
     otomatis menyesuaikan saat mode gelap (ink jadi terang → bayangan
     ikut terang) tanpa perlu didefinisikan ulang di blok dark mode. */
  --sh-1: 2px 2px 0 0 var(--ink);
  --sh-2: 3px 3px 0 0 var(--ink);
  --sh-3: 6px 6px 0 0 var(--ink);

  /* --- Gerak -------------------------------------------------------------- */
  --t-fast: 150ms;
  --t-base: 200ms;   /* sedikit lebih cepat — brutalist terasa tegas, bukan mengalun */
  --t-slow: 320ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:  cubic-bezier(0.7, 0, 0.84, 0);
  --ease-mid: cubic-bezier(0.4, 0, 0.2, 1);
  /* "Overshoot" — elemen melewati sedikit posisi akhirnya lalu mental balik,
     seperti kartu yang jatuh lalu "klik" masuk ke tempatnya. Dipakai khusus
     untuk reveal saat gulir; terasa pas dengan bahasa neo-brutalist yang
     tegas, bukan mengalun lembut. */
  --ease-overshoot: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* --- Lapisan ------------------------------------------------------------ */
  --z-bg:     0;
  --z-base:   1;
  --z-sticky: 20;
  --z-header: 40;
  --z-overlay:60;
  --z-toast:  80;

  --touch: 44px;

  /* Mode gelap otomatis DIMATIKAN (CP-20) — situs sekarang selalu terang,
     berapa pun preferensi sistem/peramban pengunjung. `color-scheme: light`
     (bukan `light dark`) juga memberi tahu peramban supaya kontrol bawaan
     (scrollbar, kalender tanggal bawaan, dsb.) ikut dirender terang, tidak
     cuma variabel kita saja. */
  color-scheme: light;
}
