/* Halaman legal (Syarat & Ketentuan, Kebijakan Privasi).
   Sengaja HTML statis, bukan bagian dari app React: harus terbaca tanpa
   JavaScript oleh pemeriksa Google OAuth dan mesin pencari. Token warna
   disalin dari index.html — kalau palet utama berubah, ubah juga di sini. */
:root {
  --bg:#FFFFFF; --bg2:#F3F7FD; --card:#FFFFFF; --line:#E1E8F3; --line2:#CFDAEC;
  --text:#0A1120; --dim:#5A6B85; --brand:#247BFF; --brandSoft:#EAF2FF;
  --accent:#DD2B20; --logoFx:none; --pad:16px;
  color-scheme:light;
}
:root[data-theme="dark"] {
  --bg:#070C16; --bg2:#0A1120; --card:#0D1526; --line:#1A2740; --line2:#243553;
  --text:#E9EFFA; --dim:#8899B4; --brand:#3B8BFF; --brandSoft:#102340;
  --accent:#FF4F44; --logoFx:invert(1) hue-rotate(180deg);
  color-scheme:dark;
}
@media (min-width:960px){ :root{ --pad:20px; } }

*,*::before,*::after{ box-sizing:border-box; }
html{ background:var(--bg); -webkit-text-size-adjust:100%; scroll-padding-top:76px; }
body{ margin:0; background:var(--bg); color:var(--text); font-size:15.5px; line-height:1.7;
      font-family:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif; -webkit-font-smoothing:antialiased; }
a{ color:var(--brand); }
a:hover{ color:var(--text); }
:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; border-radius:4px; }
h1,h2,h3{ font-family:'Chakra Petch',system-ui,sans-serif; letter-spacing:-.01em; line-height:1.25; }

.top{ position:sticky; top:0; z-index:5; background:var(--bg); border-bottom:1px solid var(--line); }
.top-in{ max-width:1200px; margin:0 auto; padding:12px var(--pad);
         display:flex; align-items:center; justify-content:space-between; gap:12px; }
.top img{ display:block; height:28px; width:auto; filter:var(--logoFx); }
.top-back{ font-size:13px; font-weight:700; text-decoration:none; }

.doc{ max-width:760px; margin:0 auto; padding:30px var(--pad) 56px; }
.doc h1{ position:relative; margin:0; padding-bottom:12px; font-size:clamp(26px,6.5vw,34px); }
.doc h1::after{ content:""; position:absolute; left:0; bottom:0; width:48px; height:3px;
                border-radius:2px; background:var(--accent); }
.meta{ margin:14px 0 0; font-size:13px; color:var(--dim); }
.lead{ margin:18px 0 0; font-size:16px; }

.summary{ margin:24px 0 0; padding:16px 18px; border-radius:14px; background:var(--brandSoft); }
.summary h2{ margin:0 0 6px; font-size:16px; }
.summary ul{ margin:0; padding-left:20px; }
.summary li{ margin:4px 0; }

.toc{ margin:24px 0 0; padding:16px 18px; border:1px solid var(--line); border-radius:14px; }
.toc b{ display:block; margin-bottom:6px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); }
.toc ol{ margin:0; padding-left:22px; columns:1; }
@media (min-width:640px){ .toc ol{ columns:2; column-gap:28px; } }
/* padding, bukan margin: margin atas hilang di awal kolom kedua sehingga
   kedua kolom tidak sejajar. ".doc" supaya menang dari aturan .doc li. */
.doc .toc li{ margin:0; padding:3px 0; break-inside:avoid; font-size:14px; }
.toc a{ text-decoration:none; }
.toc a:hover{ text-decoration:underline; }

.doc section{ margin-top:34px; }
.doc h2{ margin:0 0 10px; font-size:21px; }
.doc h3{ margin:18px 0 6px; font-size:16px; }
.doc p{ margin:10px 0; }
.doc ul,.doc ol{ margin:10px 0; padding-left:22px; }
.doc li{ margin:5px 0; }

.tbl{ margin:12px 0; overflow-x:auto; border:1px solid var(--line); border-radius:12px; }
.tbl table{ width:100%; min-width:520px; border-collapse:collapse; font-size:14px; line-height:1.55; }
.tbl th,.tbl td{ padding:10px 12px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line); }
.tbl th{ background:var(--bg2); font-size:12.5px; font-weight:800; color:var(--dim); }
.tbl tr:last-child td{ border-bottom:0; }
code{ padding:1px 5px; border-radius:5px; background:var(--bg2); font-size:.9em; }

.note{ margin:14px 0; padding:12px 14px; border-left:3px solid var(--brand); border-radius:0 10px 10px 0;
       background:var(--bg2); font-size:14.5px; }

.foot{ border-top:1px solid var(--line); }
.foot-in{ max-width:760px; margin:0 auto; padding:20px var(--pad); display:flex; flex-wrap:wrap;
          gap:8px 18px; font-size:13px; color:var(--dim); }
.foot a{ text-decoration:none; }
.foot a[aria-current="page"]{ color:var(--text); font-weight:700; }