/* =====================================================================
   Sistem gaya bersama — halaman teks panjang (/privasi, /hapus-akun).

   Halaman muka SENGAJA tidak memakai berkas ini: ia menaruh gayanya inline
   supaya render pertama tidak menunggu satu permintaan pun. Dua halaman ini
   lain — orang sampai ke sini karena mencari sesuatu, bukan karena mendarat,
   jadi satu permintaan CSS yang bisa di-cache lebih baik daripada menyalin
   empat ratus baris ke dua tempat dan membiarkannya berbeda pelan-pelan.

   Kalau token di sini berubah, halaman muka HARUS ikut diubah tangan.
   Dua bahasa desain yang berjarak satu klik dari kaki halaman lebih telanjang
   daripada satu bahasa yang seragam.
   ===================================================================== */

/* Font di-host sendiri, bukan dari CDN Google.
   Dua alasan, keduanya nyata: CDN menambah dua koneksi (preconnect ke
   googleapis + gstatic) di jalur kritis, dan ia menaruh nasib tipografi
   halaman ini pada pihak ketiga yang bisa diblokir jaringan kantor atau
   negara. Berkasnya subset latin, dan Newsreader serta Jakarta keduanya
   variabel — satu berkas melayani seluruh rentang bobotnya. */
@font-face{
  font-family:'Newsreader'; font-style:normal; font-weight:400 600;
  font-display:swap; src:url('/font/newsreader.woff2') format('woff2');
}
@font-face{
  font-family:'Newsreader'; font-style:italic; font-weight:400;
  font-display:swap; src:url('/font/newsreader-italic.woff2') format('woff2');
}
@font-face{
  font-family:'Plus Jakarta Sans'; font-style:normal; font-weight:500 800;
  font-display:swap; src:url('/font/jakarta.woff2') format('woff2');
}

:root{
  --kertas:#FBF8F3; --kertas2:#F4EFE6;
  --tinta:#191512; --tinta2:#56504A; --tinta3:#6E655C;
  --garis:#D9CDB8;
  --emas-teks:#8A6612; --emas-tanda:#C89A24;
  --awas-teks:#9A3412; --awas-tanda:#C2410C;
  --pad:20px;
  --serif:'Newsreader',ui-serif,Georgia,serif;
  --sans:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --kertas:#14110D; --kertas2:#1E1A15; --tinta:#EFE8DC; --tinta2:#A79D90;
    --tinta3:#918779; --garis:#332B22;
    --emas-teks:#FFBE3D; --emas-tanda:#FFBE3D;
    --awas-teks:#FB923C; --awas-tanda:#FB923C;
  }
}
@media (prefers-contrast:more){ :root{ --garis:#B9A98C } }

*{ box-sizing:border-box }

body{
  margin:0; background:var(--kertas); color:var(--tinta);
  font:400 17.5px/1.68 var(--serif);
  font-variant-numeric:tabular-nums; hyphens:none;
  -webkit-font-smoothing:antialiased;
}

/* Kolom baca dipasang pada elemen teks, bukan pembungkus — tabel dan garis
   boleh lebih lebar daripada prosa. 62ch untuk teks hukum: lebih lebar dari
   halaman muka karena kalimatnya panjang-panjang dan pembacanya menelusuri,
   bukan menikmati. */
.wrap{ width:min(100% - 2*var(--pad), 46rem); margin-inline:auto;
       padding:0 var(--pad) 96px }

/* KOP — sama persis dengan halaman muka. */
header{ display:flex; align-items:center; gap:9px; padding:26px 0 14px;
        border-bottom:1px solid var(--garis); margin-bottom:56px }
.lambang{ width:22px; height:22px; border-radius:7px; flex:0 0 auto;
          background:radial-gradient(120% 120% at 18% 15%,#1A2445,#050814);
          display:flex; align-items:center; justify-content:center }
.lambang svg{ width:13px; height:13px }
@media (prefers-color-scheme:dark){ .lambang{ outline:1px solid var(--garis) } }
.nama{ font:800 11px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase;
       color:var(--tinta) }
.oleh{ display:none }   /* eyebrow "BY COREASIA" dibuang: kop halaman muka juga
                           tidak punya, dan dua kop yang berbeda merusak ilusi
                           satu benda. */

h1{ font:600 clamp(1.9rem,5.2vw,2.8rem)/1.12 var(--serif); letter-spacing:-.02em;
    margin:0 0 10px; color:var(--tinta); text-wrap:balance }
.tgl{ font:500 12.5px/1.6 var(--sans); color:var(--tinta3); margin:0 0 44px;
      padding-bottom:14px; border-bottom:1px solid var(--garis) }

h2{ font:800 11px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase;
    color:var(--tinta3); margin:56px 0 14px }

p{ margin:0 0 1.05em; color:var(--tinta2); max-width:62ch; text-wrap:pretty }
ul,ol{ color:var(--tinta2); padding-left:1.3em; max-width:62ch; margin:.6em 0 1.1em }
li{ margin:.42em 0 }
strong{ color:var(--tinta); font-weight:600 }
em{ font-style:italic }
code{ font:500 .88em/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
      background:var(--kertas2); padding:.12em .38em; color:var(--tinta) }

a{ color:var(--emas-teks); text-decoration:underline; text-underline-offset:3px;
   text-decoration-thickness:1px;
   text-decoration-color:color-mix(in srgb,var(--emas-teks) 45%,transparent) }
a:hover{ text-decoration-thickness:2px }
::selection{ background:color-mix(in srgb,var(--emas-tanda) 18%,transparent) }

/* KARTU → bukan kartu lagi.
   Kotak ber-radius dan berbingkai adalah komponen paling generik di web, dan
   sistem ini membuangnya. Yang tersisa cuma penanda tepi kiri: cukup untuk
   menandai "baca yang ini", tanpa satu pun sudut membulat. */
.kartu{ border-left:2px solid var(--garis); padding:2px 0 2px 20px; margin:26px 0 }
.kartu p:last-child{ margin-bottom:0 }
.kartu.tegas{ border-left-color:var(--emas-tanda) }
.kartu.tegas strong{ color:var(--emas-teks) }
.kartu.awas{ border-left-color:var(--awas-tanda) }
.kartu.awas strong{ color:var(--awas-teks) }

table{ border-collapse:collapse; width:100%; margin:18px 0 26px;
       font:500 14px/1.55 var(--sans); display:block; overflow-x:auto }
th,td{ text-align:left; padding:10px 14px 10px 0; border-bottom:1px solid var(--garis);
       vertical-align:top; color:var(--tinta2) }
th{ font:800 10.5px/1.4 var(--sans); letter-spacing:.12em; text-transform:uppercase;
    color:var(--tinta3); white-space:nowrap }

footer{ margin-top:72px; padding-top:20px; border-top:1px solid var(--garis);
        font:500 12.5px/1.7 var(--sans); color:var(--tinta3) }
footer a{ color:var(--tinta3) }