Create custom.css

custom.css

@@ -0,0 +1,30 @@
+/**************************
+WynGPT - custom.css (final optimized + enlarged settings popup)
+***************************/
+
+/* === Voice mode button: gradient + blur + glow === */
+[aria-label="Voice mode"] {
+  background: linear-gradient(135deg,#ffffff,#cceeff,#99ddff,#66ccff,#33ccff,#00ccff);
+  background-size: 600% 600%;
+  animation: blendShift 16s ease-in-out infinite;
+  color: #fff; border: none;
+  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
+  box-shadow: 0 0 20px rgba(0,204,255,.4),0 0 40px rgba(0,204,255,.3),0 0 60px rgba(0,204,255,.2);
+  transition: .3s; position: relative; z-index: 1;
+}
+@keyframes blendShift {
+  0% { background-position: 0% 50% }
+  50% { background-position: 100% 50% }
+  100% { background-position: 0% 50% }
+}
+
+/* === Tooltip (Tippy) blur === */
+.tippy-box {
+  background: rgba(255,255,255,.5) !important;
+  backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important;
+  color: #000 !important; border: 1px solid rgba(0,0,0,.1) !important;
+}
+html.dark .tippy-box, :root.dark .tippy-box {
+  background: rgba(0,0,0,.5) !important;
+  backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important;
+  color: #fff !important; border: 1px solid rgba(255,255,255,.1) !important;