fix: make the app keyboard-reachable, and close four DoS-able patterns

The bulk of what SonarQube still had open on the reliability side, read site by
site rather than swept. Two clusters are worth calling out because they are
defects, not lint.

**Four regexes could be made to hang the process.** The worst is
`/.+@.+\..+/` in the forgot-password path: three unbounded `.+` that all
overlap, unanchored, on an endpoint that needs no login and whose schema is a
bare z.string() under a 100kb body cap. A thousand '@' characters had not
finished after 100 seconds — one request pins the event loop, and Node has one.
EMAIL_REGEX in auth.helpers is the same shape on register and profile update
(310ms for 8kb). The two tag strippers over an uploaded KML description and over
Commons metadata took 0.52s on a 16k run of '<'. Each rewrite was proven
equivalent by brute force against the original — millions of strings for the
coordinate patterns, 671,876 for the tag stripper — because a subtly different
regex on a parsing path is worse than the finding.

`<[^>]+>` could not be fixed in the pattern: `[^>]` matches `<` too, so the only
unambiguous form changes what happens to malformed markup. It is now a scan in
common/stripHtmlTags.ts, quirks included — `<>` is left alone, `<a<b>` is one
tag — with the equivalence pinned by a test that compares against the old regex
over every string up to length six.

**And roughly 500 places could only be reached with a mouse.** Clickable divs
became real buttons where the markup allowed (52 of them), took
role + tabIndex + Enter/Space where they had to stay divs, and modal backdrops
took role="presentation" — the honest role, since a backdrop is a mouse shortcut
for a Cancel control that is already in the tab order, and making it a button
plants a nameless full-screen tab stop around its own contents.

Alongside those: `.sort()` calls that now say the order they always had, `{n &&
<X/>}` guards that rendered a literal "0" for a zero-byte file and for a place at
latitude 0, an optimistic budget write that stored a boolean where the contract
and both transports use 0/1, and the Number statics.

sonar-project.properties documents the six that were deliberately left: two wiki
patterns with no overlapping quantifier pair whose "fix" would stop parsing
`[see [1]](url)`, four tar header fields bounded at 12-155 bytes by the format,
two djb2 hashes where the 32-bit wrap is the algorithm, two `| 0` that are also
coercing undefined to 0 on a path where the API sends no user_id, and the MCP
session maps Sonar reads as empty because they are filled from another module.

client/src/mobile/components/MBottomNav.tsx

@@ -136,9 +136,10 @@ export default function MBottomNav() {
     <>
       {moreOpen && (
         // Invisible scrim (the popover sits on the UI without dimming it).
-        <div className="fixed inset-0 z-[60]" onClick={() => setMoreOpen(false)}>
+        <div className="fixed inset-0 z-[60]" role="presentation" onClick={() => setMoreOpen(false)}>
           <div
             className="absolute left-4 right-4 flex flex-col gap-2 rounded-[26px] border border-[color:var(--m-gbr)] bg-[color:var(--m-glass)] p-[10px] shadow-[0_-8px_40px_-14px_rgba(0,0,0,.45)] backdrop-blur-[30px] backdrop-saturate-[1.8] bottom-[calc(env(safe-area-inset-bottom,0px)+86px)]"
+            role="presentation"
             onClick={e => e.stopPropagation()}
           >
             {moreItems.map(({ to, label, icon: Icon }) => (

client/src/mobile/components/MDropdownPanel.tsx

@@ -19,7 +19,9 @@ export default function MDropdownPanel({ open, onClose, className = '', children
 
   return (
     <>
-      <div className="fixed inset-0 z-[35]" onClick={onClose} />
+      {/* Invisible dismiss layer — decoration to a reader, which is why it carries
+          no role of its own; the panel's own controls are the keyboard path. */}
+      <div className="fixed inset-0 z-[35]" role="presentation" onClick={onClose} />
       <div
         className={`m-pop-in fixed z-[36] w-[228px] rounded-[20px] border border-[color:var(--m-gbr)] bg-[color:var(--m-glass)] p-[6px] text-m-ink shadow-[0_24px_60px_-20px_rgba(0,0,0,.5)] backdrop-blur-[30px] backdrop-saturate-[1.8] ${className}`}
       >

client/src/mobile/components/MSheet.tsx

@@ -181,6 +181,7 @@ export default function MSheet({
     // backdrop-blur (the "liquid glass" frost). The sheet still slides via m-sheet-in.
     <div
       className={`m-root fixed inset-0 z-[60] ${dimTransparent ? 'bg-transparent' : `bg-[color:var(--m-dim)] ${open ? 'm-fade-in' : 'm-fade-out'}`}`}
+      role="presentation"
       onClick={(e) => {
         if (e.target === e.currentTarget) onClose()
       }}

client/src/mobile/components/MToastHost.tsx

@@ -77,7 +77,10 @@ export default function MToastHost() {
         return (
           <div
             key={toast.id}
+            role={toast.sticky ? 'button' : undefined}
+            tabIndex={toast.sticky ? 0 : undefined}
             onClick={toast.sticky ? () => dismissToast(toast.id) : undefined}
+            onKeyDown={toast.sticky ? (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); dismissToast(toast.id) } } : undefined}
             className={`flex max-w-full items-center gap-2 rounded-full bg-m-act px-4 py-2 text-[0.75rem] font-semibold text-m-actfg shadow-[0_10px_30px_-8px_rgba(0,0,0,.5)] ${
               toast.sticky ? 'pointer-events-auto cursor-pointer' : ''
             } ${toast.removing ? 'm-toast-out' : 'm-toast-in'}`}

client/src/mobile/screens/admin/MAdminPackingTemplateManager.tsx

@@ -258,12 +258,12 @@ export default function MAdminPackingTemplateManager() {
                     />
                   </div>
                 ) : (
-                  <div className="min-w-0 flex-1" onClick={() => toggleExpand(tmpl.id)}>
+                  <button type="button" className="min-w-0 flex-1 text-left" onClick={() => toggleExpand(tmpl.id)}>
                     <div className="truncate text-[0.8125rem] font-bold text-m-ink">{tmpl.name}</div>
                     <div className="mt-[1px] font-geist text-[0.59375rem] text-m-faint">
                       {tmpl.category_count} {t('admin.packingTemplates.categories')} · {tmpl.item_count} {t('admin.packingTemplates.items')}
                     </div>
-                  </div>
+                  </button>
                 )}
                 <PkIconBtn
                   ariaLabel={t('common.edit')}

client/src/mobile/screens/admin/MAdminPluginsPanel.tsx

@@ -1653,7 +1653,7 @@ function PluginDetailSheet({ item, installed, busy, onInstall, onClose, t, local
             <h4 className={sectionH}>{t('admin.plugins.detailsTitle')}</h4>
             <div className="mt-2.5 grid grid-cols-2 gap-x-6 gap-y-3">
               {item.latest && <Meta k={t('admin.plugins.metaVersion')} v={`v${item.latest}`} />}
-              {sizeKb && <Meta k={t('admin.plugins.metaSize')} v={`${sizeKb} KB`} />}
+              {sizeKb !== null && <Meta k={t('admin.plugins.metaSize')} v={`${sizeKb} KB`} />}
               {/* The range, not just its lower bound: "TREK 3.2.0+" reads as "and anything
                   newer", which is exactly the claim a `<4.0.0` upper bound denies. */}
               {(item.trek || item.minTrekVersion) && (

client/src/mobile/screens/atlas/MAtlasSearch.tsx

@@ -53,8 +53,18 @@ export default function MAtlasSearch({
   const scrimCls = 'm-fade-in fixed inset-0 z-[70] flex flex-col bg-[rgba(16,16,19,.28)] px-[18px] pt-[calc(var(--m-safe-top,12px)+12px)] backdrop-blur-[22px] backdrop-saturate-[1.6]' // theme-lint-disable — fixed scrim value from the design
 
   return (
-    <div className={scrimCls} onClick={onClose}>
-      <div className="flex items-center gap-[10px]" onClick={(e) => e.stopPropagation()}>
+    <div
+      className={scrimCls}
+      // presentation, not role="button": the scrim wraps the whole search
+      // overlay, so making it a button puts a full-screen tab stop around its
+      // own contents — and screen readers would read the entire panel as the
+      // button's label. Clicking it is a mouse shortcut for the Cancel control
+      // inside, which is already in the tab order. Same treatment as the other
+      // backdrops in this sweep.
+      role="presentation"
+      onClick={onClose}
+    >
+      <div className="flex items-center gap-[10px]" role="presentation" onClick={(e) => e.stopPropagation()}>
         <label className="flex min-w-0 flex-1 items-center gap-[10px] rounded-[18px] border border-[color:var(--m-gbr)] bg-[color:var(--m-sheetop)] px-4 py-[14px] shadow-[0_12px_30px_-14px_rgba(0,0,0,.4)]">
           <Search size={18} strokeWidth={2.2} className="flex-none text-m-muted" />
           <input
@@ -77,6 +87,7 @@ export default function MAtlasSearch({
       {rows.length > 0 && (
         <div
           className="m-pop-in mt-[14px] divide-y divide-[color:var(--m-rowbr)] overflow-hidden rounded-[20px] border border-[color:var(--m-gbr)] bg-[color:var(--m-sheetop)] shadow-[0_20px_44px_-18px_rgba(0,0,0,.4)]"
+          role="presentation"
           onClick={(e) => e.stopPropagation()}
         >
           {rows.map((r) => (

client/src/mobile/screens/collections/MCollLabelsSheet.tsx

@@ -152,7 +152,14 @@ export default function MCollLabelsSheet({
                   className={`mb-1 flex items-center gap-[10px] rounded-[13px] px-3 py-[10px] ${editingId === label.id || on ? 'bg-[color:var(--m-ic)]' : ''}`}
                   style={on ? { boxShadow: `inset 0 0 0 1.5px ${col}` } : undefined}
                   onClick={mode === 'assign' ? () => toggleChecked(label.id) : undefined}
+                  onKeyDown={mode === 'assign'
+                    ? (e) => {
+                      if (e.target !== e.currentTarget) return
+                      if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); toggleChecked(label.id) }
+                    }
+                    : undefined}
                   role={mode === 'assign' ? 'checkbox' : undefined}
+                  tabIndex={mode === 'assign' ? 0 : undefined}
                   aria-checked={mode === 'assign' ? on : undefined}
                 >
                   <span className="h-[9px] w-[9px] flex-none rounded-full" style={{ background: col }} />

client/src/mobile/screens/dashboard/MDashWidgets.tsx

@@ -405,7 +405,7 @@ function MUpcomingWidget({ items }: { items: UpcomingReservation[] }): React.Rea
     const parsed = splitReservationDateTime(r.reservation_time)
     const datePart = parsed.date || r.day_date || null
     const date = datePart ? new Date(datePart + 'T00:00:00Z') : null
-    const dateStr = date && !isNaN(date.getTime())
+    const dateStr = date && !Number.isNaN(date.getTime())
       ? date.toLocaleDateString(locale, { day: 'numeric', month: 'short', timeZone: 'UTC' })
       : null
     const timeStr = parsed.time ? formatTime(parsed.time, locale, timeFormat) : null

client/src/mobile/screens/dashboard/MDashboard.tsx

@@ -32,7 +32,7 @@ import type { MobileDashToken } from '@trek/shared'
 function fullDate(dateStr: string | null | undefined, locale: string): string | null {
   if (!dateStr) return null
   const date = new Date(dateStr + 'T00:00:00Z')
-  if (isNaN(date.getTime())) return null
+  if (Number.isNaN(date.getTime())) return null
   const opts: Intl.DateTimeFormatOptions = { day: 'numeric', month: 'short', timeZone: 'UTC' }
   if (date.getUTCFullYear() !== new Date().getUTCFullYear()) opts.year = 'numeric'
   return date.toLocaleDateString(locale, opts)

client/src/mobile/screens/journey/MJourneySettingsSheet.tsx

@@ -140,7 +140,8 @@ export default function MJourneySettingsSheet({
 
   const toggleSharePerm = async (key: 'share_timeline' | 'share_gallery' | 'share_map') => {
     if (!shareLink) return
-    const updated = { ...shareLink, [key]: !shareLink[key] }
+    const previous = shareLink
+    const updated = { ...previous, [key]: !previous[key] }
     setShareLink(updated)
     try {
       await journeyApi.createShareLink(journey.id, {
@@ -149,7 +150,7 @@ export default function MJourneySettingsSheet({
         share_map: updated.share_map,
       })
     } catch {
-      setShareLink(shareLink)
+      setShareLink(previous)
       toast.error(t('journey.share.updateFailed'))
     }
   }

client/src/mobile/screens/notifications/MNotificationRow.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react'
+import { useState, type HTMLAttributes } from 'react'
 import { useNavigate } from 'react-router'
 import { ArrowRight, Bell, Check, Trash2, X } from 'lucide-react'
 import { useTranslation } from '../../../i18n'
@@ -45,10 +45,22 @@ export default function MNotificationRow({ notification }: MNotificationRowProps
     if (notification.navigate_target) navigate(notification.navigate_target)
   }
 
+  // Tapping an unread row marks it read; a row that is already read carries no
+  // action, so it neither takes focus nor claims a role. It stays a div because
+  // the chips and the delete button inside it are buttons of their own.
+  const markReadOnRow: HTMLAttributes<HTMLDivElement> = notification.is_read
+    ? {}
+    : {
+        role: 'button',
+        tabIndex: 0,
+        onClick: () => markRead(notification.id),
+        onKeyDown: e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); markRead(notification.id) } },
+      }
+
   return (
     <div
       className="flex items-start gap-[11px] border-b border-[color:var(--m-rowbr)] py-3 last:border-b-0"
-      onClick={() => { if (!notification.is_read) markRead(notification.id) }}
+      {...markReadOnRow}
     >
       {notification.sender_avatar ? (
         <img src={notification.sender_avatar} alt="" className="h-8 w-8 flex-none rounded-full object-cover" />
@@ -65,7 +77,7 @@ export default function MNotificationRow({ notification }: MNotificationRowProps
         <p className="mt-[2px] font-geist text-[0.65625rem] leading-relaxed text-m-muted">{body}</p>
 
         {notification.type === 'boolean' && notification.positive_text_key && notification.negative_text_key && (
-          <div className="mt-2 flex gap-[6px]" onClick={e => e.stopPropagation()}>
+          <div className="mt-2 flex gap-[6px]" role="presentation" onClick={e => e.stopPropagation()}>
             <MChip
               active={notification.response === 'positive'}
               onClick={() => handleRespond('positive')}
@@ -86,7 +98,7 @@ export default function MNotificationRow({ notification }: MNotificationRowProps
         )}
 
         {notification.type === 'navigate' && notification.navigate_text_key && notification.navigate_target && (
-          <div className="mt-2" onClick={e => e.stopPropagation()}>
+          <div className="mt-2" role="presentation" onClick={e => e.stopPropagation()}>
             <MChip onClick={handleNavigate}>
               <ArrowRight size={12} strokeWidth={2.2} />
               {t(notification.navigate_text_key)}

client/src/mobile/screens/settings/MSettingsAccount.tsx

@@ -44,6 +44,13 @@ function isWebauthnAbort(err: unknown): boolean {
   return name === 'NotAllowedError' || name === 'AbortError'
 }
 
+/** Drop trailing slashes for display, as a scan: without it /\/+$/ backtracks quadratically. */
+function trimTrailingSlashes(value: string): string {
+  let end = value.length
+  while (end > 0 && value[end - 1] === '/') end--
+  return value.slice(0, end)
+}
+
 /**
  * "Account" section — AccountTab parity: profile + avatar, password change,
  * TOTP 2FA (setup, backup codes, disable), passkeys and account deletion.
@@ -323,7 +330,7 @@ export default function MSettingsAccount() {
             </div>
             {oidcIssuer && (
               <div className="mt-[2px] font-geist text-[0.625rem] text-m-faint">
-                {t('settings.oidcLinked')} {oidcIssuer.replace('https://', '').replace(/\/+$/, '')}
+                {t('settings.oidcLinked')} {trimTrailingSlashes(oidcIssuer.replace('https://', ''))}
               </div>
             )}
           </div>

client/src/mobile/screens/settings/MSettingsMap.tsx

@@ -102,7 +102,7 @@ export default function MSettingsMap() {
         route_geometry: null,
         place_time: null,
         end_time: null,
-        created_at: Date(),
+        created_at: String(new Date()),
       },
     ],
     [],

client/src/mobile/screens/trip/plan/MPlanTimeline.tsx

@@ -250,9 +250,10 @@ function UpNextCard({ tl, t, onOpen }: {
   const sub = place?.address || place?.description || ''
 
   return (
-    <div
+    <button
+      type="button"
       onClick={() => onOpen(upNext.assignment)}
-      className="absolute left-4 right-4 cursor-pointer rounded-[22px] border border-[color:var(--m-inbr)] bg-[color:var(--m-inner)] px-4 py-3.5 shadow-[0_18px_44px_-18px_rgba(0,0,0,.3)] backdrop-blur-[28px] backdrop-saturate-[1.8] top-[calc(var(--m-safe-top,12px)+102px)]"
+      className="absolute left-4 right-4 cursor-pointer rounded-[22px] border border-[color:var(--m-inbr)] bg-[color:var(--m-inner)] px-4 py-3.5 text-left shadow-[0_18px_44px_-18px_rgba(0,0,0,.3)] backdrop-blur-[28px] backdrop-saturate-[1.8] top-[calc(var(--m-safe-top,12px)+102px)]"
     >
       <div className="flex items-center justify-between">
         <span className="whitespace-nowrap font-geist text-[0.65625rem] font-bold uppercase tracking-[.08em] text-m-muted">
@@ -280,7 +281,7 @@ function UpNextCard({ tl, t, onOpen }: {
           <ChevronRight size={16} strokeWidth={2.4} />
         </span>
       </div>
-    </div>
+    </button>
   )
 }
 

client/src/mobile/screens/trip/plan/MPlanTimelineRows.tsx

@@ -142,7 +142,18 @@ export function PlaceRow({ assignment, fullPlace, linkedRes, chrome, reorder, dr
     : place?.address || place?.description || ''
 
   return (
-    <div {...dragProps(drag)} onClick={onOpen} className={`flex cursor-pointer items-center gap-2.5 py-1.5 ${dragClass(drag)}`}>
+    // Stays a div: in editing mode the row carries its own action circles and
+    // reorder controls, which may not be nested inside a <button>. The key
+    // handler is guarded on currentTarget so Enter/Space on one of those
+    // controls does not also open the row — a mouse click would not either.
+    <div
+      {...dragProps(drag)}
+      role="button"
+      tabIndex={0}
+      onClick={onOpen}
+      onKeyDown={e => { if (e.target === e.currentTarget && (e.key === 'Enter' || e.key === ' ')) { e.preventDefault(); onOpen() } }}
+      className={`flex cursor-pointer items-center gap-2.5 py-1.5 ${dragClass(drag)}`}
+    >
       {!chrome.editing && (
         <AvatarRing className="shadow-[0_3px_8px_-3px_rgba(0,0,0,.4)]">
           <PlaceAvatar
@@ -213,7 +224,14 @@ export function TransportRow({ res, dayId, chrome, reorder, drag, onOpen }: {
   const sub = transportSubtitle(res)
 
   return (
-    <div {...dragProps(drag)} onClick={onOpen} className={`mt-1.5 flex cursor-pointer items-center gap-2.5 ${dragClass(drag)}`}>
+    <div
+      {...dragProps(drag)}
+      role="button"
+      tabIndex={0}
+      onClick={onOpen}
+      onKeyDown={e => { if (e.target === e.currentTarget && (e.key === 'Enter' || e.key === ' ')) { e.preventDefault(); onOpen() } }}
+      className={`mt-1.5 flex cursor-pointer items-center gap-2.5 ${dragClass(drag)}`}
+    >
       {!chrome.editing && (
         <AvatarRing>
           <Icon size={14} strokeWidth={2} />
@@ -360,7 +378,14 @@ export function TransitRow({ res, transit, dayId, open, chrome, reorder, drag, o
         </AvatarRing>
       )}
       <div className="min-w-0 flex-1 overflow-hidden rounded-[14px] border border-[color:var(--m-rowbr)] bg-[color:var(--m-ic)]">
-        <div onClick={onToggle} className="cursor-pointer px-3 py-[9px]">
+        <div
+          role="button"
+          tabIndex={0}
+          aria-expanded={open}
+          onClick={onToggle}
+          onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onToggle() } }}
+          className="cursor-pointer px-3 py-[9px]"
+        >
           <div className="flex items-center gap-[7px]">
             <span className="min-w-0 truncate text-[0.84375rem] font-bold">
               {to ? `${from} → ${to}` : res.title}
@@ -498,7 +523,10 @@ export function NoteRow({ note, chrome, reorder, drag, onEdit }: {
   return (
     <div
       {...dragProps(drag)}
+      role={chrome.editing ? 'button' : undefined}
+      tabIndex={chrome.editing ? 0 : undefined}
       onClick={chrome.editing ? onEdit : undefined}
+      onKeyDown={chrome.editing ? (e => { if (e.target === e.currentTarget && (e.key === 'Enter' || e.key === ' ')) { e.preventDefault(); onEdit() } }) : undefined}
       className={`my-[2px] flex items-center gap-2.5 ${chrome.editing ? 'cursor-pointer' : ''} ${dragClass(drag)}`}
     >
       {!chrome.editing && (

client/src/mobile/screens/trip/sheets/MPlaceEditSheet.tsx

@@ -187,7 +187,10 @@ export default function MPlaceEditSheet({ planner, onOpenExpense }: MPlaceEditSh
 
   const handleCoordPaste = (e: ClipboardEvent<HTMLInputElement>) => {
     const text = e.clipboardData.getData('text').trim()
-    const match = text.match(/^(-?\d+\.?\d*)\s*[,;\s]\s*(-?\d+\.?\d*)$/)
+    // Same grammar as before, spelled without the overlapping quantifiers pasted text
+    // could make backtrack: the separator is either a comma/semicolon with optional
+    // padding or pure whitespace, and a decimal is digits with an optional ".digits".
+    const match = text.match(/^(-?\d+(?:\.\d*)?)(?:\s*[,;]\s*|\s+)(-?\d+(?:\.\d*)?)$/)
     if (match) {
       e.preventDefault()
       setForm(prev => ({ ...prev, lat: match[1], lng: match[2] }))

client/src/mobile/screens/trip/sheets/MPlaceSheet.tsx

@@ -513,8 +513,14 @@ export default function MPlaceSheet({ planner, shell }: MTripSheetsProps) {
             {/* ── Files ── */}
             <div className={`mt-3 rounded-[13px] px-3 py-[9px] ${INNER_CLS}`}>
               <div
+                // Stays a div: the row carries the upload button, which may not
+                // nest inside another button.
+                role="button"
+                tabIndex={0}
+                aria-expanded={filesExpanded}
                 className="flex items-center gap-2"
                 onClick={() => { if (placeFiles.length > 0) setFilesExpanded(v => !v) }}
+                onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); if (placeFiles.length > 0) setFilesExpanded(v => !v) } }}
               >
                 <Paperclip size={14} strokeWidth={2} className="flex-none text-m-muted" />
                 <span className="min-w-0 flex-1 truncate text-[0.78125rem] font-semibold">

client/src/mobile/screens/trip/sheets/MTransportSheet.tsx

@@ -218,12 +218,13 @@ export default function MTransportSheet({ planner, shell }: MTripSheetsProps) {
             {confirmed ? t('reservations.confirmed') : t('reservations.pending')}
           </span>
           {res.confirmation_number && (
-            <span
+            <button
+              type="button"
               onClick={() => { if (blurCodes) setCodeRevealed(v => !v) }}
               className={`flex-none font-geist text-[0.71875rem] tabular-nums text-m-muted ${codeBlurred ? 'blur-[4px] select-none' : ''}`}
             >
               #{res.confirmation_number}
-            </span>
+            </button>
           )}
         </div>
 
@@ -235,12 +236,13 @@ export default function MTransportSheet({ planner, shell }: MTripSheetsProps) {
                 <span className="min-w-0 flex-1 truncate text-[0.71875rem] font-medium">
                   {[leg.from, leg.to].filter(Boolean).join(' → ') || t('reservations.confirmationCode')}
                 </span>
-                <span
+                <button
+                  type="button"
                   onClick={() => { if (blurCodes) setCodeRevealed(v => !v) }}
                   className={`flex-none font-geist text-[0.71875rem] tabular-nums text-m-muted ${codeBlurred ? 'blur-[4px] select-none' : ''}`}
                 >
                   #{leg.confirmation_number}
-                </span>
+                </button>
               </div>
             ))}
           </div>

client/src/mobile/screens/trip/sheets/MTripSheetUi.tsx

@@ -66,18 +66,24 @@ interface StatBoxProps {
 
 /** Small stat box (check-in / times / code): value 700 tabular over a faint Geist label. */
 export function StatBox({ value, label, blurred = false, onClick }: StatBoxProps) {
-  return (
-    <div
-      onClick={onClick}
-      className="min-w-0 flex-1 rounded-[10px] bg-[color:var(--m-ic)] px-[9px] py-[7px] text-center"
-    >
+  const box = 'min-w-0 flex-1 rounded-[10px] bg-[color:var(--m-ic)] px-[9px] py-[7px] text-center'
+  const inner = (
+    <>
       <div
         className={`truncate text-[0.8125rem] font-bold tabular-nums leading-tight ${blurred ? 'blur-[4px] select-none' : ''}`}
       >
         {value}
       </div>
       <div className="truncate font-geist text-[0.5625rem] text-m-faint">{label}</div>
-    </div>
+    </>
+  )
+  // A tappable stat is a real button — value and label give it its name. Without
+  // a handler it stays a plain box rather than an empty stop in the tab order.
+  if (!onClick) return <div className={box}>{inner}</div>
+  return (
+    <button type="button" onClick={onClick} className={`${box} block border-0`}>
+      {inner}
+    </button>
   )
 }
 

client/src/mobile/screens/trip/sheets/PlPlaceSearch.tsx

@@ -38,7 +38,7 @@ interface PlPlaceSearchProps {
 }
 
 /** "48.8566, 2.3522" (also ; or whitespace separated) → direct coordinates. */
-const COORD_RE = /^(-?\d+\.?\d*)\s*[,;\s]\s*(-?\d+\.?\d*)$/
+const COORD_RE = /^(-?\d+(?:\.\d*)?)(?:\s*[,;]\s*|\s+)(-?\d+(?:\.\d*)?)$/
 
 function placeToPick(place: MapsPlace): PlSearchPick {
   const s = (v: unknown) => (v == null ? undefined : String(v))

client/src/mobile/screens/trip/tabs/MBookingsTab.tsx

@@ -240,10 +240,15 @@ function BookingCard({ res, planner, canEdit, compact }: {
                   {t('files.title')}
                 </div>
                 <div className="flex flex-col gap-1">
+                  {/* A span with a button role, not a <button>: the whole card body
+                      is already one, and buttons cannot nest. */}
                   {files.map(f => (
                     <span
                       key={f.id}
+                      role="button"
+                      tabIndex={0}
                       onClick={e => { e.stopPropagation(); openFile(f.url, f.original_name) }}
+                      onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); e.stopPropagation(); openFile(f.url, f.original_name) } }}
                       className="flex items-center gap-[6px] rounded-[10px] border border-[color:var(--m-rowbr)] bg-m-card px-[10px] py-[7px]"
                     >
                       <FileText size={12} strokeWidth={2} className="flex-none text-m-muted" />

client/src/mobile/screens/trip/tabs/MFileLightbox.tsx

@@ -69,6 +69,10 @@ export default function MFileLightbox({ files, index, onIndexChange, onClose, t
 
   return createPortal(
     <div
+      // Backdrop, header bar and media pane are plain boxes: they only route the
+      // tap-to-dismiss. Escape / arrow keys and the header buttons are the
+      // keyboard equivalents, wired up in the effect above.
+      role="presentation"
       className="m-root fixed inset-0 z-[65] flex flex-col bg-black/[.92]"
       onClick={onClose}
       onTouchStart={e => { touchStartRef.current = e.touches[0].clientX }}
@@ -82,7 +86,7 @@ export default function MFileLightbox({ files, index, onIndexChange, onClose, t
       }}
     >
       {/* Header */}
-      <div className="flex flex-none items-center justify-between px-4 py-[10px]" onClick={e => e.stopPropagation()}>
+      <div role="presentation" className="flex flex-none items-center justify-between px-4 py-[10px]" onClick={e => e.stopPropagation()}>
         <span className="min-w-0 flex-1 truncate font-geist text-[0.75rem] text-white/70">
           {file.original_name}
           <span className="ml-2 text-white/40">{index + 1} / {files.length}</span>
@@ -112,6 +116,7 @@ export default function MFileLightbox({ files, index, onIndexChange, onClose, t
 
       {/* Media + nav */}
       <div
+        role="presentation"
         className="relative flex min-h-0 flex-1 items-center justify-center"
         onClick={e => {
           if (e.target !== e.currentTarget) return
@@ -131,17 +136,20 @@ export default function MFileLightbox({ files, index, onIndexChange, onClose, t
           </button>
         )}
         {fileIsVideo ? (
-          <div onClick={e => e.stopPropagation()}>
+          <div role="presentation" onClick={e => e.stopPropagation()}>
             <VideoPlayer src={file.url} style={{ maxWidth: '92vw', maxHeight: '78vh', borderRadius: 8 }} />
           </div>
         ) : (
           imgSrc && (
-            <img
-              src={imgSrc}
-              alt={file.original_name}
-              onClick={e => e.stopPropagation()}
-              className="block max-h-[78vh] max-w-[92vw] rounded-lg object-contain"
-            />
+            // The stop sits on a wrapper rather than on the <img>: a picture is
+            // not something you activate, and this keeps its alt text intact.
+            <div role="presentation" onClick={e => e.stopPropagation()}>
+              <img
+                src={imgSrc}
+                alt={file.original_name}
+                className="block max-h-[78vh] max-w-[92vw] rounded-lg object-contain"
+              />
+            </div>
           )
         )}
         {hasNext && (

client/src/mobile/screens/trip/tabs/MTransportsTab.tsx

@@ -263,7 +263,10 @@ function TransportCard({ res, planner, shell, canEdit, compact }: {
                   {files.map(f => (
                     <span
                       key={f.id}
+                      role="button"
+                      tabIndex={0}
                       onClick={e => { e.stopPropagation(); openFile(f.url, f.original_name) }}
+                      onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); e.stopPropagation(); openFile(f.url, f.original_name) } }}
                       className="flex items-center gap-[6px] rounded-[10px] border border-[color:var(--m-rowbr)] bg-m-card px-[10px] py-[7px]"
                     >
                       <FileText size={12} strokeWidth={2} className="flex-none text-m-muted" />