/* v88toto88.com - grafit dingin + perak es. Satu baris kepala, badan dibagi pita
   selebar layar berselang warna, daftar kondisi bergaya lembar periksa. */
:root{
  --base:#16181C; --band:#1D2026; --band2:#23262D; --edge:#2E333B;
  --ice:#AFC3D4; --ice2:#7A8896; --white:#F2F5F8;
  --go:#6FD3A3; --stop:#E2795F; --mark:#8FB4D8;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--base);color:var(--ice);
  font:16.5px/1.75 Verdana,Geneva,"DejaVu Sans",Tahoma,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:var(--mark)}
a:hover{color:var(--white)}
:focus-visible{outline:2px solid var(--go);outline-offset:3px}

/* satu baris kepala: lambang kiri, navigasi kanan */
.atas{background:var(--band);border-bottom:1px solid var(--edge)}
.atas .baris{max-width:1000px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;
  justify-content:space-between;gap:18px;flex-wrap:wrap}
.atas a.tera{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--white)}
.atas img{height:auto;max-height:40px;width:auto}
.atas .kode{width:40px;height:40px;flex:none;display:grid;place-items:center;border:1px solid var(--ice2);
  color:var(--ice);font-size:13px;font-weight:700}
.atas .sebutan{font-size:17.5px;font-weight:700;letter-spacing:.3px;line-height:1.2}
.atas .anak{display:block;font-size:11px;color:var(--ice2);font-weight:400;margin-top:2px}
.atas nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 2px}
.atas nav a{display:block;padding:9px 11px;color:var(--ice2);text-decoration:none;font-size:12.5px;
  min-height:40px;line-height:22px}
.atas nav a:hover{color:var(--white)}
.atas nav a[aria-current]{color:var(--go);border-bottom:2px solid var(--go)}

