
/* V5 — tombol dashboard/bank stabil pada layar sempit */
.actions{display:flex!important;flex-wrap:wrap!important;gap:7px!important}.actions a,.actions button,.btn{white-space:nowrap!important;word-break:keep-all!important;overflow-wrap:normal!important;hyphens:none!important;min-width:max-content!important}.actions .primary{background:#1f628e!important;color:#fff!important}@media(max-width:560px){.page,.container,.shell,.dashboard{width:100%!important;max-width:none!important;margin-inline:0!important;padding-left:7px!important;padding-right:7px!important}.actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}.actions a,.actions button,.btn{min-width:0!important;width:100%!important;text-align:center!important;padding-left:7px!important;padding-right:7px!important;font-size:.78rem!important}}@media(max-width:330px){.actions{grid-template-columns:1fr!important}}

/* V6 — perapian dashboard dan kontrol pilihan pada layar HP (2026-07-15) */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.actions a,.actions button,.btn{
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  min-height:44px!important;
  padding:10px 14px!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  hyphens:none!important;
  line-height:1.28!important;
  text-align:center!important;
}
select,option,optgroup{
  max-width:100%;
  font-size:16px!important;
  line-height:1.4!important;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

@media(max-width:720px){
  .topbar-inner{
    gap:10px!important;
    padding:10px 12px 9px!important;
  }
  .brand{width:100%;min-width:0;gap:9px!important}
  .brand img{width:42px!important;height:42px!important;flex:0 0 42px}
  .brand span{
    min-width:0;
    font-size:.96rem!important;
    line-height:1.25!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .navlinks{
    width:calc(100% + 24px)!important;
    max-width:none!important;
    margin-inline:-12px!important;
    padding:2px 12px 8px!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    justify-content:flex-start!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scroll-snap-type:x proximity;
  }
  .navlinks a,.navlinks button{
    flex:0 0 auto!important;
    min-height:42px!important;
    padding:8px 13px!important;
    font-size:.82rem!important;
    white-space:nowrap!important;
    overflow-wrap:normal!important;
    scroll-snap-align:start;
  }
  .container,.doc-shell{
    width:calc(100% - 16px)!important;
    margin:10px auto 44px!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  .hero{padding:24px 18px!important}
  .hero h1{font-size:clamp(1.75rem,9vw,2.35rem)!important;line-height:1.12!important}
  .hero p{font-size:1rem!important;line-height:1.58!important}
  .stats{gap:10px!important}
  .stat{padding:13px 12px!important}
  .stat b{font-size:1.55rem!important}
  .stat span{font-size:.82rem!important;line-height:1.3!important}
  .section{padding:15px!important;margin-top:18px!important}
  .section h2{font-size:1.35rem!important;line-height:1.25!important}
  .section-head p{font-size:.92rem!important;line-height:1.5!important}
  .integration-feature{padding:17px 16px!important;border-radius:18px!important}
  .integration-feature h3{font-size:1.35rem!important;line-height:1.25!important}
  .integration-feature p,.integration-feature li{
    font-size:.93rem!important;
    line-height:1.58!important;
  }
  .integration-feature ul{padding-left:20px!important;margin-bottom:14px!important}
  .card{padding:16px!important}
  .card h3{font-size:1.16rem!important;line-height:1.32!important;margin-bottom:.45rem!important}
  .card p{font-size:.94rem!important;line-height:1.55!important;margin-bottom:.8rem!important}
  .actions,
  .integration-feature .actions,
  .card .actions{
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(min(185px,100%),1fr))!important;
    gap:9px!important;
    width:100%!important;
    align-items:stretch!important;
  }
  .actions a,.actions button,.btn,
  .integration-feature .actions a,.integration-feature .actions button,
  .card .actions a,.card .actions button{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    padding:12px 14px!important;
    font-size:.92rem!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  select{
    width:100%!important;
    min-height:46px!important;
    padding:10px 40px 10px 12px!important;
  }
}

@media(max-width:460px){
  .actions,
  .integration-feature .actions,
  .card .actions{grid-template-columns:1fr!important}
  .hero{padding:22px 16px!important}
  .hero-logo{width:112px!important;height:112px!important}
  .hero h1{font-size:2rem!important}
  .section{padding:14px 12px!important}
  .integration-feature,.card{padding:15px!important}
  .actions a,.actions button,.btn{font-size:.92rem!important}
}
