feat: писюльки прыгают

lib/frontend/screens/calls/calls_tab.dart

@@ -18,6 +18,7 @@ import '../../widgets/chat_menu_overlay.dart';
 import '../../widgets/small_spinner.dart';
 import '../../widgets/prompt_dialog.dart';
 import '../../widgets/call_link_handler.dart';
+import '../../widgets/spectrum_tint.dart';
 import 'call_screen.dart';
 
 class CallsTab extends StatefulWidget {
@@ -27,7 +28,8 @@ class CallsTab extends StatefulWidget {
   State<CallsTab> createState() => _CallsTabState();
 }
 
-class _CallsTabState extends State<CallsTab> with ReloadOnReconnect {
+class _CallsTabState extends State<CallsTab>
+    with ReloadOnReconnect, SpectrumSurface {
   List<CallLogEntry> _calls = [];
   final Set<String> _removing = {};
   bool _isLoading = true;
@@ -469,7 +471,7 @@ class _CallsTabState extends State<CallsTab> with ReloadOnReconnect {
         : _calls;
 
     return Scaffold(
-      backgroundColor: cs.surface,
+      backgroundColor: spectrumSurfaceColor(cs),
       body: SafeArea(
         bottom: false,
         child: Column(

lib/frontend/screens/chats/chat_list_screen.dart

@@ -47,6 +47,7 @@ import '../../../core/protocol/packet.dart';
 import '../../../core/utils/haptics.dart';
 import '../../../core/config/app_animations.dart';
 import '../../../core/config/app_frost.dart';
+import '../../../core/config/app_spectrum_background.dart';
 import '../../../core/config/app_nav_pill_style.dart';
 import '../../../core/config/app_visual_style.dart';
 import '../../../core/config/app_stories.dart';
@@ -74,6 +75,8 @@ import '../../../main.dart'
         messagesModule,
         storiesModule;
 import '../../widgets/attachment/attachment_sheet.dart';
+import '../../widgets/spectrum_background.dart';
+import '../../widgets/spectrum_tint.dart';
 import '../../widgets/update_dialog.dart';
 import '../stories/story_composer_screen.dart';
 import '../stories/story_owner_info.dart';
@@ -189,7 +192,7 @@ class ChatListScreen extends StatefulWidget {
 enum _DeleteKind { personalLike, ownerGroup, blocked }
 
 class _ChatListScreenState extends State<ChatListScreen>
-    with TickerProviderStateMixin, RouteAware {
+    with TickerProviderStateMixin, RouteAware, SpectrumSurface {
   String? _selectedFolderId;
 
   List<ChatFolder> _folders = [];
@@ -2126,6 +2129,29 @@ class _ChatListScreenState extends State<ChatListScreen>
 
             return Stack(
               children: [
+                if (AppSpectrumBackground.isEnabled)
+                  Positioned.fill(
+                    child: AnimatedBuilder(
+                      animation: Listenable.merge([
+                        _navPageAnimController,
+                        _navDragDx,
+                      ]),
+                      child: const RepaintBoundary(child: SpectrumBackground()),
+                      builder: (context, child) {
+                        final pageDisplayT = _effectivePageNavRowT(
+                          inactiveWidth: inactiveWidth,
+                          bubbleLeftForIndex: bubbleLeftForPageT,
+                        );
+                        return Transform.translate(
+                          offset: Offset(
+                            -pageDisplayT * pageW * SpectrumTuning.parallax,
+                            0,
+                          ),
+                          child: child,
+                        );
+                      },
+                    ),
+                  ),
                 ClipRect(
                   child: SizedBox(
                     width: pageW,

lib/frontend/screens/contacts/contacts_tab.dart

@@ -14,6 +14,7 @@ import '../../widgets/komet_avatar.dart';
 import '../../widgets/connection_status.dart';
 import '../../widgets/sheet_helpers.dart';
 import '../../widgets/small_spinner.dart';
+import '../../widgets/spectrum_tint.dart';
 import '../../widgets/springy_tap.dart';
 import '../chats/chat_info_screen.dart';
 import 'nfc_exchange_sheet.dart';
@@ -28,7 +29,7 @@ class ContactsTab extends StatefulWidget {
   State<ContactsTab> createState() => _ContactsTabState();
 }
 
-class _ContactsTabState extends State<ContactsTab> {
+class _ContactsTabState extends State<ContactsTab> with SpectrumSurface {
   List<CachedContact> _contacts = [];
   bool _isLoading = true;
 
@@ -219,7 +220,7 @@ class _ContactsTabState extends State<ContactsTab> {
     final cs = Theme.of(context).colorScheme;
 
     return Scaffold(
-      backgroundColor: cs.surface,
+      backgroundColor: spectrumSurfaceColor(cs),
       body: SafeArea(
         bottom: false,
         child: Column(

lib/frontend/screens/profile/appearance_screen.dart

@@ -13,6 +13,7 @@ import '../../../core/config/app_chat_chrome.dart';
 import '../../../core/config/app_composer_background.dart';
 import '../../../core/config/app_composer_style.dart';
 import '../../../core/config/app_nav_pill_style.dart';
+import '../../../core/config/app_spectrum_background.dart';
 import '../../../core/utils/bubble_radius.dart';
 import '../../../core/utils/debouncer.dart';
 import '../../../core/utils/haptics.dart';
@@ -128,6 +129,8 @@ class _AppearanceScreenState extends State<AppearanceScreen> {
             const _NavPillStyleCard(),
             const SizedBox(height: 12),
             const _GradientToggleCard(),
+            const SizedBox(height: 12),
+            const _SpectrumToggleCard(),
           ],
         ),
       ),
@@ -521,6 +524,58 @@ class _GradientToggleCard extends StatelessWidget {
   }
 }
 
+class _SpectrumToggleCard extends StatelessWidget {
+  const _SpectrumToggleCard();
+
+  @override
+  Widget build(BuildContext context) {
+    final cs = Theme.of(context).colorScheme;
+    final l10n = AppLocalizations.of(context)!;
+    return GlossyPill(
+      color: cs.surfaceContainerHigh,
+      borderRadius: BorderRadius.circular(28),
+      padding: const EdgeInsets.fromLTRB(20, 14, 12, 14),
+      depth: 6,
+      child: Row(
+        children: [
+          Icon(Symbols.graphic_eq, color: cs.onSurface, size: 24, weight: 500),
+          const SizedBox(width: 14),
+          Expanded(
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text(
+                  l10n.appearanceSpectrumTitle,
+                  style: TextStyle(
+                    color: cs.onSurface,
+                    fontSize: 16,
+                    fontWeight: FontWeight.w700,
+                  ),
+                ),
+                const SizedBox(height: 2),
+                Text(
+                  l10n.appearanceSpectrumSubtitle,
+                  style: TextStyle(color: cs.onSurfaceVariant, fontSize: 13),
+                ),
+              ],
+            ),
+          ),
+          ValueListenableBuilder<bool>(
+            valueListenable: AppSpectrumBackground.current,
+            builder: (context, value, _) => Switch(
+              value: value,
+              onChanged: (v) {
+                Haptics.selection();
+                AppSpectrumBackground.save(v);
+              },
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
 class _PreviewSection extends StatefulWidget {
   final ValueNotifier<Color> color;
   final ValueNotifier<bool> isSystem;

lib/frontend/screens/profile/settings_tab.dart

@@ -38,6 +38,7 @@ import 'cloud_storage_screen.dart';
 import 'customization_section.dart';
 import 'debug_menu_screen.dart';
 import 'devices_screen.dart';
+import '../../widgets/spectrum_tint.dart';
 import 'edit_profile_screen.dart';
 import 'info_screen.dart';
 import 'komet_settings_screen.dart';
@@ -52,7 +53,7 @@ class SettingsTab extends StatefulWidget {
   State<SettingsTab> createState() => _SettingsTabState();
 }
 
-class _SettingsTabState extends State<SettingsTab> {
+class _SettingsTabState extends State<SettingsTab> with SpectrumSurface {
   ProfileData? _profile;
   bool _isPhoneVisible = false;
   ScrollController? _scrollController;
@@ -358,7 +359,7 @@ class _SettingsTabState extends State<SettingsTab> {
         final delta = expandedH - collapsedH;
         _syncHeaderDelta(delta);
         return Scaffold(
-          backgroundColor: cs.surface,
+          backgroundColor: spectrumSurfaceColor(cs),
           body: NotificationListener<ScrollNotification>(
             onNotification: (n) => _handleScrollNotification(n, delta),
             child: CustomScrollView(