eww widgets and theme cycle with waybar button

eww/eww.scss

@@ -0,0 +1,48 @@
+* { all: unset; }
+
+.volume-overlay {
+  background: rgba(15, 15, 20, 0.92);
+  border: 1px solid rgba(255,255,255,0.08);
+  border-radius: 12px;
+  padding: 16px;
+  backdrop-filter: blur(20px);
+  color: #e0e0e0;
+  font-family: "JetBrains Mono", monospace;
+}
+
+.header {
+  margin-bottom: 4px;
+  .header-icon { font-size: 18px; color: #33ccff; }
+  .header-title { font-size: 14px; font-weight: bold; color: #fff; }
+}
+
+.divider {
+  background: rgba(255,255,255,0.07);
+  min-height: 1px;
+  margin: 4px 0;
+}
+
+.sink-row {
+  padding: 4px 0;
+  .app-name { font-size: 12px; color: #aaa; min-width: 120px; }
+  .app-vol  { font-size: 12px; color: #33ccff; margin-left: auto; }
+  .app-icon { font-size: 14px; color: #666; }
+}
+
+.vol-slider {
+  min-height: 20px;
+  trough { background: rgba(255,255,255,0.1); border-radius: 4px; min-height: 4px; }
+  highlight { background: linear-gradient(90deg, #33ccff, #00ff99); border-radius: 4px; }
+  slider { background: #fff; border-radius: 50%; min-width: 12px; min-height: 12px; }
+}
+
+.mute-btn {
+  margin-top: 8px;
+  background: rgba(255,255,255,0.06);
+  border-radius: 8px;
+  padding: 8px;
+  font-size: 13px;
+  color: #aaa;
+  &:hover { background: rgba(255,255,255,0.12); }
+  &.muted { color: #ff5555; background: rgba(255,85,85,0.1); }
+}