Compress unnecessary css splitting.

Author: nedtwigg

browser-extension/src/entrypoints/popup/style.css

@@ -1,2 +1,16 @@
-@import url("../../styles/popup-frame.css");
 @import "tailwindcss";
+/* Popup window frame styles */
+:root {
+  --popup-width: 600px;
+  --popup-height: 400px;
+}
+
+body {
+  width: var(--popup-width);
+  height: var(--popup-height);
+  padding: 15px;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  font-size: 14px;
+  line-height: 1.4;
+  margin: 0;
+}

browser-extension/src/styles/globals.css

@@ -30,10 +30,11 @@ const App = () => {
                 key={mode}
                 type='button'
                 onClick={() => setActiveComponent(mode as Mode)}
-                className={`px-3 py-2 rounded text-sm font-medium transition-colors ${activeComponent === mode
-                  ? 'bg-blue-600 text-white'
-                  : 'bg-gray-100 text-gray-700 hover:bg-gray-200'
-                  }`}
+                className={`px-3 py-2 rounded text-sm font-medium transition-colors ${
+                  activeComponent === mode
+                    ? 'bg-blue-600 text-white'
+                    : 'bg-gray-100 text-gray-700 hover:bg-gray-200'
+                }`}
               >
                 {config.label}
               </button>