fix(fe): QA UI round — balance masking, safe areas, row overflow, loan details

Fixes the QA UI round on fe/. 13 commits, 61 files, no backend changes.

What's fixed

Balance masking (ticket 46) — the card eye had its icons inverted: the slashed eye, which means "hidden" everywhere else, was the state showing the card number. One tap now governs the amount and the card number together, per the ticket. On Home the gap was larger: closing the eye masked the header and asset rows, then listed every transaction amount in full underneath. The flag now reaches the transaction list.

Safe areas (ticket 47) — six auth screens ran content to the physical edge of the display; ten screens sized their scroll padding for a footer smaller than the one drawn. All now compute the reserve from the inset. The retry bar had the worst case: on pay-now it rendered under the confirm button with no ScrollView to reach it, so a failed repayment could not be retried.

Withdraw result (ticket 48) — the Close button was white on moana-blue-100 in light mode: 2.52:1, below AA even for large text. Now moana-blue-700 at 4.58:1. Dark mode was already 8.16:1 and is untouched.

Row overflow — a React Native <Text> doesn't shrink inside a flex-row, so long values pushed out of their container. This wasn't limited to long input: the loan receipt renders a 36-char UUID through the same row, so every receipt overflowed. Fixed in LoanDetailRow and in six hand-rolled equivalents. Amounts wrap (eliding a digit makes a different number); ids and addresses truncate in the middle.

Loan details redesigned to Figma — hero card, Collateral health, Repayment term, timeline treatment.

Also — onboarding no longer ships the "Obytes Starter" template copy; a malformed card balance renders a dash instead of the literal string NaN (Card.balance was typed number while the API returns a decimal string); theme loading no longer deep-imports a transitive dependency's dist/ at module scope, where a nativewind bump would have stopped the app booting.

Please look closely at

• borrow-detail.tsx — Margin call LTV / Liquidation LTV. These read each collateral market's thresholds, never the borrowed asset's. risk.service.ts weights the liquidation line by each collateral's own threshold, so taking the debt asset's would show false headroom — USDC borrowed against ETH would report 90% where the real line is 80%. Both rows are labelled by symbol for that reason.
• Five rows from the design are deliberately absent because no API supplies them: order id (there is no order concept), today's interest, start date (first_borrowed_at exists in the DB but isn't exposed), oracle price, and the ≈ $… USD sub-lines (USD valuation is account-wide only). A test asserts none of them reappear.
• Health factor / Borrow limit are kept although the design drops them. Say the word and they go.

Not fixed

• Sign up button — the ticket is a screenshot with no description of what's wrong; needs detail before it can be actioned.
• 6-digit PIN — closed as won't-fix. The backend enforces /^\d{4}$/ in passcode.dto.ts and passcode.service.ts, so the current 4 boxes are correct and a 6-digit UI would be rejected with a 400. The design needs confirming against the backend contract.

Known issue with the history

0381155 imports a module that 37f1648 creates two commits later, so those two commits don't type-check standalone — git bisect is broken across that window. The branch tip is green. Happy to rebase if you'd rather the history were clean. Also note 54124a6's message claims theme behaviour is unchanged; it isn't — a fresh install on a light-mode device now boots dark.

Verification

pnpm lint 0 errors (25 pre-existing warnings) · pnpm type-check clean · pnpm test:ci 90 suites / 783 tests passing · develop merged in at 017b812.