:root{--bg:#0b0b0b;--fg:#f2f2f2;--muted:#b9b9b9;--card:#121212;--accent:#d4af37}
    *{box-sizing:border-box}
    body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial;line-height:1.6;background:var(--bg);color:var(--fg)}
    a{color:var(--accent);text-decoration:none}
    a:hover{text-decoration:underline}
    header,main,footer{max-width:1000px;margin:auto;padding:16px}
    header h1{font-size:clamp(1.25rem,2.5vw,1.75rem);margin:.25em 0}
    .card{background:var(--card);border-radius:1px;padding:16px;margin:16px 0}
    .muted{color:var(--muted)}
    .center{text-align:center}
    img{max-width:100%;height:auto;border-radius:1px;}
    table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
    th,td{border:1px solid #222;padding:8px;text-align:center}
    th{background:#161616}
    iframe{width:100%;border:0;border-radius:12px}
    ul{padding-left:18px}
    blockquote{border-left:4px solid var(--accent);padding-left:12px;margin:16px 0;color:var(--muted)}
    .badge{display:inline-block;background:#1b1b1b;border:1px solid #222;border-radius:999px;padding:4px 10px;margin-right:6px}

   
    nav.card{padding:0;background:orangered;overflow:hidden}
    nav.card a{
      display:block;
      width:100%;
      padding:14px 12px;
      margin:0;
      background:#ff8c00;
      color:#111;
      font-weight:600;
      border-bottom:1px solid rgba(0,0,0,.15);
      border-radius:0;
      text-decoration:none
    }
    nav.card a:last-child{border-bottom:none}
    nav.card a:hover{background:#ffa733;color:#000;text-decoration:none}
  

  
    table{background:#ffffff;color:#000000}
    table th{background:#ff8c00;color:#000000}
    table td{background:#ffffff;color:#000000}
    
  
.header-banner{
  display:flex;
  flex-direction:column;   
  align-items:center;      
  gap:12px;
  margin:16px 0;
}

.header-banner a{
  display:block;
  text-align:center;
}

.header-banner img{
  display:block;
  width:auto;
  max-width:100%;          
  height:auto;
  margin:0 auto;           
}
.floating-top,
.floating-bottom{
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  width: 728px;
  max-width: 100%;
  z-index: 9999;

  display: flex;
  flex-direction: column;   
  align-items: center;
  gap: 6px;                
  pointer-events: auto;
}

/* posisi */
.floating-top{
  top: 10px;
}

.floating-bottom{
  bottom: 10px;
}


.floating-top a,
.floating-bottom a{
  display: block;
  width: 728px;
  max-width: 100%;
  line-height: 0;
}


.floating-top img,
.floating-bottom img{
  display: block;
  width: 728px;
  height: 80px;
  max-width: 100%;
  object-fit: contain;
}

  
.last-update {
  font-size: 13px;
  color: #666;
  margin-bottom: 10px;
}

    @media (max-width:1000px){
      table th, table td{padding:7px;font-size:14px}
      .floating-top,
  .floating-bottom{
    width: 728px;
  }
    }

    @media (max-width:768px){
      table th, table td{padding:6px;font-size:13.5px}
      .floating-top,
  .floating-bottom{
    width: 100%;
    padding: 0 6px;
  }

  .floating-top a,
  .floating-bottom a,
  .floating-top img,
  .floating-bottom img{
    width: 100%;
    height: auto;
  }
    }

    @media (max-width:600px){
      table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
      table th, table td{padding:6px;font-size:13px;white-space:nowrap}
      .floating-top img,
  .floating-bottom img{
    height: 80px; 
  }
    }

    @media (max-width:320px){
      table th, table td{padding:5px;font-size:12px}
        .floating-top,
  .floating-bottom{
    gap: 4px;
  }
    }
/* container */
.floating-top,
.floating-bottom{
  position:fixed;
  left:50%;
  transform:translateX(-50%);
  z-index:9999;
  display:flex;
  flex-direction:column;
  gap:0px;
  pointer-events:auto;
}

/* posisi */
.floating-top{ top:0; }
.floating-bottom{ bottom:0; }

/* link & gambar */
.floating-top a,
.floating-bottom a{
  display:block;
}

.floating-top img,
.floating-bottom img{
  width:728px;
  height:80px;
  max-width:100%;
  object-fit:contain;
  display:block;
}


@media (max-width:1000px){
  .floating-top img,
  .floating-bottom img{
    width:100%;
    height:auto;
  }
   header,main,footer{
    max-width:100%;
    padding:5px;
  }

  .card{
    padding:5px;
  }
}

@media (min-width: 1001px){
  nav.card{
    display: flex;
    justify-content: flex-start; 
    align-items: center;
    gap: 1px;
    padding: 8px 12px;
  }

  nav.card a{
    width: auto;               
    display: inline-block;
    padding: 8px 14px;
    border-bottom: none;       
    border-radius: 1px;
  }
}

@media (max-width:600px){
  #dtTable{
    display: table;         
    width: 100%;
    min-width: 100%;        
    margin: 0 auto;         
  }
}
#histats-wrap{
  width:100% !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  margin:20px auto !important;
  clear:both !important;
}

/* Tangkap elemen Histats hasil inject */
#histats-wrap iframe,
#histats-wrap img,
#histats-wrap a{
  display:block !important;
  margin:0 auto !important;
}