Implement comprehensive dark/light mode overhaul for admin panel

- Refactor color palette in `ui-design-spec.md` to utilize CSS variables exclusively, eliminating fixed hex values and Tailwind utility classes.
- Complete dark mode implementation in `uiStore.ts`, ensuring proper theme application via `applyTheme()` and `applyBrand()`.
- Create `admin-theme-dark-light-audit.md` to document the transition process, outlining issues with inline styles and fixed colors.
- Introduce `theme-tokens.test.ts` to enforce rules against fixed hex colors and ensure compliance with the design system.
- Update various components and styles to replace inline styles and fixed colors with CSS variables, ensuring consistent theming across light and dark modes.
- Ensure all changes maintain visual integrity in both light and dark modes, with a focus on accessibility and contrast standards.

assets/admin/pages/SmsWalletPage.tsx

@@ -117,7 +117,7 @@ function SmsWalletPageInner() {
         <div style={{
           background: 'linear-gradient(135deg, oklch(0.52 0.22 256), oklch(0.40 0.18 256))',
           borderRadius: 'var(--r)', padding: '24px 24px 20px',
-          color: '#fff', position: 'relative', overflow: 'hidden', gridColumn: '1 / 2',
+          color: 'var(--on-primary)', position: 'relative', overflow: 'hidden', gridColumn: '1 / 2',
         }}>
           <div style={{
             position: 'absolute', top: -30, left: -30,
@@ -147,14 +147,14 @@ function SmsWalletPageInner() {
                 <div style={{
                   height: '100%', borderRadius: 8,
                   width: `${Math.min(100, (smsCount / 500) * 100)}%`,
-                  background: isLowBalance ? '#ef4444' : 'rgba(255,255,255,0.85)',
+                  background: isLowBalance ? 'var(--danger)' : 'rgba(255,255,255,0.85)',
                   transition: 'width 0.4s ease',
                 }} />
               </div>
               {canCreate && (
                 <button
                   style={{
-                    background: '#fff', color: 'var(--primary)', border: 'none', borderRadius: 8,
+                    background: 'var(--surface)', color: 'var(--primary)', border: 'none', borderRadius: 8,
                     padding: '8px 18px', fontWeight: 700, fontSize: 13.5, cursor: 'pointer',
                     display: 'inline-flex', alignItems: 'center', gap: 6,
                   }}