lib/app_theme_business_object.dart

@@ -3,6 +3,12 @@ import 'package:flutter/material.dart';
 class AppThemeColors {
   const AppThemeColors({
     required this.primarySeed,
+    required this.secondarySeed,
+    required this.scaffoldGradientStart,
+    required this.scaffoldGradientEnd,
+    required this.shellSurface,
+    required this.shellBorder,
+    required this.accent,
     required this.webViewBorder,
     required this.webViewBackground,
     required this.controlsGradientStart,
@@ -12,6 +18,12 @@ class AppThemeColors {
   });
 
   final Color primarySeed;
+  final Color secondarySeed;
+  final Color scaffoldGradientStart;
+  final Color scaffoldGradientEnd;
+  final Color shellSurface;
+  final Color shellBorder;
+  final Color accent;
   final Color webViewBorder;
   final Color webViewBackground;
   final Color controlsGradientStart;
@@ -22,23 +34,35 @@ class AppThemeColors {
 
 class AppThemeBusinessObject {
   static const AppThemeColors lightColors = AppThemeColors(
-    primarySeed: Color(0xFF607D8B),
+    primarySeed: Color(0xFFE36A18),
-    webViewBorder: Color(0x42000000),
+    secondarySeed: Color(0xFF1663C7),
+    scaffoldGradientStart: Color(0xFFFFF3E3),
+    scaffoldGradientEnd: Color(0xFFE6F2FF),
+    shellSurface: Color(0xF7FFFFFF),
+    shellBorder: Color(0x1A1A4D86),
+    accent: Color(0xFF0F5DB6),
+    webViewBorder: Color(0x261A4D86),
     webViewBackground: Color(0xFFFFFFFF),
-    controlsGradientStart: Color(0xFFE1F5FE),
+    controlsGradientStart: Color(0xFFFFB465),
-    controlsGradientEnd: Color(0xFFB3E5FC),
+    controlsGradientEnd: Color(0xFF69ADFF),
-    controlsShadow: Color(0x22000000),
+    controlsShadow: Color(0x24114B7A),
-    statusText: Color(0xDD000000),
+    statusText: Color(0xFF13243D),
   );
 
   static const AppThemeColors darkColors = AppThemeColors(
-    primarySeed: Color(0xFF37474F),
+    primarySeed: Color(0xFFFF9D59),
-    webViewBorder: Color(0x66FFFFFF),
+    secondarySeed: Color(0xFF76B8FF),
-    webViewBackground: Color(0xFF0F1417),
+    scaffoldGradientStart: Color(0xFF0F1C30),
-    controlsGradientStart: Color(0xFF1B2731),
+    scaffoldGradientEnd: Color(0xFF31190C),
-    controlsGradientEnd: Color(0xFF233744),
+    shellSurface: Color(0xD9162438),
+    shellBorder: Color(0x3366AAFF),
+    accent: Color(0xFFFFBC7E),
+    webViewBorder: Color(0x3378B7FF),
+    webViewBackground: Color(0xFF0C1420),
+    controlsGradientStart: Color(0xFF275792),
+    controlsGradientEnd: Color(0xFF9A4F1F),
     controlsShadow: Color(0x44000000),
-    statusText: Color(0xE6FFFFFF),
+    statusText: Color(0xFFF4F7FF),
   );
 
   static bool isDarkMode(BuildContext context) {
@@ -50,19 +74,62 @@ class AppThemeBusinessObject {
   }
 
   static ThemeData lightTheme() {
+    final ColorScheme scheme =
+        ColorScheme.fromSeed(
+          seedColor: lightColors.primarySeed,
+          brightness: Brightness.light,
+        ).copyWith(
+          primary: lightColors.primarySeed,
+          secondary: lightColors.secondarySeed,
+          tertiary: const Color(0xFF2C85E1),
+          surface: const Color(0xFFFFFBF7),
+          onSurface: lightColors.statusText,
+        );
+
     return ThemeData(
-      colorScheme: ColorScheme.fromSeed(seedColor: lightColors.primarySeed),
       useMaterial3: true,
+      colorScheme: scheme,
+      scaffoldBackgroundColor: scheme.surface,
+      elevatedButtonTheme: ElevatedButtonThemeData(
+        style: ElevatedButton.styleFrom(
+          backgroundColor: scheme.primary,
+          foregroundColor: scheme.onPrimary,
+          padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 14),
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(16),
+          ),
+        ),
+      ),
     );
   }
 
   static ThemeData darkTheme() {
-    return ThemeData(
+    final ColorScheme scheme =
-      colorScheme: ColorScheme.fromSeed(
+        ColorScheme.fromSeed(
           seedColor: darkColors.primarySeed,
           brightness: Brightness.dark,
-      ),
+        ).copyWith(
+          primary: darkColors.primarySeed,
+          secondary: darkColors.secondarySeed,
+          tertiary: const Color(0xFF4E97E8),
+          surface: const Color(0xFF111A27),
+          onSurface: darkColors.statusText,
+        );
+
+    return ThemeData(
       useMaterial3: true,
+      colorScheme: scheme,
+      scaffoldBackgroundColor: scheme.surface,
+      elevatedButtonTheme: ElevatedButtonThemeData(
+        style: ElevatedButton.styleFrom(
+          backgroundColor: scheme.primary,
+          foregroundColor: scheme.onPrimary,
+          padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 14),
+          shape: RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(16),
+          ),
+        ),
+      ),
     );
   }
 }

lib/main.dart

@@ -118,31 +118,84 @@ class _MainPageState extends State<MainPage> {
   @override
   Widget build(BuildContext context) {
     final themeColors = AppThemeBusinessObject.colorsFor(context);
+    final theme = Theme.of(context);
 
     return Scaffold(
-      body: SafeArea(
+      body: DecoratedBox(
-        child: Column(
+        decoration: BoxDecoration(
-          children: [
+          gradient: LinearGradient(
-            Expanded(
+            begin: Alignment.topLeft,
-              flex: 9,
+            end: Alignment.bottomRight,
+            colors: [
+              themeColors.scaffoldGradientStart,
+              themeColors.scaffoldGradientEnd,
+            ],
+          ),
+        ),
+        child: SafeArea(
           child: Padding(
             padding: const EdgeInsets.all(12),
+            child: Column(
+              children: [
+                Container(
+                  width: double.infinity,
+                  padding: const EdgeInsets.all(14),
+                  decoration: BoxDecoration(
+                    color: themeColors.shellSurface,
+                    borderRadius: BorderRadius.circular(24),
+                    border: Border.all(color: themeColors.shellBorder),
+                    boxShadow: [
+                      BoxShadow(
+                        color: themeColors.controlsShadow,
+                        blurRadius: 18,
+                        offset: const Offset(0, 10),
+                      ),
+                    ],
+                  ),
+                  child: Row(
+                    children: [
+                      ClipRRect(
+                        borderRadius: BorderRadius.circular(18),
+                        child: Image.asset(
+                          'assets/icon/app_icon.png',
+                          width: 72,
+                          height: 72,
+                          fit: BoxFit.cover,
+                        ),
+                      ),
+                      const SizedBox(width: 14),
+                      Expanded(
+                        child: Text(
+                          'KRYZ Go!',
+                          textAlign: TextAlign.center,
+                          style: theme.textTheme.headlineMedium?.copyWith(
+                            fontWeight: FontWeight.w900,
+                            letterSpacing: 0.4,
+                            color: themeColors.statusText,
+                          ),
+                        ),
+                      ),
+                      const SizedBox(width: 86),
+                    ],
+                  ),
+                ),
+                const SizedBox(height: 12),
+                Expanded(
                   child: LiveInfoPanel(
                     liveInfo: _liveInfo,
                     themeColors: themeColors,
                     intervalOptions: _intervalOptions,
                   ),
                 ),
-            ),
+                const SizedBox(height: 12),
-            Expanded(
+                Container(
-              flex: 1,
-              child: Padding(
-                padding: const EdgeInsets.fromLTRB(12, 0, 12, 12),
-                child: Container(
                   width: double.infinity,
-                  padding: const EdgeInsets.symmetric(horizontal: 16),
+                  padding: const EdgeInsets.symmetric(
+                    horizontal: 16,
+                    vertical: 14,
+                  ),
                   decoration: BoxDecoration(
-                    borderRadius: BorderRadius.circular(20),
+                    borderRadius: BorderRadius.circular(24),
                     gradient: LinearGradient(
                       begin: Alignment.topLeft,
                       end: Alignment.bottomRight,
@@ -155,35 +208,41 @@ class _MainPageState extends State<MainPage> {
                       BoxShadow(
                         color: themeColors.controlsShadow,
                         blurRadius: 14,
-                        offset: Offset(0, 6),
+                        offset: const Offset(0, 6),
                       ),
                     ],
                   ),
-                  child: Row(
+                  child: Wrap(
-                    mainAxisAlignment: MainAxisAlignment.center,
+                    alignment: WrapAlignment.center,
+                    crossAxisAlignment: WrapCrossAlignment.center,
+                    spacing: 12,
+                    runSpacing: 12,
                     children: [
-                      ElevatedButton(
+                      ElevatedButton.icon(
                         onPressed: _audio.isStopped ? _play : null,
-                        child: const Text('▶️'),
+                        icon: const Icon(Icons.play_arrow_rounded),
+                        label: const Text('Play'),
                       ),
-                      const SizedBox(width: 12),
+                      ElevatedButton.icon(
-                      ElevatedButton(
                         onPressed: _audio.isStopped ? null : _stop,
-                        child: const Text('⏹️'),
+                        icon: const Icon(Icons.stop_rounded),
+                        label: const Text('Stop'),
                       ),
-                      const SizedBox(width: 16),
                       Text(
                         _playbackStatusLabel(),
-                        style: TextStyle(color: themeColors.statusText),
+                        style: theme.textTheme.titleSmall?.copyWith(
+                          fontWeight: FontWeight.w700,
+                          color: themeColors.statusText,
+                        ),
+                      ),
+                    ],
+                  ),
                 ),
               ],
             ),
           ),
         ),
       ),
-          ],
-        ),
-      ),
     );
   }
 }

linux/CMakeLists.txt

@@ -1,6 +1,6 @@
 # Project-level configuration.
 cmake_minimum_required(VERSION 3.13)
-project(KRYZ Go! LANGUAGES CXX)
+project(KRYZ_Go! LANGUAGES CXX)
 
 # The name of the executable created for the application. Change this to change
 # the on-disk name of your application.

pubspec.yaml

@@ -63,6 +63,8 @@ flutter:
   # included with your application, so that you can use the icons in
   # the material Icons class.
   uses-material-design: true
+  assets:
+    - assets/icon/app_icon.png
 
   # To add assets to your application, add an assets section, like this:
   # assets: