fix: clear every open Sonar security issue, and half the reliability ones (#2037)

* fix(security): mint idempotency keys properly, and resolve the extractor by path

Three findings out of a sweep of every open Sonar security issue. The other 49
turned out to be false positives and are documented in sonar-project.properties
rather than changed — each entry scoped to a file, never a whole rule, so a
future Math.random() on an auth path still fails.

The idempotency key is the one that can lose data. Both producers fell back to
Math.random when crypto.randomUUID was missing, and randomUUID needs a secure
context — TREK's own quickstart is http://localhost:3000 and LAN installs run on
http://192.168.x.x, so on the deployments the README documents the fallback is
what actually runs. The axios one was
`Math.random().toString(36).slice(2)`, which is not length-stable: 0.5 yields a
single character and 0 yields the empty string, which the interceptor reads as
"no key" and skips deduplication for entirely. Two writes sharing a key collapse
into one — the second gets the first one's cached response and the edit is gone
with no error anywhere. Both now come from utils/randomId, which has the
getRandomValues rung that works in insecure contexts too.

The extractor probe stored the bare binary name, so every extraction re-resolved
it through whatever PATH held at that moment. The official image sets
KITINERARY_EXTRACTOR_PATH and never reaches that branch, but a bare-metal install
without it ran an unqualified name from a PATH it does not control. It now walks
the search path itself and keeps the absolute path of the file it verified;
execFileSync also drops the /bin/sh hop the old probe needed. PATH comes through
app-config because process.env is walled off in src/.

* fix: four tests and sorts that were not doing what they claimed

Sonar reported 43 high-impact reliability issues. Reading all of them, four are
real; the rest are cosmetic or would be made worse by the suggested change.

budget.test.ts hand-built `paid: true`, but both emitters send `paid: body.paid
? 1 : 0` and the handler stores the value verbatim — the test asserted a payload
the server never sends. The line below it already used a number.

admin.controller.test.ts had a `.resolves` assertion with no await. The promise
was dropped, so that line could not fail the test.

The two to-do category lists sorted with a bare .sort(), which is byte order:
every accented name files behind the whole ASCII range, so in a German trip
"Übernachtung" lands after "Zelt". TREK ships 23 locales, so this is real data.
One side effect worth knowing: katColor picks a category's dot colour by its
index, so re-sorting can move which category shows which colour — it already
moves whenever a category is added, and the colour carries no meaning.

Deliberately not changed: the two `| 0` truncations (Math.trunc is not
equivalent — `| 0` wraps at 32 bits and these carry millisecond timestamps), the
two .map() callbacks whose second parameter is declared and used, and the sha1
in thumbnail.service (its own comment says a swap would orphan every existing
thumbnail).

* refactor: give every button a type, and prefer the Number statics

Two mechanical sweeps, no behaviour change intended in either.

A <button> with no type attribute is type="submit" per the HTML spec. Outside a
form that does nothing today, but it turns into a surprise the moment the markup
is wrapped in one, which is what Sonar's S9011 is warning about. 870 buttons get
an explicit type="button". Two things were left alone on purpose: buttons that
take a {...spread}, because the spread may carry a type and the merge order
decides which wins, and anything inside a <form> — there the answer is a
judgement call, and checking all eleven form files found every real submit button
already carrying type="submit".

The Number sweep covers only the three globals that are exactly equivalent to
their Number twin: parseInt, parseFloat and NaN. isNaN is NOT in it — the global
coerces its argument, so isNaN('abc') is true where Number.isNaN('abc') is false,
and renaming it would change what the code does. It reaches server and plugin-sdk
as well as the client; both copies of egress-policy.ts got the identical edit, so
the mirror the SDK's parity test guards stays intact.

client/src/api/client.behavior.test.ts

@@ -111,7 +111,7 @@ describe('client > request interceptor', () => {
     expect(sink[0].headers['X-Idempotency-Key']).toBe('queued-key')
   })
 
-  it('FE-APIWIRE-004: falls back to a random token when crypto.randomUUID is missing', async () => {
+  it('FE-APIWIRE-004: falls back to getRandomValues when crypto.randomUUID is missing', async () => {
     const realCrypto = globalThis.crypto
     vi.stubGlobal('crypto', {
       getRandomValues: realCrypto.getRandomValues.bind(realCrypto),
@@ -120,9 +120,30 @@ describe('client > request interceptor', () => {
     const sink: InternalAxiosRequestConfig[] = []
     await apiClient.post('/probe', {}, { adapter: okAdapter(sink) })
 
-    const key = String(sink[0].headers['X-Idempotency-Key'])
-    expect(key).toMatch(/^[a-z0-9]+$/)
-    expect(key).not.toMatch(/-/)
+    // randomUUID needs a secure context, so on the plain-http installs the
+    // README documents this branch is what actually runs. getRandomValues has no
+    // such requirement, so the fallback is still a full v4 UUID.
+    expect(String(sink[0].headers['X-Idempotency-Key'])).toMatch(
+      /^[0-9a-f]{8}-[0-9a-f]{4}-4[0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/,
+    )
+  })
+
+  it('FE-APIWIRE-004b: the last-resort key is never degenerate, even with no Web Crypto at all', async () => {
+    vi.stubGlobal('crypto', undefined)
+
+    const keys = new Set<string>()
+    for (let i = 0; i < 50; i++) {
+      const sink: InternalAxiosRequestConfig[] = []
+      await apiClient.post('/probe', {}, { adapter: okAdapter(sink) })
+      keys.add(String(sink[0].headers['X-Idempotency-Key']))
+    }
+
+    // The old fallback was Math.random().toString(36).slice(2), which is not
+    // length-stable: 0.5 yields a single character and 0 yields the empty string.
+    // An empty key makes the server skip deduplication entirely, so a retried
+    // write applies twice.
+    for (const k of keys) expect(k.length).toBeGreaterThan(16)
+    expect(keys.size).toBe(50)
   })
 
   it('FE-APIWIRE-005: the socket id header is omitted while no socket is connected', async () => {

client/src/api/client.ts

@@ -1,6 +1,7 @@
 import axios, { AxiosInstance } from 'axios'
 import type { z } from 'zod'
 import type { Place } from '../types'
+import { randomId } from '../utils/randomId'
 import {
   weatherResultSchema, type WeatherResult,
   inAppListResultSchema, type InAppListResult,
@@ -151,10 +152,7 @@ apiClient.interceptors.request.use(
       // The mutation queue sets its own pre-generated key; skip if already set.
       const method = (config.method ?? '').toLowerCase()
       if (MUTATING_METHODS.has(method) && !config.headers['X-Idempotency-Key']) {
-        const key = typeof crypto !== 'undefined' && crypto.randomUUID
-            ? crypto.randomUUID()
-            : Math.random().toString(36).slice(2)
-        config.headers['X-Idempotency-Key'] = key
+        config.headers['X-Idempotency-Key'] = randomId()
       }
       return config
     },

client/src/components/Admin/AddonManager.tsx

@@ -196,7 +196,7 @@ export default function AddonManager({ bagTrackingEnabled, onToggleBagTracking,
                           <span className={`hidden sm:inline text-xs font-medium ${bagTrackingEnabled ? 'text-content' : 'text-content-faint'}`}>
                             {bagTrackingEnabled ? t('admin.addons.enabled') : t('admin.addons.disabled')}
                           </span>
-                          <button onClick={onToggleBagTracking}
+                          <button type="button" onClick={onToggleBagTracking}
                             className="relative inline-flex h-6 w-11 items-center rounded-full transition-colors"
                             style={{ background: bagTrackingEnabled ? 'var(--text-primary)' : 'var(--border-primary)' }}>
                             <span className="absolute left-0.5 h-5 w-5 rounded-full bg-white transition-transform duration-200"
@@ -222,7 +222,7 @@ export default function AddonManager({ bagTrackingEnabled, onToggleBagTracking,
                                   <span className={`hidden sm:inline text-xs font-medium ${enabled ? 'text-content' : 'text-content-faint'}`}>
                                     {enabled ? t('admin.addons.enabled') : t('admin.addons.disabled')}
                                   </span>
-                                  <button onClick={() => onToggleCollabFeature(feat.key)}
+                                  <button type="button" onClick={() => onToggleCollabFeature(feat.key)}
                                     className="relative inline-flex h-6 w-11 items-center rounded-full transition-colors"
                                     style={{ background: enabled ? 'var(--text-primary)' : 'var(--border-primary)' }}>
                                     <span className="absolute left-0.5 h-5 w-5 rounded-full bg-white transition-transform duration-200"
@@ -269,7 +269,7 @@ export default function AddonManager({ bagTrackingEnabled, onToggleBagTracking,
                                 <span className={`hidden sm:inline text-xs font-medium ${provider.enabled ? 'text-content' : 'text-content-faint'}`}>
                                   {provider.enabled ? t('admin.addons.enabled') : t('admin.addons.disabled')}
                                 </span>
-                                <button
+                                <button type="button"
                                   onClick={provider.toggle}
                                   className="relative inline-flex h-6 w-11 items-center rounded-full transition-colors"
                                   style={{ background: provider.enabled ? 'var(--text-primary)' : 'var(--border-primary)' }}
@@ -459,7 +459,7 @@ function LlmParsingConfig({ addon }: { addon: Addon }) {
             <div className="space-y-3 rounded-lg border border-edge-secondary bg-surface p-3">
               <div className="flex items-center justify-between">
                 <span className="text-xs font-medium text-content-secondary">Installed on the server</span>
-                <button onClick={loadModels} disabled={loadingModels} className="text-xs text-content-muted underline disabled:opacity-60">
+                <button type="button" onClick={loadModels} disabled={loadingModels} className="text-xs text-content-muted underline disabled:opacity-60">
                   {loadingModels ? 'Loading…' : 'Refresh'}
                 </button>
               </div>
@@ -470,7 +470,7 @@ function LlmParsingConfig({ addon }: { addon: Addon }) {
               {installed.length > 0 && (
                 <div className="flex flex-wrap gap-1.5">
                   {installed.map(name => (
-                    <button
+                    <button type="button"
                       key={name}
                       title={name}
                       onClick={() => setModel(name)}
@@ -509,11 +509,11 @@ function LlmParsingConfig({ addon }: { addon: Addon }) {
                           )}
                         </div>
                         {installedHere ? (
-                          <button onClick={() => setModel(m.id)} disabled={active} className={`shrink-0 rounded-md px-3 py-1.5 text-xs font-medium transition-colors ${active ? 'bg-surface-tertiary text-content-muted' : 'border border-edge-secondary text-content-secondary hover:border-edge'}`}>
+                          <button type="button" onClick={() => setModel(m.id)} disabled={active} className={`shrink-0 rounded-md px-3 py-1.5 text-xs font-medium transition-colors ${active ? 'bg-surface-tertiary text-content-muted' : 'border border-edge-secondary text-content-secondary hover:border-edge'}`}>
                             {active ? 'Selected' : 'Use'}
                           </button>
                         ) : (
-                          <button onClick={() => pull(m.id)} disabled={!!pulling} className="shrink-0 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-accent-text disabled:opacity-60">
+                          <button type="button" onClick={() => pull(m.id)} disabled={!!pulling} className="shrink-0 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-accent-text disabled:opacity-60">
                             {isPulling ? 'Pulling…' : 'Pull'}
                           </button>
                         )}
@@ -526,7 +526,7 @@ function LlmParsingConfig({ addon }: { addon: Addon }) {
           )}
         </section>
 
-        <button onClick={save} disabled={saving} className="rounded-lg bg-accent px-4 py-2 text-sm font-medium text-accent-text transition-opacity disabled:opacity-60">
+        <button type="button" onClick={save} disabled={saving} className="rounded-lg bg-accent px-4 py-2 text-sm font-medium text-accent-text transition-opacity disabled:opacity-60">
           {saving ? 'Saving…' : 'Save'}
         </button>
       </div>
@@ -589,7 +589,7 @@ function AddonRow({ addon, onToggle, t, nameOverride, descriptionOverride, statu
           {isComingSoon ? t('admin.addons.disabled') : enabledState ? t('admin.addons.enabled') : t('admin.addons.disabled')}
         </span>
         {!hideToggle && (
-          <button
+          <button type="button"
             onClick={() => !isComingSoon && onToggle(addon)}
             disabled={isComingSoon}
             className="relative inline-flex h-6 w-11 items-center rounded-full transition-colors"

client/src/components/Admin/AdminMcpTokensPanel.tsx

@@ -126,13 +126,13 @@ export default function AdminMcpTokensPanel() {
                           </span>
                         ))}
                         {!expanded && hidden > 0 && (
-                          <button onClick={() => toggleScopes(session.id)}
+                          <button type="button" onClick={() => toggleScopes(session.id)}
                             className="inline-flex items-center px-1.5 py-0.5 rounded text-xs font-medium transition-colors hover:opacity-80 bg-surface-secondary text-content-secondary border border-edge">
                             +{hidden} more
                           </button>
                         )}
                         {expanded && hidden > 0 && (
-                          <button onClick={() => toggleScopes(session.id)}
+                          <button type="button" onClick={() => toggleScopes(session.id)}
                             className="inline-flex items-center px-1.5 py-0.5 rounded text-xs font-medium transition-colors hover:opacity-80 bg-surface-secondary text-content-secondary border border-edge">
                             show less
                           </button>
@@ -146,7 +146,7 @@ export default function AdminMcpTokensPanel() {
                     <span className="text-xs whitespace-nowrap text-right pt-0.5" style={{ color: 'var(--text-tertiary)' }}>
                       {new Date(session.created_at).toLocaleDateString(locale)}
                     </span>
-                    <button onClick={() => setRevokeConfirmId(session.id)}
+                    <button type="button" onClick={() => setRevokeConfirmId(session.id)}
                       className="p-1.5 rounded-lg transition-colors hover:bg-red-50 hover:text-red-600 dark:hover:bg-red-900/20"
                       style={{ color: 'var(--text-tertiary)' }} title={t('common.delete')}>
                       <Trash2 className="w-4 h-4" />
@@ -199,7 +199,7 @@ export default function AdminMcpTokensPanel() {
                   <span className="text-xs whitespace-nowrap text-right" style={{ color: 'var(--text-tertiary)' }}>
                     {token.last_used_at ? new Date(token.last_used_at).toLocaleDateString(locale) : t('admin.mcpTokens.never')}
                   </span>
-                  <button onClick={() => setDeleteConfirmId(token.id)}
+                  <button type="button" onClick={() => setDeleteConfirmId(token.id)}
                     className="p-1.5 rounded-lg transition-colors hover:bg-red-50 hover:text-red-600 dark:hover:bg-red-900/20"
                     style={{ color: 'var(--text-tertiary)' }} title={t('common.delete')}>
                     <Trash2 className="w-4 h-4" />
@@ -219,11 +219,11 @@ export default function AdminMcpTokensPanel() {
             <h3 className="text-base font-semibold text-content">{t('admin.oauthSessions.revokeTitle')}</h3>
             <p className="text-sm text-content-secondary">{t('admin.oauthSessions.revokeMessage')}</p>
             <div className="flex gap-2 justify-end">
-              <button onClick={() => setRevokeConfirmId(null)}
+              <button type="button" onClick={() => setRevokeConfirmId(null)}
                 className="px-4 py-2 rounded-lg text-sm border border-edge text-content-secondary">
                 {t('common.cancel')}
               </button>
-              <button onClick={() => handleRevoke(revokeConfirmId)}
+              <button type="button" onClick={() => handleRevoke(revokeConfirmId)}
                 className="px-4 py-2 rounded-lg text-sm font-medium text-white bg-red-600 hover:bg-red-700">
                 {t('common.delete')}
               </button>
@@ -240,11 +240,11 @@ export default function AdminMcpTokensPanel() {
             <h3 className="text-base font-semibold text-content">{t('admin.mcpTokens.deleteTitle')}</h3>
             <p className="text-sm text-content-secondary">{t('admin.mcpTokens.deleteMessage')}</p>
             <div className="flex gap-2 justify-end">
-              <button onClick={() => setDeleteConfirmId(null)}
+              <button type="button" onClick={() => setDeleteConfirmId(null)}
                 className="px-4 py-2 rounded-lg text-sm border border-edge text-content-secondary">
                 {t('common.cancel')}
               </button>
-              <button onClick={() => handleDelete(deleteConfirmId)}
+              <button type="button" onClick={() => handleDelete(deleteConfirmId)}
                 className="px-4 py-2 rounded-lg text-sm font-medium text-white bg-red-600 hover:bg-red-700">
                 {t('common.delete')}
               </button>

client/src/components/Admin/AdminPluginsPanel.tsx

@@ -187,7 +187,7 @@ const PERM_KEYS = PLUGIN_PERMISSIONS
 const KNOWN_TYPES = ['widget', 'page', 'integration', 'trip-page']
 
 function isNewer(a: string, b: string): boolean {
-  const nums = (v: string) => v.split('-')[0].split('.').map(n => parseInt(n, 10) || 0)
+  const nums = (v: string) => v.split('-')[0].split('.').map(n => Number.parseInt(n, 10) || 0)
   const pa = nums(a), pb = nums(b)
   for (let i = 0; i < 3; i++) {
     const x = pa[i] || 0, y = pb[i] || 0
@@ -795,11 +795,11 @@ export default function AdminPluginsPanel() {
               <SegBtn active={view === 'discover'} onClick={openDiscover} label={t('admin.plugins.tabDiscover')} count={registry?.length} />
             </div>
             <div className="sm:hidden flex items-center gap-2 shrink-0">
-              <button onClick={pickUpload} title={t('admin.plugins.upload')}
+              <button type="button" onClick={pickUpload} title={t('admin.plugins.upload')}
                 className="h-[38px] w-[38px] grid place-items-center rounded-xl border border-edge bg-surface-card text-content-muted hover:text-content hover:border-content-faint transition-colors">
                 <UploadCloud size={15} />
               </button>
-              <button onClick={rescan} title={t('admin.plugins.rescan')}
+              <button type="button" onClick={rescan} title={t('admin.plugins.rescan')}
                 className="h-[38px] w-[38px] grid place-items-center rounded-xl border border-edge bg-surface-card text-content-muted hover:text-content hover:border-content-faint transition-colors">
                 <RefreshCw size={15} />
               </button>
@@ -842,11 +842,11 @@ export default function AdminPluginsPanel() {
               valueLabel={sortLabel(sort, t)}
               onPick={v => setSort(v as SortKey)} />
 
-            <button onClick={pickUpload} title={t('admin.plugins.upload')}
+            <button type="button" onClick={pickUpload} title={t('admin.plugins.upload')}
               className="hidden sm:grid h-[38px] w-[38px] place-items-center rounded-xl border border-edge bg-surface-card text-content-muted hover:text-content hover:border-content-faint transition-colors">
               <UploadCloud size={15} />
             </button>
-            <button onClick={rescan} title={t('admin.plugins.rescan')}
+            <button type="button" onClick={rescan} title={t('admin.plugins.rescan')}
               className="hidden sm:grid h-[38px] w-[38px] place-items-center rounded-xl border border-edge bg-surface-card text-content-muted hover:text-content hover:border-content-faint transition-colors">
               <RefreshCw size={15} />
             </button>
@@ -871,7 +871,7 @@ export default function AdminPluginsPanel() {
               <div className="mx-1.5 sm:mx-3 mb-2 mt-1 flex items-center gap-2.5 px-3.5 py-2.5 rounded-xl bg-warning-soft border border-warning/30">
                 <ArrowUpCircle size={16} className="text-warning shrink-0" />
                 <span className="text-xs text-content-secondary">{t('admin.plugins.updatesAvailable', { count: updatable.length })}</span>
-                <button onClick={() => void updateAll()}
+                <button type="button" onClick={() => void updateAll()}
                   className="ml-auto text-xs font-semibold px-3 py-1.5 rounded-lg bg-warning text-white hover:opacity-90 transition-opacity">
                   {t('admin.plugins.updateAll')}
                 </button>
@@ -913,7 +913,7 @@ export default function AdminPluginsPanel() {
           <div className="bg-surface-card border border-edge rounded-2xl w-full max-w-2xl max-h-[70vh] flex flex-col shadow-modal" onClick={e => e.stopPropagation()}>
             <div className="px-5 py-3.5 border-b border-edge-secondary flex items-center justify-between">
               <span className="text-sm font-semibold text-content flex items-center gap-2"><Bug size={15} /> {errorsFor.id} — {t('admin.plugins.errorLog')}</span>
-              <button onClick={() => setErrorsFor(null)} className="text-content-faint hover:text-content"><X size={16} /></button>
+              <button type="button" onClick={() => setErrorsFor(null)} className="text-content-faint hover:text-content"><X size={16} /></button>
             </div>
             <div className="p-4 overflow-y-auto text-xs font-mono">
               {errorsFor.rows.length === 0 ? <p className="text-content-faint py-4 text-center">{t('admin.plugins.noErrors')}</p> :
@@ -935,7 +935,7 @@ export default function AdminPluginsPanel() {
           <div className="bg-surface-card border border-edge rounded-2xl w-full max-w-lg shadow-modal" onClick={e => e.stopPropagation()}>
             <div className="px-5 py-3.5 border-b border-edge-secondary flex items-center justify-between">
               <span className="text-sm font-semibold text-content flex items-center gap-2"><Globe size={15} /> {egressFor.id} — {t('admin.plugins.allowedHosts')}</span>
-              <button onClick={() => setEgressFor(null)} className="text-content-faint hover:text-content"><X size={16} /></button>
+              <button type="button" onClick={() => setEgressFor(null)} className="text-content-faint hover:text-content"><X size={16} /></button>
             </div>
             <div className="p-5 space-y-3">
               {!egressFor.supported ? (
@@ -949,7 +949,7 @@ export default function AdminPluginsPanel() {
                   {egressFor.hosts.map(h => (
                     <div key={h} className="flex items-center justify-between gap-2 rounded-lg border border-edge-secondary px-3 py-2">
                       <span className="text-sm font-mono text-content break-all">{h}</span>
-                      <button
+                      <button type="button"
                         disabled={egressSaving}
                         onClick={() => saveEgress(egressFor.hosts.filter(x => x !== h))}
                         className="text-content-faint hover:text-danger disabled:opacity-50"
@@ -964,7 +964,7 @@ export default function AdminPluginsPanel() {
                       placeholder="gotify.example.com"
                       className="flex-1 rounded-lg border border-edge bg-surface px-3 py-2 text-sm text-content"
                     />
-                    <button
+                    <button type="button"
                       disabled={egressSaving || !egressDraft.trim()}
                       onClick={() => saveEgress([...egressFor.hosts, egressDraft.trim()])}
                       className="rounded-lg bg-content px-3 py-2 text-sm text-surface disabled:opacity-50"
@@ -1043,7 +1043,7 @@ function sortLabel(s: SortKey, t: T): string {
 
 function SegBtn({ active, onClick, label, count }: { active: boolean; onClick: () => void; label: string; count?: number }) {
   return (
-    <button onClick={onClick} role="tab" aria-selected={active}
+    <button type="button" onClick={onClick} role="tab" aria-selected={active}
       className={`inline-flex items-center gap-2 text-[13px] font-medium px-3.5 py-1.5 rounded-lg transition-colors ${
         active ? 'bg-surface-card text-content shadow-card' : 'text-content-muted hover:text-content'}`}>
       {label}
@@ -1064,7 +1064,7 @@ function FilterMenu({ id, label, valueLabel, options, onPick, value, menu, setMe
   const active = value !== options[0]?.[0]
   return (
     <div className="relative">
-      <button onClick={() => setMenu(open ? null : id)} title={`${label}: ${valueLabel}`}
+      <button type="button" onClick={() => setMenu(open ? null : id)} title={`${label}: ${valueLabel}`}
         className={`relative h-[38px] w-[38px] sm:w-auto px-0 sm:px-3 inline-flex items-center justify-center sm:justify-start gap-1.5 rounded-xl border bg-surface-card text-[13px] text-content-secondary transition-colors whitespace-nowrap hover:border-content-faint ${
           active ? 'border-content-faint' : 'border-edge'}`}>
         {icon}
@@ -1076,7 +1076,7 @@ function FilterMenu({ id, label, valueLabel, options, onPick, value, menu, setMe
       {open && (
         <div className="absolute top-11 right-0 z-30 min-w-[180px] max-w-[calc(100vw-2rem)] p-1.5 rounded-xl border border-edge bg-surface-card shadow-elevated">
           {options.map(([v, lbl]) => (
-            <button key={v} onClick={() => { onPick(v); setMenu(null) }}
+            <button type="button" key={v} onClick={() => { onPick(v); setMenu(null) }}
               className={`w-full flex items-center gap-2.5 px-2.5 py-2 rounded-lg text-[13px] transition-colors hover:bg-surface-tertiary ${
                 value === v ? 'text-content font-semibold' : 'text-content-secondary'}`}>
               {lbl}<Check size={15} className={`ml-auto text-accent ${value === v ? 'opacity-100' : 'opacity-0'}`} />
@@ -1095,7 +1095,7 @@ function EmptyState({ t, onDiscover }: { t: T; onDiscover: () => void }) {
         <PackageOpen size={26} className="text-content-faint" />
       </div>
       <p className="text-sm font-medium text-content-muted">{t('admin.plugins.empty')}</p>
-      <button onClick={onDiscover} className="mt-4 inline-flex items-center gap-1.5 text-xs font-semibold px-4 py-2 rounded-lg bg-accent text-accent-text">
+      <button type="button" onClick={onDiscover} className="mt-4 inline-flex items-center gap-1.5 text-xs font-semibold px-4 py-2 rounded-lg bg-accent text-accent-text">
         <Download size={14} /> {t('admin.plugins.tabDiscover')}
       </button>
     </div>
@@ -1158,7 +1158,7 @@ function InstalledRow({ p, t, busy, menu, setMenu, hasUpdate, latestVer, blocked
           <div className="flex items-center gap-1.5 mt-1.5 text-[11.5px] text-warning">
             <ShieldAlert size={13} className="shrink-0" />
             <span className="truncate">{t('admin.plugins.updateBlocked', { reason: p.updateBlock.detail ?? p.updateBlock.code })}</span>
-            <button onClick={onReviewBlock}
+            <button type="button" onClick={onReviewBlock}
               className="shrink-0 font-semibold underline underline-offset-2 hover:opacity-80 transition-opacity">
               {t('admin.plugins.reviewBlock')}
             </button>
@@ -1181,7 +1181,7 @@ function InstalledRow({ p, t, busy, menu, setMenu, hasUpdate, latestVer, blocked
                 Actionable, and warning-toned until at least one host exists, because
                 until then the plugin cannot reach anything and looks silently broken. */}
             {p.operatorEgress && (
-              <button
+              <button type="button"
                 onClick={onEgress}
                 title={t('admin.plugins.allowedHosts.hint')}
                 className={`inline-flex items-center gap-1.5 text-[11px] font-medium px-2 py-[3px] rounded-md border transition-colors ${
@@ -1211,7 +1211,7 @@ function InstalledRow({ p, t, busy, menu, setMenu, hasUpdate, latestVer, blocked
 
       <div className="flex items-center gap-1.5 sm:gap-2 shrink-0">
         {hasUpdate && (
-          <button onClick={onUpdate} disabled={busy === p.id} title={t('admin.plugins.updateTo', { version: latestVer })}
+          <button type="button" onClick={onUpdate} disabled={busy === p.id} title={t('admin.plugins.updateTo', { version: latestVer })}
             className="inline-flex items-center gap-1.5 text-[11.5px] font-semibold px-2 sm:px-2.5 py-1.5 rounded-full text-warning bg-warning-soft border border-warning/30 hover:opacity-90 transition-opacity disabled:opacity-50">
             <ArrowUpCircle size={13} /> <span className="hidden sm:inline">{t('admin.plugins.updateTo', { version: latestVer })}</span>
           </button>
@@ -1221,7 +1221,7 @@ function InstalledRow({ p, t, busy, menu, setMenu, hasUpdate, latestVer, blocked
         </span>
         <ToggleSwitch on={p.enabled === 1} label={t('admin.plugins.enabledToggle')} onToggle={onToggle} />
         <div className="relative">
-          <button ref={menuBtnRef} data-testid={`plugin-row-menu-btn-${p.id}`} onClick={() => setMenu(menuOpen ? null : `row:${p.id}`)}
+          <button type="button" ref={menuBtnRef} data-testid={`plugin-row-menu-btn-${p.id}`} onClick={() => setMenu(menuOpen ? null : `row:${p.id}`)}
             className="w-[34px] h-[34px] grid place-items-center rounded-lg text-content-faint hover:text-content hover:bg-surface-tertiary transition-colors">
             <MoreHorizontal size={17} />
           </button>
@@ -1275,7 +1275,7 @@ function anchorMenu(trigger: HTMLElement | null): CSSProperties {
 
 function MenuItem({ icon, label, onClick, danger }: { icon: React.ReactNode; label: string; onClick: () => void; danger?: boolean }) {
   return (
-    <button onClick={onClick}
+    <button type="button" onClick={onClick}
       className={`w-full flex items-center gap-2.5 px-2.5 py-2 rounded-lg text-[13px] transition-colors ${
         danger ? 'text-danger hover:bg-danger-soft' : 'text-content-secondary hover:bg-surface-tertiary'}`}>
       {icon} {label}
@@ -1349,7 +1349,7 @@ function RegistryGrid({ items, onInstall, onOpenDetail, busy, t, installedIds, f
                     <Download size={11} /> {formatCompactCount(item.downloadCount)}
                   </span>
                 )}
-                <button onClick={e => { e.stopPropagation(); onInstall(item.id, offer.version) }}
+                <button type="button" onClick={e => { e.stopPropagation(); onInstall(item.id, offer.version) }}
                   disabled={busy === item.id || installed || offer.blocked}
                   title={installed ? undefined : offer.title}
                   className="ml-auto text-xs font-semibold px-3.5 py-1.5 rounded-lg bg-accent text-accent-text hover:bg-accent-hover disabled:opacity-50 disabled:bg-surface-tertiary disabled:text-content-faint transition-colors">
@@ -1412,7 +1412,7 @@ function PluginDetailModal({ item, installed, busy, onInstall, onClose, t, local
         <div className="relative">
           <Screenshot url={item.screenshotUrl} className="w-full aspect-[16/9]" iconSize={36} />
           <div className="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent" />
-          <button onClick={onClose} className="absolute top-3 right-3 w-8 h-8 grid place-items-center rounded-lg bg-black/40 text-white hover:bg-black/60 transition-colors"><X size={16} /></button>
+          <button type="button" onClick={onClose} className="absolute top-3 right-3 w-8 h-8 grid place-items-center rounded-lg bg-black/40 text-white hover:bg-black/60 transition-colors"><X size={16} /></button>
         </div>
 
         <div className="flex items-start gap-3 sm:gap-3.5 px-4 sm:px-5 -mt-7 relative z-[1]">
@@ -1426,7 +1426,7 @@ function PluginDetailModal({ item, installed, busy, onInstall, onClose, t, local
             </div>
             <p className="text-[12.5px] text-content-faint mt-0.5">{item.author}{item.latest ? ` · v${item.latest}` : ''}</p>
           </div>
-          <button onClick={() => onInstall(item.id, offer.version)}
+          <button type="button" onClick={() => onInstall(item.id, offer.version)}
             disabled={busy === item.id || installed || offer.blocked}
             title={installed ? undefined : offer.title}
             className="self-end text-[13px] font-semibold px-3 sm:px-4 py-2 rounded-lg bg-accent text-accent-text hover:bg-accent-hover disabled:opacity-50 disabled:bg-surface-tertiary disabled:text-content-faint transition-colors shrink-0">
@@ -1606,12 +1606,12 @@ function SignatureBlockDialog({ data, entry, busy, t, onRetrust, onClose }: {
           )}
         </div>
         <div className="px-5 py-3.5 border-t border-edge-secondary bg-surface-secondary flex items-center justify-end gap-2">
-          <button onClick={onClose}
+          <button type="button" onClick={onClose}
             className="text-xs font-medium px-3.5 py-2 rounded-lg border border-edge text-content-muted hover:text-content hover:bg-surface-tertiary transition-colors">
             {offerRetrust ? t('admin.plugins.sig.cancel') : t('common.close')}
           </button>
           {offerRetrust && (
-            <button onClick={() => onRetrust(version, newKey)} disabled={busy}
+            <button type="button" onClick={() => onRetrust(version, newKey)} disabled={busy}
               className="text-xs font-semibold px-4 py-2 rounded-lg bg-warning text-white hover:opacity-90 transition-opacity disabled:opacity-50">
               {t('admin.plugins.sig.retrustConfirm')}
             </button>
@@ -1685,8 +1685,8 @@ function UpdateConsentDialog({ data, unsigned, t, onApprove, onLater }: {
           )}
         </div>
         <div className="px-5 py-3.5 border-t border-edge-secondary bg-surface-secondary flex items-center justify-end gap-2">
-          <button onClick={onLater} className="text-xs font-medium px-3.5 py-2 rounded-lg border border-edge text-content-muted hover:text-content hover:bg-surface-tertiary transition-colors">{t('admin.plugins.updateLater')}</button>
-          <button onClick={onApprove} className="text-xs font-semibold px-4 py-2 rounded-lg bg-accent text-accent-text hover:bg-accent-hover transition-colors">{t('admin.plugins.updateApprove')}</button>
+          <button type="button" onClick={onLater} className="text-xs font-medium px-3.5 py-2 rounded-lg border border-edge text-content-muted hover:text-content hover:bg-surface-tertiary transition-colors">{t('admin.plugins.updateLater')}</button>
+          <button type="button" onClick={onApprove} className="text-xs font-semibold px-4 py-2 rounded-lg bg-accent text-accent-text hover:bg-accent-hover transition-colors">{t('admin.plugins.updateApprove')}</button>
         </div>
       </div>
     </div>
@@ -1726,7 +1726,7 @@ function DependencyResolveDialog({ data, t, busy, installedIds, onDownload, onCl
                     : t('admin.plugins.dep.requires', { version: r.constraint })}
                 </div>
               </div>
-              <button onClick={() => onDownload(r.id, r.constraint)} disabled={busy}
+              <button type="button" onClick={() => onDownload(r.id, r.constraint)} disabled={busy}
                 className="inline-flex items-center gap-1.5 text-[11.5px] font-semibold px-3 py-1.5 rounded-full bg-accent text-accent-text hover:bg-accent-hover transition-colors disabled:opacity-50 shrink-0">
                 <Download size={13} /> {r.installed ? t('admin.plugins.dep.update') : t('admin.plugins.dep.download')}
               </button>
@@ -1737,7 +1737,7 @@ function DependencyResolveDialog({ data, t, busy, installedIds, onDownload, onCl
           )}
         </div>
         <div className="px-5 py-3.5 border-t border-edge-secondary bg-surface-secondary flex items-center justify-end">
-          <button onClick={onClose} className="text-xs font-medium px-3.5 py-2 rounded-lg border border-edge text-content-muted hover:text-content hover:bg-surface-tertiary transition-colors">{t('common.cancel')}</button>
+          <button type="button" onClick={onClose} className="text-xs font-medium px-3.5 py-2 rounded-lg border border-edge text-content-muted hover:text-content hover:bg-surface-tertiary transition-colors">{t('common.cancel')}</button>
         </div>
       </div>
     </div>
@@ -1763,7 +1763,7 @@ function SecurityInfo({ t }: { t: T }) {
         <ShieldCheck size={14} className="text-content-faint shrink-0 mt-0.5" />
         <p className="text-xs text-content-muted">{t('admin.plugins.reviewedMeaning')}</p>
       </div>
-      <button onClick={() => setOpen(o => !o)}
+      <button type="button" onClick={() => setOpen(o => !o)}
         className="w-full px-4 sm:px-6 py-2.5 border-t border-edge-secondary flex items-center justify-between gap-2 text-xs font-medium text-content-secondary hover:text-content hover:bg-surface-tertiary transition-colors">
         <span className="flex items-center gap-2"><Lock size={13} className="shrink-0" /> <span className="text-left">{t('admin.plugins.security.title')}</span></span>
         <ChevronDown size={15} className={`shrink-0 transition-transform ${open ? 'rotate-180' : ''}`} />

client/src/components/Admin/BackupPanel.tsx

@@ -191,7 +191,7 @@ export default function BackupPanel() {
             </div>
           </div>
           <div className="flex items-center gap-2">
-            <button
+            <button type="button"
               onClick={loadBackups}
               disabled={isLoading}
               className="p-2 text-gray-500 hover:bg-gray-100 rounded-lg transition-colors"
@@ -208,7 +208,7 @@ export default function BackupPanel() {
               className="hidden"
               onChange={handleUploadRestore}
             />
-            <button
+            <button type="button"
               onClick={() => fileInputRef.current?.click()}
               disabled={isUploading}
               className="flex items-center gap-2 border border-gray-200 text-gray-700 px-3 py-2 rounded-lg hover:bg-gray-50 text-sm font-medium disabled:opacity-60"
@@ -222,7 +222,7 @@ export default function BackupPanel() {
               <span className="hidden sm:inline">{isUploading ? t('backup.uploading') : t('backup.upload')}</span>
             </button>
 
-            <button
+            <button type="button"
               onClick={handleCreate}
               disabled={isCreating}
               className="flex items-center gap-2 bg-slate-900 dark:bg-slate-100 text-white dark:text-slate-900 px-3 sm:px-4 py-2 rounded-lg hover:bg-slate-900 text-sm font-medium disabled:opacity-60"
@@ -247,7 +247,7 @@ export default function BackupPanel() {
           <div className="text-center py-12 text-gray-400">
             <HardDrive className="w-10 h-10 mb-3 mx-auto opacity-40" />
             <p className="text-sm">{t('backup.empty')}</p>
-            <button onClick={handleCreate} className="mt-4 text-slate-700 text-sm hover:underline">
+            <button type="button" onClick={handleCreate} className="mt-4 text-slate-700 text-sm hover:underline">
               {t('backup.createFirst')}
             </button>
           </div>
@@ -274,14 +274,14 @@ export default function BackupPanel() {
                   </div>
                 </div>
                 <div className="flex items-center gap-1.5 flex-shrink-0">
-                  <button
+                  <button type="button"
                     onClick={() => backupApi.download(backup.filename).catch(() => toast.error(t('backup.toast.downloadError')))}
                     className="flex items-center gap-1.5 px-3 py-1.5 text-xs text-slate-700 border border-slate-200 rounded-lg hover:bg-slate-50"
                   >
                     <Download className="w-3.5 h-3.5" />
                     {t('backup.download')}
                   </button>
-                  <button
+                  <button type="button"
                     onClick={() => handleRestore(backup.filename)}
                     disabled={restoringFile === backup.filename}
                     className="flex items-center gap-1.5 px-3 py-1.5 text-xs text-amber-700 border border-amber-200 rounded-lg hover:bg-amber-50 disabled:opacity-60"
@@ -292,7 +292,7 @@ export default function BackupPanel() {
                     }
                     {t('backup.restore')}
                   </button>
-                  <button
+                  <button type="button"
                     onClick={() => handleDelete(backup.filename)}
                     className="p-1.5 text-gray-400 hover:text-red-600 hover:bg-red-50 rounded-lg"
                   >
@@ -322,7 +322,7 @@ export default function BackupPanel() {
               <span className="text-sm font-medium text-gray-900">{t('backup.auto.enable')}</span>
               <p className="text-xs text-gray-500 mt-0.5">{t('backup.auto.enableHint')}</p>
             </div>
-            <button
+            <button type="button"
               onClick={() => handleAutoSettingsChange('enabled', !autoSettings.enabled)}
               className="relative shrink-0 inline-flex h-6 w-11 items-center rounded-full transition-colors"
               style={{ background: autoSettings.enabled ? 'var(--text-primary)' : 'var(--border-primary)' }}
@@ -339,7 +339,7 @@ export default function BackupPanel() {
                 <label className="block text-sm font-medium text-gray-700 mb-2">{t('backup.auto.interval')}</label>
                 <div className="flex flex-wrap gap-2">
                   {INTERVAL_OPTIONS.map(opt => (
-                    <button
+                    <button type="button"
                       key={opt.value}
                       onClick={() => handleAutoSettingsChange('interval', opt.value)}
                       className={`px-4 py-2 rounded-lg text-sm font-medium border transition-colors ${
@@ -360,7 +360,7 @@ export default function BackupPanel() {
                   <label className="block text-sm font-medium text-gray-700 mb-2">{t('backup.auto.hour')}</label>
                   <CustomSelect
                     value={String(autoSettings.hour)}
-                    onChange={v => handleAutoSettingsChange('hour', parseInt(String(v), 10))}
+                    onChange={v => handleAutoSettingsChange('hour', Number.parseInt(String(v), 10))}
                     size="sm"
                     options={HOURS.map(h => {
                       let label: string
@@ -386,7 +386,7 @@ export default function BackupPanel() {
                   <label className="block text-sm font-medium text-gray-700 mb-2">{t('backup.auto.dayOfWeek')}</label>
                   <div className="flex flex-wrap gap-2">
                     {DAYS_OF_WEEK.map(opt => (
-                      <button
+                      <button type="button"
                         key={opt.value}
                         onClick={() => handleAutoSettingsChange('day_of_week', opt.value)}
                         className={`px-3 py-2 rounded-lg text-sm font-medium border transition-colors ${
@@ -408,7 +408,7 @@ export default function BackupPanel() {
                   <label className="block text-sm font-medium text-gray-700 mb-2">{t('backup.auto.dayOfMonth')}</label>
                   <CustomSelect
                     value={String(autoSettings.day_of_month)}
-                    onChange={v => handleAutoSettingsChange('day_of_month', parseInt(String(v), 10))}
+                    onChange={v => handleAutoSettingsChange('day_of_month', Number.parseInt(String(v), 10))}
                     size="sm"
                     options={DAYS_OF_MONTH.map(d => ({ value: String(d), label: String(d) }))}
                   />
@@ -421,7 +421,7 @@ export default function BackupPanel() {
                 <label className="block text-sm font-medium text-gray-700 mb-2">{t('backup.auto.keepLabel')}</label>
                 <div className="flex flex-wrap gap-2">
                   {KEEP_OPTIONS.map(opt => (
-                    <button
+                    <button type="button"
                       key={opt.value}
                       onClick={() => handleAutoSettingsChange('keep_days', opt.value)}
                       className={`px-4 py-2 rounded-lg text-sm font-medium border transition-colors ${
@@ -440,7 +440,7 @@ export default function BackupPanel() {
 
           {/* Save button */}
           <div className="flex justify-end pt-2 border-t border-gray-100">
-            <button
+            <button type="button"
               onClick={handleSaveAutoSettings}
               disabled={autoSettingsSaving || !autoSettingsDirty}
               className="flex items-center gap-2 bg-slate-900 dark:bg-slate-100 text-white dark:text-slate-900 px-5 py-2 rounded-lg hover:bg-slate-900 text-sm font-medium disabled:opacity-50 transition-colors"
@@ -497,14 +497,14 @@ export default function BackupPanel() {
 
             {/* Footer */}
             <div style={{ padding: '0 24px 20px', display: 'flex', gap: 10, justifyContent: 'flex-end' }}>
-              <button
+              <button type="button"
                 onClick={() => setRestoreConfirm(null)}
                 className="text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700"
                 style={{ padding: '9px 20px', borderRadius: 10, fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, border: 'none', cursor: 'pointer', fontFamily: 'inherit' }}
               >
                 {t('common.cancel')}
               </button>
-              <button
+              <button type="button"
                 onClick={executeRestore}
                 className="bg-[#dc2626] text-white"
                 style={{ padding: '9px 20px', borderRadius: 10, fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, border: 'none', cursor: 'pointer', fontFamily: 'inherit' }}

client/src/components/Admin/CategoryManager.tsx

@@ -194,7 +194,7 @@ export default function CategoryManager() {
           <h2 className="font-semibold text-content">{t('categories.title')}</h2>
           <p className="text-xs mt-1 text-content-muted">{t('categories.subtitle')}</p>
         </div>
-        <button onClick={handleStartCreate}
+        <button type="button" onClick={handleStartCreate}
           className="flex items-center gap-2 bg-slate-900 text-white px-3 sm:px-4 py-2 rounded-lg hover:bg-slate-700 text-sm font-medium">
           <Plus className="w-4 h-4" />
           <span className="hidden sm:inline">{t('categories.new')}</span>
@@ -235,11 +235,11 @@ export default function CategoryManager() {
                       </div>
                     </div>
                     <div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
-                      <button onClick={() => handleStartEdit(cat)}
+                      <button type="button" onClick={() => handleStartEdit(cat)}
                         className="p-1.5 text-gray-400 hover:text-slate-700 hover:bg-slate-100 rounded-lg">
                         <Edit2 className="w-4 h-4" />
                       </button>
-                      <button onClick={() => handleDelete(cat.id)}
+                      <button type="button" onClick={() => handleDelete(cat.id)}
                         className="p-1.5 text-gray-400 hover:text-red-600 hover:bg-red-50 rounded-lg">
                         <Trash2 className="w-4 h-4" />
                       </button>

client/src/components/Admin/DefaultUserSettingsTab.tsx

@@ -86,7 +86,7 @@ function OptionButton({
   children: React.ReactNode
 }) {
   return (
-    <button
+    <button type="button"
       onClick={onClick}
       style={{
         display: 'flex', alignItems: 'center', gap: 8,
@@ -154,7 +154,7 @@ export default function DefaultUserSettingsTab(): React.ReactElement {
 
   const ResetButton = ({ field }: { field: keyof Defaults }) =>
     isSet(field) ? (
-      <button
+      <button type="button"
         onClick={() => reset(field)}
         className="text-xs ml-2 text-content-faint underline"
         style={{ background: 'none', border: 'none', cursor: 'pointer' }}

client/src/components/Admin/DevNotificationsPanel.tsx

@@ -66,7 +66,7 @@ export default function DevNotificationsPanel(): React.ReactElement {
   }: {
     id: string; label: string; sub: string; icon: React.ElementType; color: string; onClick: () => void
   }) => (
-    <button
+    <button type="button"
       onClick={onClick}
       disabled={sending !== null}
       className="flex items-center gap-3 px-4 py-3 rounded-lg border transition-colors text-left w-full border-edge bg-surface-card"

client/src/components/Admin/GitHubPanel.tsx

@@ -461,7 +461,7 @@ export default function GitHubPanel({ isPrerelease = false }: { isPrerelease?: b
                         {/* Expandable body */}
                         {release.body && (
                           <div className="mt-2">
-                            <button
+                            <button type="button"
                               onClick={() => toggleExpand(release.id)}
                               className="flex items-center gap-1 text-[11px] font-medium text-content-muted transition-colors"
                             >
@@ -484,7 +484,7 @@ export default function GitHubPanel({ isPrerelease = false }: { isPrerelease?: b
             {/* Load more */}
             {hasMore && (
               <div className="pt-2 text-center">
-                <button
+                <button type="button"
                   onClick={handleLoadMore}
                   disabled={loadingMore}
                   className="inline-flex items-center gap-2 rounded-lg bg-surface-secondary px-4 py-2 text-xs font-medium text-content-muted transition-colors"

client/src/components/Admin/PackingTemplateManager.tsx

@@ -158,7 +158,7 @@ export default function PackingTemplateManager() {
           <h2 className="font-semibold text-slate-900">{t('admin.packingTemplates.title')}</h2>
           <p className="text-xs text-slate-400 mt-1">{t('admin.packingTemplates.subtitle')}</p>
         </div>
-        <button onClick={() => setShowCreate(true)}
+        <button type="button" onClick={() => setShowCreate(true)}
           className="flex items-center gap-1.5 px-3 py-1.5 text-sm bg-slate-900 text-white rounded-lg hover:bg-slate-700 transition-colors">
           <Plus className="w-4 h-4" /> <span className="hidden sm:inline">{t('admin.packingTemplates.create')}</span>
         </button>
@@ -171,8 +171,8 @@ export default function PackingTemplateManager() {
           <input autoFocus value={createName} onChange={e => setCreateName(e.target.value)}
             onKeyDown={e => { if (e.key === 'Enter') handleCreateTemplate(); if (e.key === 'Escape') setShowCreate(false) }}
             placeholder={t('admin.packingTemplates.namePlaceholder')} className={inputStyle} />
-          <button onClick={handleCreateTemplate} className={`${btnIcon} text-slate-600 hover:text-slate-900`}><Check size={16} /></button>
-          <button onClick={() => setShowCreate(false)} className={`${btnIcon} text-slate-400 hover:text-slate-600`}><X size={16} /></button>
+          <button type="button" onClick={handleCreateTemplate} className={`${btnIcon} text-slate-600 hover:text-slate-900`}><Check size={16} /></button>
+          <button type="button" onClick={() => setShowCreate(false)} className={`${btnIcon} text-slate-400 hover:text-slate-600`}><X size={16} /></button>
         </div>
       )}
 
@@ -187,7 +187,7 @@ export default function PackingTemplateManager() {
             <div key={tmpl.id}>
               {/* Template row */}
               <div className="px-5 py-3 flex items-center gap-3 hover:bg-slate-50 transition-colors">
-                <button onClick={() => toggleExpand(tmpl.id)} className="text-slate-400 flex-shrink-0 p-0 bg-transparent border-none cursor-pointer">
+                <button type="button" onClick={() => toggleExpand(tmpl.id)} className="text-slate-400 flex-shrink-0 p-0 bg-transparent border-none cursor-pointer">
                   {expandedId === tmpl.id ? <ChevronDown size={15} /> : <ChevronRight size={15} />}
                 </button>
                 <Package size={16} className="text-slate-400 flex-shrink-0" />
@@ -202,9 +202,9 @@ export default function PackingTemplateManager() {
                 <span className="text-xs text-slate-400 px-2 py-0.5 bg-slate-100 rounded-full">
                   {tmpl.category_count} {t('admin.packingTemplates.categories')} · {tmpl.item_count} {t('admin.packingTemplates.items')}
                 </span>
-                <button onClick={() => { setEditingTemplate(tmpl.id); setEditTemplateName(tmpl.name) }}
+                <button type="button" onClick={() => { setEditingTemplate(tmpl.id); setEditTemplateName(tmpl.name) }}
                   className={`${btnIcon} hover:bg-slate-100 text-slate-400 hover:text-slate-700`}><Edit2 size={14} /></button>
-                <button onClick={() => handleDeleteTemplate(tmpl.id)}
+                <button type="button" onClick={() => handleDeleteTemplate(tmpl.id)}
                   className={`${btnIcon} hover:bg-red-50 text-slate-400 hover:text-red-500`}><Trash2 size={14} /></button>
               </div>
 
@@ -228,11 +228,11 @@ export default function PackingTemplateManager() {
                             <span className="flex-1 text-xs font-bold text-slate-500 uppercase tracking-wider">{cat.name}</span>
                           )}
                           <span className="text-xs text-slate-400">{catItems.length}</span>
-                          <button onClick={() => { setAddingItemToCatId(addingItemToCatId === cat.id ? null : cat.id); setNewItemName(''); setTimeout(() => addItemRef.current?.focus(), 30) }}
+                          <button type="button" onClick={() => { setAddingItemToCatId(addingItemToCatId === cat.id ? null : cat.id); setNewItemName(''); setTimeout(() => addItemRef.current?.focus(), 30) }}
                             className={`${btnIcon} text-slate-400 hover:text-slate-700`}><Plus size={13} /></button>
-                          <button onClick={() => { setEditingCatId(cat.id); setEditCatName(cat.name) }}
+                          <button type="button" onClick={() => { setEditingCatId(cat.id); setEditCatName(cat.name) }}
                             className={`${btnIcon} text-slate-400 hover:text-slate-700`}><Edit2 size={13} /></button>
-                          <button onClick={() => handleDeleteCategory(cat.id)}
+                          <button type="button" onClick={() => handleDeleteCategory(cat.id)}
                             className={`${btnIcon} text-slate-400 hover:text-red-500`}><Trash2 size={13} /></button>
                         </div>
 
@@ -246,15 +246,15 @@ export default function PackingTemplateManager() {
                                     <input autoFocus value={editItemName} onChange={e => setEditItemName(e.target.value)}
                                       onKeyDown={e => { if (e.key === 'Enter') handleRenameItem(item.id); if (e.key === 'Escape') setEditingItemId(null) }}
                                       className="flex-1 px-2 py-1 border border-slate-200 rounded-lg text-sm" />
-                                    <button onClick={() => handleRenameItem(item.id)} className="p-1 text-slate-600 hover:text-slate-900"><Check size={13} /></button>
-                                    <button onClick={() => setEditingItemId(null)} className="p-1 text-slate-400"><X size={13} /></button>
+                                    <button type="button" onClick={() => handleRenameItem(item.id)} className="p-1 text-slate-600 hover:text-slate-900"><Check size={13} /></button>
+                                    <button type="button" onClick={() => setEditingItemId(null)} className="p-1 text-slate-400"><X size={13} /></button>
                                   </>
                                 ) : (
                                   <>
                                     <span className="flex-1 text-sm text-slate-700">{item.name}</span>
-                                    <button onClick={() => { setEditingItemId(item.id); setEditItemName(item.name) }}
+                                    <button type="button" onClick={() => { setEditingItemId(item.id); setEditItemName(item.name) }}
                                       className="p-1 rounded opacity-0 group-hover:opacity-100 text-slate-400 hover:text-slate-700 transition-all"><Edit2 size={12} /></button>
-                                    <button onClick={() => handleDeleteItem(item.id)}
+                                    <button type="button" onClick={() => handleDeleteItem(item.id)}
                                       className="p-1 rounded opacity-0 group-hover:opacity-100 text-slate-400 hover:text-red-500 transition-all"><Trash2 size={12} /></button>
                                   </>
                                 )}
@@ -268,9 +268,9 @@ export default function PackingTemplateManager() {
                                   onKeyDown={e => { if (e.key === 'Enter' && newItemName.trim()) handleAddItem(cat.id); if (e.key === 'Escape') { setAddingItemToCatId(null); setNewItemName('') } }}
                                   placeholder={t('admin.packingTemplates.itemName')}
                                   className="flex-1 px-2 py-1 border border-slate-200 rounded-lg text-sm" />
-                                <button onClick={() => handleAddItem(cat.id)} disabled={!newItemName.trim()}
+                                <button type="button" onClick={() => handleAddItem(cat.id)} disabled={!newItemName.trim()}
                                   className="p-1.5 rounded-lg bg-slate-900 text-white disabled:bg-slate-300 hover:bg-slate-700 transition-colors"><Plus size={13} /></button>
-                                <button onClick={() => { setAddingItemToCatId(null); setNewItemName('') }}
+                                <button type="button" onClick={() => { setAddingItemToCatId(null); setNewItemName('') }}
                                   className="p-1 text-slate-400 hover:text-slate-600"><X size={13} /></button>
                               </div>
                             )}
@@ -287,11 +287,11 @@ export default function PackingTemplateManager() {
                         onKeyDown={e => { if (e.key === 'Enter') handleAddCategory(); if (e.key === 'Escape') { setAddingCategory(false); setNewCatName('') } }}
                         placeholder={t('admin.packingTemplates.categoryName')}
                         className="flex-1 px-3 py-2 border border-slate-200 rounded-lg text-sm" />
-                      <button onClick={handleAddCategory} className={`${btnIcon} text-slate-600 hover:text-slate-900`}><Check size={15} /></button>
-                      <button onClick={() => { setAddingCategory(false); setNewCatName('') }} className={`${btnIcon} text-slate-400`}><X size={15} /></button>
+                      <button type="button" onClick={handleAddCategory} className={`${btnIcon} text-slate-600 hover:text-slate-900`}><Check size={15} /></button>
+                      <button type="button" onClick={() => { setAddingCategory(false); setNewCatName('') }} className={`${btnIcon} text-slate-400`}><X size={15} /></button>
                     </div>
                   ) : (
-                    <button onClick={() => setAddingCategory(true)}
+                    <button type="button" onClick={() => setAddingCategory(true)}
                       className="flex items-center gap-2 px-3 py-2.5 w-full text-sm text-slate-400 hover:text-slate-600 border border-dashed border-slate-200 rounded-lg hover:border-slate-400 transition-colors">
                       <FolderPlus size={14} /> {t('admin.packingTemplates.addCategory')}
                     </button>

client/src/components/Admin/PermissionsPanel.tsx

@@ -104,7 +104,7 @@ export default function PermissionsPanel(): React.ReactElement {
             <p className="text-xs text-slate-400 mt-0.5">{t('perm.subtitle')}</p>
           </div>
           <div className="flex items-center gap-2">
-            <button
+            <button type="button"
               onClick={handleReset}
               disabled={saving}
               title={t('perm.resetDefaults')}
@@ -114,7 +114,7 @@ export default function PermissionsPanel(): React.ReactElement {
               <RotateCcw className="w-3.5 h-3.5" />
               <span className="hidden sm:inline">{t('perm.resetDefaults')}</span>
             </button>
-            <button
+            <button type="button"
               onClick={handleSave}
               disabled={saving || !dirty}
               className="flex items-center gap-1.5 px-3 py-1.5 text-sm bg-slate-900 text-white rounded-lg hover:bg-slate-700 disabled:bg-slate-400 transition-colors"

client/src/components/Admin/storage/AdminStoragePanel.tsx

@@ -338,7 +338,7 @@ export default function AdminStoragePanel(): React.ReactElement {
             ? t('storage.usage.computed', { age: relativeTime(state.usage.computedAt, locale) })
             : t('storage.usage.never')}
           {' '}
-          <button className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={handleRefreshStats}>
+          <button type="button" className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={handleRefreshStats}>
             {state.usage ? t('storage.usage.refresh') : t('storage.usage.compute')}
           </button>
         </p>
@@ -364,7 +364,7 @@ export default function AdminStoragePanel(): React.ReactElement {
                     {t(`storage.source.${row.source}`)}
                   </span>
                   <span className="flex-1" />
-                  <button
+                  <button type="button"
                     className="text-xs underline text-content-secondary"
                     style={LINK_BUTTON_STYLE}
                     onClick={() =>
@@ -376,12 +376,12 @@ export default function AdminStoragePanel(): React.ReactElement {
                     {t('storage.actions.test')}
                   </button>
                   {row.source !== 'env' && (
-                    <button className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={() => startEdit(row)}>
+                    <button type="button" className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={() => startEdit(row)}>
                       {t('storage.actions.edit')}
                     </button>
                   )}
                   {row.source === 'settings' && (
-                    <button className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={() => setConfirmRemove({ name: row.name, degenerate: false })}>
+                    <button type="button" className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={() => setConfirmRemove({ name: row.name, degenerate: false })}>
                       {t('storage.actions.remove')}
                     </button>
                   )}
@@ -433,7 +433,7 @@ export default function AdminStoragePanel(): React.ReactElement {
                             failed: String(backfill.failed),
                           })}
                         </p>
-                        <button
+                        <button type="button"
                           className="text-xs underline text-content-secondary mt-1"
                           style={LINK_BUTTON_STYLE}
                           onClick={() => handleCancelBackfill(row)}
@@ -464,7 +464,7 @@ export default function AdminStoragePanel(): React.ReactElement {
                           </p>
                         )}
                         {syncPrompt !== row.name && (
-                          <button
+                          <button type="button"
                             className="text-xs underline text-content-secondary"
                             style={LINK_BUTTON_STYLE}
                             onClick={() => handleStartBackfill(row)}
@@ -480,14 +480,14 @@ export default function AdminStoragePanel(): React.ReactElement {
                   <div className="mt-2 rounded-lg border p-2 border-edge-secondary">
                     <p className="text-xs text-content">{t('storage.sync.prompt')}</p>
                     <div className="flex items-center gap-3 mt-1">
-                      <button
+                      <button type="button"
                         className="text-xs underline text-content-secondary"
                         style={LINK_BUTTON_STYLE}
                         onClick={() => handleStartBackfill(row)}
                       >
                         {t('storage.sync.now')}
                       </button>
-                      <button
+                      <button type="button"
                         className="text-xs underline text-content-secondary"
                         style={LINK_BUTTON_STYLE}
                         onClick={() => setSyncPrompt(null)}
@@ -512,10 +512,10 @@ export default function AdminStoragePanel(): React.ReactElement {
                     {t('storage.type.mirror')}
                   </span>
                   <span className="flex-1" />
-                  <button className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={() => admin.test(backend)}>
+                  <button type="button" className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={() => admin.test(backend)}>
                     {t('storage.actions.test')}
                   </button>
-                  <button className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={() => setConfirmRemove({ name: backend.name, degenerate: true })}>
+                  <button type="button" className="text-xs underline text-content-secondary" style={LINK_BUTTON_STYLE} onClick={() => setConfirmRemove({ name: backend.name, degenerate: true })}>
                     {t('storage.actions.remove')}
                   </button>
                 </div>
@@ -552,7 +552,7 @@ export default function AdminStoragePanel(): React.ReactElement {
                         total: String(m.total),
                       })}
                     </p>
-                    <button
+                    <button type="button"
                       className="text-xs underline text-content-secondary mt-1"
                       style={LINK_BUTTON_STYLE}
                       onClick={() => void handleCancelMigration(m)}
@@ -601,7 +601,7 @@ export default function AdminStoragePanel(): React.ReactElement {
             onCancel={() => setEditing(null)}
           />
         ) : (
-          <button
+          <button type="button"
             onClick={() =>
               setEditing({
                 initial: null,
@@ -675,7 +675,7 @@ export default function AdminStoragePanel(): React.ReactElement {
       </Section>
 
       <div className="flex items-center gap-3">
-        <button
+        <button type="button"
           onClick={save}
           disabled={!admin.dirty || admin.saving}
           style={{
@@ -715,21 +715,21 @@ export default function AdminStoragePanel(): React.ReactElement {
             </p>
           ))}
           <div className="flex items-center gap-3 mt-2">
-            <button
+            <button type="button"
               className="text-xs underline text-content-secondary"
               style={LINK_BUTTON_STYLE}
               onClick={() => void moveAndSave()}
             >
               {t('storage.migrate.move')}
             </button>
-            <button
+            <button type="button"
               className="text-xs underline text-content-secondary"
               style={LINK_BUTTON_STYLE}
               onClick={() => void routeOnlySave()}
             >
               {t('storage.migrate.routeOnly')}
             </button>
-            <button
+            <button type="button"
               className="text-xs underline text-content-secondary"
               style={LINK_BUTTON_STYLE}
               onClick={() => setMigratePromptOpen(false)}
@@ -746,7 +746,7 @@ export default function AdminStoragePanel(): React.ReactElement {
               past; "save again" can never clear it, so the banner offers the
               one action that can — see useStorageAdmin.discardDraft. */}
           {admin.saveConflict && (
-            <button
+            <button type="button"
               className="text-xs underline text-content-secondary mt-1"
               style={LINK_BUTTON_STYLE}
               onClick={() => void admin.discardDraft()}

client/src/components/Admin/storage/BackendForm.tsx

@@ -236,7 +236,7 @@ export default function BackendForm({
       )}
 
       <div className="flex items-center gap-3">
-        <button
+        <button type="button"
           onClick={apply}
           disabled={!canApply}
           style={{
@@ -248,7 +248,7 @@ export default function BackendForm({
         >
           {t('storage.form.apply')}
         </button>
-        <button
+        <button type="button"
           onClick={onCancel}
           style={{
             padding: '8px 20px', borderRadius: 10, cursor: 'pointer', fontFamily: 'inherit',

client/src/components/BackgroundTasks/BackgroundTasksWidget.tsx

@@ -163,7 +163,7 @@ export default function BackgroundTasksWidget() {
                 <div style={{ fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', marginTop: 1 }}>{t('reservations.import.parsing')}</div>
               ) : task.items.length > 0 ? (
                 <div>
-                  <button
+                  <button type="button"
                     onClick={() => review(task)}
                     className="bg-accent text-accent-text"
                     style={{ marginTop: 4, border: 'none', borderRadius: 8, padding: '4px 12px', fontSize: 'calc(11.5px * var(--fs-scale-caption, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit' }}
@@ -192,7 +192,7 @@ export default function BackgroundTasksWidget() {
                     )}
                   </div>
                   {aiParsing && task.mode !== 'force-ai' && task.sourceFiles && task.sourceFiles.length > 0 && (
-                    <button
+                    <button type="button"
                       onClick={() => retryWithAi(task)}
                       disabled={retrying === task.id}
                       className="bg-surface-tertiary text-content"
@@ -211,7 +211,7 @@ export default function BackgroundTasksWidget() {
           </div>
 
           {task.status !== 'running' && (
-            <button
+            <button type="button"
               onClick={() => dismiss(task.id)}
               className="bg-transparent text-content-faint"
               style={{ flexShrink: 0, border: 'none', cursor: 'pointer', padding: 2, borderRadius: 6, display: 'flex', alignItems: 'center' }}

client/src/components/Budget/BudgetPanel.helpers.ts

@@ -48,7 +48,7 @@ export function hexLighten(hex: string, amount: number): string {
   const m = hex.replace('#', '').match(/.{2}/g)
   if (!m || m.length !== 3) return hex
   const mix = (c: number) => Math.min(255, Math.round(c + (255 - c) * amount))
-  const [r, g, b] = m.map(x => parseInt(x, 16))
+  const [r, g, b] = m.map(x => Number.parseInt(x, 16))
   return `#${[mix(r), mix(g), mix(b)].map(v => v.toString(16).padStart(2, '0')).join('')}`
 }
 

client/src/components/Budget/BudgetPanel.tsx

@@ -46,7 +46,7 @@ export default function BudgetPanel({ tripId, tripMembers = [] }: BudgetPanelPro
               onKeyDown={e => e.key === 'Enter' && handleAddCategory()}
               placeholder={t('budget.emptyPlaceholder')}
               style={{ flex: 1, padding: '9px 14px', borderRadius: 10, border: '1px solid var(--border-primary)', fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontFamily: 'inherit', outline: 'none', background: 'var(--bg-input)', color: 'var(--text-primary)', minWidth: 0 }} />
-            <button onClick={handleAddCategory} disabled={!newCategoryName.trim()}
+            <button type="button" onClick={handleAddCategory} disabled={!newCategoryName.trim()}
               style={{ background: 'var(--accent)', color: 'var(--accent-text)', border: 'none', borderRadius: 10, padding: '0 12px', cursor: 'pointer', display: 'flex', alignItems: 'center', opacity: newCategoryName.trim() ? 1 : 0.5, flexShrink: 0 }}>
               <Plus size={16} />
             </button>
@@ -87,7 +87,7 @@ export default function BudgetPanel({ tripId, tripMembers = [] }: BudgetPanelPro
                   placeholder={t('budget.categoryName')}
                   style={{ flex: 1, minWidth: 0, border: '1px solid var(--border-primary)', borderRadius: 10, padding: '9px 14px', fontSize: 'calc(13px * var(--fs-scale-body, 1))', outline: 'none', fontFamily: 'inherit', background: 'var(--bg-card)', color: 'var(--text-primary)' }}
                 />
-                <button onClick={handleAddCategory} disabled={!newCategoryName.trim()}
+                <button type="button" onClick={handleAddCategory} disabled={!newCategoryName.trim()}
                   title={t('budget.addCategory')}
                   style={{
                     appearance: 'none', border: 'none', cursor: newCategoryName.trim() ? 'pointer' : 'default', fontFamily: 'inherit',
@@ -101,7 +101,7 @@ export default function BudgetPanel({ tripId, tripMembers = [] }: BudgetPanelPro
                 </button>
               </div>
             )}
-            <button onClick={handleExportCsv} title={t('budget.exportCsv')}
+            <button type="button" onClick={handleExportCsv} title={t('budget.exportCsv')}
               style={{
                 appearance: 'none', border: 'none', cursor: 'pointer', fontFamily: 'inherit',
                 display: 'inline-flex', alignItems: 'center', gap: 6,

client/src/components/Budget/BudgetPanelAddItemRow.tsx

@@ -19,7 +19,7 @@ export default function AddItemRow({ onAdd, t }: AddItemRowProps) {
 
   const handleAdd = () => {
     if (!name.trim()) return
-    onAdd({ name: name.trim(), total_price: parseFloat(String(price).replace(',', '.')) || 0, persons: parseInt(persons) || null, days: parseInt(days) || null, note: note.trim() || null, expense_date: expenseDate || null })
+    onAdd({ name: name.trim(), total_price: Number.parseFloat(String(price).replace(',', '.')) || 0, persons: Number.parseInt(persons) || null, days: Number.parseInt(days) || null, note: note.trim() || null, expense_date: expenseDate || null })
     setName(''); setPrice(''); setPersons(''); setDays(''); setNote(''); setExpenseDate('')
     setTimeout(() => nameRef.current?.focus(), 50)
   }
@@ -57,7 +57,7 @@ export default function AddItemRow({ onAdd, t }: AddItemRowProps) {
         <input value={note} onChange={e => setNote(e.target.value)} onKeyDown={e => e.key === 'Enter' && handleAdd()} placeholder={t('budget.table.note')} style={inp} />
       </td>
       <td style={{ padding: '4px 6px', textAlign: 'center' }}>
-        <button onClick={handleAdd} disabled={!name.trim()} title={t('reservations.add')}
+        <button type="button" onClick={handleAdd} disabled={!name.trim()} title={t('reservations.add')}
           style={{ background: name.trim() ? 'var(--text-primary)' : 'var(--border-primary)', border: 'none', borderRadius: 4, color: 'var(--bg-primary)',
             cursor: name.trim() ? 'pointer' : 'default', padding: '4px 8px', display: 'inline-flex', alignItems: 'center' }}>
           <Plus size={14} />

client/src/components/Budget/BudgetPanelCategoryTable.tsx

@@ -111,7 +111,7 @@ export default function BudgetCategoryTable({ cat, grouped, categoryColor, canEd
                       <>
                         <span style={{ fontWeight: 600, fontSize: 'calc(13px * var(--fs-scale-body, 1))' }}>{cat}</span>
                         {canEdit && (
-                          <button onClick={() => setEditingCat({ name: cat, value: cat })}
+                          <button type="button" onClick={() => setEditingCat({ name: cat, value: cat })}
                             style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.4)', display: 'flex', padding: 1 }}
                             onMouseEnter={e => e.currentTarget.style.color = '#fff'} onMouseLeave={e => e.currentTarget.style.color = 'rgba(255,255,255,0.4)'}>
                             <Pencil size={10} />
@@ -123,7 +123,7 @@ export default function BudgetCategoryTable({ cat, grouped, categoryColor, canEd
                   <div style={{ display: 'flex', alignItems: 'center', gap: 10 }}>
                     <span style={{ fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 500, opacity: 0.9 }}>{fmt(subtotal, currency)}</span>
                     {canEdit && (
-                      <button onClick={() => handleDeleteCategory(cat)} title={t('budget.deleteCategory')}
+                      <button type="button" onClick={() => handleDeleteCategory(cat)} title={t('budget.deleteCategory')}
                         style={{ background: 'rgba(255,255,255,0.1)', border: 'none', borderRadius: 4, color: '#fff', cursor: 'pointer', padding: '3px 6px', display: 'flex', alignItems: 'center', opacity: 0.6 }}
                         onMouseEnter={e => e.currentTarget.style.opacity = '1'} onMouseLeave={e => e.currentTarget.style.opacity = '0.6'}>
                         <Trash2 size={13} />
@@ -225,11 +225,11 @@ export default function BudgetCategoryTable({ cat, grouped, categoryColor, canEd
                                   readOnly={!canEdit}
                                 />
                               ) : (
-                                <InlineEditCell value={item.persons} type="number" decimals={0} onSave={v => handleUpdateField(item.id, 'persons', v != null ? parseInt(v as string) || null : null)} style={{ textAlign: 'center' }} placeholder="-" locale={locale} editTooltip={t('budget.editTooltip')} readOnly={!canEdit} />
+                                <InlineEditCell value={item.persons} type="number" decimals={0} onSave={v => handleUpdateField(item.id, 'persons', v != null ? Number.parseInt(v as string) || null : null)} style={{ textAlign: 'center' }} placeholder="-" locale={locale} editTooltip={t('budget.editTooltip')} readOnly={!canEdit} />
                               )}
                             </td>
                             <td className="hidden sm:table-cell" style={{ ...td, textAlign: 'center' }}>
-                              <InlineEditCell value={item.days} type="number" decimals={0} onSave={v => handleUpdateField(item.id, 'days', v != null ? parseInt(v as string) || null : null)} style={{ textAlign: 'center' }} placeholder="-" locale={locale} editTooltip={t('budget.editTooltip')} readOnly={!canEdit} />
+                              <InlineEditCell value={item.days} type="number" decimals={0} onSave={v => handleUpdateField(item.id, 'days', v != null ? Number.parseInt(v as string) || null : null)} style={{ textAlign: 'center' }} placeholder="-" locale={locale} editTooltip={t('budget.editTooltip')} readOnly={!canEdit} />
                             </td>
                             <td className="hidden md:table-cell" style={{ ...td, textAlign: 'center', color: pp != null ? 'var(--text-secondary)' : 'var(--text-faint)' }}>{pp != null ? fmt(pp, currency) : '-'}</td>
                             <td className="hidden md:table-cell" style={{ ...td, textAlign: 'center', color: pd != null ? 'var(--text-secondary)' : 'var(--text-faint)' }}>{pd != null ? fmt(pd, currency) : '-'}</td>
@@ -246,7 +246,7 @@ export default function BudgetCategoryTable({ cat, grouped, categoryColor, canEd
                             <td className="hidden sm:table-cell" style={td}><InlineEditCell value={item.note} onSave={v => handleUpdateField(item.id, 'note', v)} placeholder={t('budget.table.note')} locale={locale} editTooltip={t('budget.editTooltip')} readOnly={!canEdit} /></td>
                             <td style={{ ...td, textAlign: 'center' }}>
                               {canEdit && (
-                              <button onClick={() => handleDeleteItem(item.id)} title={t('common.delete')}
+                              <button type="button" onClick={() => handleDeleteItem(item.id)} title={t('common.delete')}
                                 style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 4, color: 'var(--text-faint)', borderRadius: 4, display: 'inline-flex', transition: 'color 0.15s' }}
                                 onMouseEnter={e => e.currentTarget.style.color = '#ef4444'} onMouseLeave={e => e.currentTarget.style.color = '#d1d5db'}>
                                 <Trash2 size={14} />

client/src/components/Budget/BudgetPanelInlineEditCell.tsx

@@ -23,7 +23,7 @@ export default function InlineEditCell({ value, onSave, type = 'text', style = {
   const save = () => {
     setEditing(false)
     let v: string | number | null = editValue
-    if (type === 'number') { const p = parseFloat(String(editValue).replace(',', '.')); v = isNaN(p) ? null : p }
+    if (type === 'number') { const p = Number.parseFloat(String(editValue).replace(',', '.')); v = isNaN(p) ? null : p }
     if (v !== value) onSave(v)
   }
 

client/src/components/Budget/BudgetPanelMemberChips.tsx

@@ -131,7 +131,7 @@ export default function BudgetMemberChips({ members = [], tripMembers = [], onSe
         />
       ))}
       {!readOnly && (
-        <button ref={btnRef} onClick={openDropdown}
+        <button type="button" ref={btnRef} onClick={openDropdown}
           style={{
             width: btnSize, height: btnSize, borderRadius: '50%', border: '1.5px dashed var(--border-primary)',
             background: 'none', cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center',
@@ -149,7 +149,7 @@ export default function BudgetMemberChips({ members = [], tripMembers = [], onSe
           {tripMembers.map(tm => {
             const isActive = memberIds.includes(tm.id)
             return (
-              <button key={tm.id} onClick={() => toggleMember(tm.id)} style={{
+              <button type="button" key={tm.id} onClick={() => toggleMember(tm.id)} style={{
                 display: 'flex', alignItems: 'center', gap: 6, width: '100%', padding: '5px 8px',
                 borderRadius: 6, border: 'none', background: isActive ? 'var(--bg-hover)' : 'none', cursor: 'pointer',
                 fontFamily: 'inherit', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-primary)', textAlign: 'left',

client/src/components/Budget/BudgetPanelSummary.tsx

@@ -75,7 +75,7 @@ export default function BudgetSummary({ theme, currency, locale, grandTotal, has
             {/* Settlement dropdown inside the total card */}
             {hasMultipleMembers && settlement && settlement.flows.length > 0 && (
               <div style={{ marginTop: 16, borderTop: `1px solid ${theme.divider}`, paddingTop: 12 }}>
-                <button onClick={() => setSettlementOpen(v => !v)} style={{
+                <button type="button" onClick={() => setSettlementOpen(v => !v)} style={{
                   display: 'flex', alignItems: 'center', gap: 6, width: '100%',
                   background: 'none', border: 'none', cursor: 'pointer', padding: 0, fontFamily: 'inherit',
                   color: theme.sub, fontSize: 'calc(11px * var(--fs-scale-caption, 1))', fontWeight: 600, letterSpacing: 0.5,

client/src/components/Budget/CostsPanel.helpers.ts

@@ -22,7 +22,7 @@ export function splitCents(amount: number, n: number): number[] {
 
 /** Sum the amounts of the selected payers. */
 export function payerSum(amounts: Record<number, string>, ids: Set<number>): number {
-  return [...ids].reduce((a, id) => a + (parseFloat(amounts[id]) || 0), 0)
+  return [...ids].reduce((a, id) => a + (Number.parseFloat(amounts[id]) || 0), 0)
 }
 
 /** True when the payer amounts add up to the expense total, to the cent. */
@@ -45,7 +45,7 @@ export function rebalancePayers(
   if (free.length === 0) return amounts
   const pinnedSum = all
     .filter(id => pinned.has(id))
-    .reduce((a, id) => a + (parseFloat(amounts[id]) || 0), 0)
+    .reduce((a, id) => a + (Number.parseFloat(amounts[id]) || 0), 0)
   const shares = splitCents(total - pinnedSum, free.length)
   const next = { ...amounts }
   free.forEach((id, i) => { next[id] = shares[i] ? shares[i].toFixed(2) : '' })
@@ -153,7 +153,7 @@ export function calculateTicketShares(items: TicketItem[]): { shares: Record<num
   const everyone = [...new Set(items.flatMap(i => [...i.participants]))].sort((a, b) => a - b)
 
   for (const item of items) {
-    const priceNum = parseFloat(item.price) || 0
+    const priceNum = Number.parseFloat(item.price) || 0
     const priceCents = Math.round(priceNum * 100)
     totalCents += priceCents
 

client/src/components/Budget/CostsPanel.tsx

@@ -348,12 +348,12 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
         </div>
         {canEdit && (
           <div style={{ display: 'flex', gap: 10 }}>
-            <button onClick={settleAll} disabled={!(settlement?.flows || []).length}
+            <button type="button" onClick={settleAll} disabled={!(settlement?.flows || []).length}
               className="bg-surface-card border border-edge text-content disabled:opacity-40"
               style={{ display: 'inline-flex', alignItems: 'center', gap: 7, padding: '10px 16px', borderRadius: 12, fontSize: 'calc(14px * var(--fs-scale-body, 1))', fontWeight: 500, cursor: 'pointer', fontFamily: 'inherit' }}>
               <Check size={16} /> {t('costs.settleUp')}
             </button>
-            <button onClick={() => { setEditing(null); setModalOpen(true) }}
+            <button type="button" onClick={() => { setEditing(null); setModalOpen(true) }}
               className="bg-[var(--text-primary)] text-[var(--bg-primary)]"
               style={{ display: 'inline-flex', alignItems: 'center', gap: 7, padding: '10px 18px', borderRadius: 12, fontSize: 'calc(14px * var(--fs-scale-body, 1))', fontWeight: 600, border: 0, cursor: 'pointer', fontFamily: 'inherit' }}>
               <Plus size={16} /> {t('costs.addExpense')}
@@ -401,14 +401,14 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
               {filterControls}
               <div className="bg-surface-secondary" style={{ display: 'flex', borderRadius: 9, padding: 3 }}>
                 {(['all', 'mine', 'owed'] as const).map(f => (
-                  <button key={f} onClick={() => setFilter(f)}
+                  <button type="button" key={f} onClick={() => setFilter(f)}
                     className={filter === f ? 'bg-surface-card text-content' : 'text-content-muted'}
                     style={{ padding: '6px 11px', fontSize: 'calc(12px * var(--fs-scale-body, 1))', borderRadius: 7, fontWeight: 500, border: 0, cursor: 'pointer', fontFamily: 'inherit' }}>
                     {t('costs.filter.' + f)}
                   </button>
                 ))}
               </div>
-              <button onClick={handleExportCsv} title={t('budget.exportCsv')} disabled={!budgetItems.length}
+              <button type="button" onClick={handleExportCsv} title={t('budget.exportCsv')} disabled={!budgetItems.length}
                 className="bg-surface-input border border-edge text-content-muted disabled:opacity-40"
                 style={{ display: 'inline-flex', alignItems: 'center', justifyContent: 'center', width: 34, height: 34, borderRadius: 10, cursor: 'pointer', fontFamily: 'inherit', flexShrink: 0 }}>
                 <Download size={15} />
@@ -451,7 +451,7 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
             <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 14 }}>
               <div className={labelCls}>{t('costs.settleUp')} · <span className="text-content">{(settlement?.flows || []).length}</span></div>
               {canEdit && (
-                <button onClick={() => setAddingPayment(true)}
+                <button type="button" onClick={() => setAddingPayment(true)}
                   className="text-content-muted bg-surface-secondary border border-edge"
                   style={{ display: 'inline-flex', alignItems: 'center', gap: 5, padding: '5px 9px', borderRadius: 8, fontSize: 'calc(11.5px * var(--fs-scale-caption, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit' }}>
                   <Plus size={13} /> {t('costs.addPayment')}
@@ -560,7 +560,7 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
             </div>
             <div style={{ display: 'flex', alignItems: 'center', gap: 8, flexShrink: 0 }}>
               <span className="text-content" style={{ fontSize: 'calc(14px * var(--fs-scale-body, 1))', fontWeight: 700 }}>{fmt(f.amount)}</span>
-              {canEdit && <button onClick={() => settleFlow(f.from.user_id, f.to.user_id, f.amount)} className="bg-[var(--text-primary)] text-[var(--bg-primary)]" style={{ padding: '7px 12px', borderRadius: 9, fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 600, border: 0, cursor: 'pointer', fontFamily: 'inherit' }}>{t('costs.settle')}</button>}
+              {canEdit && <button type="button" onClick={() => settleFlow(f.from.user_id, f.to.user_id, f.amount)} className="bg-[var(--text-primary)] text-[var(--bg-primary)]" style={{ padding: '7px 12px', borderRadius: 9, fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 600, border: 0, cursor: 'pointer', fontFamily: 'inherit' }}>{t('costs.settle')}</button>}
             </div>
           </div>
         ))}
@@ -589,7 +589,7 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
             <span>{t('costs.youPaid')} · <b style={{ color: '#fff', fontWeight: 600 }}>{fmt0(totals.myPaid)}</b></span>
           </div>
           {canEdit && (
-            <button onClick={() => { setEditing(null); setModalOpen(true) }} style={{ marginTop: 16, width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 8, background: 'rgba(255,255,255,0.14)', border: '1px solid rgba(255,255,255,0.16)', color: '#fff', padding: 13, borderRadius: 14, fontSize: 'calc(14px * var(--fs-scale-body, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit' }}>
+            <button type="button" onClick={() => { setEditing(null); setModalOpen(true) }} style={{ marginTop: 16, width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 8, background: 'rgba(255,255,255,0.14)', border: '1px solid rgba(255,255,255,0.16)', color: '#fff', padding: 13, borderRadius: 14, fontSize: 'calc(14px * var(--fs-scale-body, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit' }}>
               <Plus size={17} /> {t('costs.addExpense')}
             </button>
           )}
@@ -628,7 +628,7 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
           <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 14, gap: 8 }}>
             <div className="text-content" style={{ fontSize: 'calc(19px * var(--fs-scale-subtitle, 1))', fontWeight: 700, letterSpacing: '-0.02em', display: 'flex', alignItems: 'baseline', gap: 8 }}>{t('costs.settleUp')} <span className="text-content-faint" style={{ fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 500 }}>{(settlement?.flows || []).length}</span></div>
             {canEdit && (
-              <button onClick={() => setAddingPayment(true)} className="text-content-muted bg-surface-card border border-edge" style={{ display: 'inline-flex', alignItems: 'center', gap: 5, padding: '6px 10px', borderRadius: 9, fontSize: 'calc(11.5px * var(--fs-scale-caption, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit' }}><Plus size={13} /> {t('costs.addPayment')}</button>
+              <button type="button" onClick={() => setAddingPayment(true)} className="text-content-muted bg-surface-card border border-edge" style={{ display: 'inline-flex', alignItems: 'center', gap: 5, padding: '6px 10px', borderRadius: 9, fontSize: 'calc(11.5px * var(--fs-scale-caption, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit' }}><Plus size={13} /> {t('costs.addPayment')}</button>
             )}
           </div>
           {SettleFlows()}
@@ -638,7 +638,7 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
         <div style={{ display: 'flex', flexDirection: 'column', gap: 12 }}>
           <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 }}>
             <div className="text-content" style={{ fontSize: 'calc(19px * var(--fs-scale-subtitle, 1))', fontWeight: 700, letterSpacing: '-0.02em' }}>{t('costs.expenses')}</div>
-            <button onClick={handleExportCsv} title={t('budget.exportCsv')} disabled={!budgetItems.length}
+            <button type="button" onClick={handleExportCsv} title={t('budget.exportCsv')} disabled={!budgetItems.length}
               className="bg-surface-card border border-edge text-content-muted disabled:opacity-40"
               style={{ display: 'inline-flex', alignItems: 'center', justifyContent: 'center', width: 34, height: 34, borderRadius: 10, cursor: 'pointer', fontFamily: 'inherit', flexShrink: 0 }}>
               <Download size={15} />
@@ -650,7 +650,7 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
           </div>
           <div className="bg-surface-secondary" style={{ display: 'flex', borderRadius: 11, padding: 3, gap: 2 }}>
             {(['all', 'mine', 'owed'] as const).map(f => (
-              <button key={f} onClick={() => setFilter(f)} className={filter === f ? 'bg-surface-card text-content' : 'text-content-muted'} style={{ flex: 1, padding: '8px 6px', fontSize: 'calc(12.5px * var(--fs-scale-body, 1))', fontWeight: 500, borderRadius: 8, border: 0, cursor: 'pointer', fontFamily: 'inherit', whiteSpace: 'nowrap' }}>{t('costs.filter.' + f)}</button>
+              <button type="button" key={f} onClick={() => setFilter(f)} className={filter === f ? 'bg-surface-card text-content' : 'text-content-muted'} style={{ flex: 1, padding: '8px 6px', fontSize: 'calc(12.5px * var(--fs-scale-body, 1))', fontWeight: 500, borderRadius: 8, border: 0, cursor: 'pointer', fontFamily: 'inherit', whiteSpace: 'nowrap' }}>{t('costs.filter.' + f)}</button>
             ))}
           </div>
           <div style={{ display: 'flex', gap: 8 }}>
@@ -705,7 +705,7 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
     }
     return (
       <div className="exp-actions bg-surface-card border border-edge" style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', gap: 3, flexShrink: 0, borderRadius: 999, padding: 5 }}>
-        <button title={t('common.edit')} onClick={onEdit} className="text-content-muted transition-colors" style={btn}><Pencil size={13} /></button>
+        <button type="button" title={t('common.edit')} onClick={onEdit} className="text-content-muted transition-colors" style={btn}><Pencil size={13} /></button>
         <button title={deleteLabel} onClick={onDelete} className="exp-action-danger transition-colors" style={{ ...btn, color: '#dc2626' }}><Trash2 size={13} /></button>
       </div>
     )
@@ -839,8 +839,8 @@ export default function CostsPanel({ tripId, tripMembers = [] }: CostsPanelProps
       </div>
       {canEdit && (
         <div className="exp-actions bg-surface-card border border-edge" style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', gap: 3, flexShrink: 0, borderRadius: 999, padding: 5 }}>
-          <button title={t('common.edit')} onClick={() => setEditingSettlement(s)} className="text-content-muted transition-colors" style={{ display: 'inline-flex', alignItems: 'center', justifyContent: 'center', width: 30, height: 30, borderRadius: 999, border: 0, cursor: 'pointer', padding: 0 }}><Pencil size={13} /></button>
-          <button title={t('costs.undo')} onClick={() => undoSettlement(s.id)} className="exp-action-danger transition-colors" style={{ display: 'inline-flex', alignItems: 'center', justifyContent: 'center', width: 30, height: 30, borderRadius: 999, border: 0, cursor: 'pointer', padding: 0, color: '#dc2626' }}><RotateCcw size={13} /></button>
+          <button type="button" title={t('common.edit')} onClick={() => setEditingSettlement(s)} className="text-content-muted transition-colors" style={{ display: 'inline-flex', alignItems: 'center', justifyContent: 'center', width: 30, height: 30, borderRadius: 999, border: 0, cursor: 'pointer', padding: 0 }}><Pencil size={13} /></button>
+          <button type="button" title={t('costs.undo')} onClick={() => undoSettlement(s.id)} className="exp-action-danger transition-colors" style={{ display: 'inline-flex', alignItems: 'center', justifyContent: 'center', width: 30, height: 30, borderRadius: 999, border: 0, cursor: 'pointer', padding: 0, color: '#dc2626' }}><RotateCcw size={13} /></button>
         </div>
       )}
       </div>
@@ -970,7 +970,7 @@ function SettlementModal({ tripId, people, me, editing, currency, onClose, onSav
   const [cur, setCur] = useState<string>((editing?.currency || currency).toUpperCase())
   const [saving, setSaving] = useState(false)
 
-  const amt = parseFloat(amount) || 0
+  const amt = Number.parseFloat(amount) || 0
   const valid = amt > 0 && fromId !== toId
   const opts = people.map(p => ({ value: String(p.id), label: p.id === me ? t('costs.you') : p.username }))
 
@@ -991,8 +991,8 @@ function SettlementModal({ tripId, people, me, editing, currency, onClose, onSav
     <Modal isOpen onClose={onClose} title={editing ? t('costs.editPayment') : t('costs.addPayment')} size="md"
       footer={
         <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 8 }}>
-          <button onClick={onClose} className="text-content-muted border border-edge" style={{ padding: '8px 16px', borderRadius: 10, background: 'none', fontSize: 'calc(13px * var(--fs-scale-body, 1))', cursor: 'pointer', fontFamily: 'inherit' }}>{t('common.cancel')}</button>
-          <button onClick={save} disabled={!valid || saving} className="bg-[var(--text-primary)] text-[var(--bg-primary)]" style={{ padding: '8px 20px', borderRadius: 10, border: 0, fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit', opacity: !valid || saving ? 0.5 : 1 }}>{editing ? t('common.save') : t('costs.addPayment')}</button>
+          <button type="button" onClick={onClose} className="text-content-muted border border-edge" style={{ padding: '8px 16px', borderRadius: 10, background: 'none', fontSize: 'calc(13px * var(--fs-scale-body, 1))', cursor: 'pointer', fontFamily: 'inherit' }}>{t('common.cancel')}</button>
+          <button type="button" onClick={save} disabled={!valid || saving} className="bg-[var(--text-primary)] text-[var(--bg-primary)]" style={{ padding: '8px 20px', borderRadius: 10, border: 0, fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit', opacity: !valid || saving ? 0.5 : 1 }}>{editing ? t('common.save') : t('costs.addPayment')}</button>
         </div>
       }>
       <div style={{ display: 'flex', flexDirection: 'column', gap: 14 }}>
@@ -1116,8 +1116,8 @@ export function ExpenseModal({ tripId, base, people, me, editing, prefill, onClo
     return calculateTicketShares(ticketItems)
   }, [ticketItems])
 
-  const totalNum = isTicketMode ? ticketInfo.total : (parseFloat(total) || 0)
-  const splitSum = [...participants].reduce((sum, id) => sum + (parseFloat(customAmounts[id]) || 0), 0)
+  const totalNum = isTicketMode ? ticketInfo.total : (Number.parseFloat(total) || 0)
+  const splitSum = [...participants].reduce((sum, id) => sum + (Number.parseFloat(customAmounts[id]) || 0), 0)
   const customBalanced = Math.round(splitSum * 100) === Math.round(totalNum * 100)
   const each = participants.size > 0 ? totalNum / participants.size : 0
   const equalShares = useMemo(() => {
@@ -1130,13 +1130,13 @@ export function ExpenseModal({ tripId, base, people, me, editing, prefill, onClo
 
     const enteredSum = [...participants]
       .filter(id => customAmounts[id])
-      .reduce((sum, id) => sum + (parseFloat(customAmounts[id]) || 0), 0)
+      .reduce((sum, id) => sum + (Number.parseFloat(customAmounts[id]) || 0), 0)
     const remaining = Math.max(0, totalNum - enteredSum)
 
     return splitEqualShares(remaining, emptyParts.map(id => ({ user_id: id })), editing?.id || 0)
   }, [totalNum, participants, customAmounts, editing])
   
-  const ticketValid = ticketItems.length > 0 && ticketItems.every(item => item.name.trim().length > 0 && (parseFloat(item.price) || 0) > 0 && item.participants.size > 0)
+  const ticketValid = ticketItems.length > 0 && ticketItems.every(item => item.name.trim().length > 0 && (Number.parseFloat(item.price) || 0) > 0 && item.participants.size > 0)
   const payersOk = !multiPayer || (payerIds.size > 0 && payersBalanced(payerAmounts, payerIds, totalNum))
   const valid = name.trim().length > 0 && payersOk && (
     isTicketMode
@@ -1263,7 +1263,7 @@ export function ExpenseModal({ tripId, base, people, me, editing, prefill, onClo
     // dropping the payer would store the entry with a total of 0.
     const payerList = multiPayer
       ? [...payerIds]
-          .map(id => ({ user_id: id, amount: parseFloat(payerAmounts[id]) || 0 }))
+          .map(id => ({ user_id: id, amount: Number.parseFloat(payerAmounts[id]) || 0 }))
           .filter(p => p.amount > 0)
       : payerId > 0 ? [{ user_id: payerId, amount: totalNum }] : []
     // A receipt line can name somebody who is not ticked as a participant. Sending
@@ -1275,7 +1275,7 @@ export function ExpenseModal({ tripId, base, people, me, editing, prefill, onClo
     const memberList = memberIds.map(id => ({
       user_id: id,
       amount: splitMode === 'custom'
-        ? (parseFloat(customAmounts[id]) || 0)
+        ? (Number.parseFloat(customAmounts[id]) || 0)
         : splitMode === 'ticket'
         ? (ticketInfo.shares[id] || 0)
         : null
@@ -1315,8 +1315,8 @@ export function ExpenseModal({ tripId, base, people, me, editing, prefill, onClo
     <Modal isOpen onClose={onClose} title={editing ? t('costs.editExpense') : t('costs.addExpense')} size={isMobile ? '2xl' : '5xl'}
       footer={
         <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 8 }}>
-          <button onClick={onClose} className="text-content-muted border border-edge" style={{ padding: '8px 16px', borderRadius: 10, background: 'none', fontSize: 'calc(13px * var(--fs-scale-body, 1))', cursor: 'pointer', fontFamily: 'inherit' }}>{t('common.cancel')}</button>
-          <button onClick={save} disabled={!valid || saving} className="bg-[var(--text-primary)] text-[var(--bg-primary)]" style={{ padding: '8px 20px', borderRadius: 10, border: 0, fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit', opacity: !valid || saving ? 0.5 : 1 }}>{editing ? t('common.save') : t('costs.addExpense')}</button>
+          <button type="button" onClick={onClose} className="text-content-muted border border-edge" style={{ padding: '8px 16px', borderRadius: 10, background: 'none', fontSize: 'calc(13px * var(--fs-scale-body, 1))', cursor: 'pointer', fontFamily: 'inherit' }}>{t('common.cancel')}</button>
+          <button type="button" onClick={save} disabled={!valid || saving} className="bg-[var(--text-primary)] text-[var(--bg-primary)]" style={{ padding: '8px 20px', borderRadius: 10, border: 0, fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit', opacity: !valid || saving ? 0.5 : 1 }}>{editing ? t('common.save') : t('costs.addExpense')}</button>
         </div>
       }>
       {/* Two columns on desktop: what the expense was on the left, how it is
@@ -1370,7 +1370,7 @@ export function ExpenseModal({ tripId, base, people, me, editing, prefill, onClo
             {COST_CATEGORY_LIST.map(c => {
               const Icon = c.Icon; const on = cat === c.key
               return (
-                <button key={c.key} onClick={() => setCat(c.key)}
+                <button type="button" key={c.key} onClick={() => setCat(c.key)}
                   className={on ? 'bg-surface-card text-content border' : 'bg-surface-secondary text-content-muted border border-edge'}
                   style={{ display: 'inline-flex', alignItems: 'center', gap: 6, padding: '6px 11px 6px 7px', borderRadius: 999, fontSize: 'calc(12.5px * var(--fs-scale-body, 1))', fontWeight: 500, cursor: 'pointer', fontFamily: 'inherit', borderColor: on ? 'var(--text-primary)' : undefined }}>
                   <span style={{ width: 20, height: 20, borderRadius: 6, display: 'grid', placeItems: 'center', background: c.color + '22', color: c.color }}><Icon size={12} /></span>

client/src/components/Collab/CollabChat.tsx

@@ -39,7 +39,7 @@ export default function CollabChat({ tripId, currentUser }: CollabChatProps) {
             <span style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', flex: 1 }}>
               <strong>{replyTo.username}</strong>: {(replyTo.text || '').slice(0, 60)}
             </span>
-            <button onClick={() => setReplyTo(null)} style={{
+            <button type="button" onClick={() => setReplyTo(null)} style={{
               background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: 'var(--text-faint)',
               display: 'flex', flexShrink: 0,
             }}>
@@ -51,7 +51,7 @@ export default function CollabChat({ tripId, currentUser }: CollabChatProps) {
         <div style={{ display: 'flex', alignItems: 'flex-end', gap: 6 }}>
           {/* Emoji button */}
           {canEdit && (
-            <button ref={emojiBtnRef} onClick={() => setShowEmoji(!showEmoji)} style={{
+            <button type="button" ref={emojiBtnRef} onClick={() => setShowEmoji(!showEmoji)} style={{
               width: 34, height: 34, borderRadius: '50%', border: 'none',
               background: showEmoji ? 'var(--bg-hover)' : 'transparent',
               color: 'var(--text-muted)', display: 'flex', alignItems: 'center', justifyContent: 'center',
@@ -80,7 +80,7 @@ export default function CollabChat({ tripId, currentUser }: CollabChatProps) {
 
           {/* Send */}
           {canEdit && (
-            <button onClick={handleSend} disabled={!text.trim() || sending} style={{
+            <button type="button" onClick={handleSend} disabled={!text.trim() || sending} style={{
               width: 34, height: 34, borderRadius: '50%', border: 'none',
               background: text.trim() ? '#007AFF' : 'var(--border-primary)',
               color: '#fff', display: 'flex', alignItems: 'center', justifyContent: 'center',

client/src/components/Collab/CollabChatEmojiPicker.tsx

@@ -46,7 +46,7 @@ export function EmojiPicker({ onSelect, onClose, anchorRef, containerRef }: Emoj
       {/* Category tabs */}
       <div style={{ display: 'flex', borderBottom: '1px solid var(--border-faint)', padding: '6px 8px', gap: 2 }}>
         {Object.keys(EMOJI_CATEGORIES).map(c => (
-          <button key={c} onClick={() => setCat(c)} style={{
+          <button type="button" key={c} onClick={() => setCat(c)} style={{
             flex: 1, padding: '4px 0', borderRadius: 6, border: 'none', cursor: 'pointer',
             background: cat === c ? 'var(--bg-hover)' : 'transparent',
             color: 'var(--text-primary)', fontSize: 'calc(10px * var(--fs-scale-caption, 1))', fontWeight: 600, fontFamily: 'inherit',
@@ -58,7 +58,7 @@ export function EmojiPicker({ onSelect, onClose, anchorRef, containerRef }: Emoj
       {/* Emoji grid */}
       <div style={{ display: 'grid', gridTemplateColumns: 'repeat(10, 1fr)', gap: 2, padding: 8 }}>
         {EMOJI_CATEGORIES[cat].map((emoji, i) => (
-          <button key={i} onClick={() => onSelect(emoji)} style={{
+          <button type="button" key={i} onClick={() => onSelect(emoji)} style={{
             width: 28, height: 28, display: 'flex', alignItems: 'center', justifyContent: 'center',
             background: 'none', border: 'none', cursor: 'pointer', borderRadius: 6,
             padding: 2, transition: 'transform 0.1s',

client/src/components/Collab/CollabChatMessages.tsx

@@ -24,7 +24,7 @@ export function ChatMessages(props: any) {
         }}>
           {hasMore && (
             <div style={{ display: 'flex', justifyContent: 'center', padding: '4px 0 10px' }}>
-              <button onClick={handleLoadMore} disabled={loadingMore} style={{
+              <button type="button" onClick={handleLoadMore} disabled={loadingMore} style={{
                 display: 'inline-flex', alignItems: 'center', gap: 4, fontSize: 'calc(11px * var(--fs-scale-caption, 1))', fontWeight: 600,
                 color: 'var(--text-muted)', background: 'var(--bg-secondary)', border: '1px solid var(--border-faint)',
                 borderRadius: 99, padding: '5px 14px', cursor: 'pointer', fontFamily: 'inherit',
@@ -181,7 +181,7 @@ export function ChatMessages(props: any) {
                         transition: 'opacity .1s',
                         ...(own ? { left: -6 } : { right: -6 }),
                       }}>
-                        <button onClick={() => setReplyTo(msg)} title={t('collab.chat.reply')} style={{
+                        <button type="button" onClick={() => setReplyTo(msg)} title={t('collab.chat.reply')} style={{
                           width: 24, height: 24, borderRadius: '50%', border: 'none',
                           background: 'var(--accent)', display: 'flex', alignItems: 'center', justifyContent: 'center',
                           cursor: 'pointer', color: 'var(--accent-text)', padding: 0,
@@ -193,7 +193,7 @@ export function ChatMessages(props: any) {
                           <Reply size={11} />
                         </button>
                         {own && canEdit && (
-                          <button onClick={() => handleDelete(msg.id)} title={t('common.delete')} style={{
+                          <button type="button" onClick={() => handleDelete(msg.id)} title={t('common.delete')} style={{
                             width: 24, height: 24, borderRadius: '50%', border: 'none',
                             background: 'var(--accent)', display: 'flex', alignItems: 'center', justifyContent: 'center',
                             cursor: 'pointer', color: 'var(--accent-text)', padding: 0,

client/src/components/Collab/CollabChatReactionBadge.tsx

@@ -18,7 +18,7 @@ export function ReactionBadge({ reaction, currentUserId, onReact }: ReactionBadg
 
   return (
     <>
-      <button ref={ref} onClick={onReact}
+      <button type="button" ref={ref} onClick={onReact}
         onMouseEnter={() => {
           if (ref.current) {
             const rect = ref.current.getBoundingClientRect()

client/src/components/Collab/CollabChatReactionMenu.tsx

@@ -31,7 +31,7 @@ export function ReactionMenu({ x, y, onReact, onClose }: ReactionMenuProps) {
       display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: 2, width: menuWidth,
     }}>
       {QUICK_REACTIONS.map(emoji => (
-        <button key={emoji} onClick={() => onReact(emoji)} style={{
+        <button type="button" key={emoji} onClick={() => onReact(emoji)} style={{
           width: 30, height: 30, display: 'flex', alignItems: 'center', justifyContent: 'center',
           background: 'none', border: 'none', cursor: 'pointer', borderRadius: '50%',
           padding: 3, transition: 'transform 0.1s, background 0.1s',

client/src/components/Collab/CollabNotes.tsx

@@ -303,13 +303,13 @@ function CollabNotesHeader({ t, canEdit, setShowSettings, setShowNewModal }: Not
         {t('collab.notes.title')}
       </h3>
       <div style={{ display: 'flex', gap: 4, alignItems: 'center' }}>
-        {canEdit && <button onClick={() => setShowSettings(true)} title={t('collab.notes.categorySettings')}
+        {canEdit && <button type="button" onClick={() => setShowSettings(true)} title={t('collab.notes.categorySettings')}
           style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', width: 28, height: 28, borderRadius: 8, border: 'none', background: 'transparent', cursor: 'pointer', color: 'var(--text-faint)', transition: 'color 0.12s' }}
           onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'}
           onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
           <Settings size={14} />
         </button>}
-        {canEdit && <button onClick={() => setShowNewModal(true)}
+        {canEdit && <button type="button" onClick={() => setShowNewModal(true)}
           style={{ display: 'inline-flex', alignItems: 'center', gap: 4, borderRadius: 99, padding: '6px 12px', background: 'var(--accent)', color: 'var(--accent-text)', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', fontWeight: 600, fontFamily: FONT, border: 'none', cursor: 'pointer', whiteSpace: 'nowrap' }}>
           <Plus size={12} />
           {t('collab.notes.new')}
@@ -322,7 +322,7 @@ function CollabNotesHeader({ t, canEdit, setShowSettings, setShowNewModal }: Not
 function CollabCategoryPills({ categories, activeCategory, setActiveCategory, t }: NotesState) {
   return (
     <div style={{ display: 'flex', gap: 4, padding: '8px 12px 0', overflowX: 'auto', flexShrink: 0 }}>
-      <button
+      <button type="button"
         onClick={() => setActiveCategory(null)}
         style={{
           flexShrink: 0, borderRadius: 99, padding: '3px 10px', fontSize: 'calc(10px * var(--fs-scale-caption, 1))', fontWeight: 600, fontFamily: FONT,
@@ -335,7 +335,7 @@ function CollabCategoryPills({ categories, activeCategory, setActiveCategory, t
         {t('collab.notes.all')}
       </button>
       {categories.map(cat => (
-        <button
+        <button type="button"
           key={cat}
           onClick={() => setActiveCategory(prev => prev === cat ? null : cat)}
           style={{
@@ -430,13 +430,13 @@ function ViewNoteModal(S: NotesState) {
             )}
           </div>
           <div style={{ display: 'flex', gap: 4, flexShrink: 0 }}>
-            {canEdit && <button onClick={() => { setViewingNote(null); setEditingNote(viewingNote) }}
+            {canEdit && <button type="button" onClick={() => { setViewingNote(null); setEditingNote(viewingNote) }}
               style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex', borderRadius: 6 }}
               onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'}
               onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               <Pencil size={16} />
             </button>}
-            <button onClick={() => setViewingNote(null)}
+            <button type="button" onClick={() => setViewingNote(null)}
               style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex', borderRadius: 6 }}
               onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'}
               onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>

client/src/components/Collab/CollabNotesCard.tsx

@@ -80,26 +80,26 @@ export function NoteCard({ note, currentUser, canEdit, onUpdate, onDelete, onEdi
             display: 'flex', gap: 2,
           }}>
             {note.content && (
-              <button onClick={() => onView?.(note)} title={t('collab.notes.expand') || 'Expand'}
+              <button type="button" onClick={() => onView?.(note)} title={t('collab.notes.expand') || 'Expand'}
                 style={{ padding: 3, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex' }}
                 onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'}
                 onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
                 <Maximize2 size={10} />
               </button>
             )}
-            {canEdit && <button onClick={handleTogglePin} title={note.pinned ? t('collab.notes.unpin') : t('collab.notes.pin')}
+            {canEdit && <button type="button" onClick={handleTogglePin} title={note.pinned ? t('collab.notes.unpin') : t('collab.notes.pin')}
               style={{ padding: 3, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = color}
               onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               {note.pinned ? <PinOff size={10} /> : <Pin size={10} />}
             </button>}
-            {canEdit && <button onClick={() => onEdit?.(note)} title={t('collab.notes.edit')}
+            {canEdit && <button type="button" onClick={() => onEdit?.(note)} title={t('collab.notes.edit')}
               style={{ padding: 3, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'}
               onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               <Pencil size={10} />
             </button>}
-            {canEdit && <button onClick={handleDelete} title={t('collab.notes.delete')}
+            {canEdit && <button type="button" onClick={handleDelete} title={t('collab.notes.delete')}
               style={{ padding: 3, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = '#ef4444'}
               onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>

client/src/components/Collab/CollabNotesCategorySettingsModal.tsx

@@ -79,7 +79,7 @@ export function CategorySettingsModal({ onClose, categories, categoryColors, onS
           <h3 style={{ fontSize: 'calc(14px * var(--fs-scale-body, 1))', fontWeight: 700, color: 'var(--text-primary)', margin: 0 }}>
             {t('collab.notes.categorySettings') || 'Category Settings'}
           </h3>
-          <button onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', padding: 2, display: 'flex' }}>
+          <button type="button" onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', padding: 2, display: 'flex' }}>
             <X size={16} />
           </button>
         </div>
@@ -96,7 +96,7 @@ export function CategorySettingsModal({ onClose, categories, categoryColors, onS
               {/* Color swatches */}
               <div style={{ display: 'flex', gap: 4 }}>
                 {NOTE_COLORS.map(c => (
-                  <button key={c.value} onClick={() => handleColorChange(cat, c.value)} style={{
+                  <button type="button" key={c.value} onClick={() => handleColorChange(cat, c.value)} style={{
                     width: 20, height: 20, borderRadius: 6, background: c.value, border: 'none', cursor: 'pointer', padding: 0,
                     outline: (localColors[cat] || NOTE_COLORS[0].value) === c.value ? '2px solid var(--text-primary)' : '2px solid transparent',
                     outlineOffset: 1, transition: 'transform 0.1s',
@@ -107,7 +107,7 @@ export function CategorySettingsModal({ onClose, categories, categoryColors, onS
               {/* Category name — editable */}
               <EditableCatName name={cat} onRename={(newName) => handleRenameCategory(cat, newName)} />
               {/* Delete */}
-              <button onClick={() => handleRemoveCategory(cat)} style={{
+              <button type="button" onClick={() => handleRemoveCategory(cat)} style={{
                 background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', padding: 3, display: 'flex',
               }}
                 onMouseEnter={e => e.currentTarget.style.color = '#ef4444'}
@@ -126,7 +126,7 @@ export function CategorySettingsModal({ onClose, categories, categoryColors, onS
                 flex: 1, border: '1px solid var(--border-primary)', borderRadius: 10, padding: '8px 12px',
                 fontSize: 'calc(13px * var(--fs-scale-body, 1))', background: 'var(--bg-input)', color: 'var(--text-primary)', fontFamily: 'inherit', outline: 'none',
               }} />
-            <button onClick={handleAddCategory} disabled={!newCatName.trim()} style={{
+            <button type="button" onClick={handleAddCategory} disabled={!newCatName.trim()} style={{
               background: newCatName.trim() ? 'var(--accent)' : 'var(--border-primary)', color: 'var(--accent-text)',
               border: 'none', borderRadius: 10, padding: '8px 14px', cursor: newCatName.trim() ? 'pointer' : 'default',
               display: 'flex', alignItems: 'center', flexShrink: 0,
@@ -136,7 +136,7 @@ export function CategorySettingsModal({ onClose, categories, categoryColors, onS
           </div>
 
           {/* Save */}
-          <button onClick={handleSave} style={{
+          <button type="button" onClick={handleSave} style={{
             width: '100%', borderRadius: 99, padding: '9px 14px', background: 'var(--accent)', color: 'var(--accent-text)',
             fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, border: 'none', cursor: 'pointer', marginTop: 8,
           }}>

client/src/components/Collab/CollabNotesFilePreviewPortal.tsx

@@ -39,8 +39,8 @@ export function FilePreviewPortal({ file, onClose }: FilePreviewPortalProps) {
           <div style={{ position: 'absolute', top: -36, left: 0, right: 0, display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '0 4px' }}>
             <span style={{ fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'rgba(255,255,255,0.7)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', maxWidth: '70%' }}>{file.original_name}</span>
             <div style={{ display: 'flex', gap: 8 }}>
-              <button onClick={openInNewTab} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.7)', display: 'flex', padding: 0 }}><ExternalLink size={15} /></button>
-              <button onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.7)', display: 'flex', padding: 0 }}><X size={17} /></button>
+              <button type="button" onClick={openInNewTab} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.7)', display: 'flex', padding: 0 }}><ExternalLink size={15} /></button>
+              <button type="button" onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.7)', display: 'flex', padding: 0 }}><X size={17} /></button>
             </div>
           </div>
         </div>
@@ -50,19 +50,19 @@ export function FilePreviewPortal({ file, onClose }: FilePreviewPortalProps) {
           <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '10px 16px', borderBottom: '1px solid var(--border-primary)', flexShrink: 0 }}>
             <span style={{ fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, color: 'var(--text-primary)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', flex: 1 }}>{file.original_name}</span>
             <div style={{ display: 'flex', gap: 8, flexShrink: 0 }}>
-              <button onClick={openInNewTab} style={{ background: 'none', border: 'none', cursor: 'pointer', display: 'flex', alignItems: 'center', gap: 3, fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-muted)', padding: 0 }}><ExternalLink size={13} /></button>
-              <button onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex', padding: 2 }}><X size={18} /></button>
+              <button type="button" onClick={openInNewTab} style={{ background: 'none', border: 'none', cursor: 'pointer', display: 'flex', alignItems: 'center', gap: 3, fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-muted)', padding: 0 }}><ExternalLink size={13} /></button>
+              <button type="button" onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex', padding: 2 }}><X size={18} /></button>
             </div>
           </div>
           {(isPdf || isTxt) ? (
             <object data={authUrl ? `${authUrl}#view=FitH` : ''} type={file.mime_type} style={{ flex: 1, width: '100%', border: 'none', background: '#fff' }} title={file.original_name}>
               <p style={{ padding: 24, textAlign: 'center', color: 'var(--text-muted)' }}>
-                <button onClick={openInNewTab} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-primary)', textDecoration: 'underline', fontSize: 'calc(14px * var(--fs-scale-body, 1))', padding: 0 }}>Download</button>
+                <button type="button" onClick={openInNewTab} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-primary)', textDecoration: 'underline', fontSize: 'calc(14px * var(--fs-scale-body, 1))', padding: 0 }}>Download</button>
               </p>
             </object>
           ) : (
             <div style={{ flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 40 }}>
-              <button onClick={openInNewTab} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-primary)', textDecoration: 'underline', fontSize: 'calc(14px * var(--fs-scale-body, 1))', padding: 0 }}>Download {file.original_name}</button>
+              <button type="button" onClick={openInNewTab} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-primary)', textDecoration: 'underline', fontSize: 'calc(14px * var(--fs-scale-body, 1))', padding: 0 }}>Download {file.original_name}</button>
             </div>
           )}
         </div>

client/src/components/Collab/CollabPanel.tsx

@@ -170,7 +170,7 @@ export default function CollabPanel({ tripId, tripMembers = [], collabFeatures }
         {tabs.map(tab => {
           const active = mobileTab === tab.id
           return (
-            <button key={tab.id} onClick={() => setMobileTab(tab.id)} style={{
+            <button type="button" key={tab.id} onClick={() => setMobileTab(tab.id)} style={{
               flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6,
               padding: '8px 0', borderRadius: 10, border: 'none', cursor: 'pointer',
               background: active ? 'var(--accent)' : 'transparent',

client/src/components/Collab/CollabPolls.tsx

@@ -250,14 +250,14 @@ function PollCard({ poll, currentUser, canEdit, onVote, onClose, onDelete, t }:
         {canEdit && (
           <div style={{ display: 'flex', gap: 2, flexShrink: 0 }}>
             {!isClosed && (
-              <button onClick={() => onClose(poll.id)} title={t('collab.polls.close')}
+              <button type="button" onClick={() => onClose(poll.id)} title={t('collab.polls.close')}
                 style={{ padding: 4, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex', borderRadius: 6 }}
                 onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'}
                 onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
                 <Lock size={12} />
               </button>
             )}
-            <button onClick={() => onDelete(poll.id)} title={t('collab.polls.delete')}
+            <button type="button" onClick={() => onDelete(poll.id)} title={t('collab.polls.delete')}
               style={{ padding: 4, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex', borderRadius: 6 }}
               onMouseEnter={e => e.currentTarget.style.color = '#ef4444'}
               onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
@@ -278,7 +278,7 @@ function PollCard({ poll, currentUser, canEdit, onVote, onClose, onDelete, t }:
           return (
             // React dispatches no mouse events on a disabled control, so the
             // handlers below need no isClosed guard of their own.
-            <button key={idx} onClick={() => onVote(poll.id, idx)}
+            <button type="button" key={idx} onClick={() => onVote(poll.id, idx)}
               disabled={isClosed}
               style={{
                 position: 'relative', display: 'flex', alignItems: 'center', gap: 8,
@@ -465,7 +465,7 @@ export default function CollabPolls({ tripId, currentUser }: CollabPollsProps) {
           {t('collab.polls.title')}
         </h3>
         {canEdit && (
-          <button onClick={() => setShowForm(true)} style={{
+          <button type="button" onClick={() => setShowForm(true)} style={{
             display: 'inline-flex', alignItems: 'center', gap: 4, borderRadius: 99, padding: '6px 12px',
             background: 'var(--accent)', color: 'var(--accent-text)', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', fontWeight: 600,
             fontFamily: FONT, border: 'none', cursor: 'pointer',

client/src/components/Collections/AddPlaceToCollectionModal.tsx

@@ -97,8 +97,8 @@ export default function AddPlaceToCollectionModal({ isOpen, collectionId, collec
     const cleanName = name.trim()
     if (!cleanName) return
     const cleanLinks = links.map(l => ({ label: l.label?.trim() || undefined, url: normalizeLinkUrl(l.url) })).filter(l => l.url)
-    const latNum = lat.trim() ? Number(lat) : NaN
-    const lngNum = lng.trim() ? Number(lng) : NaN
+    const latNum = lat.trim() ? Number(lat) : Number.NaN
+    const lngNum = lng.trim() ? Number(lng) : Number.NaN
     setSaving(true)
     try {
       const res = await collectionsApi.savePlace({

client/src/components/Collections/CollectionPlaceDetail.tsx

@@ -159,8 +159,8 @@ export default function CollectionPlaceDetail({
 
   const save = async () => {
     const cleanLinks = links.map(l => ({ label: l.label?.trim() || undefined, url: normalizeLinkUrl(l.url) })).filter(l => l.url)
-    const latNum = lat.trim() ? Number(lat) : NaN
-    const lngNum = lng.trim() ? Number(lng) : NaN
+    const latNum = lat.trim() ? Number(lat) : Number.NaN
+    const lngNum = lng.trim() ? Number(lng) : Number.NaN
     setSaving(true)
     try {
       await onSave({ name: name.trim() || place.name, description: description.trim() || null, links: cleanLinks, category_id: categoryId, label_ids: labelIds, address: address.trim() || null, lat: Number.isFinite(latNum) ? latNum : null, lng: Number.isFinite(lngNum) ? lngNum : null })

client/src/components/Collections/StatusBadge.tsx

@@ -51,7 +51,7 @@ export default function StatusBadge({ status, onChange, showLabel = true, size =
     return <span className={className} title={label}>{content}</span>
   }
 
-  // Rendered as a role=button span (not a native <button>) on purpose: inside
+  // Rendered as a role=button span (not a native <button type="button">) on purpose: inside
   // the .trek-dash scope the global `.trek-dash button` reset would strip the
   // pill's background/border/padding, and the pill also has to sit inside the
   // grid card's own clickable element without nesting one button in another.

client/src/components/Dashboard/CollectionsWidget.tsx

@@ -38,7 +38,7 @@ export default function CollectionsWidget({ onOpen }: { onOpen: () => void }): R
     <div className="tool">
       <div className="tool-head">
         <div className="tool-title"><Bookmark size={14} /> {t('collections.widget.title')}</div>
-        <button className="tool-action" aria-label={t('collections.widget.title')} onClick={onOpen}>
+        <button type="button" className="tool-action" aria-label={t('collections.widget.title')} onClick={onOpen}>
           <ArrowRight size={14} />
         </button>
       </div>
@@ -47,7 +47,7 @@ export default function CollectionsWidget({ onOpen }: { onOpen: () => void }): R
       ) : (
         <div className="col-badges">
           {lists.slice(0, 6).map(list => (
-            <button
+            <button type="button"
               key={list.id}
               className="col-badge"
               style={{ ['--badge-color' as string]: list.color || '#6366f1' }}

client/src/components/Files/FileManagerAssignModal.tsx

@@ -22,7 +22,7 @@ export function AssignModal(S: FileManagerState) {
               {files.find(f => f.id === assignFileId)?.original_name || ''}
             </div>
           </div>
-          <button onClick={() => setAssignFileId(null)} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', padding: 4, display: 'flex', flexShrink: 0 }}>
+          <button type="button" onClick={() => setAssignFileId(null)} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', padding: 4, display: 'flex', flexShrink: 0 }}>
             <X size={18} />
           </button>
         </div>
@@ -67,7 +67,7 @@ export function AssignModal(S: FileManagerState) {
             const placeBtn = (p: Place, idx: number) => {
               const isLinked = file.place_id === p.id || (file.linked_place_ids || []).includes(p.id)
               return (
-                <button key={`${p.id}-${idx}`} onClick={async () => {
+                <button type="button" key={`${p.id}-${idx}`} onClick={async () => {
                   if (isLinked) {
                     if (file.place_id === p.id) {
                       await handleAssign(file.id, { place_id: null })
@@ -142,7 +142,7 @@ export function AssignModal(S: FileManagerState) {
               const isLinked = file.reservation_id === r.id || (file.linked_reservation_ids || []).includes(r.id)
               const Icon = TRANSPORT_TYPES.has(r.type) ? transportIcon(r.type) : Ticket
               return (
-                <button key={r.id} onClick={async () => {
+                <button type="button" key={r.id} onClick={async () => {
                   if (isLinked) {
                     if (file.reservation_id === r.id) {
                       await handleAssign(file.id, { reservation_id: null })

client/src/components/Files/FileManagerFilesView.tsx

@@ -51,7 +51,7 @@ export function FilesView(S: FileManagerState) {
           { id: 'doc', label: t('files.filterDocs') },
           ...(files.some(f => f.note_id) ? [{ id: 'collab', label: t('files.filterCollab') || 'Collab' }] : []),
         ].map(tab => (
-          <button key={tab.id} onClick={() => setFilterType(tab.id)} style={{
+          <button type="button" key={tab.id} onClick={() => setFilterType(tab.id)} style={{
             padding: '4px 12px', borderRadius: 99, border: 'none', cursor: 'pointer', fontSize: 'calc(12px * var(--fs-scale-body, 1))',
             fontFamily: 'inherit', transition: 'all 0.12s',
             background: filterType === tab.id ? 'var(--accent)' : 'transparent',

client/src/components/Files/FileManagerImageLightbox.tsx

@@ -53,7 +53,7 @@ export function ImageLightbox({ files, initialIndex, onClose }: ImageLightboxPro
   const hasPrev = index > 0
   const hasNext = index < files.length - 1
   const navBtn = (side: 'left' | 'right', onClick: () => void, show: boolean): React.ReactNode => show ? (
-    <button onClick={e => { e.stopPropagation(); onClick() }}
+    <button type="button" onClick={e => { e.stopPropagation(); onClick() }}
       style={{
         position: 'absolute', top: '50%', [side]: 12, transform: 'translateY(-50%)', zIndex: 10,
         background: 'rgba(0,0,0,0.5)', border: 'none', borderRadius: '50%', width: 40, height: 40,
@@ -86,19 +86,19 @@ export function ImageLightbox({ files, initialIndex, onClose }: ImageLightboxPro
           <span style={{ marginLeft: 8, color: 'rgba(255,255,255,0.4)' }}>{index + 1} / {files.length}</span>
         </span>
         <div style={{ display: 'flex', gap: 8, flexShrink: 0 }}>
-          <button
+          <button type="button"
             onClick={() => openFileUrl(file.url, file.original_name).catch(() => {})}
             style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.7)', display: 'flex', padding: 4 }}
             title={t('files.openTab')}>
             <ExternalLink size={16} />
           </button>
-          <button
+          <button type="button"
             onClick={() => triggerDownload(file.url, file.original_name)}
             style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.7)', display: 'flex', padding: 4 }}
             title={t('files.download') || 'Download'}>
             <Download size={16} />
           </button>
-          <button onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.7)', display: 'flex', padding: 4 }}>
+          <button type="button" onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'rgba(255,255,255,0.7)', display: 'flex', padding: 4 }}>
             <X size={18} />
           </button>
         </div>
@@ -156,7 +156,7 @@ function ThumbImg({ file, active, onClick }: { file: TripFile & { url: string };
   }, [file.url, fileIsVideo, visible])
 
   return (
-    <button ref={ref} onClick={onClick} style={{
+    <button type="button" ref={ref} onClick={onClick} style={{
       width: 48, height: 48, borderRadius: 6, overflow: 'hidden', border: active ? '2px solid #fff' : '2px solid transparent',
       opacity: active ? 1 : 0.5, cursor: 'pointer', padding: 0, background: '#111', flexShrink: 0, transition: 'opacity 0.15s',
       display: 'flex', alignItems: 'center', justifyContent: 'center', color: 'rgba(255,255,255,0.7)',

client/src/components/Files/FileManagerMarkdownPreviewModal.tsx

@@ -44,17 +44,17 @@ export function MarkdownPreviewModal(S: FileManagerState) {
         <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '10px 16px', borderBottom: '1px solid var(--border-primary)', flexShrink: 0 }}>
           <span style={{ fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, color: 'var(--text-primary)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', flex: 1 }}>{previewFile.original_name}</span>
           <div style={{ display: 'flex', alignItems: 'center', gap: 8, flexShrink: 0 }}>
-            <button
+            <button type="button"
               onClick={() => openFileUrl(previewFile.url, previewFile.original_name).catch(() => toast.error(t('files.openError')))}
               style={{ display: 'flex', alignItems: 'center', gap: 4, fontSize: 'calc(12px * var(--fs-scale-body, 1))', color: 'var(--text-muted)', background: 'none', border: 'none', cursor: 'pointer', padding: '4px 8px', borderRadius: 6 }}>
               <ExternalLink size={13} /> {t('files.openTab')}
             </button>
-            <button
+            <button type="button"
               onClick={() => triggerDownload(previewFile.url, previewFile.original_name)}
               style={{ display: 'flex', alignItems: 'center', gap: 4, fontSize: 'calc(12px * var(--fs-scale-body, 1))', color: 'var(--text-muted)', background: 'none', border: 'none', cursor: 'pointer', padding: '4px 8px', borderRadius: 6 }}>
               <Download size={13} /> {t('files.download') || 'Download'}
             </button>
-            <button onClick={() => setPreviewFile(null)}
+            <button type="button" onClick={() => setPreviewFile(null)}
               style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex', padding: 4, borderRadius: 6 }}>
               <X size={18} />
             </button>

client/src/components/Files/FileManagerPdfPreviewModal.tsx

@@ -18,21 +18,21 @@ export function PdfPreviewModal(S: FileManagerState) {
         <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '10px 16px', borderBottom: '1px solid var(--border-primary)', flexShrink: 0 }}>
           <span style={{ fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, color: 'var(--text-primary)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', flex: 1 }}>{previewFile.original_name}</span>
           <div style={{ display: 'flex', alignItems: 'center', gap: 8, flexShrink: 0 }}>
-            <button
+            <button type="button"
               onClick={() => openFileUrl(previewFile.url, previewFile.original_name).catch(() => toast.error(t('files.openError')))}
               style={{ display: 'flex', alignItems: 'center', gap: 4, fontSize: 'calc(12px * var(--fs-scale-body, 1))', color: 'var(--text-muted)', background: 'none', border: 'none', cursor: 'pointer', textDecoration: 'none', padding: '4px 8px', borderRadius: 6, transition: 'color 0.15s' }}
               onMouseEnter={e => (e.currentTarget as HTMLElement).style.color = 'var(--text-primary)'}
               onMouseLeave={e => (e.currentTarget as HTMLElement).style.color = 'var(--text-muted)'}>
               <ExternalLink size={13} /> {t('files.openTab')}
             </button>
-            <button
+            <button type="button"
               onClick={() => triggerDownload(previewFile.url, previewFile.original_name)}
               style={{ display: 'flex', alignItems: 'center', gap: 4, fontSize: 'calc(12px * var(--fs-scale-body, 1))', color: 'var(--text-muted)', background: 'none', border: 'none', cursor: 'pointer', textDecoration: 'none', padding: '4px 8px', borderRadius: 6, transition: 'color 0.15s' }}
               onMouseEnter={e => (e.currentTarget as HTMLElement).style.color = 'var(--text-primary)'}
               onMouseLeave={e => (e.currentTarget as HTMLElement).style.color = 'var(--text-muted)'}>
               <Download size={13} /> {t('files.download') || 'Download'}
             </button>
-            <button onClick={() => setPreviewFile(null)}
+            <button type="button" onClick={() => setPreviewFile(null)}
               style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex', padding: 4, borderRadius: 6, transition: 'color 0.15s' }}
               onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'}
               onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
@@ -47,7 +47,7 @@ export function PdfPreviewModal(S: FileManagerState) {
           title={previewFile.original_name}
         >
           <p style={{ padding: 24, textAlign: 'center', color: 'var(--text-muted)' }}>
-            <button onClick={() => openFileUrl(previewFile.url, previewFile.original_name).catch(() => toast.error(t('files.openError')))} style={{ color: 'var(--text-primary)', textDecoration: 'underline', background: 'none', border: 'none', cursor: 'pointer', font: 'inherit' }}>{t('files.downloadPdf')}</button>
+            <button type="button" onClick={() => openFileUrl(previewFile.url, previewFile.original_name).catch(() => toast.error(t('files.openError')))} style={{ color: 'var(--text-primary)', textDecoration: 'underline', background: 'none', border: 'none', cursor: 'pointer', font: 'inherit' }}>{t('files.downloadPdf')}</button>
           </p>
         </object>
       </div>

client/src/components/Files/FileManagerRow.tsx

@@ -97,34 +97,34 @@ export function FileRow(p: FileManagerState & { file: TripFile; isTrash?: boolea
       <div className="file-actions" style={{ display: 'flex', gap: 2, flexShrink: 0 }}>
         {isTrash ? (
           <>
-            {can('file_delete', trip) && <button onClick={() => handleRestore(file.id)} title={t('files.restore') || 'Restore'} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
+            {can('file_delete', trip) && <button type="button" onClick={() => handleRestore(file.id)} title={t('files.restore') || 'Restore'} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = '#22c55e'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               <RotateCcw size={14} />
             </button>}
-            {can('file_delete', trip) && <button onClick={() => handlePermanentDelete(file.id)} title={t('common.delete')} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
+            {can('file_delete', trip) && <button type="button" onClick={() => handlePermanentDelete(file.id)} title={t('common.delete')} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = '#ef4444'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               <Trash2 size={14} />
             </button>}
           </>
         ) : (
           <>
-            <button onClick={() => handleStar(file.id)} title={file.starred ? t('files.unstar') || 'Unstar' : t('files.star') || 'Star'} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: file.starred ? '#facc15' : 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
+            <button type="button" onClick={() => handleStar(file.id)} title={file.starred ? t('files.unstar') || 'Unstar' : t('files.star') || 'Star'} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: file.starred ? '#facc15' : 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
               onMouseEnter={e => { if (!file.starred) e.currentTarget.style.color = '#facc15' }} onMouseLeave={e => { if (!file.starred) e.currentTarget.style.color = 'var(--text-faint)' }}>
               <Star size={14} fill={file.starred ? '#facc15' : 'none'} />
             </button>
-            {can('file_edit', trip) && <button onClick={() => setAssignFileId(file.id)} title={t('files.assign') || 'Assign'} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
+            {can('file_edit', trip) && <button type="button" onClick={() => setAssignFileId(file.id)} title={t('files.assign') || 'Assign'} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               <Pencil size={14} />
             </button>}
-            <button onClick={() => openFile(file)} title={t('common.open')} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
+            <button type="button" onClick={() => openFile(file)} title={t('common.open')} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               <ExternalLink size={14} />
             </button>
-            <button onClick={() => triggerDownload(file.url, file.original_name)} title={t('files.download') || 'Download'} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
+            <button type="button" onClick={() => triggerDownload(file.url, file.original_name)} title={t('files.download') || 'Download'} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = 'var(--text-primary)'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               <Download size={14} />
             </button>
-            {can('file_delete', trip) && <button onClick={() => handleDelete(file.id)} title={t('common.delete')} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
+            {can('file_delete', trip) && <button type="button" onClick={() => handleDelete(file.id)} title={t('common.delete')} style={{ padding: 6, background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', borderRadius: 6, display: 'flex' }}
               onMouseEnter={e => e.currentTarget.style.color = '#ef4444'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
               <Trash2 size={14} />
             </button>}

client/src/components/Files/FileManagerToolbar.tsx

@@ -36,7 +36,7 @@ export function FileManagerToolbar(S: FileManagerState) {
                   : tab.id === 'collab' ? files.filter(f => f.note_id).length
                   : 0
                 return (
-                  <button key={tab.id} onClick={() => setFilterType(tab.id)}
+                  <button type="button" key={tab.id} onClick={() => setFilterType(tab.id)}
                     style={{
                       appearance: 'none', border: 'none', cursor: 'pointer', fontFamily: 'inherit',
                       display: 'inline-flex', alignItems: 'center', gap: 6,
@@ -63,7 +63,7 @@ export function FileManagerToolbar(S: FileManagerState) {
           </>
         )}
 
-        <button onClick={toggleTrash} style={{
+        <button type="button" onClick={toggleTrash} style={{
           appearance: 'none', border: 'none', cursor: 'pointer', fontFamily: 'inherit',
           display: 'inline-flex', alignItems: 'center', gap: 6,
           padding: '9px 14px', borderRadius: 10, fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 500,

client/src/components/Files/FileManagerTrashView.tsx

@@ -8,7 +8,7 @@ export function TrashView(S: FileManagerState) {
     <div style={{ flex: 1, overflowY: 'auto', padding: '12px 16px 16px' }}>
       {trashFiles.length > 0 && can('file_delete', trip) && (
         <div style={{ display: 'flex', justifyContent: 'flex-end', marginBottom: 12 }}>
-          <button onClick={handleEmptyTrash} style={{
+          <button type="button" onClick={handleEmptyTrash} style={{
             padding: '5px 12px', borderRadius: 8, border: '1px solid #fecaca',
             background: '#fef2f2', color: '#dc2626', fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 500,
             cursor: 'pointer', fontFamily: 'inherit',

client/src/components/Journey/ContributorInviteDialog.tsx

@@ -49,7 +49,7 @@ export default function ContributorInviteDialog({ journeyId, existingUserIds, on
 
         <div className="flex items-center justify-between px-6 py-4 border-b border-zinc-200 dark:border-zinc-700">
           <h2 className="text-[16px] font-bold text-zinc-900 dark:text-white">{t('journey.contributors.invite')}</h2>
-          <button onClick={onClose} className="w-8 h-8 rounded-lg flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
+          <button type="button" onClick={onClose} className="w-8 h-8 rounded-lg flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
             <X size={16} />
           </button>
         </div>
@@ -102,7 +102,7 @@ export default function ContributorInviteDialog({ journeyId, existingUserIds, on
             <label className="text-[10px] font-semibold tracking-[0.12em] uppercase text-zinc-500 block mb-2">{t('journey.invite.role')}</label>
             <div className="flex gap-2">
               {(['viewer', 'editor'] as const).map(r => (
-                <button
+                <button type="button"
                   key={r}
                   onClick={() => setRole(r)}
                   className={`flex-1 py-2 rounded-lg text-[12px] font-medium border transition-all ${
@@ -119,10 +119,10 @@ export default function ContributorInviteDialog({ journeyId, existingUserIds, on
         </div>
 
         <div className="flex items-center justify-end gap-2 px-6 py-4 border-t border-zinc-200 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-800/50">
-          <button onClick={onClose} className="px-3.5 py-2 rounded-lg border border-zinc-200 dark:border-zinc-600 text-[13px] font-medium text-zinc-700 dark:text-zinc-300 hover:bg-zinc-100 dark:hover:bg-zinc-700">
+          <button type="button" onClick={onClose} className="px-3.5 py-2 rounded-lg border border-zinc-200 dark:border-zinc-600 text-[13px] font-medium text-zinc-700 dark:text-zinc-300 hover:bg-zinc-100 dark:hover:bg-zinc-700">
             {t('common.cancel')}
           </button>
-          <button
+          <button type="button"
             onClick={handleInvite}
             disabled={!selectedUserId || sending}
             className="px-3.5 py-2 rounded-lg bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 text-[13px] font-medium hover:bg-zinc-800 dark:hover:bg-zinc-100 disabled:opacity-40 disabled:cursor-not-allowed"

client/src/components/Journey/JourneyDetailPageAddTripDialog.tsx

@@ -47,7 +47,7 @@ export function AddTripDialog({ journeyId, existingTripIds, onClose, onAdded }:
 
         <div className="flex items-center justify-between px-6 py-4 border-b border-zinc-200 dark:border-zinc-700">
           <h2 className="text-[16px] font-bold text-zinc-900 dark:text-white">{t('journey.trips.linkTrip')}</h2>
-          <button onClick={onClose} className="w-8 h-8 rounded-lg flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
+          <button type="button" onClick={onClose} className="w-8 h-8 rounded-lg flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
             <X size={16} />
           </button>
         </div>
@@ -81,7 +81,7 @@ export function AddTripDialog({ journeyId, existingTripIds, onClose, onAdded }:
                     </div>
                   )}
                 </div>
-                <button
+                <button type="button"
                   onClick={() => handleAdd(trip.id)}
                   disabled={adding === trip.id}
                   className="px-3 py-1.5 rounded-lg text-[11px] font-semibold bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 hover:bg-zinc-700 dark:hover:bg-zinc-200 disabled:opacity-50"

client/src/components/Journey/JourneyDetailPageEntryCard.tsx

@@ -73,15 +73,15 @@ export function EntryCard({ entry, readOnly, onEdit, onDelete, onPhotoClick }: {
           {/* Menu top-right */}
           {!readOnly && (
             <div className="absolute top-2.5 right-3 z-[2]">
-              <button ref={menuBtnRef} onClick={() => setMenuOpen(!menuOpen)} className="w-8 h-8 rounded-[10px] bg-black/40 backdrop-blur-sm flex items-center justify-center text-white hover:bg-black/50">
+              <button type="button" ref={menuBtnRef} onClick={() => setMenuOpen(!menuOpen)} className="w-8 h-8 rounded-[10px] bg-black/40 backdrop-blur-sm flex items-center justify-center text-white hover:bg-black/50">
                 <MoreHorizontal size={14} />
               </button>
               {menuOpen && createPortal(
                 <>
                   <div className="fixed inset-0 z-[99]" onClick={() => setMenuOpen(false)} />
                   <div className="fixed z-[100] bg-white dark:bg-zinc-800 border border-zinc-200 dark:border-zinc-700 rounded-lg shadow-lg py-1 min-w-[120px]" style={{ top: (menuBtnRef.current?.getBoundingClientRect().bottom || 0) + 4, right: window.innerWidth - (menuBtnRef.current?.getBoundingClientRect().right || 0) }}>
-                    <button onClick={() => { setMenuOpen(false); onEdit() }} className="w-full text-left px-3 py-1.5 text-[12px] text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700 flex items-center gap-2"><Pencil size={12} /> {t('common.edit')}</button>
-                    <button onClick={() => { setMenuOpen(false); onDelete() }} className="w-full text-left px-3 py-1.5 text-[12px] text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20 flex items-center gap-2"><Trash2 size={12} /> {t('common.delete')}</button>
+                    <button type="button" onClick={() => { setMenuOpen(false); onEdit() }} className="w-full text-left px-3 py-1.5 text-[12px] text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700 flex items-center gap-2"><Pencil size={12} /> {t('common.edit')}</button>
+                    <button type="button" onClick={() => { setMenuOpen(false); onDelete() }} className="w-full text-left px-3 py-1.5 text-[12px] text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20 flex items-center gap-2"><Trash2 size={12} /> {t('common.delete')}</button>
                   </div>
                 </>,
                 document.body,
@@ -113,15 +113,15 @@ export function EntryCard({ entry, readOnly, onEdit, onDelete, onPhotoClick }: {
           </div>
           {!readOnly && (
             <div className="relative">
-              <button ref={menuBtnRef} onClick={() => setMenuOpen(!menuOpen)} className="w-7 h-7 rounded-md flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
+              <button type="button" ref={menuBtnRef} onClick={() => setMenuOpen(!menuOpen)} className="w-7 h-7 rounded-md flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
                 <MoreHorizontal size={14} />
               </button>
               {menuOpen && createPortal(
                 <>
                   <div className="fixed inset-0 z-[99]" onClick={() => setMenuOpen(false)} />
                   <div className="fixed z-[100] bg-white dark:bg-zinc-800 border border-zinc-200 dark:border-zinc-700 rounded-lg shadow-lg py-1 min-w-[120px]" style={{ top: (menuBtnRef.current?.getBoundingClientRect().bottom || 0) + 4, right: window.innerWidth - (menuBtnRef.current?.getBoundingClientRect().right || 0) }}>
-                    <button onClick={() => { setMenuOpen(false); onEdit() }} className="w-full text-left px-3 py-1.5 text-[12px] text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700 flex items-center gap-2"><Pencil size={12} /> {t('common.edit')}</button>
-                    <button onClick={() => { setMenuOpen(false); onDelete() }} className="w-full text-left px-3 py-1.5 text-[12px] text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20 flex items-center gap-2"><Trash2 size={12} /> {t('common.delete')}</button>
+                    <button type="button" onClick={() => { setMenuOpen(false); onEdit() }} className="w-full text-left px-3 py-1.5 text-[12px] text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-700 flex items-center gap-2"><Pencil size={12} /> {t('common.edit')}</button>
+                    <button type="button" onClick={() => { setMenuOpen(false); onDelete() }} className="w-full text-left px-3 py-1.5 text-[12px] text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20 flex items-center gap-2"><Trash2 size={12} /> {t('common.delete')}</button>
                   </div>
                 </>,
                 document.body,

client/src/components/Journey/JourneyDetailPageEntryEditor.tsx

@@ -209,7 +209,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
     setPendingFiles(prev => [...prev, ...normalized])
   }
 
-  const contextLocation = isValidGeoPoint({ lat: locationLat ?? NaN, lng: locationLng ?? NaN })
+  const contextLocation = isValidGeoPoint({ lat: locationLat ?? Number.NaN, lng: locationLng ?? Number.NaN })
     ? { lat: locationLat!, lng: locationLng!, name: locationName || undefined }
     : null
 
@@ -256,7 +256,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
 
         <div className="flex items-center justify-between px-6 py-4 border-b border-zinc-200 dark:border-zinc-700">
           <h2 className="text-[16px] font-bold text-zinc-900 dark:text-white">{entry.id === 0 ? t('journey.detail.newEntry') : t('journey.detail.editEntry')}</h2>
-          <button onClick={handleClose} className="w-8 h-8 rounded-full flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
+          <button type="button" onClick={handleClose} className="w-8 h-8 rounded-full flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
             <X size={16} />
           </button>
         </div>
@@ -275,7 +275,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
             <input ref={fileRef} type="file" accept="image/*" multiple onChange={handleFileChange} onClick={e => { (e.target as HTMLInputElement).value = '' }} className="hidden" />
             <input ref={cameraRef} type="file" accept="image/*" capture="environment" onChange={handleFileChange} onClick={e => { (e.target as HTMLInputElement).value = '' }} className="hidden" />
             <div className="flex gap-2">
-              <button
+              <button type="button"
                 onClick={() => { setPhotoTab('upload'); setShowGalleryPick(false); fileRef.current?.click() }}
                 disabled={saving}
                 className="flex-1 border border-dashed border-zinc-200 dark:border-zinc-700 rounded-xl py-4 text-[12px] text-zinc-500 hover:border-zinc-400 dark:hover:border-zinc-500 hover:bg-zinc-50 dark:hover:bg-zinc-800 flex items-center justify-center gap-1.5 disabled:opacity-50"
@@ -287,7 +287,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                 )}
               </button>
               {galleryPhotos.length > 0 && (
-                <button
+                <button type="button"
                   onClick={() => { setPhotoTab('gallery'); setShowGalleryPick(!showGalleryPick) }}
                   className={`flex-1 border rounded-xl py-4 text-[12px] text-zinc-500 flex items-center justify-center gap-1.5 ${
                     showGalleryPick
@@ -298,7 +298,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                   <Image size={13} /> {t('journey.editor.fromGallery')}
                 </button>
               )}
-              <button
+              <button type="button"
                 onClick={() => { setPhotoTab('upload'); setShowGalleryPick(false); cameraRef.current?.click() }}
                 disabled={saving}
                 aria-label={t('journey.photo.add')}
@@ -307,7 +307,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
               >
                 <Camera size={14} />
               </button>
-              <button
+              <button type="button"
                 onClick={() => { setPhotoTab('external'); setShowGalleryPick(false) }}
                 disabled={saving}
                 className={`flex-1 border rounded-lg py-4 text-[12px] text-zinc-500 flex items-center justify-center gap-1.5 ${
@@ -367,7 +367,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                     </p>
                   </div>
                   {pendingProviderGroups.length > 0 && (
-                    <button onClick={() => setPendingProviderGroups([])} className="text-[10px] text-zinc-500 hover:text-zinc-900 dark:hover:text-white whitespace-nowrap">
+                    <button type="button" onClick={() => setPendingProviderGroups([])} className="text-[10px] text-zinc-500 hover:text-zinc-900 dark:hover:text-white whitespace-nowrap">
                       {pendingProviderGroups.reduce((sum, group) => sum + group.assetIds.length, 0)} {t('journey.editor.externalPhotosQueued') || 'queued'} · {t('common.clear') || 'Clear'}
                     </button>
                   )}
@@ -380,7 +380,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                   <div className="h-full min-h-0 flex flex-col">
                     <div className="flex gap-1 px-3 py-2 border-b border-zinc-200 dark:border-zinc-700 overflow-x-auto">
                       {availableProviders.map(provider => (
-                        <button
+                        <button type="button"
                           key={provider.id}
                           data-testid={`journey-external-provider-${provider.id}`}
                           onClick={() => setExternalProvider(provider.id)}
@@ -442,7 +442,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                         <span className="absolute bottom-0.5 left-0.5 px-1 py-px rounded text-[8px] font-bold bg-zinc-900/70 text-white">{t('journey.editor.photoFirst')}</span>
                       )}
                       {idx > 0 && photos.length > 1 && (
-                        <button
+                        <button type="button"
                           onClick={e => {
                             e.stopPropagation()
                             const prevOrder = photos
@@ -470,7 +470,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                           {t('journey.editor.makeFirst')}
                         </button>
                       )}
-                      <button
+                      <button type="button"
                         onClick={async (e) => {
                           e.stopPropagation()
                           setPhotos(prev => prev.filter(x => x.id !== p.id))
@@ -490,7 +490,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                   {pendingFiles.map((f, i) => (
                     <div key={`pending-${i}`} className="w-20 h-20 rounded-xl overflow-hidden relative group">
                       <img src={pendingUrls[i]} className="w-full h-full object-cover" alt="" />
-                      <button
+                      <button type="button"
                         onClick={() => setPendingFiles(prev => prev.filter((_, j) => j !== i))}
                         className="absolute top-1 right-1 w-5 h-5 rounded-full bg-black/60 text-white flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity"
                       >
@@ -544,13 +544,13 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                         className="flex-1 min-w-0 bg-transparent border-none outline-none text-[13px] text-zinc-900 dark:text-zinc-100 placeholder:text-green-400 dark:placeholder:text-green-600"
                       />
                       {pros.length > 1 && (
-                        <button onClick={() => setPros(pros.filter((_, j) => j !== i))} className="p-1 text-green-300 dark:text-green-700 hover:text-green-600 dark:hover:text-green-400 flex-shrink-0">
+                        <button type="button" onClick={() => setPros(pros.filter((_, j) => j !== i))} className="p-1 text-green-300 dark:text-green-700 hover:text-green-600 dark:hover:text-green-400 flex-shrink-0">
                           <X size={13} strokeWidth={2.5} />
                         </button>
                       )}
                     </div>
                   ))}
-                  <button
+                  <button type="button"
                     onClick={() => setPros([...pros, ''])}
                     className="flex items-center justify-center gap-1.5 h-9 w-full border border-dashed border-green-200 dark:border-green-800/40 rounded-[10px] text-[12px] font-medium text-green-700 dark:text-green-400 hover:border-green-300 dark:hover:border-green-700 transition-colors"
                   >
@@ -578,13 +578,13 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                         className="flex-1 min-w-0 bg-transparent border-none outline-none text-[13px] text-zinc-900 dark:text-zinc-100 placeholder:text-red-400 dark:placeholder:text-red-600"
                       />
                       {cons.length > 1 && (
-                        <button onClick={() => setCons(cons.filter((_, j) => j !== i))} className="p-1 text-red-300 dark:text-red-700 hover:text-red-600 dark:hover:text-red-400 flex-shrink-0">
+                        <button type="button" onClick={() => setCons(cons.filter((_, j) => j !== i))} className="p-1 text-red-300 dark:text-red-700 hover:text-red-600 dark:hover:text-red-400 flex-shrink-0">
                           <X size={13} strokeWidth={2.5} />
                         </button>
                       )}
                     </div>
                   ))}
-                  <button
+                  <button type="button"
                     onClick={() => setCons([...cons, ''])}
                     className="flex items-center justify-center gap-1.5 h-9 w-full border border-dashed border-red-200 dark:border-red-800/40 rounded-[10px] text-[12px] font-medium text-red-700 dark:text-red-400 hover:border-red-300 dark:hover:border-red-700 transition-colors"
                   >
@@ -661,7 +661,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                   <div className="fixed inset-0 z-[99]" onClick={() => setShowLocationResults(false)} />
                   <div className="absolute left-0 right-0 top-full mt-1 z-[100] bg-white dark:bg-zinc-800 border border-zinc-200 dark:border-zinc-700 rounded-xl shadow-lg overflow-hidden max-h-[240px] overflow-y-auto">
                     {locationResults.map((r, i) => (
-                      <button
+                      <button type="button"
                         key={i}
                         onClick={() => {
                           setLocationName(r.name)
@@ -698,7 +698,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                 const Icon = config.icon
                 const active = mood === key
                 return (
-                  <button key={key} onClick={() => setMood(active ? '' : key)}
+                  <button type="button" key={key} onClick={() => setMood(active ? '' : key)}
                     className={`flex items-center gap-1.5 px-3 py-1.5 rounded-full text-[12px] font-semibold border transition-all ${
                       active ? '' : 'border-zinc-200 dark:border-zinc-700 text-zinc-500'
                     }`}
@@ -718,7 +718,7 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
                 const Icon = config.icon
                 const active = weather === key
                 return (
-                  <button key={key} onClick={() => setWeather(active ? '' : key)}
+                  <button type="button" key={key} onClick={() => setWeather(active ? '' : key)}
                     className={`flex items-center gap-1.5 px-3 py-1.5 rounded-full text-[12px] font-semibold border transition-all ${
                       active ? 'bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 border-zinc-900 dark:border-white' : 'border-zinc-200 dark:border-zinc-700 text-zinc-500 hover:border-zinc-400'
                     }`}>
@@ -735,8 +735,8 @@ export function EntryEditor({ entry, journeyId, tripDates, galleryPhotos, trips,
 
 
         <div className="flex items-center justify-end gap-2 px-6 py-4 border-t border-zinc-200 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-800/50" style={{ paddingBottom: 'max(16px, env(safe-area-inset-bottom, 16px))' }}>
-          <button onClick={handleClose} className="px-4 h-10 flex items-center rounded-full border border-zinc-200 dark:border-zinc-600 text-[13px] font-semibold text-zinc-700 dark:text-zinc-300 hover:bg-zinc-100 dark:hover:bg-zinc-700 transition-colors">{t('common.cancel')}</button>
-          <button onClick={handleSave} disabled={saving} className="px-5 h-10 flex items-center rounded-full bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 text-[13px] font-semibold hover:bg-zinc-800 dark:hover:bg-zinc-100 disabled:opacity-50 transition-colors">
+          <button type="button" onClick={handleClose} className="px-4 h-10 flex items-center rounded-full border border-zinc-200 dark:border-zinc-600 text-[13px] font-semibold text-zinc-700 dark:text-zinc-300 hover:bg-zinc-100 dark:hover:bg-zinc-700 transition-colors">{t('common.cancel')}</button>
+          <button type="button" onClick={handleSave} disabled={saving} className="px-5 h-10 flex items-center rounded-full bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 text-[13px] font-semibold hover:bg-zinc-800 dark:hover:bg-zinc-100 disabled:opacity-50 transition-colors">
             {saving ? t('common.saving') : t('common.save')}
           </button>
         </div>

client/src/components/Journey/JourneyDetailPageExpandableStory.tsx

@@ -35,7 +35,7 @@ export function ExpandableStory({ story }: { story: string }) {
         <JournalBody text={story} />
       </div>
       {clamped && !expanded && (
-        <button
+        <button type="button"
           onClick={() => setExpanded(true)}
           className="mt-2 inline-flex items-center gap-1 px-2.5 py-1 rounded-full bg-zinc-100 dark:bg-zinc-800 text-[10px] font-medium text-zinc-500 dark:text-zinc-400 hover:bg-zinc-200 dark:hover:bg-zinc-700 active:scale-95 transition-all"
         >
@@ -43,7 +43,7 @@ export function ExpandableStory({ story }: { story: string }) {
         </button>
       )}
       {expanded && (
-        <button
+        <button type="button"
           onClick={() => setExpanded(false)}
           className="mt-2 inline-flex items-center gap-1 px-2.5 py-1 rounded-full bg-zinc-100 dark:bg-zinc-800 text-[10px] font-medium text-zinc-500 dark:text-zinc-400 hover:bg-zinc-200 dark:hover:bg-zinc-700 active:scale-95 transition-all"
         >

client/src/components/Journey/JourneyDetailPageGalleryView.tsx

@@ -133,7 +133,7 @@ export function GalleryView({ entries, gallery, journeyId, userId, trips, onPhot
         </span>
         <div className="flex items-center gap-2">
           {availableProviders.map(p => (
-            <button
+            <button type="button"
               key={p.id}
               onClick={() => browseProvider(p.id)}
               className="inline-flex items-center gap-1.5 px-2.5 py-1.5 rounded-lg border border-zinc-200 dark:border-zinc-700 text-[11px] font-medium text-zinc-600 dark:text-zinc-400 hover:bg-zinc-50 dark:hover:bg-zinc-800"
@@ -176,7 +176,7 @@ export function GalleryView({ entries, gallery, journeyId, userId, trips, onPhot
                 </div>
               )}
               {/* Delete button */}
-              <button
+              <button type="button"
                 onClick={(e) => { e.stopPropagation(); handleDeletePhoto(photo.id) }}
                 className="absolute top-1.5 right-1.5 w-6 h-6 rounded-full bg-black/60 backdrop-blur text-white flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity z-10"
               >

client/src/components/Journey/JourneyDetailPageProviderPicker.tsx

@@ -160,7 +160,7 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
           <h2 className="text-[16px] font-bold text-zinc-900 dark:text-white">
             {provider === 'immich' ? 'Immich' : provider === 'synologyphotos' ? 'Synology Photos' : provider}
           </h2>
-          <button onClick={onClose} className="w-8 h-8 rounded-lg flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
+          <button type="button" onClick={onClose} className="w-8 h-8 rounded-lg flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
             <X size={16} />
           </button>
         </div>}
@@ -176,7 +176,7 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
               { id: 'all' as const, label: t('journey.picker.allPhotos'), short: t('common.all') },
               { id: 'album' as const, label: t('journey.picker.albums') },
             ].map(f => (
-              <button
+              <button type="button"
                 key={f.id}
                 onClick={() => setFilter(f.id)}
                 className={`px-3 py-1.5 rounded-lg text-[12px] font-medium transition-colors ${
@@ -233,7 +233,7 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
                 <div className="flex-1"><DatePicker value={customFrom} onChange={setCustomFrom} /></div>
                 <span className="text-zinc-400 text-[12px]">&mdash;</span>
                 <div className="flex-1"><DatePicker value={customTo} onChange={setCustomTo} /></div>
-                <button onClick={handleCustomSearch}
+                <button type="button" onClick={handleCustomSearch}
                   className="px-3 py-1.5 rounded-lg bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 text-[12px] font-medium hover:bg-zinc-800 dark:hover:bg-zinc-100 flex-shrink-0">
                   {t('journey.picker.search')}
                 </button>
@@ -243,7 +243,7 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
             {filter === 'album' && (
               <div className="flex gap-2 overflow-x-auto flex-1">
                 {albums.map((a: any) => (
-                  <button
+                  <button type="button"
                     key={a.id}
                     onClick={() => { setSelectedAlbum(a.id); setSelectedAlbumPassphrase(a.passphrase); loadAlbumPhotos(a) }}
                     className={`px-2.5 py-1 rounded-lg text-[11px] font-medium whitespace-nowrap flex-shrink-0 border ${
@@ -265,7 +265,7 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
         {!embedded && <div className="px-6 py-2.5 border-b border-zinc-200 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-800/50 flex-shrink-0">
           <div className="relative flex items-center gap-2">
             <span className="text-[10px] font-semibold tracking-[0.12em] uppercase text-zinc-500">{t('journey.picker.addTo')}</span>
-            <button
+            <button type="button"
               onClick={() => setAddToOpen(!addToOpen)}
               className="flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-zinc-200 dark:border-zinc-700 text-[12px] font-medium text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-800"
             >
@@ -276,7 +276,7 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
               <>
                 <div className="fixed inset-0 z-[9]" onClick={() => setAddToOpen(false)} />
                 <div className="absolute left-12 top-full mt-1 z-10 bg-white dark:bg-zinc-800 border border-zinc-200 dark:border-zinc-700 rounded-xl shadow-lg py-1.5 min-w-[200px] max-h-[240px] overflow-y-auto">
-                  <button
+                  <button type="button"
                     onClick={() => { setTargetEntryId(null); setAddToOpen(false) }}
                     className={`w-full text-left px-3 py-2 text-[12px] flex items-center gap-2 ${
                       !targetEntryId
@@ -291,7 +291,7 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
                     <div className="h-px bg-zinc-200 dark:bg-zinc-700 my-1" />
                   )}
                   {entries.filter(e => e.type !== 'skeleton' && e.title !== 'Gallery' && e.title !== '[Trip Photos]').map(e => (
-                    <button
+                    <button type="button"
                       key={e.id}
                       onClick={() => { setTargetEntryId(e.id); setAddToOpen(false) }}
                       className={`w-full text-left px-3 py-2 text-[12px] truncate ${
@@ -316,7 +316,7 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
           if (selectable.length === 0) return null
           return (
             <div className="px-4 py-2 border-b border-zinc-200 dark:border-zinc-700 bg-white dark:bg-zinc-900 flex-shrink-0">
-              <button
+              <button type="button"
                 onClick={() => {
                   if (allSelected) {
                     setSelected(new Map())
@@ -421,10 +421,10 @@ export function ProviderPicker({ provider, userId, entries, trips, existingAsset
             <span className="leading-[18px]">{t('journey.picker.selected')}</span>
           </span>
           <div className="flex items-center gap-2">
-            <button onClick={onClose} className="px-3.5 py-2 rounded-lg border border-zinc-200 dark:border-zinc-600 text-[13px] font-medium text-zinc-700 dark:text-zinc-300 hover:bg-zinc-100 dark:hover:bg-zinc-700">
+            <button type="button" onClick={onClose} className="px-3.5 py-2 rounded-lg border border-zinc-200 dark:border-zinc-600 text-[13px] font-medium text-zinc-700 dark:text-zinc-300 hover:bg-zinc-100 dark:hover:bg-zinc-700">
               {t('common.cancel')}
             </button>
-            <button
+            <button type="button"
               onClick={() => {
                 const groupMap = new Map<string | undefined, { assetIds: string[]; mediaTypes: string[] }>()
                 for (const [assetId, { passphrase, mediaType }] of selected.entries()) {

client/src/components/Journey/JourneyDetailPageSettingsDialog.tsx

@@ -92,7 +92,7 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
 
         <div className="flex items-center justify-between px-6 py-4 border-b border-zinc-200 dark:border-zinc-700">
           <h2 className="text-[16px] font-bold text-zinc-900 dark:text-white">{t('journey.settings.title')}</h2>
-          <button onClick={handleClose} className="w-8 h-8 rounded-xl flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
+          <button type="button" onClick={handleClose} className="w-8 h-8 rounded-xl flex items-center justify-center text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800">
             <X size={16} />
           </button>
         </div>
@@ -105,7 +105,7 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
           <div>
             <label className="text-[10px] font-semibold tracking-[0.12em] uppercase text-zinc-500 block mb-2">{t('journey.settings.coverImage')}</label>
             <input ref={coverRef} type="file" accept="image/*" onChange={handleCoverUpload} className="hidden" />
-            <button
+            <button type="button"
               onClick={() => coverRef.current?.click()}
               className="w-full h-28 rounded-xl border border-dashed border-zinc-200 dark:border-zinc-700 flex items-center justify-center gap-2 text-[12px] text-zinc-500 hover:border-zinc-400 dark:hover:border-zinc-500 hover:bg-zinc-50 dark:hover:bg-zinc-800 overflow-hidden relative"
             >
@@ -156,7 +156,7 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
                     <div className="text-[12px] font-medium text-zinc-900 dark:text-white">{trip.title}</div>
                     <div className="text-[10px] text-zinc-500">{trip.place_count || 0} {t('journey.synced.places')}</div>
                   </div>
-                  <button
+                  <button type="button"
                     onClick={() => setUnlinkTarget({ trip_id: trip.trip_id, title: trip.title })}
                     className="w-8 h-8 rounded-xl flex-shrink-0 flex items-center justify-center bg-red-500/10 text-red-500 hover:bg-red-500/20 dark:bg-red-500/15 dark:hover:bg-red-500/25 transition-colors"
                     title="Unlink trip"
@@ -166,7 +166,7 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
                 </div>
               ))}
               {journey.trips.length === 0 && <p className="text-[11px] text-zinc-400">{t('journey.trips.noTripsLinkedSettings')}</p>}
-              <button
+              <button type="button"
                 onClick={() => setShowAddTrip(true)}
                 className="w-full mt-1 flex items-center justify-center gap-1.5 py-2.5 rounded-xl border border-dashed border-zinc-300 dark:border-zinc-600 text-[12px] font-medium text-zinc-500 hover:border-zinc-400 hover:text-zinc-700 dark:hover:border-zinc-500 dark:hover:text-zinc-300 transition-colors"
               >
@@ -187,7 +187,7 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
                   <div className="flex-1 text-[12px] font-medium text-zinc-900 dark:text-white">{c.username}</div>
                   <span className="shrink-0 rounded-full font-semibold uppercase" style={{ fontSize: 8.5, letterSpacing: '0.05em', padding: '2px 7px', ...(c.role === 'owner' ? { background: 'var(--vg-ink)', color: 'var(--vg-bg)' } : { background: 'color-mix(in srgb, var(--vg-ink3) 14%, transparent)', color: 'var(--vg-ink2)' }) }}>{c.role}</span>
                   {c.role !== 'owner' && (
-                    <button
+                    <button type="button"
                       onClick={async () => {
                         if (!window.confirm(t('journey.contributors.removeConfirm', { username: c.username }))) return
                         try {
@@ -207,7 +207,7 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
                   )}
                 </div>
               ))}
-              <button
+              <button type="button"
                 onClick={onOpenInvite}
                 className="w-full mt-1 flex items-center justify-center gap-1.5 py-2.5 rounded-xl border border-dashed border-zinc-300 dark:border-zinc-600 text-[12px] font-medium text-zinc-500 hover:border-zinc-400 hover:text-zinc-700 dark:hover:border-zinc-500 dark:hover:text-zinc-300 transition-colors"
               >
@@ -228,7 +228,7 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
 
         {/* Footer */}
         <div className="flex items-center gap-1.5 px-4 md:px-6 py-4 pb-6 md:pb-4 border-t border-zinc-200 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-800/50">
-          <button
+          <button type="button"
             onClick={() => setShowDeleteConfirm(true)}
             aria-label={t('journey.settings.delete')}
             title={t('journey.settings.delete')}
@@ -237,7 +237,7 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
             <Trash2 size={14} />
             <span className="hidden md:inline">{t('journey.settings.delete')}</span>
           </button>
-          <button
+          <button type="button"
             onClick={handleArchiveToggle}
             disabled={archiving}
             aria-label={journey.status === 'archived' ? t('journey.settings.reopenJourney') : t('journey.settings.endJourney')}
@@ -247,8 +247,8 @@ export function JourneySettingsDialog({ journey, onClose, onSaved, onOpenInvite,
             {journey.status === 'archived' ? <ArchiveRestore size={14} /> : <Archive size={14} />}
             <span className="hidden md:inline">{journey.status === 'archived' ? t('journey.settings.reopenJourney') : t('journey.settings.endJourney')}</span>
           </button>
-          <button onClick={handleClose} className="h-10 px-4 rounded-full border border-zinc-200 dark:border-zinc-600 text-[13px] font-semibold text-zinc-700 dark:text-zinc-300 hover:bg-zinc-100 dark:hover:bg-zinc-700 transition-colors">{t('common.cancel')}</button>
-          <button onClick={handleSave} disabled={saving || !title.trim()} className="h-10 px-5 rounded-full bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 text-[13px] font-semibold hover:bg-zinc-800 dark:hover:bg-zinc-100 disabled:opacity-40 transition-colors">
+          <button type="button" onClick={handleClose} className="h-10 px-4 rounded-full border border-zinc-200 dark:border-zinc-600 text-[13px] font-semibold text-zinc-700 dark:text-zinc-300 hover:bg-zinc-100 dark:hover:bg-zinc-700 transition-colors">{t('common.cancel')}</button>
+          <button type="button" onClick={handleSave} disabled={saving || !title.trim()} className="h-10 px-5 rounded-full bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 text-[13px] font-semibold hover:bg-zinc-800 dark:hover:bg-zinc-100 disabled:opacity-40 transition-colors">
             {saving ? t('common.saving') : t('common.save')}
           </button>
         </div>

client/src/components/Journey/JourneyDetailPageVerdictSection.tsx

@@ -9,7 +9,7 @@ export function VerdictSection({ pros, cons }: { pros: string[]; cons: string[]
   return (
     <div className="mt-5">
       {/* Header — clickable on mobile */}
-      <button
+      <button type="button"
         onClick={() => setOpen(o => !o)}
         className="md:pointer-events-none w-full flex items-center gap-2.5 mb-3.5 group"
       >

client/src/components/Journey/JourneyMap.tsx

@@ -410,7 +410,7 @@ function JourneyMap(
         style={{ width: '100%', height: '100%' }}
       />
       <div style={{ position: 'absolute', bottom: 12, right: 12, zIndex: 400, display: 'flex', flexDirection: 'column', gap: 4 }}>
-        <button
+        <button type="button"
           onClick={zoomIn}
           style={{
             width: 32, height: 32, borderRadius: 8,
@@ -422,7 +422,7 @@ function JourneyMap(
             cursor: 'pointer', fontSize: 'calc(16px * var(--fs-scale-subtitle, 1))', fontWeight: 700, lineHeight: 1,
           }}
         >+</button>
-        <button
+        <button type="button"
           onClick={zoomOut}
           style={{
             width: 32, height: 32, borderRadius: 8,

client/src/components/Journey/JourneyShareSection.tsx

@@ -66,7 +66,7 @@ export default function JourneyShareSection({ journeyId }: { journeyId: number }
       <label className="text-[10px] font-semibold tracking-[0.12em] uppercase text-zinc-500 block mb-2">{t('journey.share.publicShare')}</label>
 
       {!link ? (
-        <button
+        <button type="button"
           onClick={createLink}
           className="w-full flex items-center justify-center gap-1.5 py-2.5 rounded-xl border border-dashed border-zinc-300 dark:border-zinc-600 text-[12px] font-medium text-zinc-500 hover:border-zinc-400 hover:text-zinc-700 dark:hover:border-zinc-500 dark:hover:text-zinc-300 transition-colors"
         >
@@ -78,13 +78,13 @@ export default function JourneyShareSection({ journeyId }: { journeyId: number }
           <div className="flex items-center gap-2 p-2 rounded-2xl bg-zinc-50 dark:bg-zinc-800 border border-zinc-200 dark:border-zinc-700">
             <Link size={13} className="text-zinc-400 flex-shrink-0 ml-1.5" />
             <span className="flex-1 text-[11px] text-zinc-600 dark:text-zinc-400 truncate">{shareUrl}</span>
-            <button
+            <button type="button"
               onClick={copyLink}
               className="flex-shrink-0 px-3 py-1.5 rounded-full bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 text-[11px] font-semibold hover:bg-zinc-700 dark:hover:bg-zinc-200 transition-colors"
             >
               {copied ? t('journey.share.copied') : t('journey.share.copy')}
             </button>
-            <button
+            <button type="button"
               onClick={deleteLink}
               className="flex-shrink-0 px-3 py-1.5 rounded-full text-[11px] font-semibold text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20 transition-colors"
             >
@@ -99,7 +99,7 @@ export default function JourneyShareSection({ journeyId }: { journeyId: number }
               { key: 'share_gallery' as const, label: t('journey.share.gallery'), icon: Grid },
               { key: 'share_map' as const, label: t('journey.share.map'), icon: MapPin },
             ].map(({ key, label, icon: Icon }) => (
-              <button
+              <button type="button"
                 key={key}
                 onClick={() => togglePerm(key)}
                 className={`flex items-center gap-2.5 px-3 py-2 rounded-xl border text-[12px] font-medium transition-all ${

client/src/components/Journey/MobileEntryCard.tsx

@@ -72,7 +72,7 @@ export default function MobileEntryCard({ entry, dayLabel, dayColor, isActive, o
   const storyPreview = entry.story ? stripMarkdown(entry.story) : ''
 
   return (
-    <button
+    <button type="button"
       onClick={onClick}
       className={`flex-shrink-0 rounded-xl overflow-hidden text-left transition-all duration-100 ${
         isActive

client/src/components/Journey/MobileEntryView.tsx

@@ -60,7 +60,7 @@ export default function MobileEntryView({ entry, readOnly, publicPhotoUrl, onClo
     <div className="fixed inset-0 z-[9999] bg-white dark:bg-zinc-950 flex flex-col overflow-hidden" style={{ height: '100dvh' }}>
       {/* Top bar */}
       <div className="flex items-center justify-between px-4 py-3 border-b border-zinc-100 dark:border-zinc-800 flex-shrink-0">
-        <button
+        <button type="button"
           onClick={onClose}
           className="w-9 h-9 rounded-lg flex items-center justify-center text-zinc-500 hover:bg-zinc-100 dark:hover:bg-zinc-800 transition-colors"
         >
@@ -68,14 +68,14 @@ export default function MobileEntryView({ entry, readOnly, publicPhotoUrl, onClo
         </button>
         {!readOnly && (
           <div className="flex items-center gap-1.5">
-            <button
+            <button type="button"
               onClick={() => { onClose(); onEdit(); }}
               className="h-8 px-3 rounded-lg bg-zinc-100 dark:bg-zinc-800 text-zinc-700 dark:text-zinc-300 text-[12px] font-medium flex items-center gap-1.5 hover:bg-zinc-200 dark:hover:bg-zinc-700 transition-colors"
             >
               <Pencil size={13} />
               {t('common.edit')}
             </button>
-            <button
+            <button type="button"
               onClick={() => { onClose(); onDelete(); }}
               className="w-8 h-8 rounded-lg flex items-center justify-center text-zinc-400 hover:bg-red-50 hover:text-red-500 dark:hover:bg-red-900/20 dark:hover:text-red-400 transition-colors"
             >

client/src/components/Journey/MobileMapTimeline.tsx

@@ -171,7 +171,7 @@ export default function MobileMapTimeline({
         />
         {!readOnly && onAddEntry && (
           <div className="fixed right-4 z-30" style={{ bottom: 'calc(var(--bottom-nav-h, 84px) + 16px)' }}>
-            <button
+            <button type="button"
               onClick={onAddEntry}
               className="w-12 h-12 rounded-full bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 shadow-lg flex items-center justify-center hover:scale-105 active:scale-95 transition-transform"
             >
@@ -244,7 +244,7 @@ export default function MobileMapTimeline({
           className="fixed right-4 z-30"
           style={{ bottom: 'calc(var(--bottom-nav-h, 84px) + 168px)' }}
         >
-          <button
+          <button type="button"
             onClick={onAddEntry}
             className="w-12 h-12 rounded-full bg-zinc-900 dark:bg-white text-white dark:text-zinc-900 shadow-lg flex items-center justify-center hover:scale-105 active:scale-95 transition-transform"
           >

client/src/components/Journey/PhotoLightbox.tsx

@@ -86,7 +86,7 @@ export default function PhotoLightbox({ photos, startIndex = 0, onClose }: Props
           <span style={{ color: 'rgba(255,255,255,0.5)', fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 500 }}>
             {idx + 1} / {photos.length}
           </span>
-          <button onClick={onClose} style={{
+          <button type="button" onClick={onClose} style={{
             background: 'rgba(255,255,255,0.1)', border: 'none', borderRadius: '50%',
             width: 36, height: 36, display: 'flex', alignItems: 'center', justifyContent: 'center',
             color: '#fff', cursor: 'pointer',
@@ -97,7 +97,7 @@ export default function PhotoLightbox({ photos, startIndex = 0, onClose }: Props
 
         {/* Prev button — visible on hover (desktop), always visible (mobile) */}
         {hasPrev && (
-          <button onClick={prev} className="flex sm:opacity-0 sm:group-hover/lightbox:opacity-100 transition-opacity" style={{
+          <button type="button" onClick={prev} className="flex sm:opacity-0 sm:group-hover/lightbox:opacity-100 transition-opacity" style={{
             position: 'absolute', left: 16, zIndex: 5,
             width: 44, height: 44, borderRadius: '50%',
             background: 'rgba(0,0,0,0.4)', backdropFilter: 'blur(8px)',
@@ -127,7 +127,7 @@ export default function PhotoLightbox({ photos, startIndex = 0, onClose }: Props
 
         {/* Next button */}
         {hasNext && (
-          <button onClick={next} className="flex sm:opacity-0 sm:group-hover/lightbox:opacity-100 transition-opacity" style={{
+          <button type="button" onClick={next} className="flex sm:opacity-0 sm:group-hover/lightbox:opacity-100 transition-opacity" style={{
             position: 'absolute', right: 16, zIndex: 5,
             width: 44, height: 44, borderRadius: '50%',
             background: 'rgba(0,0,0,0.4)', backdropFilter: 'blur(8px)',

client/src/components/Layout/BottomNav.tsx

@@ -84,7 +84,7 @@ export default function BottomNav() {
   const renderItem = ({ to, label, icon: Icon }: NavItem) => {
     const active = isActive(to)
     return (
-      <button
+      <button type="button"
         key={to}
         onClick={() => navigate(to)}
         className="flex flex-col items-center gap-1 py-1 px-1 min-w-0"
@@ -115,7 +115,7 @@ export default function BottomNav() {
     >
       <div className="flex flex-1 items-center justify-around min-w-0">{left.map(renderItem)}</div>
 
-      <button
+      <button type="button"
         onClick={create.run}
         aria-label={create.label}
         className="flex items-center justify-center flex-shrink-0 active:scale-95 transition-transform"

client/src/components/Layout/DemoBanner.tsx

@@ -547,7 +547,7 @@ export default function DemoBanner(): React.ReactElement | null {
               {t.selfHostLink}
             </a>
           </div>
-          <button
+          <button type="button"
             onClick={() => setDismissed(true)}
             style={{
               background: '#111827',

client/src/components/Layout/InAppNotificationBell.tsx

@@ -42,7 +42,7 @@ export default function InAppNotificationBell(): React.ReactElement {
 
   return (
     <div className="relative flex-shrink-0">
-      <button
+      <button type="button"
         onClick={handleOpen}
         title={t('notifications.title')}
         className="relative p-2 rounded-lg transition-colors text-content-muted"
@@ -98,7 +98,7 @@ export default function InAppNotificationBell(): React.ReactElement {
               </span>
               <div className="flex items-center gap-1">
                 {unreadCount > 0 && (
-                  <button
+                  <button type="button"
                     onClick={markAllRead}
                     title={t('notifications.markAllRead')}
                     className="p-1.5 rounded-lg transition-colors text-content-muted"
@@ -109,7 +109,7 @@ export default function InAppNotificationBell(): React.ReactElement {
                   </button>
                 )}
                 {notifications.length > 0 && (
-                  <button
+                  <button type="button"
                     onClick={deleteAll}
                     title={t('notifications.deleteAll')}
                     className="p-1.5 rounded-lg transition-colors text-content-muted"
@@ -142,7 +142,7 @@ export default function InAppNotificationBell(): React.ReactElement {
             </div>
 
             {/* Footer */}
-            <button
+            <button type="button"
               onClick={handleShowAll}
               className="w-full py-2.5 text-xs font-medium transition-colors flex-shrink-0 border-t border-edge-secondary text-content"
               style={{

client/src/components/Layout/MobileTopBar.tsx

@@ -24,7 +24,7 @@ export default function MobileTopBar() {
         className="md:hidden flex items-center justify-end gap-2 px-4"
         style={{ paddingTop: 'calc(10px + env(safe-area-inset-top, 0px))', paddingBottom: 10 }}
       >
-        <button
+        <button type="button"
           onClick={() => navigate('/notifications')}
           aria-label={t('notifications.title')}
           className="relative grid place-items-center rounded-full active:scale-95 transition-transform"
@@ -35,7 +35,7 @@ export default function MobileTopBar() {
             <span style={{ position: 'absolute', top: 7, right: 7, width: 8, height: 8, borderRadius: '50%', background: 'oklch(0.7 0.17 38)', boxShadow: '0 0 0 2px var(--bg, #fff)' }} />
           )}
         </button>
-        <button
+        <button type="button"
           onClick={() => setShowProfile(true)}
           aria-label={t('nav.profile')}
           className="grid place-items-center rounded-full text-white font-semibold text-[12px] active:scale-95 transition-transform"
@@ -90,7 +90,7 @@ function ProfileSheet({ onClose }: { onClose: () => void }) {
         <div className="h-px bg-zinc-100 dark:bg-zinc-800 mx-4" />
 
         <div className="py-2 px-2">
-          <button
+          <button type="button"
             onClick={() => handleNav('/settings')}
             className="w-full flex items-center gap-3 px-4 py-3 rounded-xl text-left hover:bg-zinc-50 dark:hover:bg-zinc-800 active:bg-zinc-100 dark:active:bg-zinc-800 transition-colors"
           >
@@ -99,7 +99,7 @@ function ProfileSheet({ onClose }: { onClose: () => void }) {
           </button>
 
           {user?.role === 'admin' && (
-            <button
+            <button type="button"
               onClick={() => handleNav('/admin')}
               className="w-full flex items-center gap-3 px-4 py-3 rounded-xl text-left hover:bg-zinc-50 dark:hover:bg-zinc-800 active:bg-zinc-100 dark:active:bg-zinc-800 transition-colors"
             >
@@ -112,7 +112,7 @@ function ProfileSheet({ onClose }: { onClose: () => void }) {
         <div className="h-px bg-zinc-100 dark:bg-zinc-800 mx-4" />
 
         <div className="py-2 px-2">
-          <button
+          <button type="button"
             onClick={handleLogout}
             className="w-full flex items-center gap-3 px-4 py-3 rounded-xl text-left hover:bg-red-50 dark:hover:bg-red-900/20 active:bg-red-100 transition-colors"
           >

client/src/components/Layout/Navbar.tsx

@@ -115,7 +115,7 @@ export default function Navbar({ tripTitle, tripId, onBack, showBack, onShare }:
           being centred on top of both (#1983). */}
       <div className="flex items-center gap-3 min-w-0 flex-1 basis-0">
         {showBack && (
-          <button onClick={onBack}
+          <button type="button" onClick={onBack}
             className="trek-back-btn p-1.5 rounded-lg transition-colors flex items-center gap-1.5 text-sm flex-shrink-0 text-content-muted"
             onMouseEnter={e => e.currentTarget.style.background = 'var(--bg-hover)'}
             onMouseLeave={e => e.currentTarget.style.background = 'transparent'}>
@@ -215,7 +215,7 @@ export default function Navbar({ tripTitle, tripId, onBack, showBack, onShare }:
 
       {/* Share button */}
       {onShare && (
-        <button onClick={onShare}
+        <button type="button" onClick={onShare}
           className="flex items-center gap-1.5 py-1.5 px-3 rounded-lg border transition-colors text-sm font-medium flex-shrink-0 border-edge text-content-secondary bg-surface-card"
           onMouseEnter={e => e.currentTarget.style.background = 'var(--bg-hover)'}
           onMouseLeave={e => e.currentTarget.style.background = 'var(--bg-card)'}>
@@ -235,7 +235,7 @@ export default function Navbar({ tripTitle, tripId, onBack, showBack, onShare }:
       )}
 
       {/* Dark mode toggle (light ↔ dark, overrides auto) — hidden on mobile */}
-      <button onClick={toggleDarkMode} title={dark ? t('nav.lightMode') : t('nav.darkMode')}
+      <button type="button" onClick={toggleDarkMode} title={dark ? t('nav.lightMode') : t('nav.darkMode')}
         className="p-2 rounded-lg transition-colors flex-shrink-0 hidden sm:flex relative w-8 h-8 items-center justify-center text-content-muted"
         onMouseEnter={e => e.currentTarget.style.background = 'var(--bg-hover)'}
         onMouseLeave={e => e.currentTarget.style.background = 'transparent'}>
@@ -252,7 +252,7 @@ export default function Navbar({ tripTitle, tripId, onBack, showBack, onShare }:
       {/* User menu */}
       {user && (
         <div className="relative">
-          <button onClick={() => setUserMenuOpen(!userMenuOpen)}
+          <button type="button" onClick={() => setUserMenuOpen(!userMenuOpen)}
             className="flex items-center gap-2 py-1.5 px-3 rounded-lg transition-colors"
             onMouseEnter={e => e.currentTarget.style.background = 'var(--bg-hover)'}
             onMouseLeave={e => e.currentTarget.style.background = 'transparent'}>
@@ -313,7 +313,7 @@ export default function Navbar({ tripTitle, tripId, onBack, showBack, onShare }:
                 </div>
 
                 <div className="py-1 border-t border-edge-secondary">
-                  <button onClick={handleLogout}
+                  <button type="button" onClick={handleLogout}
                     className="flex items-center gap-2 w-full px-4 py-2 text-sm text-red-500 hover:bg-red-500/10 transition-colors">
                     <LogOut className="w-4 h-4" />
                     {t('nav.logout')}

client/src/components/Layout/PageSidebar.tsx

@@ -59,7 +59,7 @@ export default function PageSidebar({
       <div
         className="lg:hidden flex items-center justify-between px-4 py-3 border-b border-edge"
       >
-        <button
+        <button type="button"
           onClick={() => setMobileOpen(true)}
           className="w-9 h-9 rounded-lg flex items-center justify-center transition-colors hover:bg-[var(--bg-hover)] text-content"
           aria-label="Open navigation"
@@ -110,7 +110,7 @@ export default function PageSidebar({
               >
                 {sidebarLabel}
               </span>
-              <button
+              <button type="button"
                 onClick={() => setMobileOpen(false)}
                 className="w-8 h-8 rounded-lg flex items-center justify-center transition-colors hover:bg-[var(--bg-hover)] text-content"
                 aria-label="Close navigation"
@@ -177,7 +177,7 @@ function SidebarInner({
                     {tab.group}
                   </div>
                 )}
-                <button
+                <button type="button"
                   onClick={() => onTabChange(tab.id)}
                   className={`flex items-center gap-2.5 px-3 py-2 rounded-lg text-sm text-left transition-colors ${active ? 'text-content font-semibold' : 'text-content-secondary font-medium'}`}
                   style={{

client/src/components/Map/ReservationOverlay.tsx

@@ -85,7 +85,7 @@ function parseInTz(isoLocal: string, tz: string): number {
   // minutes) makes Date.UTC NaN; bail before formatToParts, which throws on a
   // non-finite date and would blank the whole trip. computeDuration's finiteness
   // check then drops the duration cleanly.
-  if (!Number.isFinite(guess)) return NaN
+  if (!Number.isFinite(guess)) return Number.NaN
   const fmt = new Intl.DateTimeFormat('en-US', {
     timeZone: tz, hour12: false,
     year: 'numeric', month: '2-digit', day: '2-digit',

client/src/components/Map/reservationsMapbox.ts

@@ -57,7 +57,7 @@ function parseInTz(isoLocal: string, tz: string): number {
   // minutes) makes Date.UTC NaN; bail before formatToParts, which throws on a
   // non-finite date and would blank the whole trip. computeDuration's finiteness
   // check then drops the duration cleanly.
-  if (!Number.isFinite(guess)) return NaN
+  if (!Number.isFinite(guess)) return Number.NaN
   const fmt = new Intl.DateTimeFormat('en-US', {
     timeZone: tz, hour12: false,
     year: 'numeric', month: '2-digit', day: '2-digit',

client/src/components/Notifications/InAppNotificationItem.tsx

@@ -92,7 +92,7 @@ export default function InAppNotificationItem({ notification, onClose }: Notific
                 {relativeTime(notification.created_at, locale)}
               </span>
               {!notification.is_read && (
-                <button
+                <button type="button"
                   onClick={() => markRead(notification.id)}
                   title={t('notifications.markRead')}
                   className="p-1 rounded transition-colors"
@@ -103,7 +103,7 @@ export default function InAppNotificationItem({ notification, onClose }: Notific
                   <CheckCheck className="w-3.5 h-3.5" />
                 </button>
               )}
-              <button
+              <button type="button"
                 onClick={() => deleteNotification(notification.id)}
                 title={t('notifications.delete')}
                 className="p-1 rounded transition-colors"
@@ -123,7 +123,7 @@ export default function InAppNotificationItem({ notification, onClose }: Notific
           {/* Boolean actions */}
           {notification.type === 'boolean' && notification.positive_text_key && notification.negative_text_key && (
             <div className="flex gap-2 mt-2">
-              <button
+              <button type="button"
                 onClick={() => handleRespond('positive')}
                 disabled={responding || notification.response !== null}
                 className="flex items-center gap-1 px-2.5 py-1 rounded-lg text-xs font-medium transition-colors"
@@ -145,7 +145,7 @@ export default function InAppNotificationItem({ notification, onClose }: Notific
                 <Check className="w-3 h-3" />
                 {t(notification.positive_text_key)}
               </button>
-              <button
+              <button type="button"
                 onClick={() => handleRespond('negative')}
                 disabled={responding || notification.response !== null}
                 className="flex items-center gap-1 px-2.5 py-1 rounded-lg text-xs font-medium transition-colors"
@@ -172,7 +172,7 @@ export default function InAppNotificationItem({ notification, onClose }: Notific
 
           {/* Navigate action */}
           {notification.type === 'navigate' && notification.navigate_text_key && notification.navigate_target && (
-            <button
+            <button type="button"
               onClick={handleNavigate}
               className="flex items-center gap-1 mt-2 px-2.5 py-1 rounded-lg text-xs font-medium transition-colors"
               style={{ background: dark ? '#27272a' : '#f1f5f9', color: 'var(--text-secondary)' }}

client/src/components/PDF/TripPDF.tsx

@@ -132,7 +132,7 @@ function longDateRange(days, locale) {
 // unavailable (#1561).
 function dayCost(assignments, dayId, locale, tripCurrency, rates) {
   const entries: MoneyEntry[] = (assignments[String(dayId)] || []).map(a => ({
-    amount: parseFloat(a.place?.price) || 0,
+    amount: Number.parseFloat(a.place?.price) || 0,
     currency: a.place?.currency || tripCurrency,
   }))
   return formatMoneySum(entries, tripCurrency, locale || 'en', rates)
@@ -413,7 +413,7 @@ export async function downloadTripPDF({ trip, days, places, assignments = {}, ca
 
           const chips = [
             place.place_time ? `<span class="chip">${svgClock}${escHtml(place.place_time)}</span>` : '',
-            place.price && parseFloat(place.price) > 0 ? `<span class="chip chip-green">${svgMoney}${formatMoney(Number(place.price), place.currency || trip.currency, loc)}</span>` : '',
+            place.price && Number.parseFloat(place.price) > 0 ? `<span class="chip chip-green">${svgMoney}${formatMoney(Number(place.price), place.currency || trip.currency, loc)}</span>` : '',
           ].filter(Boolean).join('')
 
           return `
@@ -766,8 +766,8 @@ ${pluginSectionsHtml}
       <button id="pdf-daybreak-toggle" type="button" role="switch" aria-checked="${breaksPerDay}" aria-label="${escHtml(tr('pdf.pageBreakPerDay'))}" style="${TOGGLE_TRACK} background:${trackColour(breaksPerDay)}">
         <span style="${TOGGLE_KNOB} left:${knobOffset(breaksPerDay)}"></span>
       </button>
-      <button id="pdf-print-btn" style="display:flex;align-items:center;gap:5px;font-size:12px;font-weight:500;color:var(--text-muted);background:none;border:none;cursor:pointer;padding:4px 8px;border-radius:6px;font-family:inherit">${tr('pdf.saveAsPdf')}</button>
-      <button id="pdf-close-btn" style="background:none;border:none;cursor:pointer;color:var(--text-faint);display:flex;padding:4px;border-radius:6px">
+      <button type="button" id="pdf-print-btn" style="display:flex;align-items:center;gap:5px;font-size:12px;font-weight:500;color:var(--text-muted);background:none;border:none;cursor:pointer;padding:4px 8px;border-radius:6px;font-family:inherit">${tr('pdf.saveAsPdf')}</button>
+      <button type="button" id="pdf-close-btn" style="background:none;border:none;cursor:pointer;color:var(--text-faint);display:flex;padding:4px;border-radius:6px">
         <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
       </button>
     </div>

client/src/components/Packing/ApplyTemplateButton.tsx

@@ -59,7 +59,7 @@ export default function ApplyTemplateButton({ tripId, visibility, style, classNa
 
   return (
     <div ref={dropRef} style={{ position: 'relative' }}>
-      <button
+      <button type="button"
         onClick={() => setOpen(v => !v)}
         disabled={applying}
         className={className ?? 'hover:opacity-[0.88]'}
@@ -79,7 +79,7 @@ export default function ApplyTemplateButton({ tripId, visibility, style, classNa
           }}
         >
           {templates.map(tmpl => (
-            <button key={tmpl.id} onClick={() => handleApply(tmpl.id)}
+            <button type="button" key={tmpl.id} onClick={() => handleApply(tmpl.id)}
               style={{
                 display: 'flex', alignItems: 'center', gap: 8, width: '100%',
                 padding: '8px 12px', borderRadius: 8, border: 'none', cursor: 'pointer',

client/src/components/Packing/PackingListPanelBagCard.tsx

@@ -79,13 +79,13 @@ export function BagCard({ bag, bagItems, totalWeight, pct, tripId, tripMembers,
               / {(bag.weight_limit_grams / 1000).toFixed(1)} kg
             </span>
           ) : canEdit ? (
-            <button onClick={() => setEditingLimit(true)} title={t('packing.bagLimit')}
+            <button type="button" onClick={() => setEditingLimit(true)} title={t('packing.bagLimit')}
               style={{ background: 'none', border: 'none', padding: 0, cursor: 'pointer', color: 'var(--text-faint)', fontSize: sz.count, fontFamily: 'inherit', textDecoration: 'underline dotted' }}>
               {t('packing.setBagLimit')}
             </button>
           ) : null}
         </span>
-        {canEdit && <button onClick={onDelete} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: 'var(--text-faint)', display: 'flex' }}><X size={sz.icon} /></button>}
+        {canEdit && <button type="button" onClick={onDelete} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: 'var(--text-faint)', display: 'flex' }}><X size={sz.icon} /></button>}
       </div>
       {/* Members */}
       <div style={{ display: 'flex', alignItems: 'center', gap: 4, marginBottom: 4, flexWrap: 'wrap', position: 'relative' }}>
@@ -101,7 +101,7 @@ export function BagCard({ bag, bagItems, totalWeight, pct, tripId, tripMembers,
           </span>
         ))}
         {canEdit && (
-          <button onClick={() => setShowUserPicker(v => !v)} style={{ width: sz.avatar, height: sz.avatar, borderRadius: '50%', border: '1.5px dashed var(--border-primary)', background: 'none', color: 'var(--text-faint)', cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 0, boxSizing: 'border-box' }}>
+          <button type="button" onClick={() => setShowUserPicker(v => !v)} style={{ width: sz.avatar, height: sz.avatar, borderRadius: '50%', border: '1.5px dashed var(--border-primary)', background: 'none', color: 'var(--text-faint)', cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 0, boxSizing: 'border-box' }}>
             <Plus size={sz.avatar * 0.5} />
           </button>
         )}
@@ -110,7 +110,7 @@ export function BagCard({ bag, bagItems, totalWeight, pct, tripId, tripMembers,
             {tripMembers.map(m => {
               const isSelected = memberIds.includes(m.id)
               return (
-                <button key={m.id} onClick={() => { toggleMember(m.id); }}
+                <button type="button" key={m.id} onClick={() => { toggleMember(m.id); }}
                   style={{ display: 'flex', alignItems: 'center', gap: 8, width: '100%', padding: '6px 10px', borderRadius: 6, border: 'none', background: isSelected ? 'var(--bg-tertiary)' : 'transparent', cursor: 'pointer', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-primary)', fontFamily: 'inherit' }}
                   onMouseEnter={e => { if (!isSelected) e.currentTarget.style.background = 'var(--bg-secondary)' }}
                   onMouseLeave={e => { if (!isSelected) e.currentTarget.style.background = 'transparent' }}>
@@ -128,7 +128,7 @@ export function BagCard({ bag, bagItems, totalWeight, pct, tripId, tripMembers,
             })}
             {tripMembers.length === 0 && <div style={{ padding: '8px 10px', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)' }}>{t('packing.noMembers')}</div>}
             <div style={{ borderTop: '1px solid var(--border-secondary)', marginTop: 4, paddingTop: 4 }}>
-              <button onClick={() => setShowUserPicker(false)} style={{ width: '100%', padding: '6px 10px', borderRadius: 6, border: 'none', background: 'transparent', cursor: 'pointer', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', fontFamily: 'inherit', textAlign: 'center' }}>
+              <button type="button" onClick={() => setShowUserPicker(false)} style={{ width: '100%', padding: '6px 10px', borderRadius: 6, border: 'none', background: 'transparent', cursor: 'pointer', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', fontFamily: 'inherit', textAlign: 'center' }}>
                 {t('common.close')}
               </button>
             </div>

client/src/components/Packing/PackingListPanelBagModal.tsx

@@ -20,7 +20,7 @@ export function BagModal(S: PackingState) {
         onClick={e => e.stopPropagation()}>
         <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 16 }}>
           <h3 style={{ margin: 0, fontSize: 'calc(16px * var(--fs-scale-subtitle, 1))', fontWeight: 700, color: 'var(--text-primary)' }}>{t('packing.bags')}</h3>
-          <button onClick={() => setShowBagModal(false)} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex' }}><X size={18} /></button>
+          <button type="button" onClick={() => setShowBagModal(false)} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-faint)', display: 'flex' }}><X size={18} /></button>
         </div>
 
         {bags.map(bag => {
@@ -66,13 +66,13 @@ export function BagModal(S: PackingState) {
               onKeyDown={e => { if (e.key === 'Enter') handleCreateBag(); if (e.key === 'Escape') { setShowAddBag(false); setNewBagName('') } }}
               placeholder={t('packing.bagName')}
               style={{ flex: 1, padding: '8px 12px', borderRadius: 10, border: '1px solid var(--border-primary)', fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontFamily: 'inherit', outline: 'none' }} />
-            <button onClick={handleCreateBag} disabled={!newBagName.trim()}
+            <button type="button" onClick={handleCreateBag} disabled={!newBagName.trim()}
               style={{ padding: '8px 12px', borderRadius: 10, border: 'none', background: newBagName.trim() ? 'var(--text-primary)' : 'var(--border-primary)', color: 'var(--bg-primary)', cursor: newBagName.trim() ? 'pointer' : 'default', display: 'flex', alignItems: 'center' }}>
               <Plus size={14} />
             </button>
           </div>
         ) : (
-          <button onClick={() => setShowAddBag(true)}
+          <button type="button" onClick={() => setShowAddBag(true)}
             style={{ display: 'flex', alignItems: 'center', gap: 6, marginTop: 14, padding: '9px 14px', borderRadius: 10, border: '1px dashed var(--border-primary)', background: 'none', cursor: 'pointer', fontSize: 'calc(13px * var(--fs-scale-body, 1))', color: 'var(--text-faint)', fontFamily: 'inherit', width: '100%', transition: 'all 0.15s' }}
             onMouseEnter={e => { e.currentTarget.style.borderColor = 'var(--text-muted)'; e.currentTarget.style.color = 'var(--text-secondary)' }}
             onMouseLeave={e => { e.currentTarget.style.borderColor = 'var(--border-primary)'; e.currentTarget.style.color = 'var(--text-faint)' }}>

client/src/components/Packing/PackingListPanelBagSidebar.tsx

@@ -62,12 +62,12 @@ export function BagSidebar(S: PackingState) {
             onKeyDown={e => { if (e.key === 'Enter') handleCreateBag(); if (e.key === 'Escape') { setShowAddBag(false); setNewBagName('') } }}
             placeholder={t('packing.bagName')}
             style={{ flex: 1, padding: '5px 8px', borderRadius: 8, border: '1px solid var(--border-primary)', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', fontFamily: 'inherit', outline: 'none' }} />
-          <button onClick={handleCreateBag} style={{ padding: '4px 8px', borderRadius: 8, border: 'none', background: 'var(--text-primary)', color: 'var(--bg-primary)', cursor: 'pointer', display: 'flex', alignItems: 'center' }}>
+          <button type="button" onClick={handleCreateBag} style={{ padding: '4px 8px', borderRadius: 8, border: 'none', background: 'var(--text-primary)', color: 'var(--bg-primary)', cursor: 'pointer', display: 'flex', alignItems: 'center' }}>
             <Plus size={12} />
           </button>
         </div>
       ) : (
-        <button onClick={() => setShowAddBag(true)}
+        <button type="button" onClick={() => setShowAddBag(true)}
           style={{ display: 'flex', alignItems: 'center', gap: 4, marginTop: 12, padding: '5px 8px', borderRadius: 8, border: '1px dashed var(--border-primary)', background: 'none', cursor: 'pointer', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', fontFamily: 'inherit', width: '100%' }}>
           <Plus size={11} /> {t('packing.addBag')}
         </button>

client/src/components/Packing/PackingListPanelCategoryGroup.tsx

@@ -115,7 +115,7 @@ export function KategorieGruppe({ kategorie, items, tripId, allCategories, onRen
   return (
     <div style={{ marginBottom: 6, background: 'var(--bg-card)', borderRadius: 14, border: '1px solid var(--border-secondary)', overflow: 'visible' }}>
       <div style={{ display: 'flex', alignItems: 'center', gap: 8, padding: '10px 12px', borderBottom: offen ? '1px solid var(--border-secondary)' : 'none' }}>
-        <button onClick={() => setOffen(o => !o)} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex', color: 'var(--text-faint)', flexShrink: 0 }}>
+        <button type="button" onClick={() => setOffen(o => !o)} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex', color: 'var(--text-faint)', flexShrink: 0 }}>
           {offen ? <ChevronDown size={15} /> : <ChevronRight size={15} />}
         </button>
 
@@ -165,7 +165,7 @@ export function KategorieGruppe({ kategorie, items, tripId, allCategories, onRen
           ))}
           {canEdit && (
           <div ref={assigneeDropdownRef} style={{ position: 'relative' }}>
-            <button onClick={e => { e.stopPropagation(); setShowAssigneeDropdown(v => !v) }}
+            <button type="button" onClick={e => { e.stopPropagation(); setShowAssigneeDropdown(v => !v) }}
               style={{
                 width: 20, height: 20, borderRadius: '50%', border: '1.5px dashed var(--border-primary)',
                 background: 'none', cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center',
@@ -185,7 +185,7 @@ export function KategorieGruppe({ kategorie, items, tripId, allCategories, onRen
                 {tripMembers.map(m => {
                   const isAssigned = assignees.some(a => a.user_id === m.id)
                   return (
-                    <button key={m.id} onClick={e => {
+                    <button type="button" key={m.id} onClick={e => {
                       e.stopPropagation()
                       const newIds = isAssigned
                         ? assignees.filter(a => a.user_id !== m.id).map(a => a.user_id)
@@ -236,7 +236,7 @@ export function KategorieGruppe({ kategorie, items, tripId, allCategories, onRen
         </span>
 
         <div style={{ position: 'relative' }}>
-          <button ref={menuBtnRef} onClick={() => setShowMenu(m => !m)} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '2px 4px', borderRadius: 6, display: 'flex', color: 'var(--text-faint)' }}
+          <button type="button" ref={menuBtnRef} onClick={() => setShowMenu(m => !m)} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '2px 4px', borderRadius: 6, display: 'flex', color: 'var(--text-faint)' }}
             onMouseEnter={e => e.currentTarget.style.color = 'var(--text-secondary)'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
             <MoreHorizontal size={15} />
           </button>
@@ -300,18 +300,18 @@ export function KategorieGruppe({ kategorie, items, tripId, allCategories, onRen
                 style={{ flex: 1, padding: '6px 10px', borderRadius: 8, border: '1px solid var(--border-primary)', fontSize: 'calc(12.5px * var(--fs-scale-body, 1))', fontFamily: 'inherit', outline: 'none', color: 'var(--text-primary)', background: 'var(--bg-input)' }}
               />
               {/* disabled while the field is empty, so no extra guard here */}
-              <button onClick={() => { onAddItem(kategorie, newItemName.trim()); setNewItemName(''); setTimeout(() => addItemRef.current?.focus(), 30) }}
+              <button type="button" onClick={() => { onAddItem(kategorie, newItemName.trim()); setNewItemName(''); setTimeout(() => addItemRef.current?.focus(), 30) }}
                 disabled={!newItemName.trim()}
                 style={{ padding: '5px 8px', borderRadius: 8, border: 'none', background: newItemName.trim() ? 'var(--text-primary)' : 'var(--border-primary)', color: 'var(--bg-primary)', cursor: newItemName.trim() ? 'pointer' : 'default', display: 'flex' }}>
                 <Plus size={14} />
               </button>
-              <button onClick={() => { setShowAddItem(false); setNewItemName('') }}
+              <button type="button" onClick={() => { setShowAddItem(false); setNewItemName('') }}
                 style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, display: 'flex', color: 'var(--text-faint)' }}>
                 <X size={14} />
               </button>
             </div>
           ) : (
-            <button onClick={() => { setShowAddItem(true); setTimeout(() => addItemRef.current?.focus(), 30) }}
+            <button type="button" onClick={() => { setShowAddItem(true); setTimeout(() => addItemRef.current?.focus(), 30) }}
               style={{ display: 'flex', alignItems: 'center', gap: 5, padding: '5px 10px', margin: '2px 4px', borderRadius: 8, border: 'none', background: 'none', cursor: 'pointer', fontSize: 'calc(12px * var(--fs-scale-body, 1))', color: 'var(--text-faint)', fontFamily: 'inherit' }}
               onMouseEnter={e => e.currentTarget.style.color = 'var(--text-secondary)'}
               onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
@@ -333,7 +333,7 @@ interface MenuItemProps {
 
 function MenuItem({ icon, label, onClick, danger = false }: MenuItemProps) {
   return (
-    <button onClick={onClick} style={{
+    <button type="button" onClick={onClick} style={{
       display: 'flex', alignItems: 'center', gap: 8, width: '100%',
       padding: '7px 10px', background: 'none', border: 'none', cursor: 'pointer',
       fontSize: 'calc(12.5px * var(--fs-scale-body, 1))', fontFamily: 'inherit', borderRadius: 7, textAlign: 'left',

client/src/components/Packing/PackingListPanelHeader.tsx

@@ -36,12 +36,12 @@ export function PackingHeader(S: PackingState) {
                 placeholder={t('packing.templateName')}
                 style={{ fontSize: 'calc(12px * var(--fs-scale-body, 1))', padding: '5px 10px', borderRadius: 99, border: '1px solid var(--border-primary)', outline: 'none', fontFamily: 'inherit', width: 140, background: 'var(--bg-card)', color: 'var(--text-primary)' }}
               />
-              <button onClick={handleSaveAsTemplate} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: '#10b981' }}><Check size={14} /></button>
-              <button onClick={() => { setShowSaveTemplate(false); setSaveTemplateName('') }} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: 'var(--text-faint)' }}><X size={14} /></button>
+              <button type="button" onClick={handleSaveAsTemplate} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: '#10b981' }}><Check size={14} /></button>
+              <button type="button" onClick={() => { setShowSaveTemplate(false); setSaveTemplateName('') }} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: 'var(--text-faint)' }}><X size={14} /></button>
             </div>
           )}
           {inlineHeader && canEdit && (
-            <button onClick={() => setShowImportModal(true)} style={{
+            <button type="button" onClick={() => setShowImportModal(true)} style={{
               display: 'flex', alignItems: 'center', gap: 5, padding: '5px 11px', borderRadius: 99,
               border: '1px solid var(--border-primary)', fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 500, cursor: 'pointer',
               fontFamily: 'inherit', background: 'var(--bg-card)', color: 'var(--text-muted)',
@@ -50,7 +50,7 @@ export function PackingHeader(S: PackingState) {
             </button>
           )}
           {inlineHeader && canEdit && abgehakt > 0 && (
-            <button onClick={handleClearChecked} style={{
+            <button type="button" onClick={handleClearChecked} style={{
               fontSize: 'calc(11.5px * var(--fs-scale-caption, 1))', padding: '5px 10px', borderRadius: 99, border: '1px solid rgba(239,68,68,0.3)',
               background: 'rgba(239,68,68,0.1)', color: '#ef4444', cursor: 'pointer', fontFamily: 'inherit',
             }}>
@@ -60,7 +60,7 @@ export function PackingHeader(S: PackingState) {
           )}
           {inlineHeader && canEdit && availableTemplates.length > 0 && (
             <div ref={templateDropdownRef} style={{ position: 'relative' }}>
-              <button onClick={() => setShowTemplateDropdown(v => !v)} disabled={applyingTemplate} style={{
+              <button type="button" onClick={() => setShowTemplateDropdown(v => !v)} disabled={applyingTemplate} style={{
                 display: 'flex', alignItems: 'center', gap: 5, padding: '5px 11px', borderRadius: 99,
                 border: '1px solid', fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 500, cursor: 'pointer', fontFamily: 'inherit',
                 background: showTemplateDropdown ? 'var(--text-primary)' : 'var(--bg-card)',
@@ -76,7 +76,7 @@ export function PackingHeader(S: PackingState) {
                   boxShadow: '0 4px 16px rgba(0,0,0,0.12)', padding: 4, minWidth: 200,
                 }}>
                   {availableTemplates.map(tmpl => (
-                    <button key={tmpl.id} onClick={() => handleApplyTemplate(tmpl.id)}
+                    <button type="button" key={tmpl.id} onClick={() => handleApplyTemplate(tmpl.id)}
                       style={{
                         display: 'flex', alignItems: 'center', gap: 8, width: '100%',
                         padding: '8px 12px', borderRadius: 8, border: 'none', cursor: 'pointer',
@@ -98,7 +98,7 @@ export function PackingHeader(S: PackingState) {
             </div>
           )}
           {inlineHeader && canEdit && isAdmin && items.length > 0 && !showSaveTemplate && (
-            <button onClick={() => setShowSaveTemplate(true)} style={{
+            <button type="button" onClick={() => setShowSaveTemplate(true)} style={{
               display: 'flex', alignItems: 'center', gap: 5, padding: '5px 11px', borderRadius: 99,
               border: '1px solid var(--border-primary)', fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 500, cursor: 'pointer', fontFamily: 'inherit',
               background: 'var(--bg-card)', color: 'var(--text-muted)',
@@ -107,7 +107,7 @@ export function PackingHeader(S: PackingState) {
             </button>
           )}
           {bagTrackingEnabled && (
-            <button onClick={() => setShowBagModal(true)} className="xl:!hidden"
+            <button type="button" onClick={() => setShowBagModal(true)} className="xl:!hidden"
               style={{
                 display: 'flex', alignItems: 'center', gap: 5, padding: '5px 11px', borderRadius: 99,
                 border: '1px solid', fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 500, cursor: 'pointer', fontFamily: 'inherit',
@@ -197,17 +197,17 @@ export function PackingHeader(S: PackingState) {
             placeholder={t('packing.newCategoryPlaceholder')}
             style={{ flex: 1, padding: '8px 12px', borderRadius: 10, border: '1px solid var(--border-primary)', fontSize: 'calc(13.5px * var(--fs-scale-body, 1))', fontFamily: 'inherit', outline: 'none', color: 'var(--text-primary)' }}
           />
-          <button onClick={handleAddNewCategory} disabled={!newCatName.trim()}
+          <button type="button" onClick={handleAddNewCategory} disabled={!newCatName.trim()}
             style={{ padding: '8px 12px', borderRadius: 10, border: 'none', background: newCatName.trim() ? 'var(--text-primary)' : 'var(--border-primary)', color: 'var(--bg-primary)', cursor: newCatName.trim() ? 'pointer' : 'default', display: 'flex', alignItems: 'center' }}>
             <Check size={16} />
           </button>
-          <button onClick={() => { setAddingCategory(false); setNewCatName('') }}
+          <button type="button" onClick={() => { setAddingCategory(false); setNewCatName('') }}
             style={{ padding: '8px 12px', borderRadius: 10, border: '1px solid var(--border-primary)', background: 'none', cursor: 'pointer', display: 'flex', alignItems: 'center', color: 'var(--text-faint)' }}>
             <X size={16} />
           </button>
         </div>
       ) : (
-        <button onClick={() => setAddingCategory(true)}
+        <button type="button" onClick={() => setAddingCategory(true)}
           style={{ display: 'flex', alignItems: 'center', gap: 6, width: '100%', padding: '9px 14px', borderRadius: 10, border: '1px dashed var(--border-primary)', background: 'none', cursor: 'pointer', fontSize: 'calc(13px * var(--fs-scale-body, 1))', color: 'var(--text-faint)', fontFamily: 'inherit', transition: 'all 0.15s' }}
           onMouseEnter={e => { e.currentTarget.style.borderColor = 'var(--text-muted)'; e.currentTarget.style.color = 'var(--text-secondary)' }}
           onMouseLeave={e => { e.currentTarget.style.borderColor = 'var(--border-primary)'; e.currentTarget.style.color = 'var(--text-faint)' }}>

client/src/components/Packing/PackingListPanelImportModal.tsx

@@ -43,7 +43,7 @@ export function BulkImportModal(S: PackingState) {
         <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
           <div>
             <input ref={csvInputRef} type="file" accept=".csv,.txt" style={{ display: 'none' }} onChange={handleCsvFile} />
-            <button onClick={() => csvInputRef.current?.click()} style={{
+            <button type="button" onClick={() => csvInputRef.current?.click()} style={{
               display: 'flex', alignItems: 'center', gap: 5, padding: '5px 10px',
               border: '1px dashed var(--border-primary)', borderRadius: 8, background: 'none',
               fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', cursor: 'pointer', fontFamily: 'inherit',
@@ -52,11 +52,11 @@ export function BulkImportModal(S: PackingState) {
             </button>
           </div>
           <div style={{ display: 'flex', gap: 8 }}>
-            <button onClick={() => setShowImportModal(false)} style={{
+            <button type="button" onClick={() => setShowImportModal(false)} style={{
               fontSize: 'calc(12px * var(--fs-scale-body, 1))', background: 'none', border: '1px solid var(--border-primary)',
               borderRadius: 8, padding: '6px 14px', cursor: 'pointer', color: 'var(--text-muted)', fontFamily: 'inherit',
             }}>{t('common.cancel')}</button>
-            <button onClick={handleBulkImport} disabled={!importText.trim()} style={{
+            <button type="button" onClick={handleBulkImport} disabled={!importText.trim()} style={{
               fontSize: 'calc(12px * var(--fs-scale-body, 1))', background: 'var(--accent)', color: 'var(--accent-text)',
               border: 'none', borderRadius: 8, padding: '6px 16px', cursor: 'pointer', fontWeight: 600,
               fontFamily: 'inherit', opacity: importText.trim() ? 1 : 0.5,

client/src/components/Packing/PackingListPanelItemRow.tsx

@@ -122,7 +122,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
           <GripVertical size={13} />
         </div>
       )}
-      <button onClick={handleToggle} style={{
+      <button type="button" onClick={handleToggle} style={{
         flexShrink: 0, background: 'none', border: 'none', cursor: 'pointer', padding: 0, position: 'relative',
         width: 18, height: 18,
         color: item.checked ? '#10b981' : 'var(--text-faint)',
@@ -200,7 +200,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
               readOnly={!canEdit}
               onValueChange={async raw => {
                 if (!canEdit) return
-                const v = raw === '' ? null : parseInt(raw)
+                const v = raw === '' ? null : Number.parseInt(raw)
                 try { await updatePackingItem(tripId, item.id, { weight_grams: v }) } catch { toast.error(t('packing.toast.saveError')) }
               }}
               placeholder="—"
@@ -209,7 +209,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
             <span style={{ fontSize: 'calc(10px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', userSelect: 'none' }}>g</span>
           </div>
           <div style={{ position: 'relative' }}>
-            <button
+            <button type="button"
               onClick={() => canEdit && setShowBagPicker(p => !p)}
               style={{
                 width: 22, height: 22, borderRadius: '50%', cursor: canEdit ? 'pointer' : 'default', padding: 0, display: 'flex', alignItems: 'center', justifyContent: 'center',
@@ -226,14 +226,14 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
                 boxShadow: '0 4px 16px rgba(0,0,0,0.12)', padding: 4, minWidth: 160,
               }}>
                 {item.bag_id && (
-                  <button onClick={async () => { setShowBagPicker(false); try { await updatePackingItem(tripId, item.id, { bag_id: null }) } catch { toast.error(t('packing.toast.saveError')) } }}
+                  <button type="button" onClick={async () => { setShowBagPicker(false); try { await updatePackingItem(tripId, item.id, { bag_id: null }) } catch { toast.error(t('packing.toast.saveError')) } }}
                     style={{ display: 'flex', alignItems: 'center', gap: 7, width: '100%', padding: '6px 10px', background: 'none', border: 'none', cursor: 'pointer', fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontFamily: 'inherit', color: 'var(--text-faint)', borderRadius: 7 }}>
                     <span style={{ width: 10, height: 10, borderRadius: '50%', border: '2px dashed var(--border-primary)' }} />
                     {t('packing.noBag')}
                   </button>
                 )}
                 {bags.map(b => (
-                  <button key={b.id} onClick={async () => { setShowBagPicker(false); try { await updatePackingItem(tripId, item.id, { bag_id: b.id }) } catch { toast.error(t('packing.toast.saveError')) } }}
+                  <button type="button" key={b.id} onClick={async () => { setShowBagPicker(false); try { await updatePackingItem(tripId, item.id, { bag_id: b.id }) } catch { toast.error(t('packing.toast.saveError')) } }}
                     style={{
                       display: 'flex', alignItems: 'center', gap: 7, width: '100%', padding: '6px 10px',
                       background: item.bag_id === b.id ? 'var(--bg-tertiary)' : 'none',
@@ -260,7 +260,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
                         }}
                         placeholder={t('packing.bagName')}
                         style={{ flex: 1, padding: '4px 8px', borderRadius: 6, border: '1px solid var(--border-primary)', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', fontFamily: 'inherit', outline: 'none' }} />
-                      <button onClick={async () => {
+                      <button type="button" onClick={async () => {
                         if (bagInlineName.trim()) {
                           const newBag = await onCreateBag(bagInlineName.trim())
                           if (newBag) { try { await updatePackingItem(tripId, item.id, { bag_id: newBag.id }) } catch { toast.error(t('packing.toast.saveError')) } }
@@ -272,7 +272,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
                       </button>
                     </div>
                   ) : (
-                    <button onClick={() => setBagInlineCreate(true)}
+                    <button type="button" onClick={() => setBagInlineCreate(true)}
                       style={{ display: 'flex', alignItems: 'center', gap: 5, width: '100%', padding: '5px 6px', background: 'none', border: 'none', cursor: 'pointer', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', fontFamily: 'inherit', color: 'var(--text-faint)', borderRadius: 7 }}
                       onMouseEnter={e => e.currentTarget.style.color = 'var(--text-secondary)'}
                       onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
@@ -290,7 +290,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
       {canEdit && (
       <div className="packing-row-inline-actions" style={{ display: 'flex', gap: 2, alignItems: 'center', flexShrink: 0 }}>
         <div style={{ position: 'relative' }}>
-          <button
+          <button type="button"
             onClick={() => setShowCatPicker(p => !p)}
             title={t('packing.changeCategory')}
             style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '3px 5px', borderRadius: 6, display: 'flex', alignItems: 'center', color: 'var(--text-faint)', fontSize: 'calc(10px * var(--fs-scale-caption, 1))', gap: 2 }}
@@ -304,7 +304,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
               padding: 4, minWidth: 140,
             }}>
               {categories.map(cat => (
-                <button key={cat} onClick={() => handleCatChange(cat)} style={{
+                <button type="button" key={cat} onClick={() => handleCatChange(cat)} style={{
                   display: 'flex', alignItems: 'center', gap: 7, width: '100%',
                   padding: '6px 10px', background: cat === (item.category || t('packing.defaultCategory')) ? 'var(--bg-tertiary)' : 'none',
                   border: 'none', cursor: 'pointer', fontSize: 'calc(12.5px * var(--fs-scale-body, 1))', fontFamily: 'inherit',
@@ -330,12 +330,12 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
           />
         )}
 
-        <button onClick={() => setEditing(true)} title={t('common.rename')} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '3px 4px', borderRadius: 6, display: 'flex', color: 'var(--text-faint)' }}
+        <button type="button" onClick={() => setEditing(true)} title={t('common.rename')} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '3px 4px', borderRadius: 6, display: 'flex', color: 'var(--text-faint)' }}
           onMouseEnter={e => e.currentTarget.style.color = 'var(--text-secondary)'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
           <Pencil size={13} />
         </button>
 
-        <button onClick={handleDelete} title={t('common.delete')} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '3px 4px', borderRadius: 6, display: 'flex', color: 'var(--text-faint)' }}
+        <button type="button" onClick={handleDelete} title={t('common.delete')} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '3px 4px', borderRadius: 6, display: 'flex', color: 'var(--text-faint)' }}
           onMouseEnter={e => e.currentTarget.style.color = '#ef4444'} onMouseLeave={e => e.currentTarget.style.color = 'var(--text-faint)'}>
           <Trash2 size={13} />
         </button>
@@ -344,7 +344,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
 
       {canEdit && (
         <div className="packing-row-overflow" style={{ display: 'none', flexShrink: 0, position: 'relative' }}>
-          <button
+          <button type="button"
             ref={itemMenuBtnRef}
             onClick={() => setShowItemMenu(m => !m)}
             title={t('common.showMore')}
@@ -386,7 +386,7 @@ export function ArtikelZeile({ item, tripId, categories, onCategoryChange: _onCa
                             value={item.weight_grams ?? ''}
                             readOnly={!canEdit}
                             onValueChange={async raw => {
-                              const v = raw === '' ? null : parseInt(raw)
+                              const v = raw === '' ? null : Number.parseInt(raw)
                               try { await updatePackingItem(tripId, item.id, { weight_grams: v }) } catch { toast.error(t('packing.toast.saveError')) }
                             }}
                             placeholder="—"
@@ -459,7 +459,7 @@ interface OverflowMenuItemProps {
 
 function OverflowMenuItem({ icon, label, onClick, active = false, danger = false }: OverflowMenuItemProps) {
   return (
-    <button
+    <button type="button"
       onClick={onClick}
       style={{
         display: 'flex', alignItems: 'center', gap: 8, width: '100%',

client/src/components/Packing/PackingShareControl.tsx

@@ -49,7 +49,7 @@ export default function PackingShareControl({ item, tripMembers, currentUserId,
   }
 
   const btn = (onClick: () => void, title: string, active: boolean, node: React.ReactNode) => (
-    <button onClick={onClick} title={title}
+    <button type="button" onClick={onClick} title={title}
       style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '3px 4px', borderRadius: 6, display: 'flex', color: active ? 'var(--accent)' : 'var(--text-faint)' }}
       onMouseEnter={e => { if (!active) e.currentTarget.style.color = 'var(--text-secondary)' }}
       onMouseLeave={e => { if (!active) e.currentTarget.style.color = 'var(--text-faint)' }}>
@@ -72,7 +72,7 @@ export default function PackingShareControl({ item, tripMembers, currentUserId,
 
   return (
     <div style={{ display: 'flex' }}>
-      <button ref={btnRef} onClick={toggle} title={t('packing.share')}
+      <button type="button" ref={btnRef} onClick={toggle} title={t('packing.share')}
         style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '3px 4px', borderRadius: 6, display: 'flex', color: visibility !== 'common' ? 'var(--accent)' : 'var(--text-faint)' }}
         onMouseEnter={e => { if (visibility === 'common') e.currentTarget.style.color = 'var(--text-secondary)' }}
         onMouseLeave={e => { if (visibility === 'common') e.currentTarget.style.color = 'var(--text-faint)' }}>
@@ -97,7 +97,7 @@ export default function PackingShareControl({ item, tripMembers, currentUserId,
             ) : others.map(m => {
               const on = recipientIds.includes(m.id)
               return (
-                <button key={m.id} onClick={() => toggleRecipient(m.id)}
+                <button type="button" key={m.id} onClick={() => toggleRecipient(m.id)}
                   style={{ display: 'flex', alignItems: 'center', gap: 8, width: '100%', padding: '6px 10px', borderRadius: 7, border: 'none', cursor: 'pointer', background: 'none', fontFamily: 'inherit', fontSize: 'calc(12px * var(--fs-scale-body, 1))', color: 'var(--text-primary)' }}
                   onMouseEnter={e => e.currentTarget.style.background = 'var(--bg-tertiary)'}
                   onMouseLeave={e => e.currentTarget.style.background = 'none'}>
@@ -117,7 +117,7 @@ export default function PackingShareControl({ item, tripMembers, currentUserId,
 
 function Row({ icon, label, sub, active, onClick }: { icon: React.ReactNode; label: string; sub: string; active: boolean; onClick: () => void }) {
   return (
-    <button onClick={onClick}
+    <button type="button" onClick={onClick}
       style={{ display: 'flex', alignItems: 'flex-start', gap: 8, width: '100%', padding: '7px 10px', borderRadius: 7, border: 'none', cursor: 'pointer', background: active ? 'var(--bg-tertiary)' : 'none', fontFamily: 'inherit', textAlign: 'left' }}
       onMouseEnter={e => { if (!active) e.currentTarget.style.background = 'var(--bg-tertiary)' }}
       onMouseLeave={e => { if (!active) e.currentTarget.style.background = 'none' }}>

client/src/components/Planner/AirTrailImportModal.tsx

@@ -236,7 +236,7 @@ export default function AirTrailImportModal({ isOpen, onClose, tripId, pushUndo
     const isSelected = selected.has(f.id)
     const label = f.flightNumber ? `${f.airline ? `${f.airline} ` : ''}${f.flightNumber}` : `${f.fromCode ?? '?'} → ${f.toCode ?? '?'}`
     return (
-      <button
+      <button type="button"
         key={f.id}
         onClick={() => !already && toggle(f.id)}
         disabled={already}
@@ -279,7 +279,7 @@ export default function AirTrailImportModal({ isOpen, onClose, tripId, pushUndo
     return (
       <div key={chainKey(chain)} style={{ border: '1px solid var(--border-primary)', borderRadius: 12, padding: '8px 8px 0', marginBottom: 8 }}>
         {chain.map(renderFlight)}
-        <button
+        <button type="button"
           onClick={() => toggleJoin(chain)}
           className="bg-transparent"
           style={{
@@ -327,7 +327,7 @@ export default function AirTrailImportModal({ isOpen, onClose, tripId, pushUndo
           <div style={{ flex: 1, fontSize: 'calc(15px * var(--fs-scale-subtitle, 1))', fontWeight: 700, color: 'var(--text-primary)' }}>
             {t('reservations.airtrail.title')}
           </div>
-          <button onClick={handleClose} className="bg-transparent text-content-faint" style={{ border: 'none', cursor: 'pointer', padding: 4, borderRadius: 6, display: 'flex', alignItems: 'center' }}>
+          <button type="button" onClick={handleClose} className="bg-transparent text-content-faint" style={{ border: 'none', cursor: 'pointer', padding: 4, borderRadius: 6, display: 'flex', alignItems: 'center' }}>
             <X size={16} />
           </button>
         </div>
@@ -371,13 +371,13 @@ export default function AirTrailImportModal({ isOpen, onClose, tripId, pushUndo
         </div>
 
         <div style={{ display: 'flex', gap: 8, justifyContent: 'flex-end', marginTop: 14, paddingTop: 14, borderTop: '1px solid var(--border-faint)' }}>
-          <button
+          <button type="button"
             onClick={handleClose}
             style={{ padding: '8px 16px', borderRadius: 10, border: '1px solid var(--border-primary)', background: 'none', color: 'var(--text-primary)', fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 500, cursor: 'pointer', fontFamily: 'inherit' }}
           >
             {t('common.cancel')}
           </button>
-          <button
+          <button type="button"
             onClick={handleImport}
             disabled={selectableCount === 0 || importing}
             className={selectableCount > 0 && !importing ? 'bg-accent text-accent-text' : 'bg-surface-tertiary text-content-faint'}

client/src/components/Planner/BookingImportModal.tsx

@@ -130,7 +130,7 @@ export default function BookingImportModal({ isOpen, onClose, tripId }: BookingI
           <div style={{ flex: 1, fontSize: 'calc(15px * var(--fs-scale-subtitle, 1))', fontWeight: 700, color: 'var(--text-primary)' }}>
             {t('reservations.import.title')}
           </div>
-          <button onClick={handleClose} className="bg-transparent text-content-faint" style={{ border: 'none', cursor: 'pointer', padding: 4, borderRadius: 6, display: 'flex', alignItems: 'center' }}>
+          <button type="button" onClick={handleClose} className="bg-transparent text-content-faint" style={{ border: 'none', cursor: 'pointer', padding: 4, borderRadius: 6, display: 'flex', alignItems: 'center' }}>
             <X size={16} />
           </button>
         </div>
@@ -184,13 +184,13 @@ export default function BookingImportModal({ isOpen, onClose, tripId }: BookingI
 
         {/* Footer */}
         <div style={{ display: 'flex', gap: 8, justifyContent: 'flex-end', marginTop: 14, paddingTop: 14, borderTop: '1px solid var(--border-faint)' }}>
-          <button
+          <button type="button"
             onClick={handleClose}
             style={{ padding: '8px 16px', borderRadius: 10, border: '1px solid var(--border-primary)', background: 'none', color: 'var(--text-primary)', fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 500, cursor: 'pointer', fontFamily: 'inherit' }}
           >
             {t('common.cancel')}
           </button>
-          <button
+          <button type="button"
             onClick={handleParse}
             disabled={files.length === 0 || loading}
             className={files.length > 0 && !loading ? 'bg-accent text-accent-text' : 'bg-surface-tertiary text-content-faint'}

client/src/components/Planner/DayDetailPanel.tsx

@@ -174,7 +174,7 @@ export default function DayDetailPanel({ day, days, places, categories = [], tri
                   {day.title || t('planner.dayN', { n: (days.indexOf(day) + 1) || '?' })}
                 </span>
                 {canEditDays && onUpdateDayTitle && (
-                  <button onClick={startRename} aria-label={t('common.edit')} title={t('common.edit')} className="text-content-faint" style={{ border: 'none', background: 'none', padding: 3, cursor: 'pointer', display: 'flex', flexShrink: 0 }}>
+                  <button type="button" onClick={startRename} aria-label={t('common.edit')} title={t('common.edit')} className="text-content-faint" style={{ border: 'none', background: 'none', padding: 3, cursor: 'pointer', display: 'flex', flexShrink: 0 }}>
                     <Pencil size={12} strokeWidth={1.8} />
                   </button>
                 )}
@@ -182,14 +182,14 @@ export default function DayDetailPanel({ day, days, places, categories = [], tri
             )}
             {!collapsed && formattedDate && <div className="text-content-muted" style={{ fontSize: 'calc(12px * var(--fs-scale-body, 1))', marginTop: 1 }}>{formattedDate}</div>}
           </div>
-          <button onClick={(e) => { e.stopPropagation(); toggleCollapse() }} title={collapsed ? t('common.expand') : t('common.collapse')}
+          <button type="button" onClick={(e) => { e.stopPropagation(); toggleCollapse() }} title={collapsed ? t('common.expand') : t('common.collapse')}
             className="bg-surface-secondary"
             style={{ border: 'none', borderRadius: 10, width: 32, height: 32, display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer', flexShrink: 0, transition: 'all 0.15s ease' }}
             onMouseEnter={e => e.currentTarget.style.background = 'var(--bg-hover)'}
             onMouseLeave={e => e.currentTarget.style.background = 'var(--bg-secondary)'}>
             {collapsed ? <ChevronsUp size={14} className="text-content-muted" /> : <ChevronsDown size={14} className="text-content-muted" />}
           </button>
-          <button onClick={(e) => { e.stopPropagation(); onClose() }} className="bg-surface-secondary" style={{ border: 'none', borderRadius: 10, width: 32, height: 32, display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer', flexShrink: 0 }}
+          <button type="button" onClick={(e) => { e.stopPropagation(); onClose() }} className="bg-surface-secondary" style={{ border: 'none', borderRadius: 10, width: 32, height: 32, display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer', flexShrink: 0 }}
             onMouseEnter={e => e.currentTarget.style.background = 'var(--bg-hover)'}
             onMouseLeave={e => e.currentTarget.style.background = 'var(--bg-secondary)'}>
             <X size={14} className="text-content-muted" />
@@ -409,11 +409,11 @@ function AccommodationList({ dayAccommodations, day, reservations, canEditDays,
                           <div style={{ fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontWeight: 600, color: 'var(--text-primary)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{acc.place_name}</div>
                           {acc.place_address && <div style={{ fontSize: 'calc(10px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{acc.place_address}</div>}
                         </div>
-                        {canEditDays && <button onClick={() => { setAccommodation(acc); setHotelForm({ check_in: acc.check_in || '', check_in_end: acc.check_in_end || '', check_out: acc.check_out || '', confirmation: acc.confirmation || '', place_id: acc.place_id }); setHotelDayRange({ start: acc.start_day_id, end: acc.end_day_id }); setShowHotelPicker('edit') }}
+                        {canEditDays && <button type="button" onClick={() => { setAccommodation(acc); setHotelForm({ check_in: acc.check_in || '', check_in_end: acc.check_in_end || '', check_out: acc.check_out || '', confirmation: acc.confirmation || '', place_id: acc.place_id }); setHotelDayRange({ start: acc.start_day_id, end: acc.end_day_id }); setShowHotelPicker('edit') }}
                           style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 3, flexShrink: 0 }}>
                           <Pencil size={12} style={{ color: 'var(--text-faint)' }} />
                         </button>}
-                        {canEditDays && <button onClick={() => { setAccommodation(acc); handleRemoveAccommodation() }} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 3, flexShrink: 0 }}>
+                        {canEditDays && <button type="button" onClick={() => { setAccommodation(acc); handleRemoveAccommodation() }} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 3, flexShrink: 0 }}>
                           <X size={12} style={{ color: 'var(--text-faint)' }} />
                         </button>}
                       </div>
@@ -468,7 +468,7 @@ function AccommodationList({ dayAccommodations, day, reservations, canEditDays,
                   )
                 })}
                 {/* Add another hotel */}
-                {canEditDays && <button onClick={() => setShowHotelPicker(true)} style={{
+                {canEditDays && <button type="button" onClick={() => setShowHotelPicker(true)} style={{
                   width: '100%', padding: 8, border: '1.5px dashed var(--border-primary)', borderRadius: 10,
                   background: 'none', cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 5,
                   fontSize: 'calc(10px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', fontFamily: 'inherit',
@@ -477,7 +477,7 @@ function AccommodationList({ dayAccommodations, day, reservations, canEditDays,
                 </button>}
               </div>
             ) : (
-              canEditDays ? <button onClick={() => setShowHotelPicker(true)} style={{
+              canEditDays ? <button type="button" onClick={() => setShowHotelPicker(true)} style={{
                 width: '100%', padding: 10, border: '1.5px dashed var(--border-primary)', borderRadius: 10,
                 background: 'none', cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 5,
                 fontSize: 'calc(11px * var(--fs-scale-caption, 1))', color: 'var(--text-faint)', fontFamily: 'inherit',
@@ -546,7 +546,7 @@ function HotelPickerModal({ showHotelPicker, setShowHotelPicker, font, t, hotelD
                   <div style={{ padding: '16px 18px 12px', borderBottom: '1px solid var(--border-faint)', display: 'flex', alignItems: 'center', gap: 10 }}>
                     <Hotel size={16} style={{ color: 'var(--text-primary)' }} />
                     <span style={{ fontSize: 'calc(14px * var(--fs-scale-body, 1))', fontWeight: 700, color: 'var(--text-primary)', flex: 1 }}>{showHotelPicker === 'edit' ? t('day.editAccommodation') : t('day.addAccommodation')}</span>
-                    <button onClick={() => setShowHotelPicker(false)} style={{ background: 'var(--bg-secondary)', border: 'none', borderRadius: 8, width: 28, height: 28, display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer' }}>
+                    <button type="button" onClick={() => setShowHotelPicker(false)} style={{ background: 'var(--bg-secondary)', border: 'none', borderRadius: 8, width: 28, height: 28, display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer' }}>
                       <X size={12} style={{ color: 'var(--text-muted)' }} />
                     </button>
                   </div>
@@ -584,7 +584,7 @@ function HotelPickerModal({ showHotelPicker, setShowHotelPicker, font, t, hotelD
                           size="sm"
                         />
                       </div>
-                      <button onClick={() => setHotelDayRange({ start: days[0]?.id, end: days[days.length - 1]?.id })} style={{
+                      <button type="button" onClick={() => setHotelDayRange({ start: days[0]?.id, end: days[days.length - 1]?.id })} style={{
                         padding: '6px 14px', borderRadius: 8, border: 'none', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', fontWeight: 600, cursor: 'pointer', flexShrink: 0,
                         background: hotelDayRange.start === days[0]?.id && hotelDayRange.end === days[days.length - 1]?.id ? 'var(--text-primary)' : 'var(--bg-card)',
                         color: hotelDayRange.start === days[0]?.id && hotelDayRange.end === days[days.length - 1]?.id ? 'var(--bg-card)' : 'var(--text-muted)',
@@ -618,14 +618,14 @@ function HotelPickerModal({ showHotelPicker, setShowHotelPicker, font, t, hotelD
                   {/* Category Filter */}
                   {categories.length > 0 && (
                     <div style={{ padding: '8px 18px', borderBottom: '1px solid var(--border-faint)', display: 'flex', gap: 4, flexWrap: 'wrap' }}>
-                      <button onClick={() => setHotelCategoryFilter('')} style={{
+                      <button type="button" onClick={() => setHotelCategoryFilter('')} style={{
                         padding: '3px 10px', borderRadius: 6, border: 'none', fontSize: 'calc(10px * var(--fs-scale-caption, 1))', fontWeight: 600, cursor: 'pointer',
                         background: !hotelCategoryFilter ? 'var(--text-primary)' : 'var(--bg-secondary)',
                         color: !hotelCategoryFilter ? 'var(--bg-card)' : 'var(--text-muted)',
                       }}>{t('day.allDays')}</button>
 
                       {categories.map(c => (
-                        <button key={c.id} onClick={() => setHotelCategoryFilter(c.id)} style={{
+                        <button type="button" key={c.id} onClick={() => setHotelCategoryFilter(c.id)} style={{
                           padding: '3px 10px', borderRadius: 6, border: 'none', fontSize: 'calc(10px * var(--fs-scale-caption, 1))', fontWeight: 600, cursor: 'pointer',
                           background: hotelCategoryFilter === c.id ? c.color || 'var(--text-primary)' : 'var(--bg-secondary)',
                           color: hotelCategoryFilter === c.id ? '#fff' : 'var(--text-muted)',
@@ -641,7 +641,7 @@ function HotelPickerModal({ showHotelPicker, setShowHotelPicker, font, t, hotelD
                       return filtered.length === 0 ? (
                         <div style={{ padding: 20, textAlign: 'center', fontSize: 'calc(12px * var(--fs-scale-body, 1))', color: 'var(--text-faint)' }}>{t('day.noPlacesForHotel')}</div>
                       ) : filtered.map(p => (
-                      <button key={p.id} onClick={() => handleSelectPlace(p.id)} style={{
+                      <button type="button" key={p.id} onClick={() => handleSelectPlace(p.id)} style={{
                         display: 'flex', alignItems: 'center', gap: 10, width: '100%', padding: '10px 18px',
                         border: 'none', borderBottom: '1px solid var(--border-faint)',
                         background: hotelForm.place_id === p.id ? 'var(--bg-hover)' : 'none',
@@ -671,10 +671,10 @@ function HotelPickerModal({ showHotelPicker, setShowHotelPicker, font, t, hotelD
 
                 {/* Save / Cancel */}
                 <div style={{ padding: '12px 18px', borderTop: '1px solid var(--border-faint)', display: 'flex', justifyContent: 'flex-end', gap: 8 }}>
-                  <button onClick={() => setShowHotelPicker(false)} style={{ padding: '7px 16px', borderRadius: 8, border: '1px solid var(--border-primary)', background: 'none', fontSize: 'calc(12px * var(--fs-scale-body, 1))', cursor: 'pointer', fontFamily: 'inherit', color: 'var(--text-muted)' }}>
+                  <button type="button" onClick={() => setShowHotelPicker(false)} style={{ padding: '7px 16px', borderRadius: 8, border: '1px solid var(--border-primary)', background: 'none', fontSize: 'calc(12px * var(--fs-scale-body, 1))', cursor: 'pointer', fontFamily: 'inherit', color: 'var(--text-muted)' }}>
                     {t('common.cancel')}
                   </button>
-                  <button onClick={() => { void saveHotelPicker() }} disabled={!hotelForm.place_id} style={{
+                  <button type="button" onClick={() => { void saveHotelPicker() }} disabled={!hotelForm.place_id} style={{
                     padding: '7px 20px', borderRadius: 8, border: 'none', fontSize: 'calc(12px * var(--fs-scale-body, 1))', fontWeight: 600, cursor: 'pointer', fontFamily: 'inherit',
                     background: hotelForm.place_id ? 'var(--text-primary)' : 'var(--bg-tertiary)',
                     color: hotelForm.place_id ? 'var(--bg-card)' : 'var(--text-faint)',

client/src/components/Planner/DayPlanSidebar.tsx

@@ -306,7 +306,7 @@ function useDayPlanSidebar(props: DayPlanSidebarProps) {
         assignmentId: dragDataRef.current.assignmentId || '',
         noteId: dragDataRef.current.noteId || '',
         reservationId: dragDataRef.current.reservationId || '',
-        fromDayId: parseInt(dragDataRef.current.fromDayId) || 0,
+        fromDayId: Number.parseInt(dragDataRef.current.fromDayId) || 0,
         phase: (dragDataRef.current.phase || 'single') as 'single' | 'start' | 'middle' | 'end',
       }
     }
@@ -990,7 +990,7 @@ function useDayPlanSidebar(props: DayPlanSidebarProps) {
       setDraggingId(null); setDropTargetKey(null); dragDataRef.current = null; window.__dragData = null; return
     }
     if (placeId) {
-      onAssignToDay?.(parseInt(placeId), dayId)
+      onAssignToDay?.(Number.parseInt(placeId), dayId)
     } else if (assignmentId && fromDayId !== dayId) {
       const srcAssignment = (useTripStore.getState().assignments[String(fromDayId)] || []).find(a => a.id === Number(assignmentId))
       const capturedFromDayId = fromDayId
@@ -1739,7 +1739,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                     )
                   })()
                 ) : (
-                  <button onClick={e => toggleDay(day.id, e)} className="text-content-faint" style={{ alignSelf: 'flex-start', flexShrink: 0, background: 'none', border: 'none', padding: 6, cursor: 'pointer', display: 'flex', alignItems: 'center' }}>
+                  <button type="button" onClick={e => toggleDay(day.id, e)} className="text-content-faint" style={{ alignSelf: 'flex-start', flexShrink: 0, background: 'none', border: 'none', padding: 6, cursor: 'pointer', display: 'flex', alignItems: 'center' }}>
                     {isExpanded ? <ChevronDown size={16} strokeWidth={1.8} /> : <ChevronRight size={16} strokeWidth={1.8} />}
                   </button>
                 )}
@@ -1765,7 +1765,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                       const toLegIndex = legPart ? Number(legPart.slice(3)) : null
 
                       if (placeId) {
-                        onAssignToDay?.(parseInt(placeId), day.id)
+                        onAssignToDay?.(Number.parseInt(placeId), day.id)
                       } else if (fromReservationId && fromDayId !== day.id) {
                         const r = reservations.find(x => x.id === Number(fromReservationId))
                         if (r) { const update = computeMultiDayMove(r, day.id, phase); tripActions.updateReservation(tripId, r.id, update).catch((err: unknown) => toast.error(err instanceof Error ? err.message : t('common.unknownError'))) }
@@ -1791,7 +1791,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                     }
                     if (!assignmentId && !noteId && !placeId) { dragDataRef.current = null; window.__dragData = null; return }
                     if (placeId) {
-                      onAssignToDay?.(parseInt(placeId), day.id)
+                      onAssignToDay?.(Number.parseInt(placeId), day.id)
                       setDropTargetKey(null); window.__dragData = null; return
                     }
                     if (assignmentId && fromDayId !== day.id) {
@@ -1909,7 +1909,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                               const { placeId, assignmentId: fromAssignmentId, noteId, reservationId: fromReservationId, fromDayId, phase } = getDragData(e)
                               if (placeId) {
                                 const pos = placeItems.findIndex(i => i.data.id === assignment.id)
-                                onAssignToDay?.(parseInt(placeId), day.id, pos >= 0 ? pos : undefined)
+                                onAssignToDay?.(Number.parseInt(placeId), day.id, pos >= 0 ? pos : undefined)
                                 setDropTargetKey(null); window.__dragData = null
                               } else if (fromReservationId && fromDayId !== day.id) {
                                 const r = reservations.find(x => x.id === Number(fromReservationId))
@@ -2154,15 +2154,15 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                               )}
                             </div>
                             {canEditDays && <div className="reorder-buttons" style={{ flexShrink: 0, display: 'flex', gap: 1, transition: 'opacity 0.15s' }}>
-                              <button onClick={moveUp} disabled={idx === 0} className={idx === 0 ? 'text-[var(--border-primary)]' : 'text-content-faint'} style={{ background: 'none', border: 'none', padding: '1px 2px', cursor: idx === 0 ? 'default' : 'pointer', display: 'flex', lineHeight: 1 }}>
+                              <button type="button" onClick={moveUp} disabled={idx === 0} className={idx === 0 ? 'text-[var(--border-primary)]' : 'text-content-faint'} style={{ background: 'none', border: 'none', padding: '1px 2px', cursor: idx === 0 ? 'default' : 'pointer', display: 'flex', lineHeight: 1 }}>
                                 <ChevronUp size={12} strokeWidth={2} />
                               </button>
-                              <button onClick={moveDown} disabled={idx === merged.length - 1} className={idx === merged.length - 1 ? 'text-[var(--border-primary)]' : 'text-content-faint'} style={{ background: 'none', border: 'none', padding: '1px 2px', cursor: idx === merged.length - 1 ? 'default' : 'pointer', display: 'flex', lineHeight: 1 }}>
+                              <button type="button" onClick={moveDown} disabled={idx === merged.length - 1} className={idx === merged.length - 1 ? 'text-[var(--border-primary)]' : 'text-content-faint'} style={{ background: 'none', border: 'none', padding: '1px 2px', cursor: idx === merged.length - 1 ? 'default' : 'pointer', display: 'flex', lineHeight: 1 }}>
                                 <ChevronDown size={12} strokeWidth={2} />
                               </button>
                             </div>}
                             {canEditDays && onAddBookingToAssignment && hoveredAssignmentId === assignment.id && (
-                              <button
+                              <button type="button"
                                 onClick={e => {
                                   e.stopPropagation()
                                   onAddBookingToAssignment(day.id, assignment.id)
@@ -2289,7 +2289,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                               const insertAfter = e.clientY > rect.top + rect.height / 2
                               const { placeId, assignmentId: fromAssignmentId, noteId, reservationId: fromReservationId, fromDayId, phase } = getDragData(e)
                               if (placeId) {
-                                onAssignToDay?.(parseInt(placeId), day.id)
+                                onAssignToDay?.(Number.parseInt(placeId), day.id)
                               } else if (fromReservationId && fromDayId !== day.id) {
                                 const r2 = reservations.find(x => x.id === Number(fromReservationId))
                                 if (r2) { const update = computeMultiDayMove(r2, day.id, phase); tripActions.updateReservation(tripId, r2.id, update).catch((err: unknown) => toast.error(err instanceof Error ? err.message : t('common.unknownError'))) }
@@ -2464,7 +2464,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                               const tm = getMergedItems(day.id)
                               const noteIdx = tm.findIndex(i => i.type === 'note' && i.data.id === note.id)
                               const pos = tm.slice(0, noteIdx).filter(i => i.type === 'place').length
-                              onAssignToDay?.(parseInt(placeId), day.id, pos)
+                              onAssignToDay?.(Number.parseInt(placeId), day.id, pos)
                               setDropTargetKey(null); window.__dragData = null
                             } else if (fromReservationId && fromDayId !== day.id) {
                               const r = reservations.find(x => x.id === Number(fromReservationId))
@@ -2549,12 +2549,12 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                             every note a shorter line for the whole time you are
                             not hovering. */}
                         {canEditDays && <div className="note-edit-buttons bg-surface-card" style={{ position: 'absolute', right: 5, top: '50%', transform: 'translateY(-50%)', display: 'flex', flexDirection: 'column', justifyContent: 'center', gap: 3, padding: 4, borderRadius: 999, border: '1px solid var(--border-faint)', boxShadow: '0 4px 14px rgba(0,0,0,0.10)', opacity: 0, transition: 'opacity 0.15s' }}>
-                          <button onClick={e => openEditNote(day.id, note, e)} aria-label={t('dayplan.noteEdit')} title={t('dayplan.noteEdit')} className="text-content-faint note-edit-btn" style={{ background: 'none', border: 'none', width: 30, height: 30, borderRadius: 999, cursor: 'pointer', display: 'grid', placeItems: 'center', padding: 0 }}><Pencil size={15} /></button>
-                          <button onClick={e => { e.stopPropagation(); setPendingDeleteNote({ dayId: day.id, noteId: note.id }) }} aria-label={t('dayplan.noteDelete')} title={t('dayplan.noteDelete')} className="text-content-faint note-edit-btn note-edit-btn-danger" style={{ background: 'none', border: 'none', width: 30, height: 30, borderRadius: 999, cursor: 'pointer', display: 'grid', placeItems: 'center', padding: 0 }}><Trash2 size={15} /></button>
+                          <button type="button" onClick={e => openEditNote(day.id, note, e)} aria-label={t('dayplan.noteEdit')} title={t('dayplan.noteEdit')} className="text-content-faint note-edit-btn" style={{ background: 'none', border: 'none', width: 30, height: 30, borderRadius: 999, cursor: 'pointer', display: 'grid', placeItems: 'center', padding: 0 }}><Pencil size={15} /></button>
+                          <button type="button" onClick={e => { e.stopPropagation(); setPendingDeleteNote({ dayId: day.id, noteId: note.id }) }} aria-label={t('dayplan.noteDelete')} title={t('dayplan.noteDelete')} className="text-content-faint note-edit-btn note-edit-btn-danger" style={{ background: 'none', border: 'none', width: 30, height: 30, borderRadius: 999, cursor: 'pointer', display: 'grid', placeItems: 'center', padding: 0 }}><Trash2 size={15} /></button>
                         </div>}
                         {canEditDays && <div className="reorder-buttons" style={{ flexShrink: 0, display: 'flex', gap: 1, transition: 'opacity 0.15s' }}>
-                          <button onClick={e => { e.stopPropagation(); moveNote(day.id, note.id, 'up') }} disabled={noteIdx === 0} className={noteIdx === 0 ? 'text-[var(--border-primary)]' : 'text-content-faint'} style={{ background: 'none', border: 'none', padding: '1px 2px', cursor: noteIdx === 0 ? 'default' : 'pointer', display: 'flex', lineHeight: 1 }}><ChevronUp size={12} strokeWidth={2} /></button>
-                          <button onClick={e => { e.stopPropagation(); moveNote(day.id, note.id, 'down') }} disabled={noteIdx === merged.length - 1} className={noteIdx === merged.length - 1 ? 'text-[var(--border-primary)]' : 'text-content-faint'} style={{ background: 'none', border: 'none', padding: '1px 2px', cursor: noteIdx === merged.length - 1 ? 'default' : 'pointer', display: 'flex', lineHeight: 1 }}><ChevronDown size={12} strokeWidth={2} /></button>
+                          <button type="button" onClick={e => { e.stopPropagation(); moveNote(day.id, note.id, 'up') }} disabled={noteIdx === 0} className={noteIdx === 0 ? 'text-[var(--border-primary)]' : 'text-content-faint'} style={{ background: 'none', border: 'none', padding: '1px 2px', cursor: noteIdx === 0 ? 'default' : 'pointer', display: 'flex', lineHeight: 1 }}><ChevronUp size={12} strokeWidth={2} /></button>
+                          <button type="button" onClick={e => { e.stopPropagation(); moveNote(day.id, note.id, 'down') }} disabled={noteIdx === merged.length - 1} className={noteIdx === merged.length - 1 ? 'text-[var(--border-primary)]' : 'text-content-faint'} style={{ background: 'none', border: 'none', padding: '1px 2px', cursor: noteIdx === merged.length - 1 ? 'default' : 'pointer', display: 'flex', lineHeight: 1 }}><ChevronDown size={12} strokeWidth={2} /></button>
                         </div>}
                         </div>
                         </React.Fragment>
@@ -2580,7 +2580,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                       const { placeId, assignmentId, noteId, reservationId: fromReservationId, fromDayId, phase } = getDragData(e)
                       // Neuer Ort von der Orte-Liste
                       if (placeId) {
-                        onAssignToDay?.(parseInt(placeId), day.id)
+                        onAssignToDay?.(Number.parseInt(placeId), day.id)
                         setDropTargetKey(null); window.__dragData = null; return
                       }
                       if (fromReservationId && fromDayId !== day.id) {
@@ -2618,7 +2618,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                   {(isSelected || (showRouteToolsWhenExpanded && isExpanded)) && routeToolsRoutable && (
                     <div style={{ padding: '10px 16px 12px', borderTop: '1px solid var(--border-faint)', display: 'flex', flexDirection: 'column', gap: 7 }}>
                       <div style={{ display: 'flex', gap: 6, alignItems: 'stretch' }}>
-                        <button
+                        <button type="button"
                           onClick={() => {
                             if (showRouteToolsWhenExpanded) {
                               // Mobile: toggle this day's inline leg distances in place.
@@ -2647,7 +2647,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                           {t('dayplan.route')}
                         </button>
                         {/* Open the day's stops as a route in Google Maps (planned order). #1255 */}
-                        <button
+                        <button type="button"
                           onClick={() => {
                             const url = generateGoogleMapsUrl(dayExportStops())
                             if (url) window.open(url, '_blank', 'noopener,noreferrer')
@@ -2666,7 +2666,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                         {/* The same day, handed to CoMaps for offline navigation (#1904). The
                             day's own travel mode rides along, so the route it builds walks
                             when the plan walks. */}
-                        <button
+                        <button type="button"
                           onClick={() => {
                             const url = generateCoMapsUrl(dayExportStops(), day.default_transport_mode ?? routeProfile)
                             if (url) window.open(url, '_blank', 'noopener,noreferrer')
@@ -2688,7 +2688,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                             sat against both edges as soon as the row filled up, and
                             the row gained a button when CoMaps arrived. The label
                             stays as the accessible name and the tooltip. */}
-                        <button
+                        <button type="button"
                           onClick={() => handleOptimize(day.id)}
                           aria-label={t('dayplan.optimize')}
                           title={t('dayplan.optimize')}
@@ -2706,7 +2706,7 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
                             const ModeIcon = p.key === 'driving' ? Car : p.key === 'walking' ? Footprints : Zap
                             const active = (day.default_transport_mode ?? routeProfile) === p.key
                             return (
-                              <button
+                              <button type="button"
                                 key={p.key}
                                 onClick={() => setDayDefaultMode(day.id, p.key)}
                                 aria-label={p.label}

client/src/components/Planner/DayPlanSidebarMobileAddPlaceButton.tsx

@@ -24,7 +24,7 @@ export function MobileAddPlaceButton({ dayId, places, assignments, onAssign, onA
   return (
     <div className="md:hidden" style={{ padding: '8px 12px 12px' }}>
       {!open ? (
-        <button
+        <button type="button"
           onClick={e => { e.stopPropagation(); setOpen(true) }}
           style={{
             width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6,
@@ -47,7 +47,7 @@ export function MobileAddPlaceButton({ dayId, places, assignments, onAssign, onA
               placeholder={t('dayplan.mobile.searchPlaces')}
               style={{ flex: 1, border: 'none', outline: 'none', background: 'transparent', fontSize: 'calc(13px * var(--fs-scale-body, 1))', fontFamily: 'inherit', color: 'var(--text-primary)' }}
             />
-            <button onClick={() => { setOpen(false); setSearch('') }} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: 'var(--text-faint)' }}>
+            <button type="button" onClick={() => { setOpen(false); setSearch('') }} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 2, color: 'var(--text-faint)' }}>
               <X size={14} />
             </button>
           </div>
@@ -58,7 +58,7 @@ export function MobileAddPlaceButton({ dayId, places, assignments, onAssign, onA
               </div>
             )}
             {filtered.slice(0, 20).map(p => (
-              <button
+              <button type="button"
                 key={p.id}
                 onClick={() => {
                   onAssign?.(p.id, dayId)
@@ -77,7 +77,7 @@ export function MobileAddPlaceButton({ dayId, places, assignments, onAssign, onA
             ))}
           </div>
           {onAddNew && (
-            <button
+            <button type="button"
               onClick={() => { onAddNew(); setOpen(false); setSearch('') }}
               style={{
                 width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6,

client/src/components/Planner/DayPlanSidebarTimeConfirmModal.tsx

@@ -47,11 +47,11 @@ export function DayPlanSidebarTimeConfirmModal({ timeConfirm, setTimeConfirm, co
           {t('dayplan.confirmRemoveTimeBody', { time: timeConfirm.time })}
         </div>
         <div style={{ display: 'flex', gap: 8, justifyContent: 'flex-end', marginTop: 4 }}>
-          <button onClick={() => setTimeConfirm(null)} className="text-content-muted" style={{
+          <button type="button" onClick={() => setTimeConfirm(null)} className="text-content-muted" style={{
             fontSize: 'calc(12px * var(--fs-scale-body, 1))', background: 'none', border: '1px solid var(--border-primary)',
             borderRadius: 8, padding: '6px 14px', cursor: 'pointer', fontFamily: 'inherit',
           }}>{t('common.cancel')}</button>
-          <button onClick={confirmTimeRemoval} className="bg-[#ef4444] text-white" style={{
+          <button type="button" onClick={confirmTimeRemoval} className="bg-[#ef4444] text-white" style={{
             fontSize: 'calc(12px * var(--fs-scale-body, 1))',
             border: 'none', borderRadius: 8, padding: '6px 16px', cursor: 'pointer', fontWeight: 600, fontFamily: 'inherit',
           }}>{t('common.confirm')}</button>

client/src/components/Planner/DayPlanSidebarToolbar.tsx

@@ -94,7 +94,7 @@ export function DayPlanSidebarToolbar({
           const label = allExpanded ? t('dayplan.collapseAll') : t('dayplan.expandAll')
           return (
             <Tooltip label={label} placement="bottom">
-              <button
+              <button type="button"
                 onClick={() => {
                   const next = allExpanded ? new Set<number>() : new Set(days.map(d => d.id))
                   setExpandedDays(next)
@@ -138,7 +138,7 @@ export function DayPlanSidebarToolbar({
         })()}
         {onUndo && (
           <div style={{ position: 'relative', flexShrink: 0 }}>
-            <button
+            <button type="button"
               onClick={onUndo}
               disabled={!canUndo}
               aria-label={t('undo.button')}
@@ -172,7 +172,7 @@ export function DayPlanSidebarToolbar({
         {canEditDays && onReorderDays && onAddDay && days.length > 0 && (
           <div style={{ position: 'relative', flexShrink: 0 }}>
             <Tooltip label={t('dayplan.reorderDays')} placement="bottom">
-              <button
+              <button type="button"
                 onClick={() => setReorderOpen(v => !v)}
                 aria-label={t('dayplan.reorderDays')}
                 aria-pressed={reorderOpen}

client/src/components/Planner/DayPlanSidebarTransportDetailModal.tsx

@@ -241,7 +241,7 @@ export function DayPlanSidebarTransportDetailModal({
               {/* Aktionen */}
               <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 8 }}>
                 {onEdit && (
-                  <button onClick={() => onEdit(res)} className="bg-surface-tertiary text-content" style={{
+                  <button type="button" onClick={() => onEdit(res)} className="bg-surface-tertiary text-content" style={{
                     fontSize: 'calc(12px * var(--fs-scale-body, 1))',
                     border: 'none', borderRadius: 8, padding: '6px 14px', cursor: 'pointer', fontWeight: 600, fontFamily: 'inherit',
                     display: 'inline-flex', alignItems: 'center', gap: 5,
@@ -249,7 +249,7 @@ export function DayPlanSidebarTransportDetailModal({
                     <Pencil size={12} /> {t('common.edit')}
                   </button>
                 )}
-                <button onClick={() => setTransportDetail(null)} className="bg-accent text-accent-text" style={{
+                <button type="button" onClick={() => setTransportDetail(null)} className="bg-accent text-accent-text" style={{
                   fontSize: 'calc(12px * var(--fs-scale-body, 1))',
                   border: 'none', borderRadius: 8, padding: '6px 16px', cursor: 'pointer', fontWeight: 600, fontFamily: 'inherit',
                 }}>

client/src/components/Planner/DayReorderPopup.tsx

@@ -56,7 +56,7 @@ export function DayReorderPopup({ isOpen, days, t, locale, onReorder, onAddDay,
       size="md"
       footer={
         <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12 }}>
-          <button
+          <button type="button"
             onClick={onClose}
             style={{
               padding: '8px 16px', borderRadius: 8, fontSize: 13, fontWeight: 500,
@@ -66,7 +66,7 @@ export function DayReorderPopup({ isOpen, days, t, locale, onReorder, onAddDay,
           >
             {t('common.close')}
           </button>
-          <button
+          <button type="button"
             onClick={onAddDay}
             className="bg-accent text-accent-text"
             style={{

client/src/components/Planner/FileImportModal.tsx

@@ -360,7 +360,7 @@ export default function FileImportModal({ isOpen, onClose, tripId, pushUndo, ini
         )}
 
         <div style={{ display: 'flex', gap: 8, justifyContent: 'flex-end' }}>
-          <button
+          <button type="button"
             onClick={handleClose}
             style={{
               padding: '8px 16px', borderRadius: 10, border: '1px solid var(--border-primary)',
@@ -370,7 +370,7 @@ export default function FileImportModal({ isOpen, onClose, tripId, pushUndo, ini
           >
             {t('common.cancel')}
           </button>
-          <button
+          <button type="button"
             onClick={handleImport}
             disabled={!canImport}
             className={canImport ? 'bg-accent text-accent-text' : 'bg-surface-tertiary text-content-faint'}

client/src/components/Planner/IcsSubscribeModal.tsx

@@ -89,7 +89,7 @@ export function IcsSubscribeModal({ endpoint, title, description, onClose }: Ics
             <Calendar size={16} strokeWidth={2} style={{ color: 'var(--accent, #6366f1)' }} />
             <span style={{ fontWeight: 600, fontSize: 14 }}>{title}</span>
           </div>
-          <button
+          <button type="button"
             onClick={onClose}
             style={{
               background: 'none', border: 'none', cursor: 'pointer', padding: 4,
@@ -110,7 +110,7 @@ export function IcsSubscribeModal({ endpoint, title, description, onClose }: Ics
           </div>
         ) : !feedUrl ? (
           <>
-            <button
+            <button type="button"
               onClick={() => mutate('POST')}
               disabled={busy}
               style={{
@@ -133,7 +133,7 @@ export function IcsSubscribeModal({ endpoint, title, description, onClose }: Ics
             <SubscribeLinks httpsUrl={httpsUrl} webcalUrl={webcalUrl} />
 
             <div style={{ marginTop: 16, paddingTop: 12, borderTop: '1px solid var(--border-faint)', display: 'flex', gap: 8 }}>
-              <button
+              <button type="button"
                 onClick={() => mutate('PUT')}
                 disabled={busy}
                 style={{
@@ -148,7 +148,7 @@ export function IcsSubscribeModal({ endpoint, title, description, onClose }: Ics
                 <RefreshCw size={11} strokeWidth={2} style={{ animation: busy ? 'spin 0.8s linear infinite' : 'none' }} />
                 Regenerate
               </button>
-              <button
+              <button type="button"
                 onClick={() => mutate('DELETE')}
                 disabled={busy}
                 style={{

client/src/components/Planner/PlaceFormModal.tsx

@@ -66,8 +66,8 @@ function findDuplicatePlace(
 ): { name?: string | null } | null {
   const name = (form.name || '').trim().toLowerCase()
   const gid = (form.google_place_id || '').trim()
-  const lat = form.lat ? parseFloat(form.lat) : null
-  const lng = form.lng ? parseFloat(form.lng) : null
+  const lat = form.lat ? Number.parseFloat(form.lat) : null
+  const lng = form.lng ? Number.parseFloat(form.lng) : null
   for (const p of places || []) {
     if (gid && p.google_place_id && p.google_place_id === gid) return p
     if (name && p.name && p.name.trim().toLowerCase() === name) return p
@@ -473,8 +473,8 @@ function usePlaceFormModal(props: PlaceFormModalProps) {
     try {
       const saved = await onSave({
         ...form,
-        lat: form.lat ? parseFloat(form.lat) : null,
-        lng: form.lng ? parseFloat(form.lng) : null,
+        lat: form.lat ? Number.parseFloat(form.lat) : null,
+        lng: form.lng ? Number.parseFloat(form.lng) : null,
         category_id: form.category_id || null,
         _pendingFiles: pendingFiles.length > 0 ? pendingFiles : undefined,
       })

client/src/components/Planner/PlaceInspector.tsx

@@ -580,7 +580,7 @@ export function ActionButton({ onClick, variant, icon, label, ref }: ActionButto
   }
   const s = base[variant] || base.ghost
   return (
-    <button
+    <button type="button"
       ref={ref}
       onClick={onClick}
       style={{
@@ -676,7 +676,7 @@ function ParticipantsBox({ tripMembers, participantIds, allJoined, onSetParticip
         {/* Add button */}
         {availableToAdd.length > 0 && (
           <div style={{ position: 'relative' }}>
-            <button onClick={() => setShowAdd(!showAdd)} className="text-content-faint" style={{
+            <button type="button" onClick={() => setShowAdd(!showAdd)} className="text-content-faint" style={{
               width: 22, height: 22, borderRadius: '50%', border: '1.5px dashed var(--border-primary)',
               background: 'none', cursor: 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center',
               fontSize: 'calc(12px * var(--fs-scale-body, 1))', transition: 'all 0.12s',
@@ -692,7 +692,7 @@ function ParticipantsBox({ tripMembers, participantIds, allJoined, onSetParticip
                 boxShadow: '0 4px 16px rgba(0,0,0,0.12)', padding: 4, minWidth: 140,
               }}>
                 {availableToAdd.map(member => (
-                  <button key={member.id} onClick={() => handleAdd(member.id)} className="text-content" style={{
+                  <button type="button" key={member.id} onClick={() => handleAdd(member.id)} className="text-content" style={{
                     display: 'flex', alignItems: 'center', gap: 6, width: '100%', padding: '5px 8px',
                     borderRadius: 6, border: 'none', background: 'none', cursor: 'pointer',
                     fontFamily: 'inherit', fontSize: 'calc(11px * var(--fs-scale-caption, 1))', textAlign: 'left',
@@ -807,7 +807,7 @@ function PlaceInspectorHeader({ openNow, place, category, t, editingName, nameIn
               </div>
             )}
           </div>
-          <button
+          <button type="button"
             onClick={onClose}
             className="bg-surface-hover"
             style={{ width: 28, height: 28, borderRadius: '50%', border: 'none', display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer', flexShrink: 0, alignSelf: 'flex-start', transition: 'background 0.15s' }}
@@ -940,7 +940,7 @@ function TrackColorRow({ place, trackColor, onUpdatePlace, t }: any) {
   const [open, setOpen] = useState(false)
   return (
     <div className="bg-surface-hover" style={{ borderRadius: 10, padding: '10px 12px', display: 'flex', flexDirection: 'column', gap: 8 }}>
-      <button
+      <button type="button"
         onClick={() => setOpen(o => !o)}
         aria-expanded={open}
         style={{
@@ -980,7 +980,7 @@ function PlaceExtras({ openingHours, weekdayIndex, hoursExpanded, setHoursExpand
           <div className={`grid grid-cols-1 ${openingHours?.length > 0 ? 'sm:grid-cols-2' : ''} gap-2`}>
           {openingHours && openingHours.length > 0 && (
             <div className="bg-surface-hover" style={{ borderRadius: 10, overflow: 'hidden' }}>
-              <button
+              <button type="button"
                 onClick={() => setHoursExpanded(h => !h)}
                 style={{
                   width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'space-between',
@@ -1111,7 +1111,7 @@ function PlaceExtras({ openingHours, weekdayIndex, hoursExpanded, setHoursExpand
           {(placeFiles.length > 0 || onFileUpload) && (
             <div className="bg-surface-hover" style={{ borderRadius: 10, overflow: 'hidden' }}>
               <div style={{ display: 'flex', alignItems: 'center', padding: '8px 12px', gap: 6 }}>
-                <button
+                <button type="button"
                   onClick={() => setFilesExpanded(f => !f)}
                   style={{ flex: 1, display: 'flex', alignItems: 'center', gap: 6, background: 'none', border: 'none', cursor: 'pointer', padding: 0, fontFamily: 'inherit', textAlign: 'left' }}
                 >
@@ -1135,7 +1135,7 @@ function PlaceExtras({ openingHours, weekdayIndex, hoursExpanded, setHoursExpand
               {filesExpanded && placeFiles.length > 0 && (
                 <div style={{ padding: '0 12px 10px', display: 'flex', flexDirection: 'column', gap: 4 }}>
                   {placeFiles.map(f => (
-                    <button key={f.id} onClick={() => openFile(f.url).catch(() => {})} style={{ display: 'flex', alignItems: 'center', gap: 8, textDecoration: 'none', cursor: 'pointer', background: 'none', border: 'none', width: '100%', textAlign: 'left' }}>
+                    <button type="button" key={f.id} onClick={() => openFile(f.url).catch(() => {})} style={{ display: 'flex', alignItems: 'center', gap: 8, textDecoration: 'none', cursor: 'pointer', background: 'none', border: 'none', width: '100%', textAlign: 'left' }}>
                       {(f.mime_type || '').startsWith('image/') ? <FileImage size={12} color="#6b7280" /> : <File size={12} color="#6b7280" />}
                       <span className="text-content-secondary" style={{ fontSize: 'calc(12px * var(--fs-scale-body, 1))', flex: 1, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{f.original_name}</span>
                       {f.file_size && <span className="text-content-faint" style={{ fontSize: 'calc(11px * var(--fs-scale-caption, 1))', flexShrink: 0 }}>{formatFileSize(f.file_size)}</span>}

client/src/components/Planner/PlacesBulkCategoryModal.tsx

@@ -37,7 +37,7 @@ export function PlacesBulkCategoryModal({ count, categories, onPick, onClose }:
       }}>
         <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 4 }}>
           <span style={{ fontWeight: 600, fontSize: 14 }}>{t('places.changeCategory')}</span>
-          <button onClick={onClose} aria-label={t('common.close')} className="text-content-muted" style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 4, display: 'flex' }}>
+          <button type="button" onClick={onClose} aria-label={t('common.close')} className="text-content-muted" style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 4, display: 'flex' }}>
             <X size={15} strokeWidth={2} />
           </button>
         </div>
@@ -47,7 +47,7 @@ export function PlacesBulkCategoryModal({ count, categories, onPick, onClose }:
           {categories.map(c => {
             const CatIcon = getCategoryIcon(c.icon)
             return (
-              <button key={c.id} onClick={() => onPick(c.id)} className="text-content bg-transparent" style={rowStyle} onMouseEnter={hoverOn} onMouseLeave={hoverOff}>
+              <button type="button" key={c.id} onClick={() => onPick(c.id)} className="text-content bg-transparent" style={rowStyle} onMouseEnter={hoverOn} onMouseLeave={hoverOff}>
                 <CatIcon size={14} strokeWidth={2} color={c.color || 'var(--text-muted)'} />
                 <span style={{ flex: 1 }}>{c.name}</span>
               </button>

client/src/components/Planner/PlacesSidebarHeader.tsx

@@ -30,7 +30,7 @@ export function PlacesHeader(S: SidebarState) {
   } = S
   return (
     <div className="border-b border-edge-faint" style={{ padding: '14px 16px 10px', flexShrink: 0 }}>
-      {canEditPlaces && <button
+      {canEditPlaces && <button type="button"
         onClick={onAddPlace}
         className="bg-accent text-accent-text"
         style={{
@@ -44,7 +44,7 @@ export function PlacesHeader(S: SidebarState) {
       </button>}
       {canEditPlaces && <>
       <div style={{ display: 'flex', gap: 6, marginBottom: 10 }}>
-        <button
+        <button type="button"
           onClick={() => setFileImportOpen(true)}
           className="border border-dashed border-edge text-content-faint"
           style={{
@@ -56,7 +56,7 @@ export function PlacesHeader(S: SidebarState) {
         >
           <FileDown size={11} strokeWidth={2} /> {t('places.importFile')}
         </button>
-        <button
+        <button type="button"
           onClick={() => setListImportOpen(true)}
           className="border border-dashed border-edge text-content-faint"
           style={{
@@ -101,7 +101,7 @@ export function PlacesHeader(S: SidebarState) {
             {tabs.map(f => {
               const active = filter === f.id
               return (
-                <button
+                <button type="button"
                   key={f.id}
                   onClick={() => { setFilter(f.id); setSelectedIds(new Set()) }}
                   className={active ? 'bg-accent text-accent-text' : 'bg-surface-card text-content'}
@@ -145,7 +145,7 @@ export function PlacesHeader(S: SidebarState) {
           }}
         />
         {search && (
-          <button onClick={() => setSearch('')} style={{ position: 'absolute', right: 8, top: '50%', transform: 'translateY(-50%)', background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex' }}>
+          <button type="button" onClick={() => setSearch('')} style={{ position: 'absolute', right: 8, top: '50%', transform: 'translateY(-50%)', background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex' }}>
             <X size={12} strokeWidth={2} color="var(--text-faint)" />
           </button>
         )}
@@ -162,7 +162,7 @@ export function PlacesHeader(S: SidebarState) {
             : `${categoryFilters.size} ${t('places.categoriesSelected')}`
         return (
           <div style={{ marginTop: 6, position: 'relative', display: 'flex', gap: 6, alignItems: 'stretch' }}>
-            {categories.length > 0 && <button onClick={() => setCatDropOpen(v => !v)} className="bg-surface-card text-content" style={{
+            {categories.length > 0 && <button type="button" onClick={() => setCatDropOpen(v => !v)} className="bg-surface-card text-content" style={{
               flex: 1, minWidth: 0, display: 'flex', alignItems: 'center', justifyContent: 'space-between',
               padding: '6px 10px', borderRadius: 8, border: '1px solid var(--border-primary)',
               fontSize: 'calc(12px * var(--fs-scale-body, 1))',
@@ -173,7 +173,7 @@ export function PlacesHeader(S: SidebarState) {
             </button>}
             {/* Minimum-stars filter (#1435), same floors as the collections bar. */}
             <Tooltip label={t('places.filterByRating')} placement="bottom">
-              <button
+              <button type="button"
                 onClick={() => { setStarDropOpen(v => !v); setCatDropOpen(false) }}
                 aria-label={t('places.filterByRating')}
                 aria-expanded={starDropOpen}
@@ -203,7 +203,7 @@ export function PlacesHeader(S: SidebarState) {
                 {(['all', 5, 4, 3, 2, 1] as const).map(opt => {
                   const active = ratingFilter === opt
                   return (
-                    <button
+                    <button type="button"
                       key={String(opt)}
                       onClick={() => { setRatingFilter(opt as number | 'all'); setStarDropOpen(false) }}
                       className={`text-content ${active ? 'bg-surface-hover' : 'bg-transparent'}`}
@@ -230,7 +230,7 @@ export function PlacesHeader(S: SidebarState) {
             )}
             {canEditPlaces && (
               <Tooltip label={t('common.select')} placement="bottom">
-              <button
+              <button type="button"
                 onClick={() => { setSelectMode(v => !v); setSelectedIds(new Set()) }}
                 aria-label={t('common.select')}
                 aria-pressed={selectMode}
@@ -273,7 +273,7 @@ export function PlacesHeader(S: SidebarState) {
                   const active = categoryFilters.has(String(c.id))
                   const CatIcon = getCategoryIcon(c.icon)
                   return (
-                    <button key={c.id} onClick={() => toggleCategoryFilter(String(c.id))} className={`text-content ${active ? 'bg-surface-hover' : 'bg-transparent'}`} style={{
+                    <button type="button" key={c.id} onClick={() => toggleCategoryFilter(String(c.id))} className={`text-content ${active ? 'bg-surface-hover' : 'bg-transparent'}`} style={{
                       display: 'flex', alignItems: 'center', gap: 8, width: '100%',
                       padding: '6px 10px', borderRadius: 6, border: 'none', cursor: 'pointer',
                       fontFamily: 'inherit', fontSize: 'calc(12px * var(--fs-scale-body, 1))',
@@ -295,7 +295,7 @@ export function PlacesHeader(S: SidebarState) {
                 {places.some(p => p.category_id == null) && (() => {
                   const active = categoryFilters.has('uncategorized')
                   return (
-                    <button onClick={() => toggleCategoryFilter('uncategorized')} className={`text-content-muted ${active ? 'bg-surface-hover' : 'bg-transparent'}`} style={{
+                    <button type="button" onClick={() => toggleCategoryFilter('uncategorized')} className={`text-content-muted ${active ? 'bg-surface-hover' : 'bg-transparent'}`} style={{
                       display: 'flex', alignItems: 'center', gap: 8, width: '100%',
                       padding: '6px 10px', borderRadius: 6, border: 'none', cursor: 'pointer',
                       fontFamily: 'inherit', fontSize: 'calc(12px * var(--fs-scale-body, 1))',
@@ -314,7 +314,7 @@ export function PlacesHeader(S: SidebarState) {
                   )
                 })()}
                 {categoryFilters.size > 0 && (
-                  <button onClick={() => setCategoryFilters(new Set())} className="bg-transparent text-content-faint" style={{
+                  <button type="button" onClick={() => setCategoryFilters(new Set())} className="bg-transparent text-content-faint" style={{
                     display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 4,
                     width: '100%', padding: '6px 10px', borderRadius: 6, border: 'none', cursor: 'pointer',
                     fontFamily: 'inherit', fontSize: 'calc(11px * var(--fs-scale-caption, 1))',

client/src/components/Planner/PlacesSidebarList.tsx

@@ -18,7 +18,7 @@ export function PlacesList(S: SidebarState) {
           <span className="text-content-faint" style={{ fontSize: 'calc(13px * var(--fs-scale-body, 1))' }}>
             {filter === 'unplanned' ? t('places.allPlanned') : t('places.noneFound')}
           </span>
-          {canEditPlaces && <button onClick={onAddPlace} className="text-content" style={{ fontSize: 'calc(12px * var(--fs-scale-body, 1))', background: 'none', border: 'none', cursor: 'pointer', textDecoration: 'underline', fontFamily: 'inherit' }}>
+          {canEditPlaces && <button type="button" onClick={onAddPlace} className="text-content" style={{ fontSize: 'calc(12px * var(--fs-scale-body, 1))', background: 'none', border: 'none', cursor: 'pointer', textDecoration: 'underline', fontFamily: 'inherit' }}>
             {t('places.addPlace')}
           </button>}
         </div>

client/src/components/Planner/PlacesSidebarListImportModal.tsx

@@ -25,7 +25,7 @@ export function ListImportModal(S: SidebarState) {
         {hasMultipleListImportProviders && (
           <div style={{ display: 'flex', gap: 6, marginBottom: 10 }}>
             {availableListImportProviders.map(provider => (
-              <button
+              <button type="button"
                 key={provider}
                 onClick={() => setListImportProvider(provider)}
                 className={listImportProvider === provider ? 'bg-accent text-accent-text' : 'bg-surface-tertiary text-content-muted'}
@@ -67,7 +67,7 @@ export function ListImportModal(S: SidebarState) {
           </div>
         )}
         <div style={{ display: 'flex', gap: 8, marginTop: 16, justifyContent: 'flex-end' }}>
-          <button
+          <button type="button"
             onClick={() => { setListImportOpen(false); setListImportUrl('') }}
             className="text-content"
             style={{
@@ -78,7 +78,7 @@ export function ListImportModal(S: SidebarState) {
           >
             {t('common.cancel')}
           </button>
-          <button
+          <button type="button"
             onClick={handleListImport}
             disabled={!listImportUrl.trim() || listImportLoading}
             className={!listImportUrl.trim() || listImportLoading ? 'bg-surface-tertiary text-content-faint' : 'bg-accent text-accent-text'}

client/src/components/Planner/PlacesSidebarMobileDayPicker.tsx

@@ -23,7 +23,7 @@ export function MobileDayPickerSheet(S: SidebarState) {
         </div>
         <div style={{ overflowY: 'auto', padding: '8px 12px' }}>
           {/* View details */}
-          <button
+          <button type="button"
             onClick={() => { onPlaceClick(dayPickerPlace.id); setDayPickerPlace(null); setMobileShowDays(false) }}
             className="bg-transparent text-content"
             style={{ display: 'flex', alignItems: 'center', gap: 12, width: '100%', padding: '12px 14px', borderRadius: 12, border: 'none', cursor: 'pointer', fontFamily: 'inherit', textAlign: 'left', fontSize: 'calc(14px * var(--fs-scale-body, 1))' }}
@@ -32,7 +32,7 @@ export function MobileDayPickerSheet(S: SidebarState) {
           </button>
           {/* Edit */}
           {canEditPlaces && (
-            <button
+            <button type="button"
               onClick={() => { onEditPlace(dayPickerPlace); setDayPickerPlace(null); setMobileShowDays(false) }}
               className="bg-transparent text-content"
               style={{ display: 'flex', alignItems: 'center', gap: 12, width: '100%', padding: '12px 14px', borderRadius: 12, border: 'none', cursor: 'pointer', fontFamily: 'inherit', textAlign: 'left', fontSize: 'calc(14px * var(--fs-scale-body, 1))' }}
@@ -43,7 +43,7 @@ export function MobileDayPickerSheet(S: SidebarState) {
           {/* Assign to day */}
           {days?.length > 0 && (
             <>
-              <button
+              <button type="button"
                 onClick={() => setMobileShowDays(v => !v)}
                 className="bg-transparent text-content"
               style={{ display: 'flex', alignItems: 'center', gap: 12, width: '100%', padding: '12px 14px', borderRadius: 12, border: 'none', cursor: 'pointer', fontFamily: 'inherit', textAlign: 'left', fontSize: 'calc(14px * var(--fs-scale-body, 1))' }}
@@ -54,7 +54,7 @@ export function MobileDayPickerSheet(S: SidebarState) {
               {mobileShowDays && (
                 <div style={{ paddingLeft: 20 }}>
                   {days.map((day, i) => (
-                    <button
+                    <button type="button"
                       key={day.id}
                       onClick={() => { onAssignToDay(dayPickerPlace.id, day.id); setDayPickerPlace(null); setMobileShowDays(false) }}
                       style={{ display: 'flex', alignItems: 'center', gap: 10, width: '100%', padding: '10px 14px', borderRadius: 10, border: 'none', cursor: 'pointer', background: 'transparent', fontFamily: 'inherit', textAlign: 'left' }}
@@ -73,7 +73,7 @@ export function MobileDayPickerSheet(S: SidebarState) {
           )}
           {/* Delete */}
           {canEditPlaces && (
-            <button
+            <button type="button"
               onClick={() => { onDeletePlace(dayPickerPlace.id); setDayPickerPlace(null); setMobileShowDays(false) }}
               style={{ display: 'flex', alignItems: 'center', gap: 12, width: '100%', padding: '12px 14px', borderRadius: 12, border: 'none', cursor: 'pointer', background: 'transparent', fontFamily: 'inherit', textAlign: 'left', fontSize: 'calc(14px * var(--fs-scale-body, 1))', color: '#ef4444' }}
             >

client/src/components/Planner/PlacesSidebarRow.tsx

@@ -121,7 +121,7 @@ export const MemoPlaceRow = React.memo(function MemoPlaceRow({
       </div>
       <div style={{ flexShrink: 0, display: 'flex', alignItems: 'center' }}>
         {!selectMode && !inDay && selectedDayId && (
-          <button
+          <button type="button"
             onClick={e => { e.stopPropagation(); onAssignToDay(place.id) }}
             className="bg-surface-hover text-content-faint"
             style={{