style(ui): system-wide UX/UI polish pass — design-system conformance + copy cleanup (#835)

* style(ui): system-wide UX/UI polish pass — design-system conformance + copy cleanup

Multi-agent scan of all 404 UI files against the locked design system, then
141 verified surgical fixes across 109 files (net -32 lines):

- Remove forbidden elevation/motion: shadow-* and rounded-xl on cards, active:scale
  bounce, hover:shadow on list items, transition-all -> transition-colors.
- Drop font-medium from single-weight Hedvig display headings/numerals.
- Replace raw rainbow Tailwind status colors with Badge variants / brand tokens /
  neutral surfaces (achromatic chrome, semantic colors stay data-only).
- Route raw dates through formatDate(), hand-rolled currency through formatCurrency(),
  add tabular-nums to financial figures; text-gray-* -> text-foreground tokens.
- Swap hand-rolled skeletons for the Skeleton primitive; off-scale spacing -> token scale.
- Fix copy: mislabeled "Leverantörsfakturor" -> "Utgifter" on bank-import outflow total,
  collapse no-op identical-branch ternaries, broken Swedish diacritics (mojibake),
  correct mismatch-password toast, correct supplier currency-field label.
- Remove PII-leaking debug console.log on register, stray console.logs.

Verified: tsc clean on all changed files, eslint clean, production build passes.

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

* fix(auth): sanitize residual error logs in register flow

Follow-up to PR review (compliance swarm V16 / GDPR Art.5(1)(f)): the
remaining console.error calls in the register flow passed raw error
objects, which Supabase may populate with PII (email) in nested fields.
Log only sanitized message strings instead.

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

---------

Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

app/(auth)/login/page.tsx

@@ -276,7 +276,7 @@ function LoginPageContent() {
             </p>
           </div>
 
-          <div className="rounded-xl border bg-card p-4">
+          <div className="rounded-lg border bg-card p-4">
             <p className="text-sm text-muted-foreground text-center leading-relaxed">
               {showResetPassword ? tAuth('email_sent_hint_reset') : tAuth('email_sent_hint_login')}
             </p>
@@ -327,7 +327,7 @@ function LoginPageContent() {
             </p>
           </div>
 
-          <div className="rounded-xl border bg-card p-6" style={{ boxShadow: 'var(--shadow-md)' }}>
+          <div className="rounded-lg border bg-card p-6">
             <form onSubmit={handleResetPassword} className="space-y-5">
               <div className="space-y-2">
                 <Label htmlFor="email">{tAuth('email_label')}</Label>
@@ -382,7 +382,7 @@ function LoginPageContent() {
           </p>
         </div>
 
-        <div className="rounded-xl border bg-card p-6" style={{ boxShadow: 'var(--shadow-md)' }}>
+        <div className="rounded-lg border bg-card p-6">
           {callbackError === 'auth_error' && (
             <div className="mb-5 rounded-lg border border-destructive/30 bg-destructive/5 p-4">
               <p className="text-sm font-medium text-destructive">

app/(auth)/mfa/enroll/page.tsx

@@ -188,7 +188,7 @@ function MfaEnrollContent() {
             </p>
           </div>
 
-          <div className="rounded-xl border bg-card p-6" style={{ boxShadow: 'var(--shadow-md)' }}>
+          <div className="rounded-lg border bg-card p-6">
             <div className="space-y-4">
               <div className="rounded-lg border bg-muted/50 p-4">
                 <p className="text-sm text-muted-foreground leading-relaxed">
@@ -242,7 +242,7 @@ function MfaEnrollContent() {
           </p>
         </div>
 
-        <div className="rounded-xl border bg-card p-6 space-y-6" style={{ boxShadow: 'var(--shadow-md)' }}>
+        <div className="rounded-lg border bg-card p-6 space-y-6">
           {/* QR Code */}
           <div className="flex justify-center">
             <div

app/(auth)/mfa/verify/page.tsx

@@ -171,7 +171,7 @@ function MfaVerifyContent() {
           </p>
         </div>
 
-        <div className="rounded-xl border bg-card p-6" style={{ boxShadow: 'var(--shadow-md)' }}>
+        <div className="rounded-lg border bg-card p-6">
           <form onSubmit={handleVerify} className="space-y-5">
             <div className="space-y-2">
               <Label htmlFor="code">{t('verify_code_label')}</Label>

app/(auth)/register/page.tsx

@@ -140,7 +140,7 @@ function RegisterPageContent() {
       })
 
       if (error) {
-        console.error('[register] BankID verifyOtp failed', error)
+        console.error('[register] BankID verifyOtp failed', error.message)
         toast({
           title: t('register_failed_complete'),
           description: getErrorMessage(error, { context: 'auth', locale: errorLocale }),
@@ -152,7 +152,7 @@ function RegisterPageContent() {
       router.push('/select-company')
       router.refresh()
     } catch (error) {
-      console.error('[register] BankID signup error', error)
+      console.error('[register] BankID signup error', error instanceof Error ? error.message : String(error))
       toast({
         title: t('register_failed_title'),
         description: getErrorMessage(error, { context: 'auth', locale: errorLocale }),
@@ -201,14 +201,6 @@ function RegisterPageContent() {
     }
 
     try {
-      console.log('[register] attempting signUp', {
-        email: emailValue,
-        hasPassword: !!passwordValue,
-        passwordLength: passwordValue.length,
-        redirectTo: `${window.location.origin}/auth/callback`,
-        supabaseUrl: process.env.NEXT_PUBLIC_SUPABASE_URL,
-      })
-
       const { data, error } = await supabase.auth.signUp({
         email: emailValue,
         password: passwordValue,
@@ -218,15 +210,7 @@ function RegisterPageContent() {
       })
 
       if (error) {
-        console.error('[register] signUp error', {
-          message: error.message,
-          code: error.code,
-          status: error.status,
-          name: error.name,
-          stack: error.stack,
-          cause: error.cause,
-          fullError: JSON.stringify(error, Object.getOwnPropertyNames(error)),
-        })
+        console.error('[register] signUp error', error.message)
         toast({
           title: t('register_failed_title'),
           description: getErrorMessage(error, { context: 'auth', locale: errorLocale }),
@@ -235,16 +219,6 @@ function RegisterPageContent() {
         return
       }
 
-      console.log('[register] signUp response', {
-        userId: data.user?.id,
-        email: data.user?.email,
-        isAnonymous: data.user?.is_anonymous,
-        identities: data.user?.identities?.length,
-        hasSession: !!data.session,
-        confirmationSentAt: data.user?.confirmation_sent_at,
-        provider: data.user?.app_metadata?.provider,
-      })
-
       // If auto-confirmed (local dev), process invite immediately and redirect
       if (data.session) {
         const cookieMatch = document.cookie.match(/gnubok-invite-token=([^;]+)/)
@@ -260,19 +234,11 @@ function RegisterPageContent() {
 
             if (res.ok) {
               document.cookie = 'gnubok-invite-token=; path=/; max-age=0'
-              console.log('[register] invite accepted after auto-confirm — redirecting')
               window.location.href = '/'
               return
             }
-
-            // Log the error response so we can diagnose invite failures
-            const errBody = await res.json().catch(() => ({}))
-            console.error('[register] invite acceptance returned non-ok', {
-              status: res.status,
-              error: errBody.error,
-            })
           } catch (err) {
-            console.error('[register] invite acceptance failed:', err)
+            console.error('[register] invite acceptance failed:', err instanceof Error ? err.message : String(err))
           }
         }
 
@@ -294,13 +260,7 @@ function RegisterPageContent() {
       setEmail(emailValue)
       setIsRegistered(true)
     } catch (error) {
-      console.error('[register] unexpected exception', {
-        error,
-        message: error instanceof Error ? error.message : String(error),
-        stack: error instanceof Error ? error.stack : undefined,
-        type: typeof error,
-        constructor: error?.constructor?.name,
-      })
+      console.error('[register] unexpected exception', error instanceof Error ? error.message : String(error))
       toast({
         title: t('register_failed_title'),
         description: getErrorMessage(error, { context: 'auth', locale: errorLocale }),
@@ -329,7 +289,7 @@ function RegisterPageContent() {
             </p>
           </div>
 
-          <div className="rounded-xl border bg-card p-4">
+          <div className="rounded-lg border bg-card p-4">
             <p className="text-sm text-muted-foreground text-center leading-relaxed">
               {t('duplicate_hint')}
             </p>
@@ -377,7 +337,7 @@ function RegisterPageContent() {
             </p>
           </div>
 
-          <div className="rounded-xl border bg-card p-4">
+          <div className="rounded-lg border bg-card p-4">
             <p className="text-sm text-muted-foreground text-center leading-relaxed">
               {t('confirm_email_hint')}
             </p>
@@ -416,7 +376,7 @@ function RegisterPageContent() {
           </p>
         </div>
 
-        <div className="rounded-xl border bg-card p-6" style={{ boxShadow: 'var(--shadow-md)' }}>
+        <div className="rounded-lg border bg-card p-6">
           {bankIdEnabled && !bankIdUser && (
             <>
               <div className="mb-5">

app/(auth)/reset-password/page.tsx

@@ -40,7 +40,7 @@ export default function ResetPasswordPage() {
     if (password !== confirmPassword) {
       toast({
         title: t('mismatch_title'),
-        description: t('weak_description'),
+        description: t('mismatch_description'),
         variant: 'destructive',
       })
       setIsLoading(false)
@@ -102,7 +102,7 @@ export default function ResetPasswordPage() {
           </p>
         </div>
 
-        <div className="rounded-xl border bg-card p-6" style={{ boxShadow: 'var(--shadow-md)' }}>
+        <div className="rounded-lg border bg-card p-6">
           <form onSubmit={handleResetPassword} className="space-y-5">
             <div className="space-y-2">
               <Label htmlFor="password">{t('new_password_label')}</Label>