feat: POS PIN unlock with employee number + PIN auth

- Add employeeNumber and pinHash fields to users table
- POST /auth/pin-login: takes combined code (4-digit employee# + 4-digit PIN)
- POST /auth/set-pin: employee sets their own PIN (requires full auth)
- DELETE /auth/pin: remove PIN
- Lock screen with numpad, auto-submits on 8 digits, visual dot separator
- POS uses its own auth token separate from admin session
- Admin "POS" link clears admin session before navigating
- /pos route has no auth guard — lock screen is the auth
- API client uses POS token when available, admin token otherwise
- Auto-lock timer reads pos_lock_timeout from app_config (default 15 min)
- Lock button in POS top bar, shows current cashier name

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

packages/admin/src/components/pos/pos-register.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from 'react'
+import { useEffect, useRef, useCallback } from 'react'
 import { useQuery } from '@tanstack/react-query'
 import { queryOptions } from '@tanstack/react-query'
 import { api } from '@/lib/api-client'
@@ -7,12 +7,18 @@ import { currentDrawerOptions, transactionOptions } from '@/api/pos'
 import { POSTopBar } from './pos-top-bar'
 import { POSItemPanel } from './pos-item-panel'
 import { POSCartPanel } from './pos-cart-panel'
+import { POSLockScreen } from './pos-lock-screen'
 
 interface Location {
   id: string
   name: string
 }
 
+interface AppConfigEntry {
+  key: string
+  value: string | null
+}
+
 function locationsOptions() {
   return queryOptions({
     queryKey: ['locations'],
@@ -20,11 +26,61 @@ function locationsOptions() {
   })
 }
 
+function configOptions(key: string) {
+  return queryOptions({
+    queryKey: ['config', key],
+    queryFn: async (): Promise<string | null> => {
+      try {
+        const entry = await api.get<AppConfigEntry>(`/v1/config/${key}`)
+        return entry.value
+      } catch {
+        return null
+      }
+    },
+  })
+}
+
 export function POSRegister() {
-  const { locationId, setLocation, currentTransactionId, setDrawerSession } = usePOSStore()
+  const { locationId, setLocation, currentTransactionId, setDrawerSession, locked, lock, touchActivity, token } = usePOSStore()
+
+  // Fetch lock timeout from config
+  const { data: lockTimeoutStr } = useQuery({
+    ...configOptions('pos_lock_timeout'),
+    enabled: !!token,
+  })
+  const lockTimeoutMinutes = parseInt(lockTimeoutStr ?? '15') || 15
+
+  // Auto-lock timer
+  const timerRef = useRef<ReturnType<typeof setInterval> | null>(null)
+
+  useEffect(() => {
+    if (locked || lockTimeoutMinutes === 0) {
+      if (timerRef.current) clearInterval(timerRef.current)
+      return
+    }
+
+    timerRef.current = setInterval(() => {
+      const { lastActivity, locked: isLocked } = usePOSStore.getState()
+      if (!isLocked && Date.now() - lastActivity > lockTimeoutMinutes * 60_000) {
+        lock()
+      }
+    }, 30_000)
+
+    return () => {
+      if (timerRef.current) clearInterval(timerRef.current)
+    }
+  }, [locked, lockTimeoutMinutes, lock])
+
+  // Track activity on any interaction
+  const handleActivity = useCallback(() => {
+    if (!locked) touchActivity()
+  }, [locked, touchActivity])
 
   // Fetch locations
-  const { data: locationsData } = useQuery(locationsOptions())
+  const { data: locationsData } = useQuery({
+    ...locationsOptions(),
+    enabled: !!token,
+  })
   const locations = locationsData?.data ?? []
 
   // Auto-select first location
@@ -38,6 +94,7 @@ export function POSRegister() {
   const { data: drawer } = useQuery({
     ...currentDrawerOptions(locationId),
     retry: false,
+    enabled: !!locationId && !!token,
   })
 
   // Sync drawer session ID
@@ -50,10 +107,18 @@ export function POSRegister() {
   }, [drawer, setDrawerSession])
 
   // Fetch current transaction
-  const { data: transaction } = useQuery(transactionOptions(currentTransactionId))
+  const { data: transaction } = useQuery({
+    ...transactionOptions(currentTransactionId),
+    enabled: !!currentTransactionId && !!token,
+  })
 
   return (
-    <div className="flex flex-col h-full">
+    <div
+      className="relative flex flex-col h-full"
+      onPointerDown={handleActivity}
+      onKeyDown={handleActivity}
+    >
+      {locked && <POSLockScreen />}
       <POSTopBar
         locations={locations}
         locationId={locationId}
@@ -62,7 +127,7 @@ export function POSRegister() {
       />
       <div className="flex flex-1 min-h-0">
         <div className="w-[60%] border-r border-border overflow-hidden">
-          <POSItemPanel transaction={transaction ?? null} />
+          <POSItemPanel _transaction={transaction ?? null} />
         </div>
         <div className="w-[40%] overflow-hidden">
           <POSCartPanel transaction={transaction ?? null} />