Report wizard: mobile-card fallback (#1904 fix) renders duplicated below the table on desktop/tablet

[steilerDev]

BUG: mobile-card fallback (#1904 fix) has no default display: none — duplicates every invoice row on desktop/tablet

Severity: Major
Component: Frontend UI / Budget (Report Wizard)
Found in: E2E re-verification for Story #1900 (e2e/tests/budget/reportWizardEditableContent.spec.ts Scenario 11 reconciliation, follow-up to #1904)

Steps to Reproduce

1. Open the Bank Report Wizard (/budget/reports) on a desktop or tablet viewport (>767px wide).
2. Walk through steps 1-4 to any source with at least one allocated invoice.
3. Arrive on step 5 ("Preview & Export") and scroll below the invoice <table>.

Expected Behavior

The .mobileCardList fallback added to fix #1904 should only be visible at ≤767px, mirroring the established convention elsewhere in the app (e.g. InvoiceDepositsSection.module.css, which sets .mobileCardList { display: none; } as a base rule and flips it to visible only inside @media (max-width: 767px)).

Actual Behavior

client/src/components/reports/ReportContentEditor.module.css only sets .mobileCardList { display: flex; ... } INSIDE the @media (max-width: 767px) block (lines ~196-200) — there is no corresponding base-rule display: none outside the media query. Since a bare <div> defaults to display: block, the mobile card list is visible at ALL viewport widths, not just mobile. On desktop/tablet, every invoice row's vendor/invoice number/date/status/amounts/usage text now renders TWICE: once in the <table> and once again as a stacked card directly below it.

Environment

• Browser: Chromium (Playwright), also expected in real Chrome/Firefox/Safari
• Viewport: desktop (1920px), tablet (768-810px) — NOT mobile (≤767px), where the table itself is correctly hidden so there's no visible duplication
• Docker: N/A (component-level bug, reproducible in dev too)

Evidence

Compare client/src/components/reports/ReportContentEditor.module.css (no base .mobileCardList rule) against client/src/pages/InvoiceDetailPage/InvoiceDepositsSection.module.css lines 133-134 (.mobileCardList { display: none; } as a base rule, flipped at line ~408 inside the media query) — the established pattern for this exact desktop-table/mobile-card split elsewhere in the codebase. A regression-guard E2E assertion has been added to reportWizardEditableContent.spec.ts Scenario 1 (desktop) asserting mobileCardList is not visible, to catch this class of regression going forward.

Notes

Fix: add .mobileCardList { display: none; } as a base (non-media-query) rule in ReportContentEditor.module.css, before the existing @media (max-width: 767px) override that sets it to display: flex. One-line CSS fix, no JSX change needed.

[steilerDev]

[frontend-developer] Fixed on the #1900 PR branch — base display:none added per the InvoiceDepositsSection convention.