:root{--b:#1d4ed8;--bd:#1e3a8a;--bl:#dbe7ff;--t:#0f172a;--m:#334155;--lk:#1e40af;--page1:#b9cff6;--page2:#d4e2fb;--card:#fffaf0;--field:#eef3ff;--fb:#5f7fcf;--peach:#ffd9b8;--peach-l:#fff1de;--grad:linear-gradient(145deg,#2f63e8,#1d4ed8);--clay:9px 11px 22px rgba(30,58,138,.38),-6px -6px 14px rgba(255,255,255,.8),inset 4px 4px 8px #fff,inset -5px -5px 10px rgba(194,140,90,.2);--clay-s:5px 6px 12px rgba(30,58,138,.35),-3px -3px 8px rgba(255,255,255,.8),inset 2px 2px 4px #fff,inset -3px -3px 6px rgba(194,140,90,.2)}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,Arial,sans-serif;color:var(--t);line-height:1.65;background:radial-gradient(circle at 92% 4%,rgba(255,200,160,.7),transparent 38%),linear-gradient(160deg,var(--page1),var(--page2)) fixed;min-height:100vh}
header{background:linear-gradient(160deg,#1e40af,#1d4ed8);color:#fff;padding:12px 20px;border-radius:0 0 28px 28px;display:flex;justify-content:space-between;align-items:center;gap:12px;box-shadow:0 10px 22px rgba(30,58,138,.3)}
header strong{font-size:22px}header a{color:#fff;font-weight:600}
main{max-width:780px;margin:0 auto;padding:20px}
.card{background:var(--card);border:2px solid rgba(255,255,255,.95);border-radius:26px;box-shadow:var(--clay);padding:18px 22px;margin-bottom:16px}
h1{margin:10px 0 4px}h2{font-size:19px;margin:0 0 8px;color:var(--bd)}
p{margin:0 0 10px}ul{margin:0 0 10px;padding-left:22px}li{margin-bottom:4px}
a{color:var(--lk)}
table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;padding:8px 10px;border-bottom:1px solid rgba(30,64,175,.22);vertical-align:top}th{color:var(--bd)}
.tablewrap{overflow-x:auto}
.hint{font-size:14px;color:var(--m)}
.ringkas{background:var(--peach-l);border-radius:20px;box-shadow:var(--clay-s);padding:12px 16px;margin-bottom:16px}
.ringkas ul{margin:6px 0 0}
mark.ph{background:#ffe08a;color:#3b2a00;padding:0 4px;border-radius:6px;font-weight:600}
nav.toc{font-size:14px;margin-bottom:16px}nav.toc ol{margin:6px 0 0;padding-left:22px;columns:2}
footer{max-width:780px;margin:0 auto;padding:10px 20px 30px;font-size:14px;color:var(--m)}
:focus-visible{outline:3px solid #b45309;outline-offset:3px}
header :focus-visible{outline-color:#fff}
@media (max-width:600px){nav.toc ol{columns:1}}
