:root{--dasar:#faf7f2;--tinta:#1c1917;--arang:#292524;--oker:#c2410c;--pasir:#f5e9d8;
--s1:#efe0c6;--s2:#dcc09a;--s3:#b8906a;--s4:#6e5642;--s5:#292524;--garis:3px solid var(--arang)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--dasar);color:var(--tinta);font:400 17px/1.7 "Roboto Serif",Georgia,serif}
img{max-width:100%;height:auto;display:block}
a{color:var(--oker);text-underline-offset:3px}
a:hover{color:var(--arang)}
h1,h2,h3,.stensil{font-family:"Big Shoulders Display","Arial Narrow",sans-serif;letter-spacing:.02em;line-height:1.1}
h1{font-size:clamp(2.1rem,6vw,3.4rem);font-weight:800;margin:.2em 0 .4em}
h2{font-size:clamp(1.6rem,4.4vw,2.2rem);font-weight:800;margin:1.8em 0 .5em;padding-top:.3em;border-top:var(--garis)}
h3{font-size:1.35rem;font-weight:600;margin:1.4em 0 .4em}
.stensil{text-transform:uppercase;letter-spacing:.14em;font-weight:800;font-size:.8rem}
.lebar{max-width:1120px;margin:0 auto;padding:0 18px}
.tapak{position:absolute;left:-999px;top:0;background:var(--oker);color:#fff;padding:10px 14px}
.tapak:focus{left:10px;z-index:9}
/* kepala */
.kop{background:var(--arang);color:var(--pasir);border-bottom:6px solid var(--oker)}
.kop-isi{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:10px 18px;max-width:1120px;margin:0 auto}
.merek{display:inline-flex;align-items:center;gap:10px;color:var(--pasir);text-decoration:none;min-height:44px}
.merek b{font:800 1.55rem/1 "Big Shoulders Display",sans-serif;letter-spacing:.04em}
.merek b i{font-style:normal;color:#fb923c}
.bor{display:flex;gap:6px;flex-wrap:wrap;margin:0;padding:0;list-style:none}
.bor a{display:inline-block;min-height:34px;padding:7px 10px;border:2px solid var(--pasir);border-radius:2px;color:var(--pasir);text-decoration:none;font:800 .9rem/1.1 "Big Shoulders Display",sans-serif;letter-spacing:.1em}
.bor a:hover,.bor a[aria-current]{background:var(--oker);border-color:var(--oker);color:#fff}
.laci{margin-left:auto}
.laci summary{cursor:pointer;list-style:none;min-height:40px;padding:8px 14px;background:var(--oker);color:#fff;border-radius:2px;font:800 .95rem/1.4 "Big Shoulders Display",sans-serif;letter-spacing:.12em;text-transform:uppercase}
.laci summary::-webkit-details-marker{display:none}
.laci[open] summary{background:var(--pasir);color:var(--arang)}
.laci-isi{position:absolute;right:12px;left:12px;margin-top:10px;background:var(--pasir);color:var(--tinta);border:var(--garis);border-radius:2px;padding:12px 16px;z-index:5;max-width:520px;margin-left:auto}
.laci-isi p{margin:.4em 0 .2em;color:var(--s4)}
.laci-isi ul{margin:0 0 .4em;padding:0;list-style:none}
.laci-isi li a{display:block;min-height:36px;padding:6px 0;color:var(--arang)}
.kop{position:relative}
/* remah */
.remah{font-size:.9rem;margin:18px 0 0;color:var(--s4)}
.remah ol{list-style:none;margin:0;padding:0;display:block}
.remah li{display:inline}
.remah li+li::before{content:" / ";color:var(--s3)}
/* umum */
main{display:block;padding-bottom:40px}
.tanggal{font-size:.9rem;color:var(--s4)}
.pengantar{font-size:1.1rem}
figure{margin:1.4em 0}
figcaption{font-size:.85rem;color:var(--s4);padding-top:6px;border-bottom:1px dashed var(--s3)}
.bingkai{border:var(--garis);border-radius:2px;overflow:hidden}
.tabel-wadah{overflow-x:auto;margin:1.2em 0;border:var(--garis);border-radius:2px}
table{border-collapse:collapse;width:100%;font-size:.95rem;background:#fff}
th,td{padding:9px 11px;text-align:left;vertical-align:top;border-bottom:1px solid var(--s2)}
thead th{background:var(--arang);color:var(--pasir);font:800 .85rem/1.3 "Big Shoulders Display",sans-serif;letter-spacing:.1em;text-transform:uppercase}
tbody tr:nth-child(even){background:var(--dasar)}
.angka{text-align:right;white-space:nowrap}
.catatan{background:var(--pasir);border-left:8px solid var(--oker);padding:12px 16px;margin:1.4em 0;border-radius:2px}
.catatan .stensil{display:block;color:var(--oker);margin-bottom:4px}
.periksa{list-style:none;padding:0}
.periksa li{padding:6px 0 6px 34px;position:relative;border-bottom:1px dotted var(--s3)}
.periksa li::before{content:"";position:absolute;left:4px;top:12px;width:16px;height:16px;border:3px solid var(--arang);border-radius:2px}
.tombol{display:inline-block;min-height:44px;padding:10px 18px;background:var(--oker);color:#fff;text-decoration:none;border-radius:2px;font:800 1rem/1.5 "Big Shoulders Display",sans-serif;letter-spacing:.12em;text-transform:uppercase;border:3px solid var(--oker)}
.tombol:hover{background:var(--arang);border-color:var(--arang);color:#fff}
.tanya dt{font-weight:600;margin-top:1em}
.tanya dd{margin:.3em 0 0;padding-left:14px;border-left:3px solid var(--s2)}
/* inti bor emiten */
.inti{display:grid;grid-template-columns:1fr;gap:22px;margin-top:10px}
@media(min-width:860px){.inti{grid-template-columns:250px 1fr;align-items:start}.inti>.kolom{position:sticky;top:12px}}
.kolom{margin:0;padding:0;list-style:none;border:var(--garis);border-radius:2px;overflow:hidden}
.kolom li{padding:12px 14px 12px 16px;position:relative}
.kolom li::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:repeating-linear-gradient(90deg,transparent 0 10px,rgba(0,0,0,.18) 10px 14px)}
.kolom .stensil{display:block;font-size:.78rem;opacity:.85}
.kolom span.isi{display:block;font-size:.95rem;line-height:1.45}
.kolom li:nth-child(1){background:var(--s1)}
.kolom li:nth-child(2){background:var(--s2)}
.kolom li:nth-child(3){background:var(--s3)}
.kolom li:nth-child(4){background:var(--s4);color:var(--pasir)}
.kolom li:nth-child(5){background:var(--s5);color:var(--pasir)}
.kolom li:nth-child(4) a,.kolom li:nth-child(5) a{color:#fdba74}
.kedalaman{font:600 .78rem/1 "Big Shoulders Display",sans-serif;position:absolute;right:10px;top:10px;letter-spacing:.1em;opacity:.8}
.lapis-h{display:block}
.lapis-h small{display:block;margin-bottom:6px;font:800 .8rem/1 "Big Shoulders Display",sans-serif;letter-spacing:.14em;color:var(--oker);text-transform:uppercase}
/* beranda */
.pembuka{display:grid;gap:20px;margin-top:24px}
@media(min-width:860px){.pembuka{grid-template-columns:1.1fr .9fr;align-items:end}}
.pembuka .kutip{font-size:1.15rem;border-left:8px solid var(--oker);padding-left:14px}
.penampang{margin:28px 0;border:var(--garis);border-radius:2px;overflow:hidden}
.penampang .langit{background:linear-gradient(#fde7cf,#f5e9d8);padding:10px 16px}
.penampang .lapis{display:grid;grid-template-columns:1fr;gap:6px 16px;padding:16px;position:relative}
@media(min-width:720px){.penampang .lapis{grid-template-columns:160px 1fr 190px;align-items:center}}
.penampang .lapis:nth-of-type(2){background:var(--s1)}
.penampang .lapis:nth-of-type(3){background:var(--s2)}
.penampang .lapis:nth-of-type(4){background:var(--s3)}
.penampang .lapis:nth-of-type(5){background:var(--s4);color:var(--pasir)}
.penampang .lapis:nth-of-type(6){background:var(--s5);color:var(--pasir)}
.penampang .lapis p{margin:0}
.penampang .kode{font:800 2rem/1 "Big Shoulders Display",sans-serif;letter-spacing:.08em}
.penampang .lapis a.tombol{justify-self:start}
.penampang .lapis:nth-of-type(5) .stensil,.penampang .lapis:nth-of-type(6) .stensil{color:#fdba74}
.dua{display:grid;gap:22px}
@media(min-width:860px){.dua{grid-template-columns:1fr 1fr}}
.sampel{list-style:none;padding:0;margin:0;display:grid;gap:14px}
@media(min-width:720px){.sampel{grid-template-columns:repeat(2,1fr)}}
.sampel li{border:var(--garis);border-radius:2px;padding:14px 16px 16px;background:#fff;position:relative}
.sampel li::before{content:"";position:absolute;top:0;left:0;bottom:0;width:10px;background:repeating-linear-gradient(180deg,var(--s2) 0 12px,var(--s4) 12px 18px,var(--s1) 18px 30px)}
.sampel li>*{margin-left:10px}
.sampel h3{margin:.2em 0 .3em 10px}
.sampel p{margin:.2em 0 .6em 10px;font-size:.95rem}
.kaki{background:var(--arang);color:var(--pasir);margin-top:40px;border-top:6px solid var(--oker)}
.kaki-isi{display:grid;gap:18px;padding:26px 18px;max-width:1120px;margin:0 auto}
@media(min-width:760px){.kaki-isi{grid-template-columns:1.2fr 1fr 1fr}}
.kaki p{margin:.3em 0}
.kaki .stensil{color:#fdba74}
.kaki ul{list-style:none;margin:0;padding:0}
.kaki li a{display:inline-block;min-height:32px;padding:5px 0;color:var(--pasir)}
.kaki small{display:block;font-size:.85rem;color:var(--s2);padding:0 18px 22px;max-width:1120px;margin:0 auto}
.galat{text-align:center;padding:40px 0}
