html, body { max-width:100%; overflow-x:clip; }
main, section, article, form, fieldset { min-width:0; }
img, svg, video { max-width:100%; height:auto; }
.brand img { display:block; width:150px; height:auto; max-width:100%; }
input, select, textarea, button { max-width:100%; }

@media (max-width:860px) {
  html, body { overscroll-behavior-x:none; touch-action:pan-y; }
  body.navigation-open { overflow:hidden; }
  h1, h2, h3, p, a, code, small { overflow-wrap:anywhere; }
  .topbar { min-height:68px; height:auto!important; padding-top:14px!important; padding-bottom:14px!important; }
  .hero, .intro { min-width:0; }
  .filters, .share-line, .new-category form { min-width:0!important; }
  input:not([type="color"]):not([type="checkbox"]):not([type="radio"]), select, textarea {
    width:100%; min-width:0; font-size:16px!important;
  }
  form, .editor, .goal-editor, .category-card { max-width:100%; }
}

@media (max-width:560px) {
  .topbar-actions { display:flex; align-items:center; gap:8px; }
  .topbar-actions .new-transaction { white-space:nowrap; }
  .new-category, .budget-panel, .link-card { padding-left:18px!important; padding-right:18px!important; }
  .share-line { grid-template-columns:1fr!important; }
  .share-line button { min-height:44px; }
  .transaction-summary { min-width:0; }
  .transaction-main { min-width:0; }
  .transaction-main strong, .transaction-main small { overflow:hidden; text-overflow:ellipsis; }
}