neoagent 2.4.1-beta.30 → 2.4.1-beta.31

package/flutter_app/lib/features/onboarding/onboarding_companion_step.dart

@@ -6,6 +6,7 @@ import 'package:http/http.dart' as http;
 import 'package:url_launcher/url_launcher.dart';
 
 import '../../main.dart';
+import '../../src/theme/palette.dart';
 import 'onboarding_chrome.dart';
 
 class OnboardingCompanionStep extends StatefulWidget {
@@ -189,12 +190,13 @@ class _OnboardingCompanionStepState extends State<OnboardingCompanionStep> {
   }
 
   Widget _buildChannelSelector() {
+    final p = paletteOf(context);
     return Container(
       padding: const EdgeInsets.all(4),
       decoration: BoxDecoration(
-        color: Colors.white.withValues(alpha: 0.05),
-        borderRadius: BorderRadius.circular(16),
-        border: Border.all(color: Colors.white.withValues(alpha: 0.08)),
+        color: p.bgSecondary,
+        borderRadius: BorderRadius.circular(14),
+        border: Border.all(color: p.border),
       ),
       child: Row(
         mainAxisSize: MainAxisSize.min,
@@ -234,7 +236,9 @@ class _OnboardingCompanionStepState extends State<OnboardingCompanionStep> {
           child: Text(
             label,
             style: TextStyle(
-              color: isSelected ? Colors.white : Colors.white.withValues(alpha: 0.6),
+              color: isSelected
+                  ? paletteOf(context).textPrimary
+                  : paletteOf(context).textMuted,
               fontSize: 14,
               fontWeight: FontWeight.w700,
             ),
@@ -248,7 +252,6 @@ class _OnboardingCompanionStepState extends State<OnboardingCompanionStep> {
   Widget build(BuildContext context) {
     final width = MediaQuery.sizeOf(context).width;
     final useGrid = width >= 700;
-    final columns = width >= 1050 ? 3 : (useGrid ? 2 : 1);
 
     return AnimatedBuilder(
       animation: widget.controller,
@@ -333,12 +336,14 @@ class _OnboardingCompanionStepState extends State<OnboardingCompanionStep> {
                   _buildChannelSelector(),
                   if (_isLoadingReleases) ...[
                     const SizedBox(width: 12),
-                    const SizedBox(
+                    SizedBox(
                       width: 14,
                       height: 14,
                       child: CircularProgressIndicator(
                         strokeWidth: 2,
-                        valueColor: AlwaysStoppedAnimation<Color>(Colors.white54),
+                        valueColor: AlwaysStoppedAnimation<Color>(
+                          paletteOf(context).textMuted,
+                        ),
                       ),
                     ),
                   ],
@@ -348,11 +353,12 @@ class _OnboardingCompanionStepState extends State<OnboardingCompanionStep> {
               Expanded(
                 child: useGrid
                     ? GridView.builder(
-                        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-                          crossAxisCount: columns,
+                        gridDelegate:
+                            const SliverGridDelegateWithMaxCrossAxisExtent(
+                          maxCrossAxisExtent: 360,
                           crossAxisSpacing: 14,
                           mainAxisSpacing: 14,
-                          childAspectRatio: width >= 1050 ? 1.42 : 1.25,
+                          mainAxisExtent: 264,
                         ),
                         itemCount: items.length,
                         itemBuilder: (context, index) {
@@ -442,6 +448,7 @@ class _CompanionCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final p = paletteOf(context);
     final shellSize = compact ? 48.0 : 58.0;
     final iconSize = compact ? 24.0 : 30.0;
 
@@ -473,26 +480,24 @@ class _CompanionCard extends StatelessWidget {
                 item.title,
                 maxLines: 1,
                 overflow: TextOverflow.ellipsis,
-                style: const TextStyle(
-                  color: Colors.white,
-                  fontSize: 18,
-                  fontWeight: FontWeight.w800,
+                style: TextStyle(
+                  color: p.textPrimary,
+                  fontSize: 16,
+                  fontWeight: FontWeight.w700,
                 ),
               ),
               const SizedBox(height: 6),
-              Expanded(
-                child: Text(
-                  item.subtitle,
-                  maxLines: 3,
-                  overflow: TextOverflow.ellipsis,
-                  style: TextStyle(
-                    color: Colors.white.withValues(alpha: 0.68),
-                    fontSize: 13,
-                    height: 1.35,
-                  ),
+              Text(
+                item.subtitle,
+                maxLines: 2,
+                overflow: TextOverflow.ellipsis,
+                style: TextStyle(
+                  color: p.textMuted,
+                  fontSize: 13,
+                  height: 1.4,
                 ),
               ),
-              const SizedBox(height: 12),
+              const Spacer(),
               if (item.id == 'desktop' && !item.connected)
                 _PlatformSelector(
                   selectedPlatform: selectedDesktopPlatform,
@@ -525,17 +530,17 @@ class _CompanionCard extends StatelessWidget {
                   children: <Widget>[
                     Text(
                       item.title,
-                      style: const TextStyle(
-                        color: Colors.white,
-                        fontSize: 20,
-                        fontWeight: FontWeight.w800,
+                      style: TextStyle(
+                        color: p.textPrimary,
+                        fontSize: 18,
+                        fontWeight: FontWeight.w700,
                       ),
                     ),
                     const SizedBox(height: 5),
                     Text(
                       item.subtitle,
                       style: TextStyle(
-                        color: Colors.white.withValues(alpha: 0.68),
+                        color: p.textMuted,
                         fontSize: 14,
                         height: 1.45,
                       ),
@@ -585,7 +590,7 @@ class _StatusIndicator extends StatelessWidget {
           : Icon(
               Icons.arrow_circle_down_rounded,
               key: const ValueKey<String>('downloadable'),
-              color: Colors.white.withValues(alpha: 0.26),
+              color: paletteOf(context).textMuted.withValues(alpha: 0.5),
               size: 28,
             ),
     );
@@ -600,8 +605,10 @@ class _DownloadButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final p = paletteOf(context);
     if (item.connected) {
       return Container(
+        width: double.infinity,
         padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
         decoration: BoxDecoration(
           color: item.accentColor.withValues(alpha: 0.16),
@@ -610,15 +617,20 @@ class _DownloadButton extends StatelessWidget {
         ),
         child: Row(
           mainAxisSize: MainAxisSize.min,
+          mainAxisAlignment: MainAxisAlignment.center,
           children: <Widget>[
             Icon(Icons.done_all_rounded, size: 14, color: item.accentColor),
             const SizedBox(width: 6),
-            Text(
-              'Connected',
-              style: TextStyle(
-                color: item.accentColor,
-                fontSize: 12,
-                fontWeight: FontWeight.w700,
+            Flexible(
+              child: Text(
+                'Connected',
+                maxLines: 1,
+                overflow: TextOverflow.ellipsis,
+                style: TextStyle(
+                  color: item.accentColor,
+                  fontSize: 12,
+                  fontWeight: FontWeight.w700,
+                ),
               ),
             ),
           ],
@@ -627,33 +639,39 @@ class _DownloadButton extends StatelessWidget {
     }
 
     return Container(
+      width: double.infinity,
       padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
       decoration: BoxDecoration(
         color: isClicked
-            ? Colors.white.withValues(alpha: 0.08)
+            ? p.bgSecondary
             : item.accentColor.withValues(alpha: 0.12),
         borderRadius: BorderRadius.circular(12),
         border: Border.all(
           color: isClicked
-              ? Colors.white.withValues(alpha: 0.2)
+              ? p.borderLight
               : item.accentColor.withValues(alpha: 0.25),
         ),
       ),
       child: Row(
         mainAxisSize: MainAxisSize.min,
+        mainAxisAlignment: MainAxisAlignment.center,
         children: <Widget>[
           Icon(
             isClicked ? Icons.hourglass_empty_rounded : Icons.open_in_new_rounded,
             size: 14,
-            color: isClicked ? Colors.white70 : item.accentColor,
+            color: isClicked ? p.textMuted : item.accentColor,
           ),
           const SizedBox(width: 6),
-          Text(
-            isClicked ? 'Waiting for pairing...' : item.buttonText,
-            style: TextStyle(
-              color: isClicked ? Colors.white70 : Colors.white,
-              fontSize: 12,
-              fontWeight: FontWeight.w700,
+          Flexible(
+            child: Text(
+              isClicked ? 'Waiting for pairing...' : item.buttonText,
+              maxLines: 1,
+              overflow: TextOverflow.ellipsis,
+              style: TextStyle(
+                color: isClicked ? p.textMuted : item.accentColor,
+                fontSize: 12,
+                fontWeight: FontWeight.w700,
+              ),
             ),
           ),
         ],
@@ -673,26 +691,27 @@ class _PlatformSelector extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final p = paletteOf(context);
     return Container(
       margin: const EdgeInsets.only(bottom: 12),
       padding: const EdgeInsets.all(2),
       decoration: BoxDecoration(
-        color: Colors.white.withValues(alpha: 0.04),
+        color: p.bgSecondary,
         borderRadius: BorderRadius.circular(10),
-        border: Border.all(color: Colors.white.withValues(alpha: 0.06)),
+        border: Border.all(color: p.border),
       ),
       child: Row(
-        mainAxisSize: MainAxisSize.min,
         children: <Widget>[
-          _buildTab(TargetPlatform.macOS, 'macOS'),
-          _buildTab(TargetPlatform.windows, 'Windows'),
-          _buildTab(TargetPlatform.linux, 'Linux'),
+          Expanded(child: _buildTab(context, TargetPlatform.macOS, 'macOS')),
+          Expanded(child: _buildTab(context, TargetPlatform.windows, 'Windows')),
+          Expanded(child: _buildTab(context, TargetPlatform.linux, 'Linux')),
         ],
       ),
     );
   }
 
-  Widget _buildTab(TargetPlatform platform, String label) {
+  Widget _buildTab(BuildContext context, TargetPlatform platform, String label) {
+    final p = paletteOf(context);
     final isSelected = selectedPlatform == platform;
     return Material(
       color: Colors.transparent,
@@ -701,15 +720,18 @@ class _PlatformSelector extends StatelessWidget {
         borderRadius: BorderRadius.circular(8),
         child: AnimatedContainer(
           duration: const Duration(milliseconds: 180),
-          padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 6),
+          padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 6),
           decoration: BoxDecoration(
-            color: isSelected ? Colors.white.withValues(alpha: 0.08) : Colors.transparent,
+            color: isSelected ? p.bgCard : Colors.transparent,
             borderRadius: BorderRadius.circular(8),
           ),
           child: Text(
             label,
+            textAlign: TextAlign.center,
+            maxLines: 1,
+            overflow: TextOverflow.ellipsis,
             style: TextStyle(
-              color: isSelected ? Colors.white : Colors.white.withValues(alpha: 0.5),
+              color: isSelected ? p.textPrimary : p.textMuted,
               fontSize: 11,
               fontWeight: FontWeight.w700,
             ),

package/flutter_app/lib/features/onboarding/onboarding_messaging_step.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 
 import '../../main.dart';
+import '../../src/theme/palette.dart';
 import 'onboarding_chrome.dart';
 
 class OnboardingMessagingStep extends StatefulWidget {
@@ -29,7 +30,6 @@ class _OnboardingMessagingStepState extends State<OnboardingMessagingStep> {
         : messagingPlatforms;
     final width = MediaQuery.sizeOf(context).width;
     final useGrid = width >= 700;
-    final columns = width >= 1050 ? 3 : (useGrid ? 2 : 1);
 
     return OnboardingScaffold(
       step: 2,
@@ -79,11 +79,11 @@ class _OnboardingMessagingStepState extends State<OnboardingMessagingStep> {
       ),
       child: useGrid
           ? GridView.builder(
-              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-                crossAxisCount: columns,
+              gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
+                maxCrossAxisExtent: 360,
                 crossAxisSpacing: 14,
                 mainAxisSpacing: 14,
-                childAspectRatio: width >= 1050 ? 1.5 : 1.35,
+                mainAxisExtent: 160,
               ),
               itemCount: platforms.length,
               itemBuilder: (context, index) {
@@ -133,6 +133,7 @@ class _MessagingPlatformCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final p = paletteOf(context);
     final iconSize = compact ? 24.0 : 30.0;
     final shellSize = compact ? 48.0 : 58.0;
     return OnboardingOptionCard(
@@ -172,10 +173,10 @@ class _MessagingPlatformCard extends StatelessWidget {
                   platform.label,
                   maxLines: 1,
                   overflow: TextOverflow.ellipsis,
-                  style: const TextStyle(
-                    color: Colors.white,
-                    fontSize: 18,
-                    fontWeight: FontWeight.w800,
+                  style: TextStyle(
+                    color: p.textPrimary,
+                    fontSize: 16,
+                    fontWeight: FontWeight.w700,
                   ),
                 ),
                 const SizedBox(height: 4),
@@ -184,9 +185,9 @@ class _MessagingPlatformCard extends StatelessWidget {
                   maxLines: 2,
                   overflow: TextOverflow.ellipsis,
                   style: TextStyle(
-                    color: Colors.white.withValues(alpha: 0.68),
+                    color: p.textMuted,
                     fontSize: 13,
-                    height: 1.35,
+                    height: 1.4,
                   ),
                 ),
               ],
@@ -213,17 +214,17 @@ class _MessagingPlatformCard extends StatelessWidget {
                     children: <Widget>[
                       Text(
                         platform.label,
-                        style: const TextStyle(
-                          color: Colors.white,
-                          fontSize: 20,
-                          fontWeight: FontWeight.w800,
+                        style: TextStyle(
+                          color: p.textPrimary,
+                          fontSize: 18,
+                          fontWeight: FontWeight.w700,
                         ),
                       ),
                       const SizedBox(height: 5),
                       Text(
                         platform.subtitle,
                         style: TextStyle(
-                          color: Colors.white.withValues(alpha: 0.68),
+                          color: p.textMuted,
                           fontSize: 14,
                           height: 1.45,
                         ),
@@ -255,6 +256,7 @@ class _SelectionIcon extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final p = paletteOf(context);
     return AnimatedSwitcher(
       duration: const Duration(milliseconds: 220),
       child: selected
@@ -267,7 +269,7 @@ class _SelectionIcon extends StatelessWidget {
           : Icon(
               Icons.add_circle_outline_rounded,
               key: ValueKey<String>('idle-$id'),
-              color: Colors.white.withValues(alpha: 0.26),
+              color: p.textMuted.withValues(alpha: 0.5),
               size: 28,
             ),
     );

package/flutter_app/lib/features/onboarding/onboarding_model_step.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 
 import '../../main.dart';
+import '../../src/theme/palette.dart';
 import 'onboarding_chrome.dart';
 
 class OnboardingModelStep extends StatefulWidget {
@@ -76,7 +77,6 @@ class _OnboardingModelStepState extends State<OnboardingModelStep> {
   Widget build(BuildContext context) {
     final width = MediaQuery.sizeOf(context).width;
     final useGrid = width >= 720;
-    final columns = width >= 1150 ? 3 : (useGrid ? 2 : 1);
 
     return OnboardingScaffold(
       step: 3,
@@ -100,7 +100,7 @@ class _OnboardingModelStepState extends State<OnboardingModelStep> {
                 'No available models found.\nYou can configure providers later in Settings.',
                 textAlign: TextAlign.center,
                 style: TextStyle(
-                  color: Colors.white.withValues(alpha: 0.6),
+                  color: paletteOf(context).textMuted,
                   fontSize: 16,
                   height: 1.5,
                 ),
@@ -108,11 +108,11 @@ class _OnboardingModelStepState extends State<OnboardingModelStep> {
             )
           : useGrid
           ? GridView.builder(
-              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-                crossAxisCount: columns,
+              gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
+                maxCrossAxisExtent: 380,
                 crossAxisSpacing: 14,
                 mainAxisSpacing: 14,
-                childAspectRatio: width >= 1150 ? 1.38 : 1.18,
+                mainAxisExtent: 214,
               ),
               itemCount: _models.length,
               itemBuilder: (context, index) {
@@ -193,6 +193,7 @@ class _ModelChoiceCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final p = paletteOf(context);
     final shellSize = compact ? 48.0 : 58.0;
     final iconSize = compact ? 24.0 : 30.0;
     final titleSize = compact ? 17.0 : 20.0;
@@ -231,7 +232,7 @@ class _ModelChoiceCard extends StatelessWidget {
                           : Icon(
                               Icons.radio_button_unchecked_rounded,
                               key: ValueKey<String>('idle-${model.id}'),
-                              color: Colors.white.withValues(alpha: 0.25),
+                              color: p.textMuted.withValues(alpha: 0.5),
                               size: 28,
                             ),
                     ),
@@ -243,9 +244,9 @@ class _ModelChoiceCard extends StatelessWidget {
                   maxLines: 1,
                   overflow: TextOverflow.ellipsis,
                   style: TextStyle(
-                    color: Colors.white,
+                    color: p.textPrimary,
                     fontSize: titleSize,
-                    fontWeight: FontWeight.w800,
+                    fontWeight: FontWeight.w700,
                   ),
                 ),
                 const SizedBox(height: 6),
@@ -255,7 +256,7 @@ class _ModelChoiceCard extends StatelessWidget {
                     vertical: 5,
                   ),
                   decoration: BoxDecoration(
-                    color: Colors.white.withValues(alpha: 0.08),
+                    color: p.bgSecondary,
                     borderRadius: BorderRadius.circular(999),
                   ),
                   child: Text(
@@ -263,7 +264,7 @@ class _ModelChoiceCard extends StatelessWidget {
                     maxLines: 1,
                     overflow: TextOverflow.ellipsis,
                     style: TextStyle(
-                      color: Colors.white.withValues(alpha: 0.72),
+                      color: p.textMuted,
                       fontSize: 11,
                       fontWeight: FontWeight.w700,
                     ),
@@ -275,7 +276,7 @@ class _ModelChoiceCard extends StatelessWidget {
                   maxLines: 3,
                   overflow: TextOverflow.ellipsis,
                   style: TextStyle(
-                    color: Colors.white.withValues(alpha: 0.68),
+                    color: p.textMuted,
                     fontSize: purposeSize,
                     height: 1.35,
                   ),
@@ -306,9 +307,9 @@ class _ModelChoiceCard extends StatelessWidget {
                           Text(
                             model.label,
                             style: TextStyle(
-                              color: Colors.white,
+                              color: p.textPrimary,
                               fontSize: titleSize,
-                              fontWeight: FontWeight.w800,
+                              fontWeight: FontWeight.w700,
                             ),
                           ),
                           Container(
@@ -317,13 +318,13 @@ class _ModelChoiceCard extends StatelessWidget {
                               vertical: 5,
                             ),
                             decoration: BoxDecoration(
-                              color: Colors.white.withValues(alpha: 0.08),
+                              color: p.bgSecondary,
                               borderRadius: BorderRadius.circular(999),
                             ),
                             child: Text(
                               model.provider,
                               style: TextStyle(
-                                color: Colors.white.withValues(alpha: 0.72),
+                                color: p.textMuted,
                                 fontSize: 12,
                                 fontWeight: FontWeight.w700,
                               ),
@@ -335,7 +336,7 @@ class _ModelChoiceCard extends StatelessWidget {
                       Text(
                         model.purpose,
                         style: TextStyle(
-                          color: Colors.white.withValues(alpha: 0.68),
+                          color: p.textMuted,
                           fontSize: purposeSize,
                           height: 1.45,
                         ),
@@ -355,7 +356,7 @@ class _ModelChoiceCard extends StatelessWidget {
                       : Icon(
                           Icons.radio_button_unchecked_rounded,
                           key: ValueKey<String>('idle-${model.id}'),
-                          color: Colors.white.withValues(alpha: 0.25),
+                          color: p.textMuted.withValues(alpha: 0.5),
                           size: 28,
                         ),
                 ),

package/flutter_app/lib/features/onboarding/onboarding_shell.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import '../../main.dart';
+import '../../src/theme/palette.dart';
 import 'onboarding_video_step.dart';
 import 'onboarding_welcome_step.dart';
 import 'onboarding_companion_step.dart';
@@ -38,7 +39,7 @@ class _OnboardingShellState extends State<OnboardingShell> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      backgroundColor: Colors.black, // Deep black for video and transitions
+      backgroundColor: paletteOf(context).bgPrimary,
       body: PageView(
         controller: _pageController,
         physics:

package/flutter_app/lib/features/onboarding/onboarding_video_step.dart

@@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:video_player/video_player.dart';
 
+import '../../src/theme/palette.dart';
 import 'onboarding_chrome.dart';
 
 class OnboardingVideoStep extends StatefulWidget {
@@ -75,26 +76,27 @@ class _OnboardingVideoStepState extends State<OnboardingVideoStep> {
     final orientation = MediaQuery.orientationOf(context);
 
     if (_hasError) {
+      final p = paletteOf(context);
       return Scaffold(
-        backgroundColor: Colors.black,
+        backgroundColor: p.bgPrimary,
         body: Center(
           child: Padding(
             padding: const EdgeInsets.all(32),
             child: Column(
               mainAxisSize: MainAxisSize.min,
               children: <Widget>[
-                const Icon(
+                Icon(
                   Icons.play_circle_outline_rounded,
-                  color: Colors.white70,
+                  color: p.accent,
                   size: 56,
                 ),
                 const SizedBox(height: 18),
-                const Text(
+                Text(
                   'Continue to setup',
                   style: TextStyle(
-                    color: Colors.white,
+                    color: p.textPrimary,
                     fontSize: 26,
-                    fontWeight: FontWeight.w800,
+                    fontWeight: FontWeight.w700,
                   ),
                 ),
                 const SizedBox(height: 12),
@@ -102,7 +104,7 @@ class _OnboardingVideoStepState extends State<OnboardingVideoStep> {
                   'The intro is not available on this device.',
                   textAlign: TextAlign.center,
                   style: TextStyle(
-                    color: Colors.white.withValues(alpha: 0.68),
+                    color: p.textMuted,
                     fontSize: 15,
                     height: 1.5,
                   ),
@@ -135,7 +137,7 @@ class _OnboardingVideoStepState extends State<OnboardingVideoStep> {
     }
 
     return Scaffold(
-      backgroundColor: Colors.black,
+      backgroundColor: portrait ? paletteOf(context).bgPrimary : Colors.black,
       body: portrait
           ? const _RotatePrompt()
           : Stack(
@@ -183,21 +185,22 @@ class _RotatePrompt extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final p = paletteOf(context);
     return Center(
       child: Padding(
         padding: const EdgeInsets.all(32),
         child: Column(
           mainAxisSize: MainAxisSize.min,
           children: <Widget>[
-            const Icon(Icons.screen_rotation, color: Colors.white, size: 54),
+            Icon(Icons.screen_rotation, color: p.accent, size: 54),
             const SizedBox(height: 18),
-            const Text(
+            Text(
               'Rotate to continue',
               textAlign: TextAlign.center,
               style: TextStyle(
-                color: Colors.white,
+                color: p.textPrimary,
                 fontSize: 24,
-                fontWeight: FontWeight.w800,
+                fontWeight: FontWeight.w700,
               ),
             ),
             const SizedBox(height: 10),
@@ -205,7 +208,7 @@ class _RotatePrompt extends StatelessWidget {
               'This intro is designed for full-screen landscape playback.',
               textAlign: TextAlign.center,
               style: TextStyle(
-                color: Colors.white.withValues(alpha: 0.7),
+                color: p.textMuted,
                 fontSize: 15,
                 height: 1.5,
               ),