/* Visual feedback only; pointer tracking never captures or prevents gestures. */
:root {
  --press-down-duration: 70ms;
  --press-release-duration: 220ms;
  --press-release-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --press-scale: .96;
  --press-surface: rgb(108 108 120 / 14%);
}

/* Keep small text actions, filters and icon actions comfortable to tap. */
:where(button, [role="button"], input[type="button"], input[type="submit"], input[type="reset"], summary) {
  box-sizing: border-box;
  min-height: 44px;
  min-width: 44px;
}
.icon-button { width: 44px; height: 44px; flex-shrink: 0; }
.check-field { min-height: 44px; }
.search-box input { font-size: 16px; }
/* Touch controls respond as controls; editable text keeps native selection. */
:where(button, [role="button"], .sheet-head, .bank-institution-header, .check-field) {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
:where(input, textarea, [contenteditable="true"]) {
  -webkit-user-select: text;
  user-select: text;
}

/* Exclude navigation: its pill and pointer capture own the drag interaction. */
:where(button:not(.tab), a[href], [role="button"]:not(.tab), input[type="button"], input[type="submit"], input[type="reset"], summary):not(:disabled, [aria-disabled="true"], [aria-disabled="true"] *, [inert], [inert] *) {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition:
    transform var(--press-release-duration) var(--press-release-ease),
    box-shadow var(--press-release-duration) var(--press-release-ease);
}
:where(button:not(.tab), a[href], [role="button"]:not(.tab), input[type="button"], input[type="submit"], input[type="reset"], summary):not(:disabled, [aria-disabled="true"], [aria-disabled="true"] *, [inert], [inert] *):is(:active, [data-press-active]) {
  transform: scale(var(--press-scale));
  box-shadow: inset 0 0 0 999px var(--press-surface);
  transition-duration: var(--press-down-duration);
}

/* Larger cards move less, so their text stays steady under the finger. */
:where(button, a[href], [role="button"]):is(.purpose-card, .goal-card, .home-goal-row, .tx-card, .list-card, .bill-mini) {
  --press-scale: .985;
}

/* Labels activate their native checkboxes without custom event handlers. */
:where(.check-field, .bank-account-choice):has(input:not(:disabled, [aria-disabled="true"])) {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: box-shadow var(--press-release-duration) var(--press-release-ease);
}
:where(.check-field, .bank-account-choice):not([inert], [inert] *):has(input:not(:disabled, [aria-disabled="true"])):is(:active, [data-press-active]) {
  box-shadow: inset 0 0 0 999px var(--press-surface);
  transition-duration: var(--press-down-duration);
}

/* Fields retain native selection, keyboards and pickers. No scale on focus. */
:where(input:not([type="hidden"], [type="checkbox"], [type="radio"], [type="button"], [type="submit"], [type="reset"]), select, textarea):not(:disabled, [readonly], [aria-disabled="true"], [inert], [inert] *):active {
  border-color: #8d8d99;
}
.field .date-control:has(input:not(:disabled, [readonly])):active { border-color: #8d8d99; }
.search-box:focus-within { outline: 3px solid #3d7ded; outline-offset: 3px; }

/* Tonal feedback also works with reduced motion and during navigation drags. */
.tabbar .nav-bubble {
  transition:
    background-color var(--press-release-duration) var(--press-release-ease),
    transform var(--press-release-duration) var(--press-release-ease);
}
.tabbar[data-pressed] .nav-bubble,
.tabbar:has(.tab:not(:disabled, [aria-disabled="true"]):active) .nav-bubble {
  background-color: #dcdde2;
  transform: scale(.94);
  transition-duration: var(--press-down-duration);
}

/* Animate inside the navigation pill; its outer position remains gesture-owned. */
.tabbar .nav-content {
  transition: transform var(--press-release-duration) var(--press-release-ease);
}
.tabbar:not([data-dragging]) .tab:not(:disabled, [aria-disabled="true"]):active .nav-content,
.tabbar[data-dragging] .tab.is-preview .nav-content {
  transform: scale(.92);
  transition-duration: var(--press-down-duration);
}

/* A disabled action never inherits the older global button:active scale. */
:where(button, input[type="button"], input[type="submit"], input[type="reset"]):is(:disabled, [aria-disabled="true"], [aria-disabled="true"] *, [inert], [inert] *):active {
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  :where(button:not(.tab), a[href], [role="button"]:not(.tab), input[type="button"], input[type="submit"], input[type="reset"], summary),
  .tabbar .nav-bubble,
  .tabbar .nav-content {
    transition: none !important;
  }
  :where(button:not(.tab), a[href], [role="button"]:not(.tab), input[type="button"], input[type="submit"], input[type="reset"], summary):is(:active, [data-press-active]),
  .tabbar .nav-bubble,
  .tabbar .nav-content {
    transform: none !important;
  }
}