fix(android): restore wordmark+subtitle header, content padding, OS light/dark theme

android/app/src/main/java/com/yarisobd/app/MainActivity.kt

@@ -35,6 +35,7 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
 import com.yarisobd.app.data.remote.dto.TripSummary
 import com.yarisobd.app.ui.components.YarisHeader
@@ -190,7 +191,7 @@ fun YarisMainScreen(client: OkHttpClient) {
             }
         }
     ) { padding ->
-        Column(modifier = Modifier.padding(padding)) {
+        Column(modifier = Modifier.padding(padding).padding(start = 4.dp, end = 4.dp, bottom = 16.dp)) {
             when (selectedTab) {
                 0 -> DashboardScreen(
                     gps = gps,

android/app/src/main/java/com/yarisobd/app/ui/components/YarisHeader.kt

@@ -1,18 +1,20 @@
 package com.yarisobd.app.ui.components
 
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.statusBarsPadding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.drawBehind
-import androidx.compose.ui.geometry.Offset
-import androidx.compose.ui.geometry.Size
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.font.FontStyle
 import androidx.compose.ui.text.font.FontWeight
@@ -21,33 +23,39 @@ import androidx.compose.ui.unit.sp
 import com.yarisobd.app.ui.theme.YarisDark
 import com.yarisobd.app.ui.theme.YarisRed
 
-/** Global dark top bar matching the web UI's mobile topbar + YARIS wordmark. */
+/** Global dark top bar: YARIS wordmark + red underline + phase subtitle. */
 @Composable
 fun YarisHeader() {
     Surface(color = YarisDark) {
-        Row(Modifier.fillMaxWidth().statusBarsPadding()) {
+        Column(
-            Column(
+            Modifier
+                .fillMaxWidth()
+                .statusBarsPadding()
+                .padding(horizontal = 16.dp, vertical = 10.dp)
+        ) {
+            Text(
+                "YARIS-OBD",
+                style = MaterialTheme.typography.titleLarge.copy(
+                    fontWeight = FontWeight.Normal,
+                    fontStyle = FontStyle.Italic,
+                    letterSpacing = 1.5.sp,
+                ),
+                color = Color.White,
+                maxLines = 1,
+            )
+            Spacer(Modifier.height(2.dp))
+            Box(
                 Modifier
-                    .padding(horizontal = 16.dp, vertical = 12.dp)
+                    .width(48.dp)
-                    .drawBehind {
+                    .height(3.dp)
-                        drawRect(
+                    .background(YarisRed, RoundedCornerShape(2.dp))
-                            color = YarisRed,
+            )
-                            topLeft = Offset(0f, size.height - 4.dp.toPx()),
+            Spacer(Modifier.height(6.dp))
-                            size = Size(size.width, 3.dp.toPx()),
+            Text(
-                        )
+                "phase 28 — android companion",
-                    }
+                style = MaterialTheme.typography.bodySmall,
-            ) {
+                color = Color.White.copy(alpha = 0.55f),
-                Text(
+            )
-                    "YARIS-OBD",
-                    style = MaterialTheme.typography.titleLarge.copy(
-                        fontWeight = FontWeight.Normal,
-                        fontStyle = FontStyle.Italic,
-                        letterSpacing = 1.2.sp,
-                    ),
-                    color = Color.White,
-                    maxLines = 1,
-                )
-            }
         }
     }
 }

android/app/src/main/java/com/yarisobd/app/ui/theme/Theme.kt

@@ -54,18 +54,28 @@ private val LightColorScheme = lightColorScheme(
 private val DarkColorScheme = darkColorScheme(
     primary = YarisBlue,
     onPrimary = Color.White,
-    background = YarisDark,
+    primaryContainer = Color(0xFF2B3B6E),
+    onPrimaryContainer = Color(0xFFD6E0FB),
+    secondary = YarisBlue,
+    onSecondary = Color.White,
+    background = Color(0xFF121316),
     onBackground = Color(0xFFE0E0E0),
     surface = YarisDark,
     onSurface = Color(0xFFE0E0E0),
     surfaceContainerHigh = Color(0xFF2A2A2C),
+    surfaceContainer = YarisDark,
+    surfaceVariant = Color(0xFF2A2A2C),
     onSurfaceVariant = Color(0xFFAAAAAA),
     error = YarisRed,
+    onError = Color.White,
+    errorContainer = Color(0xFF5A1016),
+    onErrorContainer = Color(0xFFFBE3E5),
+    outline = Color(0xFF3A3A3C),
 )
 
 @Composable
 fun YarisOBDTheme(
-    darkTheme: Boolean = false, // the web UI is light — match it by default
+    darkTheme: Boolean = isSystemInDarkTheme(),
     dynamicColor: Boolean = false, // Off by default — use our brand colors
     content: @Composable () -> Unit
 ) {
@@ -82,7 +92,6 @@ fun YarisOBDTheme(
     if (!view.isInEditMode) {
         SideEffect {
             val window = (view.context as Activity).window
-            window.statusBarColor = YarisDark.toArgb()
             // Dark top bar sits under the status bar, so status icons stay light.
             WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = false
         }