fix: remove global styles from final css build (#139)

* fix: remove global styles for body tag

* fix: copy global css to styles.css

* docs: update docs with warning about prod usage

* fix: remove colorscheme from :root

Author: arjunvegda

README.md

@@ -125,6 +125,7 @@ type DevToolsProps = {
 
 ```tsx
 import { DevTools } from 'jotai-devtools';
+// Note that this may get included in your production builds. Please import it conditionally if you want to avoid that
 import 'jotai-devtools/styles.css';
 
 const App = () => {
@@ -142,6 +143,7 @@ const App = () => {
 ```tsx
 import { createStore } from 'jotai';
 import { DevTools } from 'jotai-devtools';
+// Note that this may get included in your production builds. Please import it conditionally if you want to avoid that
 import 'jotai-devtools/styles.css';
 
 const customStore = createStore();
@@ -191,6 +193,9 @@ and is replaced it with native CSS.
 
 2. Replace `@emotion/react` with `jotai-devtools/styles.css` in your code
 
+Note that this css file may get included in your production builds please import
+it conditionally if you want to avoid that.
+
 ```diff
 import { DevTools } from 'jotai-devtools';
 + import 'jotai-devtools/styles.css';

src/DevTools/Extension/components/Shell/components/TimeTravel/components/SnapshotList/components/RecordHistory.tsx

@@ -13,7 +13,7 @@ export const RecordHistory = () => {
     ? 'Stop recording snapshot history'
     : 'Record snapshot history';
   return (
-    <Tooltip label={label} openDelay={750}>
+    <Tooltip label={label} openDelay={750} withinPortal={false}>
       <ActionIcon
         variant="outline"
         color={useThemeMode(