/* pernyataan */
.nyata{background:#101216;border-bottom:1px solid var(--edge);color:var(--ice2);font-size:12.5px}
.nyata p{margin:0;padding:10px 20px;max-width:1000px;margin-inline:auto;line-height:1.55}
.nyata strong{color:var(--stop)}

/* pita selebar layar, berselang warna */
.pita{padding:30px 20px}
.pita:nth-of-type(odd){background:var(--base)}
.pita:nth-of-type(even){background:var(--band)}
.pita>*{max-width:680px;margin-inline:auto}

.rute{list-style:none;padding:0;margin:0 auto 14px;font-size:12px;color:var(--ice2);display:flex;gap:8px;
  flex-wrap:wrap;max-width:680px}
.rute a{color:var(--ice2)}

h1{font-size:29px;line-height:1.3;font-weight:700;margin:2px auto 16px;color:var(--white);letter-spacing:-.2px;
  max-width:680px}
h2{font-size:21px;font-weight:700;margin:0 auto 12px;color:var(--white);line-height:1.36;max-width:680px}
h3{font-size:14.5px;font-weight:700;margin:20px auto 6px;color:var(--go);max-width:680px}
p{margin:0 auto 15px;max-width:680px}
.awal{font-size:17px;line-height:1.7;color:var(--ice2);margin:0 auto 4px;max-width:680px}
strong{color:var(--white)}

/* lembar periksa kondisi */
.lembar{max-width:680px;margin:6px auto 0}
.lembar .atasnya{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;
  padding-bottom:9px;border-bottom:1px solid var(--edge);margin-bottom:4px}
.lembar .atasnya h2{margin:0;font-size:15.5px;max-width:none}
.lembar .atasnya time{font-size:12px;color:var(--ice2)}
.baris-cek{display:flex;align-items:center;gap:13px;padding:13px 2px;border-bottom:1px solid var(--edge)}
.baris-cek:last-child{border-bottom:0}
.kotak{width:19px;height:19px;flex:none;border:1.5px solid var(--go);position:relative}
.kotak::after{content:"";position:absolute;left:5px;top:1px;width:6px;height:11px;
  border-right:2px solid var(--go);border-bottom:2px solid var(--go);transform:rotate(42deg)}
.kotak.silang{border-color:var(--stop)}
.kotak.silang::after{left:7px;top:3px;width:2px;height:12px;border:0;background:var(--stop);
  box-shadow:0 0 0 0 transparent;transform:rotate(45deg)}
.baris-cek .sebut{flex:1;font-size:14px}
.baris-cek .sebut b{display:block;font-size:12px;color:var(--ice2);font-weight:400;margin-bottom:1px}
.baris-cek .nilai{font-size:12.5px;color:var(--go);white-space:nowrap}
.baris-cek .nilai.buruk{color:var(--stop)}

/* kutip */
.tegas{max-width:680px;margin:20px auto;border:1px solid var(--edge);border-left:3px solid var(--go);
  background:var(--band2);padding:14px 17px}
.tegas p{margin:0}
.tegas p+p{margin-top:12px}

/* dua sisi */
.sisian{display:grid;grid-template-columns:1fr 1fr;gap:15px;max-width:680px;margin:20px auto}
.sisian>div{border-top:1px solid var(--edge);padding-top:12px}
.sisian h3{margin-top:0;max-width:none}
.sisian p{max-width:none;margin-bottom:0}

/* langkah */
ol.jenjang{counter-reset:j;list-style:none;padding:0;margin:18px auto;max-width:680px}
ol.jenjang li{counter-increment:j;padding:0 0 14px 38px;position:relative;margin:0}
ol.jenjang li::before{content:counter(j,decimal-leading-zero);position:absolute;left:0;top:2px;
  color:var(--go);font-size:13px;font-weight:700;letter-spacing:.5px}
ol.jenjang li b{display:block;font-size:14.5px;color:var(--white);margin-bottom:2px}

ul.daftar{padding-left:19px;margin:14px auto;max-width:680px}
ul.daftar li{margin-bottom:8px}

/* tabel */
table.rekap{width:100%;max-width:680px;margin:18px auto;border-collapse:collapse;font-size:13.5px}
table.rekap th{text-align:left;padding:9px 11px;border-bottom:1.5px solid var(--edge);font-size:11.5px;
  color:var(--ice2);font-weight:700}
table.rekap td{padding:10px 11px;border-bottom:1px solid var(--edge);vertical-align:top}
table.rekap tr:last-child td{border-bottom:0}

/* tanya */
.tanyaan{max-width:680px;margin:0 auto}
.tanyaan h2{margin-bottom:8px}
.tanyaan details{border-bottom:1px solid var(--edge)}
.tanyaan summary{cursor:pointer;padding:14px 32px 14px 0;position:relative;list-style:none;font-size:14.5px;
  color:var(--white);font-weight:700}
.tanyaan summary::-webkit-details-marker{display:none}
.tanyaan summary::after{content:"+";position:absolute;right:6px;top:12px;color:var(--go);font-size:18px;font-weight:400}
.tanyaan details[open] summary::after{content:"\2212"}
.tanyaan p{margin:0 0 14px;font-size:14.5px;color:var(--ice2);max-width:none}

/* kaki */
.bawah{background:#101216;border-top:1px solid var(--edge)}
.bawah .ruang{max-width:1000px;margin:0 auto;padding:26px 20px 34px}
.bawah ul{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-wrap:wrap;gap:2px 20px}
.bawah a{color:var(--ice2);text-decoration:none;font-size:12.5px;display:inline-block;padding:7px 0;
  min-height:36px;line-height:22px}
.bawah a:hover{color:var(--mark)}
.bawah .kecil{font-size:12px;color:var(--ice2);line-height:1.66}
.bawah .kecil p{margin:0 0 9px;max-width:none}
.usia{display:inline-block;border:1px solid var(--stop);color:var(--stop);padding:1px 7px;font-size:11px;
  font-weight:700;margin-right:6px}

@media (max-width:640px){
  body{font-size:15.5px}
  h1{font-size:23px} h2{font-size:19px}
  .sisian{grid-template-columns:1fr}
  .atas .baris{padding:12px 16px}
  .atas nav a{padding:8px 9px;font-size:12px}
  .pita{padding:24px 16px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}