💅 style(launcher, notification_popup): update keyboard focus styling and add discharging battery icons

styles/components.css

@@ -64,6 +64,30 @@
   border: 3px solid var(--red);
 }
 
+#battery-circle.discharging {
+  border: 3px solid var(--yellow);
+}
+
+#battery-circle.discharging-low {
+  border: 3px solid var(--orange);
+}
+
+#battery-circle.discharging-critical {
+  border: 3px solid var(--red-dim);
+}
+
+#battery-icon.discharging {
+  color: var(--yellow);
+}
+
+#battery-icon.discharging-low {
+  color: var(--orange);
+}
+
+#battery-icon.discharging-critical {
+  color: var(--red-dim);
+}
+
 /*
  * ── metrics ───────────────────────────────────────────────────────────
 */

styles/launcher.css

@@ -22,6 +22,22 @@
   border-radius: 16px;
 }
 
+/* Keyboard focus styling for header buttons */
+#close-button.focused,
+#config-button.focused {
+  background-color: var(--primary);
+  border-radius: 16px;
+  box-shadow: 0 0 0 2px var(--primary-bright);
+}
+
+#close-button.focused #close-label {
+  color: var(--background);
+}
+
+#config-button.focused #config-label {
+  color: var(--background);
+}
+
 #close-button:active {
   background-color: var(--red-dim);
   border-radius: 40px;