/* ==========================================================================
   WAR BENSIN BALI — responsif & gerak
   Dimuat terakhir supaya aturan mobile menimpa tata letak desktop.
   ========================================================================== */
@media (max-width:900px){
  .only-desktop{display:none!important}
  .top{top:10px;left:10px;right:10px;flex-wrap:wrap;gap:8px}
  .search{order:3;flex-basis:100%;max-width:none}
  .banner{top:116px;left:10px;font-size:11.5px;gap:8px}
  .brand{transform:none}
  .side{top:auto;bottom:0;left:0;right:0;width:auto;max-height:52vh;border-radius:0;
    border-left:0;border-right:0;border-bottom:0}
  .side.hide{transform:translateY(100%)}
  .sheet{top:auto;bottom:0;left:0;right:0;width:auto;max-height:88vh;border-radius:0;
    border-left:0;border-right:0;border-bottom:0}
  .rank{top:auto;bottom:0;left:0;right:0;width:auto;max-height:58vh;border-radius:0}
  .social{top:auto;bottom:0;left:0;right:0;width:auto;max-height:70vh;border-radius:0}
  .legend{display:none}
}

@media (prefers-reduced-motion:reduce){
  .live u{animation:none}
  .skel{animation:none}
}