/* ================= RUMAHKU — RESPONSIVE ================= */
html, body { min-height: 100vh; }
#app-frame { min-height: 100vh; min-height: 100dvh; }
.topbar { padding-top: calc(14px + env(safe-area-inset-top)); }
.bottomnav { padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
@media (orientation: landscape) and (max-height: 520px) {
  .hero-card{padding:12px 14px}.hero-greet{margin:6px 0 10px}.hero-weather{padding:6px 4px}.hw-ico{font-size:15px}.hero-loc{margin-top:6px}
  .quick-grid{grid-template-columns:repeat(8,1fr)}.q-ico{width:44px;height:44px;font-size:19px}.q-item{font-size:10.5px}
  #views{padding-bottom:84px}.bottomnav{padding:5px 4px 6px}.nav-btn .ni{font-size:17px}
  .fab{bottom:74px;width:52px;height:52px;font-size:27px}
  .modal-backdrop{align-items:center}.modal{max-width:640px;border-radius:20px;max-height:92vh}
  .j-gallery{grid-template-columns:repeat(4,1fr)}
}
@media (min-width: 700px) {
  body{background:#cfc8b8}
  #app-frame{max-width:680px;margin:0 auto;border-radius:22px;overflow:hidden;box-shadow:0 12px 50px rgba(0,0,0,.22);min-height:100vh}
  #views{padding:10px 22px 104px}
  .page-title{font-size:24px}.card{padding:18px 20px}
  .quick-grid{grid-template-columns:repeat(6,1fr);gap:14px 10px}.q-ico{width:58px;height:58px;font-size:24px}
  .hero-weather{padding:12px 10px}.balance-num{font-size:34px}
  .modal-backdrop{align-items:center}.modal{max-width:560px;border-radius:22px;max-height:88vh}
  .fab{width:62px;height:62px}
  .j-gallery{grid-template-columns:repeat(3,1fr)}
  .belanja-nums b{font-size:15px}
}
@media (min-width: 1024px) {
  #app-frame{max-width:960px}
  #view-home,#view-finance,#view-report,#view-more,#view-belanja,#view-tasks,#view-links{column-count:2;column-gap:18px}
  #view-home>.card,#view-home>.quick-grid,#view-finance>#finBody>.card,#view-report>.card,#view-more>.card,
  #belanjaList>.belanja-card,#taskList>.task-card,#linksBody>.vendor-card{break-inside:avoid;-webkit-column-break-inside:avoid;display:inline-block;width:100%}
  #view-home .page-title,#view-home>.hero-card,#view-finance .page-title,#view-finance>.balance-card,#view-finance>.seg,
  #view-report .page-title,#view-more .page-title,#view-belanja .page-title,#view-belanja>p,#view-tasks .page-title,#view-tasks>p,#view-tasks>.seg,
  #view-links .page-title,#view-links>.seg{column-span:all;-webkit-column-span:all}
  .quick-grid{grid-template-columns:repeat(4,1fr)}.j-gallery{grid-template-columns:repeat(4,1fr)}.modal{max-width:600px}
}
@media (min-width: 1440px){ #app-frame{max-width:1060px} }
.icon-btn,.nav-btn,.seg-btn,.btn,.mini-add,.fab,.q-item,.u-edit{touch-action:manipulation}