/* Dorax Finance — the list the round + of a phone opens (features/phone/quick-sheet.js): a title and three big buttons side by side, an expense, an
   income, a transfer (owner, 2026-10-11: "leave only three"). Nothing else in the list, so nothing scrolls and the three need no band of their own. */
.quick-base { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 2px 2px 4px; }
.quick-base button { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 96px; padding: 12px 6px; border: 1px solid var(--line-strong); border-radius: var(--r-mid); background: var(--surface-2); color: var(--ink-strong); font-size: 14px; font-weight: 500; text-align: center; -webkit-tap-highlight-color: transparent; transition: transform var(--t1) ease-out, border-color var(--t1) ease-out; }
.quick-base button:active { transform: scale(.95); }
@media (hover: hover) and (pointer: fine) { .quick-base button:hover { border-color: var(--hover-line); } }
.quick-base button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.quick-base .fl-ico { width: 44px; height: 44px; border-color: var(--side-line); background: var(--side-tint); color: var(--brand); }
.quick-base .fl-ico svg { width: 21px; height: 21px; }
.quick-base span:last-child { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (prefers-reduced-motion: no-preference) { .quick-base button { animation: rise 260ms var(--ease) both; animation-delay: calc(var(--i) * 30ms); } }
/* the narrowest phones (320 px): the longest of the three words ("Transferência") whole */
@media (max-width: 360px) { .quick-base { gap: 8px; } .quick-base button { font-size: 12.5px; padding: 12px 4px; } }