UI: responsive layout pass for channel detail and edit pages

[pskillen]

Problem

Channel edit and detail pages present a long vertical form / field grid that works on desktop but is cumbersome on mobile. The edit form stacks Identity → RF → DMR → Location → Scan/APRS as flat Stack sections with many inputs visible at once. The detail page renders every section expanded via DetailSections (including DMR and analogue tone rows regardless of mode).

There has been no deliberate responsive UX pass — grouping related fields (RX/TX/offset/band pills), collapsing secondary sections, or optimising touch targets and scroll length on narrow viewports.

Intended outcome

Manually review and improve channel detail (/channels/:id) and edit (/channels/:id/edit, /channels/new) layouts for mobile and desktop.

Edit page improvements

• Collapsible sections — wrap secondary groups in Mantine Accordion (or similar) so operators can focus on one area at a time. Suggested groups:
  • Identity — always visible or first accordion panel (name, mode)
  • RF — RX/TX frequencies, computed offset, band pills, bandwidth, power; analogue tones when applicable
  • DMR — when isDmrMode (colour code, timeslot, contact, RX group list)
  • Location — locator/coords, Use my location (feat: "use my location" on maidenhead converter and channel editor #59), map picker, useLocation / hideFromMap
  • Scan / APRS — scan skip, APRS, TOT, VOX
• RF grouping — keep RX, TX, offset readout, and BandPillsForFrequencies visually together (offset is already computed below the frequency row; consider inline summary e.g. 145.775 → 145.175 (−0.6 MHz)).
• Mobile — reduce horizontal Group grow breakage; full-width inputs; accordion reduces scroll depth.
• Desktop — optional two-column layout within RF/DMR sections where it aids scanning (e.g. RX | TX side by side is fine at sm+).
• Sticky actions — consider fixed bottom Save / Cancel bar on mobile so operators don't scroll past a long form to submit.
• Default accordion: Identity + RF open; others collapsed on mobile, all open or remembered state on desktop (localStorage optional nice-to-have).

Detail page improvements

• Align with feat: show mode-appropriate fields on channel detail and edit pages #48 mode-appropriate visibility — hide DMR / analogue tone rows when not applicable (edit already gates; detail still shows everything).
• Collapsible or compact sections — less critical than edit, but accordion or summary cards for Location / Scan / Vendor extras on mobile.
• Information hierarchy — lead with identity + RF summary; map placement (currently below external links) may move up for field-use context — decide during review.
• Reuse DetailSections where possible; extend component if accordion variant is needed.

Deliverables

• Updated edit.tsx and detail.tsx layouts.
• Brief notes in docs/reference/display-conventions.md or channel CRUD docs on section grouping conventions.
• Sidecar .md if a shared ChannelFormSections or CollapsibleDetailSections component is extracted.
• Verify at base (~375px), sm, and desktop widths.

Affected

• src/routes/channels/edit.tsx
• src/routes/channels/detail.tsx
• Possibly src/components/report/DetailSections.tsx — accordion variant
• docs/reference/display-conventions.md or docs/features/crud/

Notes / dependencies

• Coordinate with feat: show mode-appropriate fields on channel detail and edit pages #48 (mode-appropriate fields) — detail gating should land here or in feat: show mode-appropriate fields on channel detail and edit pages #48 first; avoid duplicate work.
• Coordinate with refactor: rationalise channel data model field types and vendor mappings #52 (typed fields / selects) — layout should accommodate future Select/NumberInput controls.
• Edit already uses ChannelModeSelect, BandPillsForFrequencies, UseMyLocationButton — preserve existing behaviour inside new layout.
• refactor: drop channel number from internal model (assign at export) #53 (drop channel number) — remove number field from edit/detail when that lands.

Out of scope

• Channel list table layout (separate concern).
• New fields or validation rules.
• Full wizard/stepper flow for new channel creation.

Manual verify

1. Edit channel on mobile viewport — accordion collapses; Save reachable without excessive scroll.
2. Edit DMR channel — DMR section visible; FM channel — DMR section hidden.
3. Detail FM channel — no empty DMR section on mobile or desktop.
4. Desktop edit — RF frequencies and offset readable at a glance.

Workflow note

Branch from origin/main, atomic conventional commits (detail gating → edit accordion → detail layout → docs), PR linking Closes #69.