diff --git a/esphome/esp-bedside-panel.yaml b/esphome/esp-bedside-panel.yaml
index 86353c8..d9913c2 100644
--- a/esphome/esp-bedside-panel.yaml
+++ b/esphome/esp-bedside-panel.yaml
@@ -6,6 +6,7 @@
 # https://home.fox.co.nz/gitea/zorruno/zorruno-homeassistant/src/branch/master/esphome/esp-bedside-panel.yaml
 #:########################################################################################:#
 # VERSIONS:
+# V1.28 2026-07-18 Restyled Atto Charging as top-row data with active red background
 # V1.27 2026-07-18 Added Open-Meteo rain sensors and rearranged Atto status/controls
 # V1.26 2026-07-18 Added Bedtime icon, snappier Security navigation and Atto text refinements
 # V1.25 2026-07-18 Reduced Jobs button line spacing to a balanced gap
@@ -128,12 +129,12 @@ substitutions:
   # Device Naming
   device_name: "esp-bedside-panel"
   friendly_name: "ESP Bedside Panel"
-  description_comment: "Guition JC1060P470C_I_W_Y ESP32-P4 bedside control panel. Open-Meteo rain probability and revised Atto status/control layout. (Layout V1.1)"
+  description_comment: "Guition JC1060P470C_I_W_Y ESP32-P4 bedside control panel. Open-Meteo rain probability and top-row Atto Charging status styling. (Layout V1.1)"
   device_area: "Bedroom"
 
   # Project Naming
   project_name: "Guition.JC1060P470C_I_W_Y"
-  project_version: "v1.27"
+  project_version: "v1.28"
 
   # Passwords & Secrets
   api_key: !secret esp-api_key
@@ -2650,7 +2651,7 @@ script:
                     ? lv_color_hex(0x315843)
                     : lv_color_hex(0x6B3A3A);
 
-            # Charging: prominent status and bright red active button.
+            # Charging: top-row data styling when idle, red background when active.
             - lvgl.label.update:
                 id: atto_charging_state_label
                 text: !lambda |-
@@ -2663,7 +2664,7 @@ script:
                 bg_color: !lambda |-
                   return id(ha_atto_charging).state
                     ? lv_color_hex(0xD32F2F)
-                    : lv_color_hex(0x28313D);
+                    : lv_color_hex(0x111923);
 
             # Charging schedule state.
             - lvgl.label.update:
@@ -5276,34 +5277,33 @@ lvgl:
             y: 22
             width: 220
             height: 92
-            bg_color: 0x28313D
+            bg_color: 0x111923
             bg_opa: COVER
-            border_width: 2
-            border_color: 0xA96363
+            border_width: 0
             radius: 17
+            clickable: false
             widgets:
               - label:
-                  align: LEFT_MID
-                  x: 10
-                  y: 0
+                  x: 17
+                  y: 31
                   text: "\U000F0084"
                   text_font: font_mdi_vehicle
                   text_color: 0xFFFFFF
 
               - label:
-                  x: 44
-                  y: 11
-                  width: 166
+                  x: 57
+                  y: 9
+                  width: 145
                   text: "Atto Charging"
                   text_font: font_small
                   text_align: CENTER
-                  text_color: 0xFFFFFF
+                  text_color: 0xAEB8C4
 
               - label:
                   id: atto_charging_state_label
-                  x: 44
-                  y: 43
-                  width: 166
+                  x: 57
+                  y: 38
+                  width: 145
                   text: "Off"
                   text_font: font_vehicle_bold
                   text_align: CENTER