refactor(design): no amber boxes, attention is one ochre sentence (#1562)

The founder wants the yellow boxes gone everywhere. The design system
already agreed: status colors are data, not chrome (convention 12) and
attention is a single ochre sentence, never a banner (convention 6).
This enforces it:

- ConfirmationDialog: the amber warning panel is now an AttnLine, and
  the hardcoded Swedish default warningText is gone: it injected an
  immutability warning into dialogs whose authors never asked for one
  (every current caller passes the prop explicitly, so no behavior
  change at any call site).
- Badge warning variant: amber fill replaced with a hairline chip and
  ochre text.
- DestructiveConfirmDialog warning variant: neutral icon disc, default
  primary confirm button (only --destructive survives as chrome).
- BankSyncStatusChip stale state: same neutral shape as the healthy
  chip, ochre text carries the signal.
- SandboxBanner: solid amber bar becomes secondary-on-border chrome.
- BankIdAuth, BankIdCompanyPicker, SessionTimeoutModal: the last three
  raw-amber (bg-amber-*) holdouts moved onto tokens, the company-picker
  banner becoming a plain AttnLine.
- Mechanical sweep of the ~58 hand-rolled bg-warning/border-warning
  boxes across 45 files: fills to bg-muted/30 (icon discs bg-muted),
  borders to border-border, text-warning-foreground to text-attn. The
  account-class dots in account-number.tsx keep bg-warning: they are
  data indicators, not chrome.

Co-authored-by: Jakob Wennberg <311770904+jakobwennberg-oss@users.noreply.github.com>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

components/salary/EmployeeTaxCard.tsx

@@ -241,7 +241,7 @@ export default function EmployeeTaxCard({
                     {t('tax_column_suggested_under_66')}
                   </p>
                 ) : isSenior && !columnTouched ? (
-                  <p className="text-xs text-warning-foreground">
+                  <p className="text-xs text-attn">
                     {t('tax_column_senior_warning')}
                   </p>
                 ) : null}

components/salary/NewEmployeeDialog.tsx

@@ -415,7 +415,7 @@ function NewEmployeeForm({ onCreated, onCancel }: { onCreated: () => void; onCan
             </Field>
           </div>
           {showChecksumWarning && (
-            <p className="text-xs text-warning-foreground">{BANK_CHECKSUM_WARNING_SV}</p>
+            <p className="text-xs text-attn">{BANK_CHECKSUM_WARNING_SV}</p>
           )}
         </section>
         </div>

components/salary/SalaryCalendar.tsx

@@ -97,8 +97,8 @@ interface AbsenceTypeMeta {
 //   neutral    = the rest (study, unpaid, other)
 const TYPE_META: Record<AbsenceType, AbsenceTypeMeta> = {
   sick:          { labelKey: 'type_sick',          shortLabelKey: 'type_sick_short',          icon: HeartPulse,   pillClass: 'bg-destructive/10 text-destructive' },
-  vab:           { labelKey: 'type_vab',           shortLabelKey: 'type_vab_short',           icon: Baby,         pillClass: 'bg-warning/15 text-warning-foreground' },
-  care_relative: { labelKey: 'type_care_relative', shortLabelKey: 'type_care_relative_short', icon: Heart,        pillClass: 'border border-warning/40 text-warning-foreground' },
+  vab:           { labelKey: 'type_vab',           shortLabelKey: 'type_vab_short',           icon: Baby,         pillClass: 'bg-muted text-attn' },
+  care_relative: { labelKey: 'type_care_relative', shortLabelKey: 'type_care_relative_short', icon: Heart,        pillClass: 'border border-border text-attn' },
   parental:      { labelKey: 'type_parental',      shortLabelKey: 'type_parental_short',      icon: Heart,        pillClass: 'bg-success/10 text-success' },
   pregnancy:     { labelKey: 'type_pregnancy',     shortLabelKey: 'type_pregnancy_short',     icon: Heart,        pillClass: 'border border-success/40 text-success' },
   study:         { labelKey: 'type_study',         shortLabelKey: 'type_study_short',         icon: Activity,     pillClass: 'bg-secondary text-secondary-foreground' },
@@ -727,11 +727,11 @@ function BulkWorkedDialog({
           </div>
 
           {conflicts.length > 0 && (
-            <div className="space-y-1 rounded-md border border-warning/40 bg-warning/10 p-2 text-xs">
-              <div className="font-medium text-warning-foreground">
+            <div className="space-y-1 rounded-md border border-border bg-muted/30 p-2 text-xs">
+              <div className="font-medium text-attn">
                 {t('conflicts_worked', { count: conflicts.length })}
               </div>
-              <ul className="list-disc space-y-0.5 pl-4 text-warning-foreground tabular-nums">
+              <ul className="list-disc space-y-0.5 pl-4 text-attn tabular-nums">
                 {conflicts.map(c => <li key={c.date}>{c.date}</li>)}
               </ul>
             </div>
@@ -880,11 +880,11 @@ function BulkAbsenceDialog({
           </div>
 
           {conflicts.length > 0 && (
-            <div className="space-y-1 rounded-md border border-warning/40 bg-warning/10 p-2 text-xs">
-              <div className="font-medium text-warning-foreground">
+            <div className="space-y-1 rounded-md border border-border bg-muted/30 p-2 text-xs">
+              <div className="font-medium text-attn">
                 {t('conflicts_absence', { count: conflicts.length })}
               </div>
-              <ul className="list-disc space-y-0.5 pl-4 text-warning-foreground tabular-nums">
+              <ul className="list-disc space-y-0.5 pl-4 text-attn tabular-nums">
                 {conflicts.map(c => <li key={c.date}>{c.date}</li>)}
               </ul>
             </div>