Initial commit

2025-08-25 12:00:06 +08:00
commit fa14798e26
90 changed files with 20722 additions and 0 deletions
--- a/.codesandbox/tasks.json
+++ b/.codesandbox/tasks.json
@@ -0,0 +1,25 @@
+{
+  // These tasks will run in order when initializing your CodeSandbox project.
+  "setupTasks": [
+    {
+      "name": "Install Dependencies",
+      "command": "yarn install"
+    }
+  ],
+
+  // These tasks can be run from CodeSandbox. Running one will open a log in the app.
+  "tasks": {
+    "install": {
+      "name": "install dependencies",
+      "command": "yarn install"
+    },
+    "Development": {
+      "name": "Development",
+      "command": "yarn web",
+      "runAtStart": true,
+      "preview": {
+        "port": 3000
+      }
+    }
+  }
+}
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -0,0 +1,4 @@
+{
+  "name": "Devcontainer",
+  "image": "ghcr.io/codesandbox/devcontainers/typescript-node:latest"
+}
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -0,0 +1,27 @@
+name: Run Tests
+
+on:
+  push:
+    branches:
+      - '*'
+  pull_request:
+    branches:
+      - '*'
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
+      - name: Install dependencies
+        run: yarn install
+
+      - name: Run tests
+        run: yarn test
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,48 @@
+dist
+
+**/node_modules
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
+# expo
+**/.expo/*
+
+# next.js
+**/.next/*
+/out/
+
+# tamagui
+**/.tamagui/*
+
+# production
+/build
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+
+# os
+.DS_Store
+THUMBS_DB
+thumbs.db
+
+# turbo build log
+**/.turbo/*
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
--- a/.husky/pre-push
+++ b/.husky/pre-push
@@ -0,0 +1 @@
+yarn test
--- a/.prettierrc
+++ b/.prettierrc
@@ -0,0 +1,7 @@
+{
+  "trailingComma": "es5",
+  "semi": false,
+  "singleQuote": true,
+  "arrowParens": "always",
+  "printWidth": 100
+}
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -0,0 +1,40 @@
+{
+  "explorer.fileNesting.enabled": true,
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "typescript.enablePromptUseWorkspaceTsdk": true,
+  "editor.insertSpaces": true,
+  "editor.tabSize": 2,
+  "editor.formatOnSave": true,
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[javascriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "eslint.workingDirectories": [
+    {
+      "mode": "auto"
+    }
+  ],
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact"
+  ],
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "always"
+  },
+  "cSpell.words": [
+    "Tamagui"
+  ],
+}
--- a/.watchmanconfig
+++ b/.watchmanconfig
@@ -0,0 +1 @@
+{}
--- a/.yarn/releases/yarn-4.5.0.cjs
+++ b/.yarn/releases/yarn-4.5.0.cjs
--- a/.yarnrc.yml
+++ b/.yarnrc.yml
@@ -0,0 +1,21 @@
+compressionLevel: mixed
+
+enableGlobalCache: false
+
+enableTelemetry: false
+
+logFilters:
+  - code: YN0002
+    level: discard
+  - code: YN0060
+    level: discard
+  - code: YN0006
+    level: discard
+  - code: YN0076
+    level: discard
+  - code: YN0013
+    level: discard
+
+nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-4.5.0.cjs
--- a/README.md
+++ b/README.md
@@ -0,0 +1,104 @@
+# Tamagui + Solito + Next + Expo Monorepo
+
+```sh
+npm create tamagui
+```
+
+## 🔦 About
+
+This monorepo is a starter for an Expo + Next.js + Tamagui + Solito app.
+
+Many thanks to [@FernandoTheRojo](https://twitter.com/fernandotherojo) for the Solito starter monorepo which this was forked from. Check out his [talk about using expo + next together at Next.js Conf 2021](https://www.youtube.com/watch?v=0lnbdRweJtA).
+
+## 📦 Included packages
+
+- [Tamagui](https://tamagui.dev) 🪄
+- [solito](https://solito.dev) for cross-platform navigation
+- Expo SDK
+- Next.js
+- Expo Router
+
+## 🗂 Folder layout
+
+The main apps are:
+
+- `expo` (native)
+- `next` (web)
+
+- `packages` shared packages across apps
+  - `ui` includes your custom UI kit that will be optimized by Tamagui
+  - `app` you'll be importing most files from `app/`
+    - `features` (don't use a `screens` folder. organize by feature.)
+    - `provider` (all the providers that wrap the app, and some no-ops for Web.)
+
+You can add other folders inside of `packages/` if you know what you're doing and have a good reason to.
+
+> [!TIP]
+> Switching from `app` to `pages` router:
+>
+> - remove `app` folder from `apps/next`
+> - move `index.tsx` from `pages-example` to `pages` folder
+> - rename `pages-example-user` to `user` and be sure to update `linkTarget` in `screen.tsx` to `user` as well
+> - delete `SwitchRouterButton.tsx` component and remove it from `screen.tsx` and `packages/ui/src/index.tsx`
+> - search for `pagesMode` keyword and remove it
+
+## 🏁 Start the app
+
+- Install dependencies: `yarn`
+
+- Next.js local dev: `yarn web`
+
+To run with optimizer on in dev mode (just for testing, it's faster to leave it off): `yarn web:extract`. To build for production `yarn web:prod`.
+
+To see debug output to verify the compiler, add `// debug` as a comment to the top of any file.
+
+- Expo local dev: `yarn native`
+
+## UI Kit
+
+Note we're following the [design systems guide](https://tamagui.dev/docs/guides/design-systems) and creating our own package for components.
+
+See `packages/ui` named `@my/ui` for how this works.
+
+## 🆕 Add new dependencies
+
+### Pure JS dependencies
+
+If you're installing a JavaScript-only dependency that will be used across platforms, install it in `packages/app`:
+
+```sh
+cd packages/app
+yarn add date-fns
+cd ../..
+yarn
+```
+
+### Native dependencies
+
+If you're installing a library with any native code, you must install it in `expo`:
+
+```sh
+cd apps/expo
+yarn add react-native-reanimated
+cd ..
+yarn
+```
+
+## Update new dependencies
+
+### Pure JS dependencies
+
+```sh
+yarn upgrade-interactive
+```
+
+You can also install the native library inside of `packages/app` if you want to get autoimport for that package inside of the `app` folder. However, you need to be careful and install the _exact_ same version in both packages. If the versions mismatch at all, you'll potentially get terrible bugs. This is a classic monorepo issue. I use `lerna-update-wizard` to help with this (you don't need to use Lerna to use that lib).
+
+You may potentially want to have the native module transpiled for the next app. If you get error messages with `Cannot use import statement outside a module`, you may need to use `transpilePackages` in your `next.config.js` and add the module to the array there.
+
+### Deploying to Vercel
+
+- Root: `apps/next`
+- Install command to be `yarn set version stable && yarn install`
+- Build command: leave default setting
+- Output dir: leave default setting
--- a/app.json
+++ b/app.json
@@ -0,0 +1,15 @@
+{
+  "expo": {
+    "extra": {
+      "eas": {
+        "projectId": "8078f986-6a8d-43ef-b773-7f4396e4cbc5"
+      }
+    },
+    "android": {
+      "package": "com.eeymoo.apptemplate"
+    },
+    "plugins": [
+      "expo-sqlite"
+    ]
+  }
+}
--- a/apps/expo/.gitignore
+++ b/apps/expo/.gitignore
@@ -0,0 +1,131 @@
+.expo
+ios
+android
+
+# OSX
+#
+.DS_Store
+
+# Xcode
+#
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+project.xcworkspace
+
+# Android/IntelliJ
+#
+build/
+.idea
+.gradle
+local.properties
+*.iml
+*.hprof
+
+# node.js
+#
+node_modules/
+npm-debug.log
+yarn-error.log
+
+# BUCK
+buck-out/
+\.buckd/
+*.keystore
+
+# fastlane
+#
+# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
+# screenshots whenever they are needed.
+# For more information about the recommended setup visit:
+# https://docs.fastlane.tools/best-practices/source-control/
+
+*/fastlane/report.xml
+*/fastlane/Preview.html
+*/fastlane/screenshots
+
+# Bundle artifacts
+*.jsbundle
+
+# CocoaPods
+/ios/Pods/
+
+# Expo
+.expo/*
+web-build/
+
+
+# @generated expo-cli sync-ee1e620bf946655de5f4a4ea0da0b18cabc4cf78
+# The following patterns were generated by expo-cli
+
+# OSX
+#
+.DS_Store
+
+# Xcode
+#
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+project.xcworkspace
+
+# Android/IntelliJ
+#
+build/
+.idea
+.gradle
+local.properties
+*.iml
+*.hprof
+
+# node.js
+#
+node_modules/
+npm-debug.log
+yarn-error.log
+
+# BUCK
+buck-out/
+\.buckd/
+*.keystore
+!debug.keystore
+
+# Bundle artifacts
+*.jsbundle
+
+# CocoaPods
+/ios/Pods/
+
+# Expo
+.expo/
+web-build/
+dist/
+
+expo-env.d.ts
+# @end expo-cli
--- a/apps/expo/app.json
+++ b/apps/expo/app.json
@@ -0,0 +1,38 @@
+{
+  "expo": {
+    "name": "yourprojectsname",
+    "slug": "yourprojectsname",
+    "scheme": "yourprojectsname",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/icon.png",
+    "userInterfaceStyle": "automatic",
+    "splash": {
+      "image": "./assets/splash.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "updates": {
+      "fallbackToCacheTimeout": 0
+    },
+    "assetBundlePatterns": ["**/*"],
+    "ios": {
+      "supportsTablet": true,
+      "bundleIdentifier": "com.yourprojectsname.app"
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#FFFFFF"
+      },
+      "package": "com.yourprojectsname.app"
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    },
+    "plugins": ["expo-router", "expo-font"],
+    "experiments": {
+      "typedRoutes": true
+    }
+  }
+}
--- a/apps/expo/app/_layout.tsx
+++ b/apps/expo/app/_layout.tsx
@@ -0,0 +1,48 @@
+import { useEffect } from 'react'
+import { useColorScheme } from 'react-native'
+import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native'
+import { useFonts } from 'expo-font'
+import { SplashScreen, Stack } from 'expo-router'
+import { Provider } from 'app/provider'
+import { NativeToast } from '@my/ui/src/NativeToast'
+
+export const unstable_settings = {
+  // Ensure that reloading on `/user` keeps a back button present.
+  initialRouteName: 'Home',
+}
+
+// Prevent the splash screen from auto-hiding before asset loading is complete.
+SplashScreen.preventAutoHideAsync()
+
+export default function App() {
+  const [interLoaded, interError] = useFonts({
+    Inter: require('@tamagui/font-inter/otf/Inter-Medium.otf'),
+    InterBold: require('@tamagui/font-inter/otf/Inter-Bold.otf'),
+  })
+
+  useEffect(() => {
+    if (interLoaded || interError) {
+      // Hide the splash screen after the fonts have loaded (or an error was returned) and the UI is ready.
+      SplashScreen.hideAsync()
+    }
+  }, [interLoaded, interError])
+
+  if (!interLoaded && !interError) {
+    return null
+  }
+
+  return <RootLayoutNav />
+}
+
+function RootLayoutNav() {
+  const colorScheme = useColorScheme()
+
+  return (
+    <Provider>
+      <ThemeProvider value={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
+        <Stack />
+        <NativeToast />
+      </ThemeProvider>
+    </Provider>
+  )
+}
--- a/apps/expo/app/index.tsx
+++ b/apps/expo/app/index.tsx
@@ -0,0 +1,15 @@
+import { HomeScreen } from 'app/features/home/screen'
+import { Stack } from 'expo-router'
+
+export default function Screen() {
+  return (
+    <>
+      <Stack.Screen
+        options={{
+          title: 'Home',
+        }}
+      />
+      <HomeScreen />
+    </>
+  )
+}
--- a/apps/expo/app/types.d.ts
+++ b/apps/expo/app/types.d.ts
@@ -0,0 +1,7 @@
+import { config } from '@my/config'
+
+export type Conf = typeof config
+
+declare module '@my/ui' {
+  interface TamaguiCustomConfig extends Conf {}
+}
--- a/apps/expo/app/user/[id].tsx
+++ b/apps/expo/app/user/[id].tsx
@@ -0,0 +1,21 @@
+import { UserDetailScreen } from 'app/features/user/detail-screen'
+import { Stack } from 'expo-router'
+import { useParams } from 'solito/navigation'
+
+export default function Screen() {
+  const { id } = useParams()
+  return (
+    <>
+      <Stack.Screen
+        options={{
+          title: 'User',
+          presentation: 'modal',
+          animation: 'slide_from_right',
+          gestureEnabled: true,
+          gestureDirection: 'horizontal',
+        }}
+      />
+      <UserDetailScreen id={id as string} />
+    </>
+  )
+}
--- a/apps/expo/assets/adaptive-icon.png
+++ b/apps/expo/assets/adaptive-icon.png
--- a/apps/expo/assets/favicon.png
+++ b/apps/expo/assets/favicon.png
--- a/apps/expo/assets/icon.png
+++ b/apps/expo/assets/icon.png
--- a/apps/expo/assets/splash.png
+++ b/apps/expo/assets/splash.png
--- a/apps/expo/babel.config.js
+++ b/apps/expo/babel.config.js
@@ -0,0 +1,35 @@
+module.exports = (api) => {
+  api.cache(true)
+  return {
+    presets: [['babel-preset-expo', { jsxRuntime: 'automatic' }]],
+    plugins: [
+      [
+        require.resolve('babel-plugin-module-resolver'),
+        {
+          root: ['../..'],
+          alias: {
+            // define aliases to shorten the import paths
+            app: '../../packages/app',
+            '@my/ui': '../../packages/ui',
+          },
+          extensions: ['.js', '.jsx', '.tsx', '.ios.js', '.android.js'],
+        },
+      ],
+      // if you want reanimated support
+      // 'react-native-reanimated/plugin',
+      ...(process.env.EAS_BUILD_PLATFORM === 'android'
+        ? []
+        : [
+            [
+              '@tamagui/babel-plugin',
+              {
+                components: ['@my/ui', 'tamagui'],
+                config: '../../packages/config/src/tamagui.config.ts',
+                logTimings: true,
+                disableExtraction: process.env.NODE_ENV === 'development',
+              },
+            ],
+          ]),
+    ],
+  }
+}
--- a/apps/expo/eas.json
+++ b/apps/expo/eas.json
@@ -0,0 +1,20 @@
+{
+  "build": {
+    "development": {
+      "distribution": "internal",
+      "android": {
+        "buildType": "apk"
+      },
+      "ios": {
+        "simulator": true,
+        "image": "latest"
+      }
+    },
+    "production": {
+      "distribution": "store",
+      "android": {
+        "buildType": "app-bundle"
+      }
+    }
+  }
+}
--- a/apps/expo/index.js
+++ b/apps/expo/index.js
@@ -0,0 +1,7 @@
+import 'setimmediate'
+
+if (!global?.setImmediate) {
+  global.setImmediate = setTimeout
+}
+
+import 'expo-router/entry'
--- a/apps/expo/metro.config.js
+++ b/apps/expo/metro.config.js
@@ -0,0 +1,27 @@
+// Learn more https://docs.expo.dev/guides/monorepos
+// Learn more https://docs.expo.io/guides/customizing-metro
+/**
+ * @type {import('expo/metro-config')}
+ */
+const { getDefaultConfig } = require('@expo/metro-config')
+const path = require('node:path')
+
+const projectRoot = __dirname
+const workspaceRoot = path.resolve(projectRoot, '../..')
+
+const config = getDefaultConfig(projectRoot)
+
+// 1. Watch all files within the monorepo
+config.watchFolders = [workspaceRoot]
+// 2. Let Metro know where to resolve packages and in what order
+config.resolver.nodeModulesPaths = [
+  path.resolve(projectRoot, 'node_modules'),
+  path.resolve(workspaceRoot, 'node_modules'),
+]
+// 3. Force Metro to resolve (sub)dependencies only from the `nodeModulesPaths`
+config.resolver.disableHierarchicalLookup = true
+
+config.transformer = { ...config.transformer, unstable_allowRequireContext: true }
+config.transformer.minifierPath = require.resolve('metro-minify-terser')
+
+module.exports = config
--- a/apps/expo/package.json
+++ b/apps/expo/package.json
@@ -0,0 +1,57 @@
+{
+  "name": "expo-app",
+  "version": "1.0.0",
+  "main": "index.js",
+  "private": true,
+  "scripts": {
+    "start": "npx expo start -c",
+    "android": "npx expo run:android",
+    "ios": "yarn fix-xcode-env && npx expo run:ios",
+    "eject": "npx expo eject",
+    "fix-xcode-env": "node scripts/fix-xcode-env.mjs",
+    "prebuild": "yarn expo prebuild"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.26.0",
+    "@expo/config-plugins": "~10.0.0",
+    "@my/ui": "0.0.1",
+    "@react-navigation/bottom-tabs": "^7.3.12",
+    "@react-navigation/native": "^7.1.8",
+    "app": "0.0.0",
+    "babel-plugin-module-resolver": "^5.0.2",
+    "burnt": "^0.12.2",
+    "expo": "~53.0.8",
+    "expo-constants": "~17.1.6",
+    "expo-dev-client": "~5.1.8",
+    "expo-font": "~13.3.1",
+    "expo-linear-gradient": "~14.1.4",
+    "expo-linking": "~7.1.4",
+    "expo-router": "~5.0.6",
+    "expo-splash-screen": "~0.30.8",
+    "expo-status-bar": "~2.2.3",
+    "expo-updates": "~0.28.12",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
+    "react-native": "0.79.2",
+    "react-native-gesture-handler": "~2.24.0",
+    "react-native-safe-area-context": "5.4.0",
+    "react-native-screens": "~4.10.0",
+    "react-native-svg": "15.8.0",
+    "react-native-web": "^0.20.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.24.6",
+    "@expo/metro-config": "~0.20.0",
+    "@tamagui/babel-plugin": "^1.132.18",
+    "metro-minify-terser": "^0.81.0",
+    "typescript": "~5.8.3"
+  },
+  "resolutions": {
+    "metro": "0.81.0",
+    "metro-resolver": "0.81.0"
+  },
+  "overrides": {
+    "metro": "0.81.0",
+    "metro-resolver": "0.81.0"
+  }
+}
--- a/apps/expo/scripts/fix-xcode-env.mjs
+++ b/apps/expo/scripts/fix-xcode-env.mjs
@@ -0,0 +1,29 @@
+import fs from 'node:fs/promises'
+import path from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { execSync } from 'node:child_process'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+
+const iosDir = path.join(__dirname, '..', 'ios')
+const xcodePath = path.join(iosDir, '.xcode.env.local')
+
+async function main() {
+  try {
+    // Create ios directory if it doesn't exist
+    await fs.mkdir(iosDir, { recursive: true })
+
+    // Get the path to the Node binary
+    const nodePath = process.execPath
+
+    // Create or update the .xcode.env.local file
+    const content = `export NODE_BINARY=${nodePath}\n`
+    await fs.writeFile(xcodePath, content)
+  } catch (error) {
+    console.error('Error:', error.message)
+    process.exit(1)
+  }
+}
+
+main()
--- a/apps/expo/tsconfig.json
+++ b/apps/expo/tsconfig.json
@@ -0,0 +1,14 @@
+{
+  "extends": "../../tsconfig.base",
+  "include": [
+    "app/**/*.ts",
+    "app/**/*.tsx",
+    ".expo/types/**/*.ts",
+    "expo-env.d.ts"
+  ],
+  "compilerOptions": {
+    "composite": true,
+    "jsx": "react-jsx"
+  },
+  "references": []
+}
--- a/apps/next/.env
+++ b/apps/next/.env
@@ -0,0 +1,3 @@
+IGNORE_TS_CONFIG_PATHS=true
+TAMAGUI_TARGET=web
+TAMAGUI_DISABLE_WARN_DYNAMIC_LOAD=1
--- a/apps/next/.eslintrc.js
+++ b/apps/next/.eslintrc.js
@@ -0,0 +1,4 @@
+module.exports = {
+  extends: 'next',
+  root: true,
+}
--- a/apps/next/.gitignore
+++ b/apps/next/.gitignore
@@ -0,0 +1 @@
+.vercel
--- a/apps/next/tests/build.test.ts
+++ b/apps/next/tests/build.test.ts
@@ -0,0 +1,76 @@
+import { exec, type ChildProcess } from 'node:child_process'
+import { expect, test, afterAll } from 'vitest'
+import path from 'node:path'
+
+let buildProcess: ChildProcess | null = null
+
+afterAll(() => {
+  if (buildProcess?.pid) {
+    try {
+      process.kill(buildProcess.pid, 0) // Check if process exists
+      process.kill(buildProcess.pid) // Kill the process if it exists
+    } catch (error) {
+      // Process doesn't exist or we don't have permission to kill it
+      console.info('Process already terminated or cannot be killed.')
+    }
+  }
+})
+
+test('Next.js build completes', async () => {
+  try {
+    buildProcess = exec('yarn build', {
+      cwd: path.resolve(__dirname, '..'),
+    })
+
+    const buildOutput = new Promise<string>((resolve, reject) => {
+      let output = ''
+      buildProcess?.stdout?.on('data', (data) => {
+        output += data.toString()
+      })
+      buildProcess?.stderr?.on('data', (data) => {
+        output += data.toString()
+      })
+      buildProcess?.on('close', (code) => {
+        if (code === 0) {
+          resolve(output)
+        } else {
+          reject(new Error(`Build process exited with code ${code}`))
+        }
+      })
+    })
+
+    const result = await buildOutput
+
+    // Check for yarn build output
+    expect(result).toContain('built @my/config')
+    expect(result).toContain('built @my/ui')
+
+    // Check for Next.js version and build process
+    expect(result).toContain('Next.js 14')
+    expect(result).toContain('Creating an optimized production build')
+
+    // Check for route information
+    expect(result).toContain('Route (app)')
+    expect(result).toContain('Route (pages)')
+    expect(result).toContain('First Load JS shared by all')
+
+    // Check for specific route patterns
+    expect(result).toContain('○ /')
+    expect(result).toContain('○ /_not-found')
+    expect(result).toContain('ƒ /user/[id]')
+    expect(result).toContain('/_app')
+    expect(result).toContain('/pages-example')
+    expect(result).toContain('/pages-example-user/[id]')
+
+    // Check for chunk information
+    expect(result).toContain('chunks/framework-')
+    expect(result).toContain('chunks/main-')
+    expect(result).toContain('chunks/pages/_app-')
+
+    // Check for static and dynamic route indicators
+    expect(result).toContain('○  (Static)   prerendered as static content')
+    expect(result).toContain('ƒ  (Dynamic)  server-rendered on demand')
+  } finally {
+    // The process kill check has been moved to the afterAll block
+  }
+}, 60_000)
--- a/apps/next/tests/dev.test.ts
+++ b/apps/next/tests/dev.test.ts
@@ -0,0 +1,54 @@
+import { spawn, type ChildProcess } from 'node:child_process'
+import { expect, test } from 'vitest'
+import path from 'node:path'
+import treeKill from 'tree-kill'
+import { promisify } from 'node:util'
+
+const treeKillAsync = promisify(treeKill)
+
+test('Next.js dev server starts', async () => {
+  let devProcess: ChildProcess | null = null
+
+  try {
+    devProcess = spawn('yarn', ['dev'], {
+      cwd: path.resolve(__dirname, '..'),
+      stdio: 'pipe',
+      shell: true,
+    })
+
+    let output = ''
+    devProcess.stdout?.on('data', (data) => {
+      output += data.toString()
+    })
+
+    // Wait for the server to start (adjust timeout as needed)
+    await new Promise<void>((resolve, reject) => {
+      const timeout = setTimeout(() => {
+        reject(new Error('Timeout waiting for dev server to start'))
+      }, 30000)
+
+      devProcess?.stdout?.on('data', (data) => {
+        if (data.toString().includes('Ready in')) {
+          clearTimeout(timeout)
+          resolve()
+        }
+      })
+    })
+
+    // Check for expected output
+    expect(output).toContain('Next.js 14')
+    expect(output).toContain('Local:')
+    expect(output).toContain('Ready in')
+
+    // Additional checks can be added here
+  } finally {
+    // Ensure the dev server is killed and wait for it to fully terminate
+    if (devProcess?.pid) {
+      try {
+        await treeKillAsync(devProcess.pid)
+      } catch (error) {
+        console.error('Failed to kill process:', error)
+      }
+    }
+  }
+}, 60000) // Increased timeout to account for both startup and shutdown
--- a/apps/next/app/layout.tsx
+++ b/apps/next/app/layout.tsx
@@ -0,0 +1,19 @@
+import type { Metadata } from 'next'
+import { NextTamaguiProvider } from 'app/provider/NextTamaguiProvider'
+
+export const metadata: Metadata = {
+  title: 'Tamagui • App Router',
+  description: 'Tamagui, Solito, Expo & Next.js',
+  icons: '/favicon.ico',
+}
+
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+  return (
+    // You can use `suppressHydrationWarning` to avoid the warning about mismatched content during hydration in dev mode
+    <html lang="en" suppressHydrationWarning>
+      <body>
+        <NextTamaguiProvider>{children}</NextTamaguiProvider>
+      </body>
+    </html>
+  )
+}
--- a/apps/next/app/page.tsx
+++ b/apps/next/app/page.tsx
@@ -0,0 +1,5 @@
+'use client'
+
+import { HomeScreen } from 'app/features/home/screen'
+
+export default HomeScreen
--- a/apps/next/app/user/[id]/page.tsx
+++ b/apps/next/app/user/[id]/page.tsx
@@ -0,0 +1,9 @@
+'use client'
+
+import { UserDetailScreen } from 'app/features/user/detail-screen'
+import { useParams } from 'solito/navigation'
+
+export default function Page() {
+  const { id } = useParams()
+  return <UserDetailScreen id={id as string} />
+}
--- a/apps/next/next-env.d.ts
+++ b/apps/next/next-env.d.ts
@@ -0,0 +1,6 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+/// <reference types="next/navigation-types/compat/navigation" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.
--- a/apps/next/next.config.js
+++ b/apps/next/next.config.js
@@ -0,0 +1,58 @@
+/** @type {import('next').NextConfig} */
+const { withTamagui } = require('@tamagui/next-plugin')
+const { join } = require('node:path')
+
+const boolVals = {
+  true: true,
+  false: false,
+}
+
+const disableExtraction =
+  boolVals[process.env.DISABLE_EXTRACTION] ?? process.env.NODE_ENV === 'development'
+
+const plugins = [
+  withTamagui({
+    config: '../../packages/config/src/tamagui.config.ts',
+    components: ['tamagui', '@my/ui'],
+    appDir: true,
+    importsWhitelist: ['constants.js', 'colors.js'],
+    outputCSS: process.env.NODE_ENV === 'production' ? './public/tamagui.css' : null,
+    logTimings: true,
+    disableExtraction,
+    shouldExtract: (path) => {
+      if (path.includes(join('packages', 'app'))) {
+        return true
+      }
+    },
+    disableThemesBundleOptimize: true,
+    excludeReactNativeWebExports: ['Switch', 'ProgressBar', 'Picker', 'CheckBox', 'Touchable'],
+  }),
+]
+
+module.exports = () => {
+  /** @type {import('next').NextConfig} */
+  let config = {
+    typescript: {
+      ignoreBuildErrors: true,
+    },
+    transpilePackages: [
+      'solito',
+      'react-native-web',
+      'expo-linking',
+      'expo-constants',
+      'expo-modules-core',
+    ],
+    experimental: {
+      scrollRestoration: true,
+    },
+  }
+
+  for (const plugin of plugins) {
+    config = {
+      ...config,
+      ...plugin(config),
+    }
+  }
+
+  return config
+}
--- a/apps/next/package.json
+++ b/apps/next/package.json
@@ -0,0 +1,35 @@
+{
+  "name": "next-app",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev",
+    "build": "cd ../.. && yarn build && cd apps/next && next build",
+    "start": "next start",
+    "serve": "NODE_ENV=production next start --port 8151",
+    "lint": "next lint",
+    "test": "vitest"
+  },
+  "dependencies": {
+    "@tamagui/config": "^1.132.18",
+    "@tamagui/next-theme": "^1.132.18",
+    "app": "0.0.0",
+    "next": "14.2.14",
+    "raf": "^3.4.1",
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
+    "react-native": "0.79.2",
+    "react-native-web": "^0.20.0",
+    "tamagui": "^1.132.18",
+    "vercel": "latest"
+  },
+  "devDependencies": {
+    "@tamagui/next-plugin": "^1.132.18",
+    "@types/node": "^20.14.1",
+    "eslint-config-next": "^14.2.3",
+    "next-compose-plugins": "^2.2.1",
+    "next-transpile-modules": "^10.0.1",
+    "tree-kill": "^1.2.2",
+    "vitest": "^2.1.1"
+  }
+}
--- a/apps/next/pages/_app.tsx
+++ b/apps/next/pages/_app.tsx
@@ -0,0 +1,55 @@
+import '@tamagui/core/reset.css'
+import '@tamagui/font-inter/css/400.css'
+import '@tamagui/font-inter/css/700.css'
+import 'raf/polyfill'
+
+import type React from 'react'
+import Head from 'next/head'
+import type { SolitoAppProps } from 'solito'
+import { NextTamaguiProvider } from 'app/provider/NextTamaguiProvider'
+import { config } from '@my/ui'
+
+if (process.env.NODE_ENV === 'production') {
+  require('../public/tamagui.css')
+}
+
+function MyApp({ Component, pageProps }: SolitoAppProps) {
+  return (
+    <>
+      <Head>
+        <title>Tamagui • Pages Router</title>
+        <meta name="description" content="Tamagui, Solito, Expo & Next.js" />
+        <link rel="icon" href="/favicon.ico" />
+        <style
+          dangerouslySetInnerHTML={{
+            // the first time this runs you'll get the full CSS including all themes
+            // after that, it will only return CSS generated since the last call
+            __html: config.getNewCSS(),
+          }}
+        />
+
+        <style
+          dangerouslySetInnerHTML={{
+            __html: config.getCSS({
+              // if you are using "outputCSS" option, you should use this "exclude"
+              // if not, then you can leave the option out
+              exclude: process.env.NODE_ENV === 'production' ? 'design-system' : null,
+            }),
+          }}
+        />
+
+        <script
+          dangerouslySetInnerHTML={{
+            // avoid flash of animated things on enter:
+            __html: `document.documentElement.classList.add('t_unmounted')`,
+          }}
+        />
+      </Head>
+      <NextTamaguiProvider>
+        <Component {...pageProps} />
+      </NextTamaguiProvider>
+    </>
+  )
+}
+
+export default MyApp
--- a/apps/next/pages/_document.tsx
+++ b/apps/next/pages/_document.tsx
@@ -0,0 +1,65 @@
+import { Children } from 'react'
+import { AppRegistry } from 'react-native'
+import NextDocument, {
+  type DocumentContext,
+  type DocumentInitialProps,
+  Head,
+  Html,
+  Main,
+  NextScript,
+} from 'next/document'
+import { config } from '@my/ui'
+
+export default class Document extends NextDocument {
+  static async getInitialProps(ctx: DocumentContext): Promise<DocumentInitialProps> {
+    AppRegistry.registerComponent('Main', () => Main)
+    const page = await ctx.renderPage()
+
+    // @ts-ignore
+    const { getStyleElement } = AppRegistry.getApplication('Main')
+
+    /**
+     * Note: be sure to keep tamagui styles after react-native-web styles like it is here!
+     * So Tamagui styles can override the react-native-web styles.
+     */
+    const styles = [
+      getStyleElement(),
+      <style
+        key="tamagui-css"
+        dangerouslySetInnerHTML={{
+          __html: config.getCSS({
+            exclude: process.env.NODE_ENV === 'development' ? null : 'design-system',
+          }),
+        }}
+      />,
+      <style
+        jsx
+        global
+        key="tamagui-css"
+      >{`
+        html {
+          font-family: 'Inter';
+        }
+      `}</style>,
+    ]
+
+    return { ...page, styles: Children.toArray(styles) }
+  }
+
+  render() {
+    return (
+      <Html>
+        <Head>
+          <meta
+            httpEquiv="X-UA-Compatible"
+            content="IE=edge"
+          />
+        </Head>
+        <body>
+          <Main />
+          <NextScript />
+        </body>
+      </Html>
+    )
+  }
+}
--- a/apps/next/pages/pages-example-user/[id].tsx
+++ b/apps/next/pages/pages-example-user/[id].tsx
@@ -0,0 +1,17 @@
+import { UserDetailScreen } from 'app/features/user/detail-screen'
+import Head from 'next/head'
+import { createParam } from 'solito'
+
+const { useParam } = createParam<{ id: string }>()
+
+export default function Page() {
+  const [id] = useParam('id') as unknown as string
+  return (
+    <>
+      <Head>
+        <title>User</title>
+      </Head>
+      <UserDetailScreen id={id} />
+    </>
+  )
+}
--- a/apps/next/pages/pages-example/index.tsx
+++ b/apps/next/pages/pages-example/index.tsx
@@ -0,0 +1,5 @@
+import { HomeScreen } from 'app/features/home/screen'
+
+export default function Page() {
+  return <HomeScreen pagesMode={true} />
+}
--- a/apps/next/public/favicon.ico
+++ b/apps/next/public/favicon.ico
--- a/apps/next/public/tamagui.css
+++ b/apps/next/public/tamagui.css
@@ -0,0 +1,367 @@
+._ovs-contain {overscroll-behavior:contain;}
+  .is_Text .is_Text {display:inline-flex;}
+  ._dsp_contents {display:contents;}
+  :root {--c-radius-0:0px;--c-radius-1:3px;--c-radius-2:5px;--c-radius-3:7px;--c-radius-4:9px;--c-radius-5:10px;--c-radius-6:16px;--c-radius-7:19px;--c-radius-8:22px;--c-radius-9:26px;--c-radius-10:34px;--c-radius-11:42px;--c-radius-12:50px;--c-radius-true:9px;--c-zIndex-0:0;--c-zIndex-1:100;--c-zIndex-2:200;--c-zIndex-3:300;--c-zIndex-4:400;--c-zIndex-5:500;--c-space-0:0px;--c-space-1:2px;--c-space-2:7px;--c-space-3:13px;--c-space-4:18px;--c-space-5:24px;--c-space-6:32px;--c-space-7:39px;--c-space-8:46px;--c-space-9:53px;--c-space-10:60px;--c-space-11:74px;--c-space-12:88px;--c-space-13:102px;--c-space-14:116px;--c-space-15:130px;--c-space-16:144px;--c-space-17:144px;--c-space-18:158px;--c-space-19:172px;--c-space-20:186px;--c-space-0--25:0.5px;--c-space-0--5:1px;--c-space-0--75:1.5px;--c-space-1--5:4px;--c-space-2--5:10px;--c-space-3--5:16px;--c-space-true:18px;--c-space-4--5:21px;--c-space--0--25:-0.5px;--c-space--0--5:-1px;--c-space--0--75:-1.5px;--c-space--1:-2px;--c-space--1--5:-4px;--c-space--2:-7px;--c-space--2--5:-10px;--c-space--3:-13px;--c-space--3--5:-16px;--c-space--4:-18px;--c-space--true:-18px;--c-space--4--5:-21px;--c-space--5:-24px;--c-space--6:-32px;--c-space--7:-39px;--c-space--8:-46px;--c-space--9:-53px;--c-space--10:-60px;--c-space--11:-74px;--c-space--12:-88px;--c-space--13:-102px;--c-space--14:-116px;--c-space--15:-130px;--c-space--16:-144px;--c-space--17:-144px;--c-space--18:-158px;--c-space--19:-172px;--c-space--20:-186px;--c-size-0:0px;--c-size-1:20px;--c-size-2:28px;--c-size-3:36px;--c-size-4:44px;--c-size-5:52px;--c-size-6:64px;--c-size-7:74px;--c-size-8:84px;--c-size-9:94px;--c-size-10:104px;--c-size-11:124px;--c-size-12:144px;--c-size-13:164px;--c-size-14:184px;--c-size-15:204px;--c-size-16:224px;--c-size-17:224px;--c-size-18:244px;--c-size-19:264px;--c-size-20:284px;--c-size-0--25:2px;--c-size-0--5:4px;--c-size-0--75:8px;--c-size-1--5:24px;--c-size-2--5:32px;--c-size-3--5:40px;--c-size-true:44px;--c-size-4--5:48px}
+:root .font_body, :root .t_lang-body-default .font_body {--f-family:Inter, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--f-lineHeight-1:23px;--f-lineHeight-2:24px;--f-lineHeight-3:25px;--f-lineHeight-4:27px;--f-lineHeight-5:30px;--f-lineHeight-6:32px;--f-lineHeight-7:34px;--f-lineHeight-8:38px;--f-lineHeight-9:46px;--f-lineHeight-10:66px;--f-lineHeight-11:77px;--f-lineHeight-12:85px;--f-lineHeight-13:97px;--f-lineHeight-14:121px;--f-lineHeight-15:148px;--f-lineHeight-16:172px;--f-lineHeight-true:27px;--f-weight-1:300;--f-weight-2:300;--f-weight-3:300;--f-weight-4:300;--f-weight-5:300;--f-weight-6:300;--f-weight-7:300;--f-weight-8:300;--f-weight-9:300;--f-weight-10:300;--f-weight-11:300;--f-weight-12:300;--f-weight-13:300;--f-weight-14:300;--f-weight-15:300;--f-weight-16:300;--f-weight-true:300;--f-letterSpacing-1:0px;--f-letterSpacing-2:0px;--f-letterSpacing-3:0px;--f-letterSpacing-4:0px;--f-letterSpacing-5:0px;--f-letterSpacing-6:0px;--f-letterSpacing-7:0px;--f-letterSpacing-8:0px;--f-letterSpacing-9:0px;--f-letterSpacing-10:0px;--f-letterSpacing-11:0px;--f-letterSpacing-12:0px;--f-letterSpacing-13:0px;--f-letterSpacing-14:0px;--f-letterSpacing-15:0px;--f-letterSpacing-16:0px;--f-letterSpacing-true:0px;--f-size-1:12px;--f-size-2:13px;--f-size-3:14px;--f-size-4:15px;--f-size-5:18px;--f-size-6:20px;--f-size-7:22px;--f-size-8:25px;--f-size-9:33px;--f-size-10:51px;--f-size-11:61px;--f-size-12:68px;--f-size-13:79px;--f-size-14:101px;--f-size-15:125px;--f-size-16:147px;--f-size-true:15px}
+:root .font_heading, :root .t_lang-heading-default .font_heading {--f-family:Inter, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--f-lineHeight-1:21px;--f-lineHeight-2:22px;--f-lineHeight-3:23px;--f-lineHeight-4:24px;--f-lineHeight-5:26px;--f-lineHeight-6:25px;--f-lineHeight-7:30px;--f-lineHeight-8:33px;--f-lineHeight-9:40px;--f-lineHeight-10:56px;--f-lineHeight-11:65px;--f-lineHeight-12:72px;--f-lineHeight-13:82px;--f-lineHeight-14:102px;--f-lineHeight-15:124px;--f-lineHeight-16:144px;--f-lineHeight-true:24px;--f-weight-1:400;--f-weight-2:400;--f-weight-3:400;--f-weight-4:400;--f-weight-5:400;--f-weight-6:400;--f-weight-7:700;--f-weight-8:700;--f-weight-9:700;--f-weight-10:700;--f-weight-11:700;--f-weight-12:700;--f-weight-13:700;--f-weight-14:700;--f-weight-15:700;--f-weight-16:700;--f-weight-true:700;--f-letterSpacing-1:2px;--f-letterSpacing-2:2px;--f-letterSpacing-3:2px;--f-letterSpacing-4:2px;--f-letterSpacing-5:2px;--f-letterSpacing-6:1px;--f-letterSpacing-7:0px;--f-letterSpacing-8:-1px;--f-letterSpacing-9:-2px;--f-letterSpacing-10:-3px;--f-letterSpacing-11:-3px;--f-letterSpacing-12:-4px;--f-letterSpacing-13:-4px;--f-letterSpacing-14:-5px;--f-letterSpacing-15:-6px;--f-letterSpacing-16:-6px;--f-letterSpacing-true:-6px;--f-size-1:11px;--f-size-2:12px;--f-size-3:13px;--f-size-4:14px;--f-size-5:16px;--f-size-6:15px;--f-size-7:20px;--f-size-8:23px;--f-size-9:30px;--f-size-10:46px;--f-size-11:55px;--f-size-12:62px;--f-size-13:72px;--f-size-14:92px;--f-size-15:114px;--f-size-16:134px;--f-size-true:14px;--f-transform-1:uppercase;--f-transform-2:uppercase;--f-transform-3:uppercase;--f-transform-4:uppercase;--f-transform-5:uppercase;--f-transform-6:uppercase;--f-transform-7:none;--f-transform-8:none;--f-transform-9:none;--f-transform-10:none;--f-transform-11:none;--f-transform-12:none;--f-transform-13:none;--f-transform-14:none;--f-transform-15:none;--f-transform-16:none;--f-transform-true:none}
+  :root.t_dark .t_light , :root.t_light, :root.t_light , .tm_xxt {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 95%, 1);--color3:hsla(0, 0%, 93%, 1);--color4:hsla(0, 0%, 91%, 1);--color5:hsla(0, 0%, 88%, 1);--color6:hsla(0, 0%, 85%, 1);--color7:hsla(0, 0%, 82%, 1);--color8:hsla(0, 0%, 76%, 1);--color9:hsla(0, 0%, 56%, 1);--color10:hsla(0, 0%, 50%, 1);--color11:hsla(0, 0%, 42%, 1);--color12:hsla(0, 0%, 9%, 1);--color0:hsla(0, 0%, 9%, 0);--color02:hsla(0, 0%, 9%, 0.2);--color04:hsla(0, 0%, 9%, 0.4);--color06:hsla(0, 0%, 9%, 0.6);--color08:hsla(0, 0%, 9%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 100%, 0.8);--backgroundPress:hsla(0, 0%, 95%, 1);--backgroundFocus:hsla(0, 0%, 95%, 1);--borderColor:hsla(0, 0%, 91%, 1);--borderColorHover:hsla(0, 0%, 93%, 1);--borderColorPress:hsla(0, 0%, 88%, 1);--borderColorFocus:hsla(0, 0%, 91%, 1);--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--colorTransparent:hsla(0, 0%, 9%, 0);--blue1:hsl(206, 100%, 99.2%);--blue2:hsl(210, 100%, 98.0%);--blue3:hsl(209, 100%, 96.5%);--blue4:hsl(210, 98.8%, 94.0%);--blue5:hsl(209, 95.0%, 90.1%);--blue6:hsl(209, 81.2%, 84.5%);--blue7:hsl(208, 77.5%, 76.9%);--blue8:hsl(206, 81.9%, 65.3%);--blue9:hsl(206, 100%, 50.0%);--blue10:hsl(208, 100%, 47.3%);--blue11:hsl(211, 100%, 43.2%);--blue12:hsl(211, 100%, 15.0%);--green1:hsl(136, 50.0%, 98.9%);--green2:hsl(138, 62.5%, 96.9%);--green3:hsl(139, 55.2%, 94.5%);--green4:hsl(140, 48.7%, 91.0%);--green5:hsl(141, 43.7%, 86.0%);--green6:hsl(143, 40.3%, 79.0%);--green7:hsl(146, 38.5%, 69.0%);--green8:hsl(151, 40.2%, 54.1%);--green9:hsl(151, 55.0%, 41.5%);--green10:hsl(152, 57.5%, 37.6%);--green11:hsl(153, 67.0%, 28.5%);--green12:hsl(155, 40.0%, 14.0%);--red1:hsl(359, 100%, 99.4%);--red2:hsl(359, 100%, 98.6%);--red3:hsl(360, 100%, 96.8%);--red4:hsl(360, 97.9%, 94.8%);--red5:hsl(360, 90.2%, 91.9%);--red6:hsl(360, 81.7%, 87.8%);--red7:hsl(359, 74.2%, 81.7%);--red8:hsl(359, 69.5%, 74.3%);--red9:hsl(358, 75.0%, 59.0%);--red10:hsl(358, 69.4%, 55.2%);--red11:hsl(358, 65.0%, 48.7%);--red12:hsl(354, 50.0%, 14.6%);--yellow1:hsl(60, 54.0%, 98.5%);--yellow2:hsl(52, 100%, 95.5%);--yellow3:hsl(55, 100%, 90.9%);--yellow4:hsl(54, 100%, 86.6%);--yellow5:hsl(52, 97.9%, 82.0%);--yellow6:hsl(50, 89.4%, 76.1%);--yellow7:hsl(47, 80.4%, 68.0%);--yellow8:hsl(48, 100%, 46.1%);--yellow9:hsl(53, 92.0%, 50.0%);--yellow10:hsl(50, 100%, 48.5%);--yellow11:hsl(42, 100%, 29.0%);--yellow12:hsl(40, 55.0%, 13.5%);--shadow1:rgba(0,0,0,0.04);--shadow2:rgba(0,0,0,0.08);--shadow3:rgba(0,0,0,0.16);--shadow4:rgba(0,0,0,0.24);--shadow5:rgba(0,0,0,0.32);--shadow6:rgba(0,0,0,0.4);--black1:#050505;--black2:#151515;--black3:#191919;--black4:#232323;--black5:#282828;--black6:#323232;--black7:#424242;--black8:#494949;--black9:#545454;--black10:#626262;--black11:#a5a5a5;--black12:#fff;--white1:#fff;--white2:#f2f2f2;--white3:hsl(0, 0%, 93%);--white4:hsl(0, 0%, 91%);--white5:hsl(0, 0%, 88%);--white6:hsl(0, 0%, 85%);--white7:hsl(0, 0%, 82%);--white8:hsl(0, 0%, 76%);--white9:hsl(0, 0%, 56%);--white10:hsl(0, 0%, 50%);--white11:hsl(0, 0%, 42%);--white12:hsl(0, 0%, 9%);--shadowColor:rgba(0,0,0,0.04);--accent1:hsla(0, 0%, 2%, 1);--accent2:hsla(0, 0%, 8%, 1);--accent3:hsla(0, 0%, 10%, 1);--accent4:hsla(0, 0%, 14%, 1);--accent5:hsla(0, 0%, 16%, 1);--accent6:hsla(0, 0%, 20%, 1);--accent7:hsla(0, 0%, 26%, 1);--accent8:hsla(0, 0%, 29%, 1);--accent9:hsla(0, 0%, 33%, 1);--accent10:hsla(0, 0%, 38%, 1);--accent11:hsla(0, 0%, 65%, 1);--accent12:hsla(0, 0%, 100%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    :root {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 95%, 1);--color3:hsla(0, 0%, 93%, 1);--color4:hsla(0, 0%, 91%, 1);--color5:hsla(0, 0%, 88%, 1);--color6:hsla(0, 0%, 85%, 1);--color7:hsla(0, 0%, 82%, 1);--color8:hsla(0, 0%, 76%, 1);--color9:hsla(0, 0%, 56%, 1);--color10:hsla(0, 0%, 50%, 1);--color11:hsla(0, 0%, 42%, 1);--color12:hsla(0, 0%, 9%, 1);--color0:hsla(0, 0%, 9%, 0);--color02:hsla(0, 0%, 9%, 0.2);--color04:hsla(0, 0%, 9%, 0.4);--color06:hsla(0, 0%, 9%, 0.6);--color08:hsla(0, 0%, 9%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 100%, 0.8);--backgroundPress:hsla(0, 0%, 95%, 1);--backgroundFocus:hsla(0, 0%, 95%, 1);--borderColor:hsla(0, 0%, 91%, 1);--borderColorHover:hsla(0, 0%, 93%, 1);--borderColorPress:hsla(0, 0%, 88%, 1);--borderColorFocus:hsla(0, 0%, 91%, 1);--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--colorTransparent:hsla(0, 0%, 9%, 0);--blue1:hsl(206, 100%, 99.2%);--blue2:hsl(210, 100%, 98.0%);--blue3:hsl(209, 100%, 96.5%);--blue4:hsl(210, 98.8%, 94.0%);--blue5:hsl(209, 95.0%, 90.1%);--blue6:hsl(209, 81.2%, 84.5%);--blue7:hsl(208, 77.5%, 76.9%);--blue8:hsl(206, 81.9%, 65.3%);--blue9:hsl(206, 100%, 50.0%);--blue10:hsl(208, 100%, 47.3%);--blue11:hsl(211, 100%, 43.2%);--blue12:hsl(211, 100%, 15.0%);--green1:hsl(136, 50.0%, 98.9%);--green2:hsl(138, 62.5%, 96.9%);--green3:hsl(139, 55.2%, 94.5%);--green4:hsl(140, 48.7%, 91.0%);--green5:hsl(141, 43.7%, 86.0%);--green6:hsl(143, 40.3%, 79.0%);--green7:hsl(146, 38.5%, 69.0%);--green8:hsl(151, 40.2%, 54.1%);--green9:hsl(151, 55.0%, 41.5%);--green10:hsl(152, 57.5%, 37.6%);--green11:hsl(153, 67.0%, 28.5%);--green12:hsl(155, 40.0%, 14.0%);--red1:hsl(359, 100%, 99.4%);--red2:hsl(359, 100%, 98.6%);--red3:hsl(360, 100%, 96.8%);--red4:hsl(360, 97.9%, 94.8%);--red5:hsl(360, 90.2%, 91.9%);--red6:hsl(360, 81.7%, 87.8%);--red7:hsl(359, 74.2%, 81.7%);--red8:hsl(359, 69.5%, 74.3%);--red9:hsl(358, 75.0%, 59.0%);--red10:hsl(358, 69.4%, 55.2%);--red11:hsl(358, 65.0%, 48.7%);--red12:hsl(354, 50.0%, 14.6%);--yellow1:hsl(60, 54.0%, 98.5%);--yellow2:hsl(52, 100%, 95.5%);--yellow3:hsl(55, 100%, 90.9%);--yellow4:hsl(54, 100%, 86.6%);--yellow5:hsl(52, 97.9%, 82.0%);--yellow6:hsl(50, 89.4%, 76.1%);--yellow7:hsl(47, 80.4%, 68.0%);--yellow8:hsl(48, 100%, 46.1%);--yellow9:hsl(53, 92.0%, 50.0%);--yellow10:hsl(50, 100%, 48.5%);--yellow11:hsl(42, 100%, 29.0%);--yellow12:hsl(40, 55.0%, 13.5%);--shadow1:rgba(0,0,0,0.04);--shadow2:rgba(0,0,0,0.08);--shadow3:rgba(0,0,0,0.16);--shadow4:rgba(0,0,0,0.24);--shadow5:rgba(0,0,0,0.32);--shadow6:rgba(0,0,0,0.4);--black1:#050505;--black2:#151515;--black3:#191919;--black4:#232323;--black5:#282828;--black6:#323232;--black7:#424242;--black8:#494949;--black9:#545454;--black10:#626262;--black11:#a5a5a5;--black12:#fff;--white1:#fff;--white2:#f2f2f2;--white3:hsl(0, 0%, 93%);--white4:hsl(0, 0%, 91%);--white5:hsl(0, 0%, 88%);--white6:hsl(0, 0%, 85%);--white7:hsl(0, 0%, 82%);--white8:hsl(0, 0%, 76%);--white9:hsl(0, 0%, 56%);--white10:hsl(0, 0%, 50%);--white11:hsl(0, 0%, 42%);--white12:hsl(0, 0%, 9%);--shadowColor:rgba(0,0,0,0.04);--accent1:hsla(0, 0%, 2%, 1);--accent2:hsla(0, 0%, 8%, 1);--accent3:hsla(0, 0%, 10%, 1);--accent4:hsla(0, 0%, 14%, 1);--accent5:hsla(0, 0%, 16%, 1);--accent6:hsla(0, 0%, 20%, 1);--accent7:hsla(0, 0%, 26%, 1);--accent8:hsla(0, 0%, 29%, 1);--accent9:hsla(0, 0%, 33%, 1);--accent10:hsla(0, 0%, 38%, 1);--accent11:hsla(0, 0%, 65%, 1);--accent12:hsla(0, 0%, 100%, 1);}
+  }
+.t_light ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark, :root.t_dark , :root.t_light .t_dark , .tm_xxt {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(0, 0%, 2%, 0);--background02:hsla(0, 0%, 2%, 0.2);--background04:hsla(0, 0%, 2%, 0.4);--background06:hsla(0, 0%, 2%, 0.6);--background08:hsla(0, 0%, 2%, 0.8);--color1:hsla(0, 0%, 2%, 1);--color2:hsla(0, 0%, 8%, 1);--color3:hsla(0, 0%, 10%, 1);--color4:hsla(0, 0%, 14%, 1);--color5:hsla(0, 0%, 16%, 1);--color6:hsla(0, 0%, 20%, 1);--color7:hsla(0, 0%, 26%, 1);--color8:hsla(0, 0%, 29%, 1);--color9:hsla(0, 0%, 33%, 1);--color10:hsla(0, 0%, 38%, 1);--color11:hsla(0, 0%, 65%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 2%, 1);--backgroundHover:hsla(0, 0%, 8%, 1);--backgroundPress:hsla(0, 0%, 2%, 0.8);--backgroundFocus:hsla(0, 0%, 2%, 0.8);--borderColor:hsla(0, 0%, 14%, 1);--borderColorHover:hsla(0, 0%, 16%, 1);--borderColorPress:hsla(0, 0%, 10%, 1);--borderColorFocus:hsla(0, 0%, 14%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);--blue1:hsl(212, 35.0%, 9.2%);--blue2:hsl(216, 50.0%, 11.8%);--blue3:hsl(214, 59.4%, 15.3%);--blue4:hsl(214, 65.8%, 17.9%);--blue5:hsl(213, 71.2%, 20.2%);--blue6:hsl(212, 77.4%, 23.1%);--blue7:hsl(211, 85.1%, 27.4%);--blue8:hsl(211, 89.7%, 34.1%);--blue9:hsl(206, 100%, 50.0%);--blue10:hsl(209, 100%, 60.6%);--blue11:hsl(210, 100%, 66.1%);--blue12:hsl(206, 98.0%, 95.8%);--green1:hsl(146, 30.0%, 7.4%);--green2:hsl(155, 44.2%, 8.4%);--green3:hsl(155, 46.7%, 10.9%);--green4:hsl(154, 48.4%, 12.9%);--green5:hsl(154, 49.7%, 14.9%);--green6:hsl(154, 50.9%, 17.6%);--green7:hsl(153, 51.8%, 21.8%);--green8:hsl(151, 51.7%, 28.4%);--green9:hsl(151, 55.0%, 41.5%);--green10:hsl(151, 49.3%, 46.5%);--green11:hsl(151, 50.0%, 53.2%);--green12:hsl(137, 72.0%, 94.0%);--red1:hsl(353, 23.0%, 9.8%);--red2:hsl(357, 34.4%, 12.0%);--red3:hsl(356, 43.4%, 16.4%);--red4:hsl(356, 47.6%, 19.2%);--red5:hsl(356, 51.1%, 21.9%);--red6:hsl(356, 55.2%, 25.9%);--red7:hsl(357, 60.2%, 31.8%);--red8:hsl(358, 65.0%, 40.4%);--red9:hsl(358, 75.0%, 59.0%);--red10:hsl(358, 85.3%, 64.0%);--red11:hsl(358, 100%, 69.5%);--red12:hsl(351, 89.0%, 96.0%);--yellow1:hsl(45, 100%, 5.5%);--yellow2:hsl(46, 100%, 6.7%);--yellow3:hsl(45, 100%, 8.7%);--yellow4:hsl(45, 100%, 10.4%);--yellow5:hsl(47, 100%, 12.1%);--yellow6:hsl(49, 100%, 14.3%);--yellow7:hsl(49, 90.3%, 18.4%);--yellow8:hsl(50, 100%, 22.0%);--yellow9:hsl(53, 92.0%, 50.0%);--yellow10:hsl(54, 100%, 68.0%);--yellow11:hsl(48, 100%, 47.0%);--yellow12:hsl(53, 100%, 91.0%);--shadow1:rgba(0,0,0,0.2);--shadow2:rgba(0,0,0,0.3);--shadow3:rgba(0,0,0,0.4);--shadow4:rgba(0,0,0,0.5);--shadow5:rgba(0,0,0,0.6);--shadow6:rgba(0,0,0,0.7);--black1:#050505;--black2:#151515;--black3:#191919;--black4:#232323;--black5:#282828;--black6:#323232;--black7:#424242;--black8:#494949;--black9:#545454;--black10:#626262;--black11:#a5a5a5;--black12:#fff;--white1:#fff;--white2:#f2f2f2;--white3:hsl(0, 0%, 93%);--white4:hsl(0, 0%, 91%);--white5:hsl(0, 0%, 88%);--white6:hsl(0, 0%, 85%);--white7:hsl(0, 0%, 82%);--white8:hsl(0, 0%, 76%);--white9:hsl(0, 0%, 56%);--white10:hsl(0, 0%, 50%);--white11:hsl(0, 0%, 42%);--white12:hsl(0, 0%, 9%);--shadowColor:rgba(0,0,0,0.2);--accent1:hsla(0, 0%, 100%, 1);--accent2:hsla(0, 0%, 95%, 1);--accent3:hsla(0, 0%, 93%, 1);--accent4:hsla(0, 0%, 91%, 1);--accent5:hsla(0, 0%, 88%, 1);--accent6:hsla(0, 0%, 85%, 1);--accent7:hsla(0, 0%, 82%, 1);--accent8:hsla(0, 0%, 76%, 1);--accent9:hsla(0, 0%, 56%, 1);--accent10:hsla(0, 0%, 50%, 1);--accent11:hsla(0, 0%, 42%, 1);--accent12:hsla(0, 0%, 9%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    :root {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(0, 0%, 2%, 0);--background02:hsla(0, 0%, 2%, 0.2);--background04:hsla(0, 0%, 2%, 0.4);--background06:hsla(0, 0%, 2%, 0.6);--background08:hsla(0, 0%, 2%, 0.8);--color1:hsla(0, 0%, 2%, 1);--color2:hsla(0, 0%, 8%, 1);--color3:hsla(0, 0%, 10%, 1);--color4:hsla(0, 0%, 14%, 1);--color5:hsla(0, 0%, 16%, 1);--color6:hsla(0, 0%, 20%, 1);--color7:hsla(0, 0%, 26%, 1);--color8:hsla(0, 0%, 29%, 1);--color9:hsla(0, 0%, 33%, 1);--color10:hsla(0, 0%, 38%, 1);--color11:hsla(0, 0%, 65%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 2%, 1);--backgroundHover:hsla(0, 0%, 8%, 1);--backgroundPress:hsla(0, 0%, 2%, 0.8);--backgroundFocus:hsla(0, 0%, 2%, 0.8);--borderColor:hsla(0, 0%, 14%, 1);--borderColorHover:hsla(0, 0%, 16%, 1);--borderColorPress:hsla(0, 0%, 10%, 1);--borderColorFocus:hsla(0, 0%, 14%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);--blue1:hsl(212, 35.0%, 9.2%);--blue2:hsl(216, 50.0%, 11.8%);--blue3:hsl(214, 59.4%, 15.3%);--blue4:hsl(214, 65.8%, 17.9%);--blue5:hsl(213, 71.2%, 20.2%);--blue6:hsl(212, 77.4%, 23.1%);--blue7:hsl(211, 85.1%, 27.4%);--blue8:hsl(211, 89.7%, 34.1%);--blue9:hsl(206, 100%, 50.0%);--blue10:hsl(209, 100%, 60.6%);--blue11:hsl(210, 100%, 66.1%);--blue12:hsl(206, 98.0%, 95.8%);--green1:hsl(146, 30.0%, 7.4%);--green2:hsl(155, 44.2%, 8.4%);--green3:hsl(155, 46.7%, 10.9%);--green4:hsl(154, 48.4%, 12.9%);--green5:hsl(154, 49.7%, 14.9%);--green6:hsl(154, 50.9%, 17.6%);--green7:hsl(153, 51.8%, 21.8%);--green8:hsl(151, 51.7%, 28.4%);--green9:hsl(151, 55.0%, 41.5%);--green10:hsl(151, 49.3%, 46.5%);--green11:hsl(151, 50.0%, 53.2%);--green12:hsl(137, 72.0%, 94.0%);--red1:hsl(353, 23.0%, 9.8%);--red2:hsl(357, 34.4%, 12.0%);--red3:hsl(356, 43.4%, 16.4%);--red4:hsl(356, 47.6%, 19.2%);--red5:hsl(356, 51.1%, 21.9%);--red6:hsl(356, 55.2%, 25.9%);--red7:hsl(357, 60.2%, 31.8%);--red8:hsl(358, 65.0%, 40.4%);--red9:hsl(358, 75.0%, 59.0%);--red10:hsl(358, 85.3%, 64.0%);--red11:hsl(358, 100%, 69.5%);--red12:hsl(351, 89.0%, 96.0%);--yellow1:hsl(45, 100%, 5.5%);--yellow2:hsl(46, 100%, 6.7%);--yellow3:hsl(45, 100%, 8.7%);--yellow4:hsl(45, 100%, 10.4%);--yellow5:hsl(47, 100%, 12.1%);--yellow6:hsl(49, 100%, 14.3%);--yellow7:hsl(49, 90.3%, 18.4%);--yellow8:hsl(50, 100%, 22.0%);--yellow9:hsl(53, 92.0%, 50.0%);--yellow10:hsl(54, 100%, 68.0%);--yellow11:hsl(48, 100%, 47.0%);--yellow12:hsl(53, 100%, 91.0%);--shadow1:rgba(0,0,0,0.2);--shadow2:rgba(0,0,0,0.3);--shadow3:rgba(0,0,0,0.4);--shadow4:rgba(0,0,0,0.5);--shadow5:rgba(0,0,0,0.6);--shadow6:rgba(0,0,0,0.7);--black1:#050505;--black2:#151515;--black3:#191919;--black4:#232323;--black5:#282828;--black6:#323232;--black7:#424242;--black8:#494949;--black9:#545454;--black10:#626262;--black11:#a5a5a5;--black12:#fff;--white1:#fff;--white2:#f2f2f2;--white3:hsl(0, 0%, 93%);--white4:hsl(0, 0%, 91%);--white5:hsl(0, 0%, 88%);--white6:hsl(0, 0%, 85%);--white7:hsl(0, 0%, 82%);--white8:hsl(0, 0%, 76%);--white9:hsl(0, 0%, 56%);--white10:hsl(0, 0%, 50%);--white11:hsl(0, 0%, 42%);--white12:hsl(0, 0%, 9%);--shadowColor:rgba(0,0,0,0.2);--accent1:hsla(0, 0%, 100%, 1);--accent2:hsla(0, 0%, 95%, 1);--accent3:hsla(0, 0%, 93%, 1);--accent4:hsla(0, 0%, 91%, 1);--accent5:hsla(0, 0%, 88%, 1);--accent6:hsla(0, 0%, 85%, 1);--accent7:hsla(0, 0%, 82%, 1);--accent8:hsla(0, 0%, 76%, 1);--accent9:hsla(0, 0%, 56%, 1);--accent10:hsla(0, 0%, 50%, 1);--accent11:hsla(0, 0%, 42%, 1);--accent12:hsla(0, 0%, 9%, 1);}
+  }
+.t_dark ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_accent, :root.t_light .t_accent, .tm_xxt {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(0, 0%, 2%, 0);--background02:hsla(0, 0%, 2%, 0.2);--background04:hsla(0, 0%, 2%, 0.4);--background06:hsla(0, 0%, 2%, 0.6);--background08:hsla(0, 0%, 2%, 0.8);--color1:hsla(0, 0%, 2%, 1);--color2:hsla(0, 0%, 8%, 1);--color3:hsla(0, 0%, 10%, 1);--color4:hsla(0, 0%, 14%, 1);--color5:hsla(0, 0%, 16%, 1);--color6:hsla(0, 0%, 20%, 1);--color7:hsla(0, 0%, 26%, 1);--color8:hsla(0, 0%, 29%, 1);--color9:hsla(0, 0%, 33%, 1);--color10:hsla(0, 0%, 38%, 1);--color11:hsla(0, 0%, 65%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 2%, 1);--backgroundHover:hsla(0, 0%, 2%, 0.8);--backgroundPress:hsla(0, 0%, 8%, 1);--backgroundFocus:hsla(0, 0%, 8%, 1);--borderColor:hsla(0, 0%, 14%, 1);--borderColorHover:hsla(0, 0%, 10%, 1);--borderColorPress:hsla(0, 0%, 16%, 1);--borderColorFocus:hsla(0, 0%, 14%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_accent {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(0, 0%, 2%, 0);--background02:hsla(0, 0%, 2%, 0.2);--background04:hsla(0, 0%, 2%, 0.4);--background06:hsla(0, 0%, 2%, 0.6);--background08:hsla(0, 0%, 2%, 0.8);--color1:hsla(0, 0%, 2%, 1);--color2:hsla(0, 0%, 8%, 1);--color3:hsla(0, 0%, 10%, 1);--color4:hsla(0, 0%, 14%, 1);--color5:hsla(0, 0%, 16%, 1);--color6:hsla(0, 0%, 20%, 1);--color7:hsla(0, 0%, 26%, 1);--color8:hsla(0, 0%, 29%, 1);--color9:hsla(0, 0%, 33%, 1);--color10:hsla(0, 0%, 38%, 1);--color11:hsla(0, 0%, 65%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 2%, 1);--backgroundHover:hsla(0, 0%, 2%, 0.8);--backgroundPress:hsla(0, 0%, 8%, 1);--backgroundFocus:hsla(0, 0%, 8%, 1);--borderColor:hsla(0, 0%, 14%, 1);--borderColorHover:hsla(0, 0%, 10%, 1);--borderColorPress:hsla(0, 0%, 16%, 1);--borderColorFocus:hsla(0, 0%, 14%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+  }
+.t_light_accent ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_accent, :root.t_light .t_dark .t_accent, .tm_xxt {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 95%, 1);--color3:hsla(0, 0%, 93%, 1);--color4:hsla(0, 0%, 91%, 1);--color5:hsla(0, 0%, 88%, 1);--color6:hsla(0, 0%, 85%, 1);--color7:hsla(0, 0%, 82%, 1);--color8:hsla(0, 0%, 76%, 1);--color9:hsla(0, 0%, 56%, 1);--color10:hsla(0, 0%, 50%, 1);--color11:hsla(0, 0%, 42%, 1);--color12:hsla(0, 0%, 9%, 1);--color0:hsla(0, 0%, 9%, 0);--color02:hsla(0, 0%, 9%, 0.2);--color04:hsla(0, 0%, 9%, 0.4);--color06:hsla(0, 0%, 9%, 0.6);--color08:hsla(0, 0%, 9%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 95%, 1);--backgroundPress:hsla(0, 0%, 100%, 0.8);--backgroundFocus:hsla(0, 0%, 100%, 0.8);--borderColor:hsla(0, 0%, 91%, 1);--borderColorHover:hsla(0, 0%, 88%, 1);--borderColorPress:hsla(0, 0%, 93%, 1);--borderColorFocus:hsla(0, 0%, 91%, 1);--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--colorTransparent:hsla(0, 0%, 9%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_accent {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 95%, 1);--color3:hsla(0, 0%, 93%, 1);--color4:hsla(0, 0%, 91%, 1);--color5:hsla(0, 0%, 88%, 1);--color6:hsla(0, 0%, 85%, 1);--color7:hsla(0, 0%, 82%, 1);--color8:hsla(0, 0%, 76%, 1);--color9:hsla(0, 0%, 56%, 1);--color10:hsla(0, 0%, 50%, 1);--color11:hsla(0, 0%, 42%, 1);--color12:hsla(0, 0%, 9%, 1);--color0:hsla(0, 0%, 9%, 0);--color02:hsla(0, 0%, 9%, 0.2);--color04:hsla(0, 0%, 9%, 0.4);--color06:hsla(0, 0%, 9%, 0.6);--color08:hsla(0, 0%, 9%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 95%, 1);--backgroundPress:hsla(0, 0%, 100%, 0.8);--backgroundFocus:hsla(0, 0%, 100%, 0.8);--borderColor:hsla(0, 0%, 91%, 1);--borderColorHover:hsla(0, 0%, 88%, 1);--borderColorPress:hsla(0, 0%, 93%, 1);--borderColorFocus:hsla(0, 0%, 91%, 1);--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--colorTransparent:hsla(0, 0%, 9%, 0);}
+  }
+.t_dark_accent ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_black, :root.t_light .t_black, .tm_xxt {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 0%, 2%, 0);--background02:hsla(0, 0%, 2%, 0.2);--background04:hsla(0, 0%, 2%, 0.4);--background06:hsla(0, 0%, 2%, 0.6);--background08:hsla(0, 0%, 2%, 0.8);--color1:hsla(0, 0%, 2%, 1);--color2:hsla(0, 0%, 8%, 1);--color3:hsla(0, 0%, 10%, 1);--color4:hsla(0, 0%, 14%, 1);--color5:hsla(0, 0%, 16%, 1);--color6:hsla(0, 0%, 20%, 1);--color7:hsla(0, 0%, 26%, 1);--color8:hsla(0, 0%, 29%, 1);--color9:hsla(0, 0%, 33%, 1);--color10:hsla(0, 0%, 38%, 1);--color11:hsla(0, 0%, 65%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 2%, 1);--backgroundHover:hsla(0, 0%, 2%, 0.8);--backgroundPress:hsla(0, 0%, 8%, 1);--backgroundFocus:hsla(0, 0%, 8%, 1);--borderColor:hsla(0, 0%, 14%, 1);--borderColorHover:hsla(0, 0%, 10%, 1);--borderColorPress:hsla(0, 0%, 16%, 1);--borderColorFocus:hsla(0, 0%, 14%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_black {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 0%, 2%, 0);--background02:hsla(0, 0%, 2%, 0.2);--background04:hsla(0, 0%, 2%, 0.4);--background06:hsla(0, 0%, 2%, 0.6);--background08:hsla(0, 0%, 2%, 0.8);--color1:hsla(0, 0%, 2%, 1);--color2:hsla(0, 0%, 8%, 1);--color3:hsla(0, 0%, 10%, 1);--color4:hsla(0, 0%, 14%, 1);--color5:hsla(0, 0%, 16%, 1);--color6:hsla(0, 0%, 20%, 1);--color7:hsla(0, 0%, 26%, 1);--color8:hsla(0, 0%, 29%, 1);--color9:hsla(0, 0%, 33%, 1);--color10:hsla(0, 0%, 38%, 1);--color11:hsla(0, 0%, 65%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 2%, 1);--backgroundHover:hsla(0, 0%, 2%, 0.8);--backgroundPress:hsla(0, 0%, 8%, 1);--backgroundFocus:hsla(0, 0%, 8%, 1);--borderColor:hsla(0, 0%, 14%, 1);--borderColorHover:hsla(0, 0%, 10%, 1);--borderColorPress:hsla(0, 0%, 16%, 1);--borderColorFocus:hsla(0, 0%, 14%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+  }
+.t_light_black ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_white, :root.t_light .t_white, .tm_xxt {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 95%, 1);--color3:hsla(0, 0%, 93%, 1);--color4:hsla(0, 0%, 91%, 1);--color5:hsla(0, 0%, 88%, 1);--color6:hsla(0, 0%, 85%, 1);--color7:hsla(0, 0%, 82%, 1);--color8:hsla(0, 0%, 76%, 1);--color9:hsla(0, 0%, 56%, 1);--color10:hsla(0, 0%, 50%, 1);--color11:hsla(0, 0%, 42%, 1);--color12:hsla(0, 0%, 9%, 1);--color0:hsla(0, 0%, 9%, 0);--color02:hsla(0, 0%, 9%, 0.2);--color04:hsla(0, 0%, 9%, 0.4);--color06:hsla(0, 0%, 9%, 0.6);--color08:hsla(0, 0%, 9%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 100%, 0.8);--backgroundPress:hsla(0, 0%, 95%, 1);--backgroundFocus:hsla(0, 0%, 95%, 1);--borderColor:hsla(0, 0%, 91%, 1);--borderColorHover:hsla(0, 0%, 93%, 1);--borderColorPress:hsla(0, 0%, 88%, 1);--borderColorFocus:hsla(0, 0%, 91%, 1);--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--colorTransparent:hsla(0, 0%, 9%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_white {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 95%, 1);--color3:hsla(0, 0%, 93%, 1);--color4:hsla(0, 0%, 91%, 1);--color5:hsla(0, 0%, 88%, 1);--color6:hsla(0, 0%, 85%, 1);--color7:hsla(0, 0%, 82%, 1);--color8:hsla(0, 0%, 76%, 1);--color9:hsla(0, 0%, 56%, 1);--color10:hsla(0, 0%, 50%, 1);--color11:hsla(0, 0%, 42%, 1);--color12:hsla(0, 0%, 9%, 1);--color0:hsla(0, 0%, 9%, 0);--color02:hsla(0, 0%, 9%, 0.2);--color04:hsla(0, 0%, 9%, 0.4);--color06:hsla(0, 0%, 9%, 0.6);--color08:hsla(0, 0%, 9%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 100%, 0.8);--backgroundPress:hsla(0, 0%, 95%, 1);--backgroundFocus:hsla(0, 0%, 95%, 1);--borderColor:hsla(0, 0%, 91%, 1);--borderColorHover:hsla(0, 0%, 93%, 1);--borderColorPress:hsla(0, 0%, 88%, 1);--borderColorFocus:hsla(0, 0%, 91%, 1);--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--colorTransparent:hsla(0, 0%, 9%, 0);}
+  }
+.t_light_white ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_blue, :root.t_light .t_blue, .tm_xxt {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(216, 100%, 99%, 0);--background02:hsla(216, 100%, 99%, 0.2);--background04:hsla(216, 100%, 99%, 0.4);--background06:hsla(216, 100%, 99%, 0.6);--background08:hsla(216, 100%, 99%, 0.8);--color1:hsla(210, 100%, 99%, 1);--color2:hsla(210, 100%, 98%, 1);--color3:hsla(210, 100%, 96%, 1);--color4:hsla(210, 100%, 94%, 1);--color5:hsla(209, 96%, 90%, 1);--color6:hsla(209, 82%, 85%, 1);--color7:hsla(208, 78%, 77%, 1);--color8:hsla(206, 82%, 65%, 1);--color9:hsla(206, 100%, 50%, 1);--color10:hsla(208, 100%, 47%, 1);--color11:hsla(211, 100%, 43%, 1);--color12:hsla(211, 100%, 15%, 1);--color0:hsla(211, 100%, 15%, 0);--color02:hsla(211, 100%, 15%, 0.2);--color04:hsla(211, 100%, 15%, 0.4);--color06:hsla(211, 100%, 15%, 0.6);--color08:hsla(211, 100%, 15%, 0.8);--background:hsla(210, 100%, 99%, 1);--backgroundHover:hsla(216, 100%, 99%, 0.8);--backgroundPress:hsla(210, 100%, 98%, 1);--backgroundFocus:hsla(210, 100%, 98%, 1);--borderColor:hsla(210, 100%, 94%, 1);--borderColorHover:hsla(210, 100%, 96%, 1);--borderColorPress:hsla(209, 96%, 90%, 1);--borderColorFocus:hsla(210, 100%, 94%, 1);--color:hsla(211, 100%, 15%, 1);--colorHover:hsla(211, 100%, 43%, 1);--colorPress:hsla(211, 100%, 15%, 1);--colorFocus:hsla(211, 100%, 43%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(211, 100%, 15%, 0.2);--colorTransparent:hsla(211, 100%, 15%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_blue {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(216, 100%, 99%, 0);--background02:hsla(216, 100%, 99%, 0.2);--background04:hsla(216, 100%, 99%, 0.4);--background06:hsla(216, 100%, 99%, 0.6);--background08:hsla(216, 100%, 99%, 0.8);--color1:hsla(210, 100%, 99%, 1);--color2:hsla(210, 100%, 98%, 1);--color3:hsla(210, 100%, 96%, 1);--color4:hsla(210, 100%, 94%, 1);--color5:hsla(209, 96%, 90%, 1);--color6:hsla(209, 82%, 85%, 1);--color7:hsla(208, 78%, 77%, 1);--color8:hsla(206, 82%, 65%, 1);--color9:hsla(206, 100%, 50%, 1);--color10:hsla(208, 100%, 47%, 1);--color11:hsla(211, 100%, 43%, 1);--color12:hsla(211, 100%, 15%, 1);--color0:hsla(211, 100%, 15%, 0);--color02:hsla(211, 100%, 15%, 0.2);--color04:hsla(211, 100%, 15%, 0.4);--color06:hsla(211, 100%, 15%, 0.6);--color08:hsla(211, 100%, 15%, 0.8);--background:hsla(210, 100%, 99%, 1);--backgroundHover:hsla(216, 100%, 99%, 0.8);--backgroundPress:hsla(210, 100%, 98%, 1);--backgroundFocus:hsla(210, 100%, 98%, 1);--borderColor:hsla(210, 100%, 94%, 1);--borderColorHover:hsla(210, 100%, 96%, 1);--borderColorPress:hsla(209, 96%, 90%, 1);--borderColorFocus:hsla(210, 100%, 94%, 1);--color:hsla(211, 100%, 15%, 1);--colorHover:hsla(211, 100%, 43%, 1);--colorPress:hsla(211, 100%, 15%, 1);--colorFocus:hsla(211, 100%, 43%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(211, 100%, 15%, 0.2);--colorTransparent:hsla(211, 100%, 15%, 0);}
+  }
+.t_light_blue ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_red, :root.t_light .t_red, .tm_xxt {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 100%, 99%, 0);--background02:hsla(0, 100%, 99%, 0.2);--background04:hsla(0, 100%, 99%, 0.4);--background06:hsla(0, 100%, 99%, 0.6);--background08:hsla(0, 100%, 99%, 0.8);--color1:hsla(0, 100%, 99%, 1);--color2:hsla(0, 100%, 99%, 1);--color3:hsla(0, 100%, 97%, 1);--color4:hsla(0, 100%, 95%, 1);--color5:hsla(0, 90%, 92%, 1);--color6:hsla(0, 81%, 88%, 1);--color7:hsla(359, 74%, 82%, 1);--color8:hsla(359, 69%, 74%, 1);--color9:hsla(358, 75%, 59%, 1);--color10:hsla(358, 69%, 55%, 1);--color11:hsla(358, 65%, 49%, 1);--color12:hsla(355, 49%, 15%, 1);--color0:hsla(355, 48%, 15%, 0);--color02:hsla(355, 48%, 15%, 0.2);--color04:hsla(355, 48%, 15%, 0.4);--color06:hsla(355, 48%, 15%, 0.6);--color08:hsla(355, 48%, 15%, 0.8);--background:hsla(0, 100%, 99%, 1);--backgroundHover:hsla(0, 100%, 99%, 0.8);--backgroundPress:hsla(0, 100%, 99%, 1);--backgroundFocus:hsla(0, 100%, 99%, 1);--borderColor:hsla(0, 100%, 95%, 1);--borderColorHover:hsla(0, 100%, 97%, 1);--borderColorPress:hsla(0, 90%, 92%, 1);--borderColorFocus:hsla(0, 100%, 95%, 1);--color:hsla(355, 49%, 15%, 1);--colorHover:hsla(358, 65%, 49%, 1);--colorPress:hsla(355, 49%, 15%, 1);--colorFocus:hsla(358, 65%, 49%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(355, 48%, 15%, 0.2);--colorTransparent:hsla(355, 48%, 15%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_red {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 100%, 99%, 0);--background02:hsla(0, 100%, 99%, 0.2);--background04:hsla(0, 100%, 99%, 0.4);--background06:hsla(0, 100%, 99%, 0.6);--background08:hsla(0, 100%, 99%, 0.8);--color1:hsla(0, 100%, 99%, 1);--color2:hsla(0, 100%, 99%, 1);--color3:hsla(0, 100%, 97%, 1);--color4:hsla(0, 100%, 95%, 1);--color5:hsla(0, 90%, 92%, 1);--color6:hsla(0, 81%, 88%, 1);--color7:hsla(359, 74%, 82%, 1);--color8:hsla(359, 69%, 74%, 1);--color9:hsla(358, 75%, 59%, 1);--color10:hsla(358, 69%, 55%, 1);--color11:hsla(358, 65%, 49%, 1);--color12:hsla(355, 49%, 15%, 1);--color0:hsla(355, 48%, 15%, 0);--color02:hsla(355, 48%, 15%, 0.2);--color04:hsla(355, 48%, 15%, 0.4);--color06:hsla(355, 48%, 15%, 0.6);--color08:hsla(355, 48%, 15%, 0.8);--background:hsla(0, 100%, 99%, 1);--backgroundHover:hsla(0, 100%, 99%, 0.8);--backgroundPress:hsla(0, 100%, 99%, 1);--backgroundFocus:hsla(0, 100%, 99%, 1);--borderColor:hsla(0, 100%, 95%, 1);--borderColorHover:hsla(0, 100%, 97%, 1);--borderColorPress:hsla(0, 90%, 92%, 1);--borderColorFocus:hsla(0, 100%, 95%, 1);--color:hsla(355, 49%, 15%, 1);--colorHover:hsla(358, 65%, 49%, 1);--colorPress:hsla(355, 49%, 15%, 1);--colorFocus:hsla(358, 65%, 49%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(355, 48%, 15%, 0.2);--colorTransparent:hsla(355, 48%, 15%, 0);}
+  }
+.t_light_red ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_yellow, :root.t_light .t_yellow, .tm_xxt {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(60, 45%, 98%, 0);--background02:hsla(60, 45%, 98%, 0.2);--background04:hsla(60, 45%, 98%, 0.4);--background06:hsla(60, 45%, 98%, 0.6);--background08:hsla(60, 45%, 98%, 0.8);--color1:hsla(60, 50%, 98%, 1);--color2:hsla(52, 100%, 95%, 1);--color3:hsla(55, 100%, 91%, 1);--color4:hsla(54, 100%, 87%, 1);--color5:hsla(52, 98%, 82%, 1);--color6:hsla(50, 90%, 76%, 1);--color7:hsla(47, 80%, 68%, 1);--color8:hsla(48, 100%, 46%, 1);--color9:hsla(53, 92%, 50%, 1);--color10:hsla(50, 100%, 48%, 1);--color11:hsla(42, 100%, 29%, 1);--color12:hsla(41, 56%, 13%, 1);--color0:hsla(41, 55%, 13%, 0);--color02:hsla(41, 55%, 13%, 0.2);--color04:hsla(41, 55%, 13%, 0.4);--color06:hsla(41, 55%, 13%, 0.6);--color08:hsla(41, 55%, 13%, 0.8);--background:hsla(60, 50%, 98%, 1);--backgroundHover:hsla(60, 45%, 98%, 0.8);--backgroundPress:hsla(52, 100%, 95%, 1);--backgroundFocus:hsla(52, 100%, 95%, 1);--borderColor:hsla(54, 100%, 87%, 1);--borderColorHover:hsla(55, 100%, 91%, 1);--borderColorPress:hsla(52, 98%, 82%, 1);--borderColorFocus:hsla(54, 100%, 87%, 1);--color:hsla(41, 56%, 13%, 1);--colorHover:hsla(42, 100%, 29%, 1);--colorPress:hsla(41, 56%, 13%, 1);--colorFocus:hsla(42, 100%, 29%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(41, 55%, 13%, 0.2);--colorTransparent:hsla(41, 55%, 13%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(60, 45%, 98%, 0);--background02:hsla(60, 45%, 98%, 0.2);--background04:hsla(60, 45%, 98%, 0.4);--background06:hsla(60, 45%, 98%, 0.6);--background08:hsla(60, 45%, 98%, 0.8);--color1:hsla(60, 50%, 98%, 1);--color2:hsla(52, 100%, 95%, 1);--color3:hsla(55, 100%, 91%, 1);--color4:hsla(54, 100%, 87%, 1);--color5:hsla(52, 98%, 82%, 1);--color6:hsla(50, 90%, 76%, 1);--color7:hsla(47, 80%, 68%, 1);--color8:hsla(48, 100%, 46%, 1);--color9:hsla(53, 92%, 50%, 1);--color10:hsla(50, 100%, 48%, 1);--color11:hsla(42, 100%, 29%, 1);--color12:hsla(41, 56%, 13%, 1);--color0:hsla(41, 55%, 13%, 0);--color02:hsla(41, 55%, 13%, 0.2);--color04:hsla(41, 55%, 13%, 0.4);--color06:hsla(41, 55%, 13%, 0.6);--color08:hsla(41, 55%, 13%, 0.8);--background:hsla(60, 50%, 98%, 1);--backgroundHover:hsla(60, 45%, 98%, 0.8);--backgroundPress:hsla(52, 100%, 95%, 1);--backgroundFocus:hsla(52, 100%, 95%, 1);--borderColor:hsla(54, 100%, 87%, 1);--borderColorHover:hsla(55, 100%, 91%, 1);--borderColorPress:hsla(52, 98%, 82%, 1);--borderColorFocus:hsla(54, 100%, 87%, 1);--color:hsla(41, 56%, 13%, 1);--colorHover:hsla(42, 100%, 29%, 1);--colorPress:hsla(41, 56%, 13%, 1);--colorFocus:hsla(42, 100%, 29%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(41, 55%, 13%, 0.2);--colorTransparent:hsla(41, 55%, 13%, 0);}
+  }
+.t_light_yellow ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_green, :root.t_light .t_green, .tm_xxt {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(140, 60%, 99%, 0);--background02:hsla(140, 60%, 99%, 0.2);--background04:hsla(140, 60%, 99%, 0.4);--background06:hsla(140, 60%, 99%, 0.6);--background08:hsla(140, 60%, 99%, 0.8);--color1:hsla(140, 60%, 99%, 1);--color2:hsla(138, 63%, 97%, 1);--color3:hsla(139, 57%, 95%, 1);--color4:hsla(139, 48%, 91%, 1);--color5:hsla(141, 44%, 86%, 1);--color6:hsla(142, 40%, 79%, 1);--color7:hsla(146, 38%, 69%, 1);--color8:hsla(151, 40%, 54%, 1);--color9:hsla(151, 55%, 42%, 1);--color10:hsla(152, 57%, 38%, 1);--color11:hsla(153, 67%, 28%, 1);--color12:hsla(155, 41%, 14%, 1);--color0:hsla(155, 41%, 14%, 0);--color02:hsla(155, 41%, 14%, 0.2);--color04:hsla(155, 41%, 14%, 0.4);--color06:hsla(155, 41%, 14%, 0.6);--color08:hsla(155, 41%, 14%, 0.8);--background:hsla(140, 60%, 99%, 1);--backgroundHover:hsla(140, 60%, 99%, 0.8);--backgroundPress:hsla(138, 63%, 97%, 1);--backgroundFocus:hsla(138, 63%, 97%, 1);--borderColor:hsla(139, 48%, 91%, 1);--borderColorHover:hsla(139, 57%, 95%, 1);--borderColorPress:hsla(141, 44%, 86%, 1);--borderColorFocus:hsla(139, 48%, 91%, 1);--color:hsla(155, 41%, 14%, 1);--colorHover:hsla(153, 67%, 28%, 1);--colorPress:hsla(155, 41%, 14%, 1);--colorFocus:hsla(153, 67%, 28%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(155, 41%, 14%, 0.2);--colorTransparent:hsla(155, 41%, 14%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_green {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(140, 60%, 99%, 0);--background02:hsla(140, 60%, 99%, 0.2);--background04:hsla(140, 60%, 99%, 0.4);--background06:hsla(140, 60%, 99%, 0.6);--background08:hsla(140, 60%, 99%, 0.8);--color1:hsla(140, 60%, 99%, 1);--color2:hsla(138, 63%, 97%, 1);--color3:hsla(139, 57%, 95%, 1);--color4:hsla(139, 48%, 91%, 1);--color5:hsla(141, 44%, 86%, 1);--color6:hsla(142, 40%, 79%, 1);--color7:hsla(146, 38%, 69%, 1);--color8:hsla(151, 40%, 54%, 1);--color9:hsla(151, 55%, 42%, 1);--color10:hsla(152, 57%, 38%, 1);--color11:hsla(153, 67%, 28%, 1);--color12:hsla(155, 41%, 14%, 1);--color0:hsla(155, 41%, 14%, 0);--color02:hsla(155, 41%, 14%, 0.2);--color04:hsla(155, 41%, 14%, 0.4);--color06:hsla(155, 41%, 14%, 0.6);--color08:hsla(155, 41%, 14%, 0.8);--background:hsla(140, 60%, 99%, 1);--backgroundHover:hsla(140, 60%, 99%, 0.8);--backgroundPress:hsla(138, 63%, 97%, 1);--backgroundFocus:hsla(138, 63%, 97%, 1);--borderColor:hsla(139, 48%, 91%, 1);--borderColorHover:hsla(139, 57%, 95%, 1);--borderColorPress:hsla(141, 44%, 86%, 1);--borderColorFocus:hsla(139, 48%, 91%, 1);--color:hsla(155, 41%, 14%, 1);--colorHover:hsla(153, 67%, 28%, 1);--colorPress:hsla(155, 41%, 14%, 1);--colorFocus:hsla(153, 67%, 28%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(155, 41%, 14%, 0.2);--colorTransparent:hsla(155, 41%, 14%, 0);}
+  }
+.t_light_green ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_black, :root.t_light .t_dark .t_black, .tm_xxt {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(0, 0%, 2%, 0);--background02:hsla(0, 0%, 2%, 0.2);--background04:hsla(0, 0%, 2%, 0.4);--background06:hsla(0, 0%, 2%, 0.6);--background08:hsla(0, 0%, 2%, 0.8);--color1:hsla(0, 0%, 2%, 1);--color2:hsla(0, 0%, 8%, 1);--color3:hsla(0, 0%, 10%, 1);--color4:hsla(0, 0%, 14%, 1);--color5:hsla(0, 0%, 16%, 1);--color6:hsla(0, 0%, 20%, 1);--color7:hsla(0, 0%, 26%, 1);--color8:hsla(0, 0%, 29%, 1);--color9:hsla(0, 0%, 33%, 1);--color10:hsla(0, 0%, 38%, 1);--color11:hsla(0, 0%, 65%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 2%, 1);--backgroundHover:hsla(0, 0%, 8%, 1);--backgroundPress:hsla(0, 0%, 2%, 0.8);--backgroundFocus:hsla(0, 0%, 2%, 0.8);--borderColor:hsla(0, 0%, 14%, 1);--borderColorHover:hsla(0, 0%, 16%, 1);--borderColorPress:hsla(0, 0%, 10%, 1);--borderColorFocus:hsla(0, 0%, 14%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_black {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(0, 0%, 2%, 0);--background02:hsla(0, 0%, 2%, 0.2);--background04:hsla(0, 0%, 2%, 0.4);--background06:hsla(0, 0%, 2%, 0.6);--background08:hsla(0, 0%, 2%, 0.8);--color1:hsla(0, 0%, 2%, 1);--color2:hsla(0, 0%, 8%, 1);--color3:hsla(0, 0%, 10%, 1);--color4:hsla(0, 0%, 14%, 1);--color5:hsla(0, 0%, 16%, 1);--color6:hsla(0, 0%, 20%, 1);--color7:hsla(0, 0%, 26%, 1);--color8:hsla(0, 0%, 29%, 1);--color9:hsla(0, 0%, 33%, 1);--color10:hsla(0, 0%, 38%, 1);--color11:hsla(0, 0%, 65%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 2%, 1);--backgroundHover:hsla(0, 0%, 8%, 1);--backgroundPress:hsla(0, 0%, 2%, 0.8);--backgroundFocus:hsla(0, 0%, 2%, 0.8);--borderColor:hsla(0, 0%, 14%, 1);--borderColorHover:hsla(0, 0%, 16%, 1);--borderColorPress:hsla(0, 0%, 10%, 1);--borderColorFocus:hsla(0, 0%, 14%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+  }
+.t_dark_black ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_white, :root.t_light .t_dark .t_white, .tm_xxt {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 95%, 1);--color3:hsla(0, 0%, 93%, 1);--color4:hsla(0, 0%, 91%, 1);--color5:hsla(0, 0%, 88%, 1);--color6:hsla(0, 0%, 85%, 1);--color7:hsla(0, 0%, 82%, 1);--color8:hsla(0, 0%, 76%, 1);--color9:hsla(0, 0%, 56%, 1);--color10:hsla(0, 0%, 50%, 1);--color11:hsla(0, 0%, 42%, 1);--color12:hsla(0, 0%, 9%, 1);--color0:hsla(0, 0%, 9%, 0);--color02:hsla(0, 0%, 9%, 0.2);--color04:hsla(0, 0%, 9%, 0.4);--color06:hsla(0, 0%, 9%, 0.6);--color08:hsla(0, 0%, 9%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 95%, 1);--backgroundPress:hsla(0, 0%, 100%, 0.8);--backgroundFocus:hsla(0, 0%, 100%, 0.8);--borderColor:hsla(0, 0%, 91%, 1);--borderColorHover:hsla(0, 0%, 88%, 1);--borderColorPress:hsla(0, 0%, 93%, 1);--borderColorFocus:hsla(0, 0%, 91%, 1);--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--colorTransparent:hsla(0, 0%, 9%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_white {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 95%, 1);--color3:hsla(0, 0%, 93%, 1);--color4:hsla(0, 0%, 91%, 1);--color5:hsla(0, 0%, 88%, 1);--color6:hsla(0, 0%, 85%, 1);--color7:hsla(0, 0%, 82%, 1);--color8:hsla(0, 0%, 76%, 1);--color9:hsla(0, 0%, 56%, 1);--color10:hsla(0, 0%, 50%, 1);--color11:hsla(0, 0%, 42%, 1);--color12:hsla(0, 0%, 9%, 1);--color0:hsla(0, 0%, 9%, 0);--color02:hsla(0, 0%, 9%, 0.2);--color04:hsla(0, 0%, 9%, 0.4);--color06:hsla(0, 0%, 9%, 0.6);--color08:hsla(0, 0%, 9%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 95%, 1);--backgroundPress:hsla(0, 0%, 100%, 0.8);--backgroundFocus:hsla(0, 0%, 100%, 0.8);--borderColor:hsla(0, 0%, 91%, 1);--borderColorHover:hsla(0, 0%, 88%, 1);--borderColorPress:hsla(0, 0%, 93%, 1);--borderColorFocus:hsla(0, 0%, 91%, 1);--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--colorTransparent:hsla(0, 0%, 9%, 0);}
+  }
+.t_dark_white ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_blue, :root.t_light .t_dark .t_blue, .tm_xxt {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(214, 35%, 9%, 0);--background02:hsla(214, 35%, 9%, 0.2);--background04:hsla(214, 35%, 9%, 0.4);--background06:hsla(214, 35%, 9%, 0.6);--background08:hsla(214, 35%, 9%, 0.8);--color1:hsla(212, 36%, 9%, 1);--color2:hsla(216, 50%, 12%, 1);--color3:hsla(214, 59%, 15%, 1);--color4:hsla(214, 65%, 18%, 1);--color5:hsla(213, 71%, 20%, 1);--color6:hsla(212, 78%, 23%, 1);--color7:hsla(211, 86%, 27%, 1);--color8:hsla(211, 90%, 34%, 1);--color9:hsla(206, 100%, 50%, 1);--color10:hsla(209, 100%, 61%, 1);--color11:hsla(210, 100%, 66%, 1);--color12:hsla(206, 100%, 96%, 1);--color0:hsla(207, 100%, 96%, 0);--color02:hsla(207, 100%, 96%, 0.2);--color04:hsla(207, 100%, 96%, 0.4);--color06:hsla(207, 100%, 96%, 0.6);--color08:hsla(207, 100%, 96%, 0.8);--background:hsla(212, 36%, 9%, 1);--backgroundHover:hsla(216, 50%, 12%, 1);--backgroundPress:hsla(214, 35%, 9%, 0.8);--backgroundFocus:hsla(214, 35%, 9%, 0.8);--borderColor:hsla(214, 65%, 18%, 1);--borderColorHover:hsla(213, 71%, 20%, 1);--borderColorPress:hsla(214, 59%, 15%, 1);--borderColorFocus:hsla(214, 65%, 18%, 1);--color:hsla(206, 100%, 96%, 1);--colorHover:hsla(210, 100%, 66%, 1);--colorPress:hsla(206, 100%, 96%, 1);--colorFocus:hsla(210, 100%, 66%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(207, 100%, 96%, 0.2);--colorTransparent:hsla(207, 100%, 96%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_blue {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(214, 35%, 9%, 0);--background02:hsla(214, 35%, 9%, 0.2);--background04:hsla(214, 35%, 9%, 0.4);--background06:hsla(214, 35%, 9%, 0.6);--background08:hsla(214, 35%, 9%, 0.8);--color1:hsla(212, 36%, 9%, 1);--color2:hsla(216, 50%, 12%, 1);--color3:hsla(214, 59%, 15%, 1);--color4:hsla(214, 65%, 18%, 1);--color5:hsla(213, 71%, 20%, 1);--color6:hsla(212, 78%, 23%, 1);--color7:hsla(211, 86%, 27%, 1);--color8:hsla(211, 90%, 34%, 1);--color9:hsla(206, 100%, 50%, 1);--color10:hsla(209, 100%, 61%, 1);--color11:hsla(210, 100%, 66%, 1);--color12:hsla(206, 100%, 96%, 1);--color0:hsla(207, 100%, 96%, 0);--color02:hsla(207, 100%, 96%, 0.2);--color04:hsla(207, 100%, 96%, 0.4);--color06:hsla(207, 100%, 96%, 0.6);--color08:hsla(207, 100%, 96%, 0.8);--background:hsla(212, 36%, 9%, 1);--backgroundHover:hsla(216, 50%, 12%, 1);--backgroundPress:hsla(214, 35%, 9%, 0.8);--backgroundFocus:hsla(214, 35%, 9%, 0.8);--borderColor:hsla(214, 65%, 18%, 1);--borderColorHover:hsla(213, 71%, 20%, 1);--borderColorPress:hsla(214, 59%, 15%, 1);--borderColorFocus:hsla(214, 65%, 18%, 1);--color:hsla(206, 100%, 96%, 1);--colorHover:hsla(210, 100%, 66%, 1);--colorPress:hsla(206, 100%, 96%, 1);--colorFocus:hsla(210, 100%, 66%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(207, 100%, 96%, 0.2);--colorTransparent:hsla(207, 100%, 96%, 0);}
+  }
+.t_dark_blue ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_red, :root.t_light .t_dark .t_red, .tm_xxt {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(351, 25%, 10%, 0);--background02:hsla(351, 25%, 10%, 0.2);--background04:hsla(351, 25%, 10%, 0.4);--background06:hsla(351, 25%, 10%, 0.6);--background08:hsla(351, 25%, 10%, 0.8);--color1:hsla(350, 24%, 10%, 1);--color2:hsla(357, 34%, 12%, 1);--color3:hsla(357, 43%, 16%, 1);--color4:hsla(356, 47%, 19%, 1);--color5:hsla(356, 51%, 22%, 1);--color6:hsla(357, 55%, 26%, 1);--color7:hsla(357, 60%, 32%, 1);--color8:hsla(358, 65%, 40%, 1);--color9:hsla(358, 75%, 59%, 1);--color10:hsla(358, 86%, 64%, 1);--color11:hsla(358, 100%, 69%, 1);--color12:hsla(353, 90%, 96%, 1);--color0:hsla(353, 90%, 96%, 0);--color02:hsla(353, 90%, 96%, 0.2);--color04:hsla(353, 90%, 96%, 0.4);--color06:hsla(353, 90%, 96%, 0.6);--color08:hsla(353, 90%, 96%, 0.8);--background:hsla(350, 24%, 10%, 1);--backgroundHover:hsla(357, 34%, 12%, 1);--backgroundPress:hsla(351, 25%, 10%, 0.8);--backgroundFocus:hsla(351, 25%, 10%, 0.8);--borderColor:hsla(356, 47%, 19%, 1);--borderColorHover:hsla(356, 51%, 22%, 1);--borderColorPress:hsla(357, 43%, 16%, 1);--borderColorFocus:hsla(356, 47%, 19%, 1);--color:hsla(353, 90%, 96%, 1);--colorHover:hsla(358, 100%, 69%, 1);--colorPress:hsla(353, 90%, 96%, 1);--colorFocus:hsla(358, 100%, 69%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(353, 90%, 96%, 0.2);--colorTransparent:hsla(353, 90%, 96%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_red {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(351, 25%, 10%, 0);--background02:hsla(351, 25%, 10%, 0.2);--background04:hsla(351, 25%, 10%, 0.4);--background06:hsla(351, 25%, 10%, 0.6);--background08:hsla(351, 25%, 10%, 0.8);--color1:hsla(350, 24%, 10%, 1);--color2:hsla(357, 34%, 12%, 1);--color3:hsla(357, 43%, 16%, 1);--color4:hsla(356, 47%, 19%, 1);--color5:hsla(356, 51%, 22%, 1);--color6:hsla(357, 55%, 26%, 1);--color7:hsla(357, 60%, 32%, 1);--color8:hsla(358, 65%, 40%, 1);--color9:hsla(358, 75%, 59%, 1);--color10:hsla(358, 86%, 64%, 1);--color11:hsla(358, 100%, 69%, 1);--color12:hsla(353, 90%, 96%, 1);--color0:hsla(353, 90%, 96%, 0);--color02:hsla(353, 90%, 96%, 0.2);--color04:hsla(353, 90%, 96%, 0.4);--color06:hsla(353, 90%, 96%, 0.6);--color08:hsla(353, 90%, 96%, 0.8);--background:hsla(350, 24%, 10%, 1);--backgroundHover:hsla(357, 34%, 12%, 1);--backgroundPress:hsla(351, 25%, 10%, 0.8);--backgroundFocus:hsla(351, 25%, 10%, 0.8);--borderColor:hsla(356, 47%, 19%, 1);--borderColorHover:hsla(356, 51%, 22%, 1);--borderColorPress:hsla(357, 43%, 16%, 1);--borderColorFocus:hsla(356, 47%, 19%, 1);--color:hsla(353, 90%, 96%, 1);--colorHover:hsla(358, 100%, 69%, 1);--colorPress:hsla(353, 90%, 96%, 1);--colorFocus:hsla(358, 100%, 69%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(353, 90%, 96%, 0.2);--colorTransparent:hsla(353, 90%, 96%, 0);}
+  }
+.t_dark_red ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_yellow, :root.t_light .t_dark .t_yellow, .tm_xxt {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(46, 100%, 5%, 0);--background02:hsla(46, 100%, 5%, 0.2);--background04:hsla(46, 100%, 5%, 0.4);--background06:hsla(46, 100%, 5%, 0.6);--background08:hsla(46, 100%, 5%, 0.8);--color1:hsla(45, 100%, 5%, 1);--color2:hsla(46, 100%, 7%, 1);--color3:hsla(45, 100%, 9%, 1);--color4:hsla(45, 100%, 10%, 1);--color5:hsla(46, 100%, 12%, 1);--color6:hsla(49, 100%, 14%, 1);--color7:hsla(49, 89%, 18%, 1);--color8:hsla(50, 100%, 22%, 1);--color9:hsla(53, 92%, 50%, 1);--color10:hsla(54, 100%, 68%, 1);--color11:hsla(48, 100%, 47%, 1);--color12:hsla(53, 100%, 91%, 1);--color0:hsla(53, 100%, 91%, 0);--color02:hsla(53, 100%, 91%, 0.2);--color04:hsla(53, 100%, 91%, 0.4);--color06:hsla(53, 100%, 91%, 0.6);--color08:hsla(53, 100%, 91%, 0.8);--background:hsla(45, 100%, 5%, 1);--backgroundHover:hsla(46, 100%, 7%, 1);--backgroundPress:hsla(46, 100%, 5%, 0.8);--backgroundFocus:hsla(46, 100%, 5%, 0.8);--borderColor:hsla(45, 100%, 10%, 1);--borderColorHover:hsla(46, 100%, 12%, 1);--borderColorPress:hsla(45, 100%, 9%, 1);--borderColorFocus:hsla(45, 100%, 10%, 1);--color:hsla(53, 100%, 91%, 1);--colorHover:hsla(48, 100%, 47%, 1);--colorPress:hsla(53, 100%, 91%, 1);--colorFocus:hsla(48, 100%, 47%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(53, 100%, 91%, 0.2);--colorTransparent:hsla(53, 100%, 91%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(46, 100%, 5%, 0);--background02:hsla(46, 100%, 5%, 0.2);--background04:hsla(46, 100%, 5%, 0.4);--background06:hsla(46, 100%, 5%, 0.6);--background08:hsla(46, 100%, 5%, 0.8);--color1:hsla(45, 100%, 5%, 1);--color2:hsla(46, 100%, 7%, 1);--color3:hsla(45, 100%, 9%, 1);--color4:hsla(45, 100%, 10%, 1);--color5:hsla(46, 100%, 12%, 1);--color6:hsla(49, 100%, 14%, 1);--color7:hsla(49, 89%, 18%, 1);--color8:hsla(50, 100%, 22%, 1);--color9:hsla(53, 92%, 50%, 1);--color10:hsla(54, 100%, 68%, 1);--color11:hsla(48, 100%, 47%, 1);--color12:hsla(53, 100%, 91%, 1);--color0:hsla(53, 100%, 91%, 0);--color02:hsla(53, 100%, 91%, 0.2);--color04:hsla(53, 100%, 91%, 0.4);--color06:hsla(53, 100%, 91%, 0.6);--color08:hsla(53, 100%, 91%, 0.8);--background:hsla(45, 100%, 5%, 1);--backgroundHover:hsla(46, 100%, 7%, 1);--backgroundPress:hsla(46, 100%, 5%, 0.8);--backgroundFocus:hsla(46, 100%, 5%, 0.8);--borderColor:hsla(45, 100%, 10%, 1);--borderColorHover:hsla(46, 100%, 12%, 1);--borderColorPress:hsla(45, 100%, 9%, 1);--borderColorFocus:hsla(45, 100%, 10%, 1);--color:hsla(53, 100%, 91%, 1);--colorHover:hsla(48, 100%, 47%, 1);--colorPress:hsla(53, 100%, 91%, 1);--colorFocus:hsla(48, 100%, 47%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(53, 100%, 91%, 0.2);--colorTransparent:hsla(53, 100%, 91%, 0);}
+  }
+.t_dark_yellow ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_green, :root.t_light .t_dark .t_green, .tm_xxt {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(145, 33%, 7%, 0);--background02:hsla(145, 33%, 7%, 0.2);--background04:hsla(145, 33%, 7%, 0.4);--background06:hsla(145, 33%, 7%, 0.6);--background08:hsla(145, 33%, 7%, 0.8);--color1:hsla(145, 32%, 7%, 1);--color2:hsla(155, 44%, 8%, 1);--color3:hsla(155, 46%, 11%, 1);--color4:hsla(154, 48%, 13%, 1);--color5:hsla(155, 50%, 15%, 1);--color6:hsla(154, 51%, 18%, 1);--color7:hsla(153, 51%, 22%, 1);--color8:hsla(151, 52%, 28%, 1);--color9:hsla(151, 55%, 42%, 1);--color10:hsla(151, 49%, 46%, 1);--color11:hsla(151, 50%, 53%, 1);--color12:hsla(136, 73%, 94%, 1);--color0:hsla(134, 73%, 94%, 0);--color02:hsla(134, 73%, 94%, 0.2);--color04:hsla(134, 73%, 94%, 0.4);--color06:hsla(134, 73%, 94%, 0.6);--color08:hsla(134, 73%, 94%, 0.8);--background:hsla(145, 32%, 7%, 1);--backgroundHover:hsla(155, 44%, 8%, 1);--backgroundPress:hsla(145, 33%, 7%, 0.8);--backgroundFocus:hsla(145, 33%, 7%, 0.8);--borderColor:hsla(154, 48%, 13%, 1);--borderColorHover:hsla(155, 50%, 15%, 1);--borderColorPress:hsla(155, 46%, 11%, 1);--borderColorFocus:hsla(154, 48%, 13%, 1);--color:hsla(136, 73%, 94%, 1);--colorHover:hsla(151, 50%, 53%, 1);--colorPress:hsla(136, 73%, 94%, 1);--colorFocus:hsla(151, 50%, 53%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(134, 73%, 94%, 0.2);--colorTransparent:hsla(134, 73%, 94%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_green {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(145, 33%, 7%, 0);--background02:hsla(145, 33%, 7%, 0.2);--background04:hsla(145, 33%, 7%, 0.4);--background06:hsla(145, 33%, 7%, 0.6);--background08:hsla(145, 33%, 7%, 0.8);--color1:hsla(145, 32%, 7%, 1);--color2:hsla(155, 44%, 8%, 1);--color3:hsla(155, 46%, 11%, 1);--color4:hsla(154, 48%, 13%, 1);--color5:hsla(155, 50%, 15%, 1);--color6:hsla(154, 51%, 18%, 1);--color7:hsla(153, 51%, 22%, 1);--color8:hsla(151, 52%, 28%, 1);--color9:hsla(151, 55%, 42%, 1);--color10:hsla(151, 49%, 46%, 1);--color11:hsla(151, 50%, 53%, 1);--color12:hsla(136, 73%, 94%, 1);--color0:hsla(134, 73%, 94%, 0);--color02:hsla(134, 73%, 94%, 0.2);--color04:hsla(134, 73%, 94%, 0.4);--color06:hsla(134, 73%, 94%, 0.6);--color08:hsla(134, 73%, 94%, 0.8);--background:hsla(145, 32%, 7%, 1);--backgroundHover:hsla(155, 44%, 8%, 1);--backgroundPress:hsla(145, 33%, 7%, 0.8);--backgroundFocus:hsla(145, 33%, 7%, 0.8);--borderColor:hsla(154, 48%, 13%, 1);--borderColorHover:hsla(155, 50%, 15%, 1);--borderColorPress:hsla(155, 46%, 11%, 1);--borderColorFocus:hsla(154, 48%, 13%, 1);--color:hsla(136, 73%, 94%, 1);--colorHover:hsla(151, 50%, 53%, 1);--colorPress:hsla(136, 73%, 94%, 1);--colorFocus:hsla(151, 50%, 53%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(134, 73%, 94%, 0.2);--colorTransparent:hsla(134, 73%, 94%, 0);}
+  }
+.t_dark_green ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_Card, :root.t_dark .t_light .t_Input, :root.t_dark .t_light .t_ListItem, :root.t_dark .t_light .t_Progress, :root.t_dark .t_light .t_SelectTrigger, :root.t_dark .t_light .t_SliderTrack, :root.t_dark .t_light .t_TextArea, :root.t_dark .t_light .t_TooltipArrow, :root.t_dark .t_light .t_white_Card, :root.t_dark .t_light .t_white_Input, :root.t_dark .t_light .t_white_ListItem, :root.t_dark .t_light .t_white_Progress, :root.t_dark .t_light .t_white_SelectTrigger, :root.t_dark .t_light .t_white_SliderTrack, :root.t_dark .t_light .t_white_TextArea, :root.t_dark .t_light .t_white_TooltipArrow, :root.t_light .t_Card, :root.t_light .t_Input, :root.t_light .t_ListItem, :root.t_light .t_Progress, :root.t_light .t_SelectTrigger, :root.t_light .t_SliderTrack, :root.t_light .t_TextArea, :root.t_light .t_TooltipArrow, :root.t_light .t_white_Card, :root.t_light .t_white_Input, :root.t_light .t_white_ListItem, :root.t_light .t_white_Progress, :root.t_light .t_white_SelectTrigger, :root.t_light .t_white_SliderTrack, :root.t_light .t_white_TextArea, :root.t_light .t_white_TooltipArrow, .tm_xxt {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 95%, 1);--backgroundHover:hsla(0, 0%, 100%, 1);--backgroundPress:hsla(0, 0%, 93%, 1);--backgroundFocus:hsla(0, 0%, 93%, 1);--borderColor:hsla(0, 0%, 88%, 1);--borderColorHover:hsla(0, 0%, 91%, 1);--borderColorFocus:hsla(0, 0%, 88%, 1);--borderColorPress:hsla(0, 0%, 85%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_Card, .t_Input, .t_ListItem, .t_Progress, .t_SelectTrigger, .t_SliderTrack, .t_TextArea, .t_TooltipArrow, .t_white_Card, .t_white_Input, .t_white_ListItem, .t_white_Progress, .t_white_SelectTrigger, .t_white_SliderTrack, .t_white_TextArea, .t_white_TooltipArrow {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 95%, 1);--backgroundHover:hsla(0, 0%, 100%, 1);--backgroundPress:hsla(0, 0%, 93%, 1);--backgroundFocus:hsla(0, 0%, 93%, 1);--borderColor:hsla(0, 0%, 88%, 1);--borderColorHover:hsla(0, 0%, 91%, 1);--borderColorFocus:hsla(0, 0%, 88%, 1);--borderColorPress:hsla(0, 0%, 85%, 1);}
+  }
+:root.t_dark .t_light .t_Button, :root.t_dark .t_light .t_SliderTrackActive, :root.t_dark .t_light .t_white_Button, :root.t_dark .t_light .t_white_SliderTrackActive, :root.t_light .t_Button, :root.t_light .t_SliderTrackActive, :root.t_light .t_white_Button, :root.t_light .t_white_SliderTrackActive, .tm_xxt {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 91%, 1);--backgroundHover:hsla(0, 0%, 93%, 1);--backgroundPress:hsla(0, 0%, 88%, 1);--backgroundFocus:hsla(0, 0%, 88%, 1);--borderColor:hsla(0, 0%, 82%, 1);--borderColorHover:hsla(0, 0%, 85%, 1);--borderColorFocus:hsla(0, 0%, 82%, 1);--borderColorPress:hsla(0, 0%, 76%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_Button, .t_SliderTrackActive, .t_white_Button, .t_white_SliderTrackActive {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 91%, 1);--backgroundHover:hsla(0, 0%, 93%, 1);--backgroundPress:hsla(0, 0%, 88%, 1);--backgroundFocus:hsla(0, 0%, 88%, 1);--borderColor:hsla(0, 0%, 82%, 1);--borderColorHover:hsla(0, 0%, 85%, 1);--borderColorFocus:hsla(0, 0%, 82%, 1);--borderColorPress:hsla(0, 0%, 76%, 1);}
+  }
+:root.t_dark .t_light .t_Checkbox, :root.t_dark .t_light .t_RadioGroupItem, :root.t_dark .t_light .t_Switch, :root.t_dark .t_light .t_TooltipContent, :root.t_dark .t_light .t_white_Checkbox, :root.t_dark .t_light .t_white_RadioGroupItem, :root.t_dark .t_light .t_white_Switch, :root.t_dark .t_light .t_white_TooltipContent, :root.t_light .t_Checkbox, :root.t_light .t_RadioGroupItem, :root.t_light .t_Switch, :root.t_light .t_TooltipContent, :root.t_light .t_white_Checkbox, :root.t_light .t_white_RadioGroupItem, :root.t_light .t_white_Switch, :root.t_light .t_white_TooltipContent, .tm_xxt {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 93%, 1);--backgroundHover:hsla(0, 0%, 95%, 1);--backgroundPress:hsla(0, 0%, 91%, 1);--backgroundFocus:hsla(0, 0%, 91%, 1);--borderColor:hsla(0, 0%, 85%, 1);--borderColorHover:hsla(0, 0%, 88%, 1);--borderColorFocus:hsla(0, 0%, 85%, 1);--borderColorPress:hsla(0, 0%, 82%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_Checkbox, .t_RadioGroupItem, .t_Switch, .t_TooltipContent, .t_white_Checkbox, .t_white_RadioGroupItem, .t_white_Switch, .t_white_TooltipContent {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 93%, 1);--backgroundHover:hsla(0, 0%, 95%, 1);--backgroundPress:hsla(0, 0%, 91%, 1);--backgroundFocus:hsla(0, 0%, 91%, 1);--borderColor:hsla(0, 0%, 85%, 1);--borderColorHover:hsla(0, 0%, 88%, 1);--borderColorFocus:hsla(0, 0%, 85%, 1);--borderColorPress:hsla(0, 0%, 82%, 1);}
+  }
+:root.t_dark .t_light .t_ProgressIndicator, :root.t_dark .t_light .t_SliderThumb, :root.t_dark .t_light .t_SwitchThumb, :root.t_dark .t_light .t_Tooltip, :root.t_dark .t_light .t_white_ProgressIndicator, :root.t_dark .t_light .t_white_SliderThumb, :root.t_dark .t_light .t_white_SwitchThumb, :root.t_dark .t_light .t_white_Tooltip, :root.t_light .t_ProgressIndicator, :root.t_light .t_SliderThumb, :root.t_light .t_SwitchThumb, :root.t_light .t_Tooltip, :root.t_light .t_white_ProgressIndicator, :root.t_light .t_white_SliderThumb, :root.t_light .t_white_SwitchThumb, :root.t_light .t_white_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(0, 0%, 9%, 0);--background02:hsla(0, 0%, 9%, 0.2);--background04:hsla(0, 0%, 9%, 0.4);--background06:hsla(0, 0%, 9%, 0.6);--background08:hsla(0, 0%, 9%, 0.8);--color1:hsla(0, 0%, 9%, 1);--color2:hsla(0, 0%, 42%, 1);--color3:hsla(0, 0%, 50%, 1);--color4:hsla(0, 0%, 56%, 1);--color5:hsla(0, 0%, 76%, 1);--color6:hsla(0, 0%, 82%, 1);--color7:hsla(0, 0%, 85%, 1);--color8:hsla(0, 0%, 88%, 1);--color9:hsla(0, 0%, 91%, 1);--color10:hsla(0, 0%, 93%, 1);--color11:hsla(0, 0%, 95%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 9%, 1);--backgroundHover:hsla(0, 0%, 9%, 0.8);--backgroundPress:hsla(0, 0%, 42%, 1);--backgroundFocus:hsla(0, 0%, 42%, 1);--borderColor:hsla(0, 0%, 56%, 1);--borderColorHover:hsla(0, 0%, 50%, 1);--borderColorPress:hsla(0, 0%, 76%, 1);--borderColorFocus:hsla(0, 0%, 56%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 95%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 95%, 1);--placeholderColor:hsla(0, 0%, 91%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_ProgressIndicator, .t_SliderThumb, .t_SwitchThumb, .t_Tooltip, .t_white_ProgressIndicator, .t_white_SliderThumb, .t_white_SwitchThumb, .t_white_Tooltip {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(0, 0%, 9%, 0);--background02:hsla(0, 0%, 9%, 0.2);--background04:hsla(0, 0%, 9%, 0.4);--background06:hsla(0, 0%, 9%, 0.6);--background08:hsla(0, 0%, 9%, 0.8);--color1:hsla(0, 0%, 9%, 1);--color2:hsla(0, 0%, 42%, 1);--color3:hsla(0, 0%, 50%, 1);--color4:hsla(0, 0%, 56%, 1);--color5:hsla(0, 0%, 76%, 1);--color6:hsla(0, 0%, 82%, 1);--color7:hsla(0, 0%, 85%, 1);--color8:hsla(0, 0%, 88%, 1);--color9:hsla(0, 0%, 91%, 1);--color10:hsla(0, 0%, 93%, 1);--color11:hsla(0, 0%, 95%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 9%, 1);--backgroundHover:hsla(0, 0%, 9%, 0.8);--backgroundPress:hsla(0, 0%, 42%, 1);--backgroundFocus:hsla(0, 0%, 42%, 1);--borderColor:hsla(0, 0%, 56%, 1);--borderColorHover:hsla(0, 0%, 50%, 1);--borderColorPress:hsla(0, 0%, 76%, 1);--borderColorFocus:hsla(0, 0%, 56%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 95%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 95%, 1);--placeholderColor:hsla(0, 0%, 91%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+  }
+.t_light_SwitchThumb ::selection, .t_light_SliderThumb ::selection, .t_light_Tooltip ::selection, .t_light_ProgressIndicator ::selection, .t_light_white_SwitchThumb ::selection, .t_light_white_SliderThumb ::selection, .t_light_white_Tooltip ::selection, .t_light_white_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_Card, :root.t_dark .t_Input, :root.t_dark .t_ListItem, :root.t_dark .t_Progress, :root.t_dark .t_SelectTrigger, :root.t_dark .t_SliderTrack, :root.t_dark .t_TextArea, :root.t_dark .t_TooltipArrow, :root.t_dark .t_black_Card, :root.t_dark .t_black_Input, :root.t_dark .t_black_ListItem, :root.t_dark .t_black_Progress, :root.t_dark .t_black_SelectTrigger, :root.t_dark .t_black_SliderTrack, :root.t_dark .t_black_TextArea, :root.t_dark .t_black_TooltipArrow, :root.t_light .t_dark .t_Card, :root.t_light .t_dark .t_Input, :root.t_light .t_dark .t_ListItem, :root.t_light .t_dark .t_Progress, :root.t_light .t_dark .t_SelectTrigger, :root.t_light .t_dark .t_SliderTrack, :root.t_light .t_dark .t_TextArea, :root.t_light .t_dark .t_TooltipArrow, :root.t_light .t_dark .t_black_Card, :root.t_light .t_dark .t_black_Input, :root.t_light .t_dark .t_black_ListItem, :root.t_light .t_dark .t_black_Progress, :root.t_light .t_dark .t_black_SelectTrigger, :root.t_light .t_dark .t_black_SliderTrack, :root.t_light .t_dark .t_black_TextArea, :root.t_light .t_dark .t_black_TooltipArrow, .tm_xxt {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 8%, 1);--backgroundHover:hsla(0, 0%, 10%, 1);--backgroundPress:hsla(0, 0%, 2%, 1);--backgroundFocus:hsla(0, 0%, 2%, 1);--borderColor:hsla(0, 0%, 16%, 1);--borderColorHover:hsla(0, 0%, 20%, 1);--borderColorFocus:hsla(0, 0%, 16%, 1);--borderColorPress:hsla(0, 0%, 14%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_Card, .t_Input, .t_ListItem, .t_Progress, .t_SelectTrigger, .t_SliderTrack, .t_TextArea, .t_TooltipArrow, .t_black_Card, .t_black_Input, .t_black_ListItem, .t_black_Progress, .t_black_SelectTrigger, .t_black_SliderTrack, .t_black_TextArea, .t_black_TooltipArrow {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 8%, 1);--backgroundHover:hsla(0, 0%, 10%, 1);--backgroundPress:hsla(0, 0%, 2%, 1);--backgroundFocus:hsla(0, 0%, 2%, 1);--borderColor:hsla(0, 0%, 16%, 1);--borderColorHover:hsla(0, 0%, 20%, 1);--borderColorFocus:hsla(0, 0%, 16%, 1);--borderColorPress:hsla(0, 0%, 14%, 1);}
+  }
+:root.t_dark .t_Button, :root.t_dark .t_SliderTrackActive, :root.t_dark .t_black_Button, :root.t_dark .t_black_SliderTrackActive, :root.t_light .t_dark .t_Button, :root.t_light .t_dark .t_SliderTrackActive, :root.t_light .t_dark .t_black_Button, :root.t_light .t_dark .t_black_SliderTrackActive, .tm_xxt {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 14%, 1);--backgroundHover:hsla(0, 0%, 16%, 1);--backgroundPress:hsla(0, 0%, 10%, 1);--backgroundFocus:hsla(0, 0%, 10%, 1);--borderColor:hsla(0, 0%, 26%, 1);--borderColorHover:hsla(0, 0%, 29%, 1);--borderColorFocus:hsla(0, 0%, 26%, 1);--borderColorPress:hsla(0, 0%, 20%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_Button, .t_SliderTrackActive, .t_black_Button, .t_black_SliderTrackActive {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 14%, 1);--backgroundHover:hsla(0, 0%, 16%, 1);--backgroundPress:hsla(0, 0%, 10%, 1);--backgroundFocus:hsla(0, 0%, 10%, 1);--borderColor:hsla(0, 0%, 26%, 1);--borderColorHover:hsla(0, 0%, 29%, 1);--borderColorFocus:hsla(0, 0%, 26%, 1);--borderColorPress:hsla(0, 0%, 20%, 1);}
+  }
+:root.t_dark .t_Checkbox, :root.t_dark .t_RadioGroupItem, :root.t_dark .t_Switch, :root.t_dark .t_TooltipContent, :root.t_dark .t_black_Checkbox, :root.t_dark .t_black_RadioGroupItem, :root.t_dark .t_black_Switch, :root.t_dark .t_black_TooltipContent, :root.t_light .t_dark .t_Checkbox, :root.t_light .t_dark .t_RadioGroupItem, :root.t_light .t_dark .t_Switch, :root.t_light .t_dark .t_TooltipContent, :root.t_light .t_dark .t_black_Checkbox, :root.t_light .t_dark .t_black_RadioGroupItem, :root.t_light .t_dark .t_black_Switch, :root.t_light .t_dark .t_black_TooltipContent, .tm_xxt {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 10%, 1);--backgroundHover:hsla(0, 0%, 14%, 1);--backgroundPress:hsla(0, 0%, 8%, 1);--backgroundFocus:hsla(0, 0%, 8%, 1);--borderColor:hsla(0, 0%, 20%, 1);--borderColorHover:hsla(0, 0%, 26%, 1);--borderColorFocus:hsla(0, 0%, 20%, 1);--borderColorPress:hsla(0, 0%, 16%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_Checkbox, .t_RadioGroupItem, .t_Switch, .t_TooltipContent, .t_black_Checkbox, .t_black_RadioGroupItem, .t_black_Switch, .t_black_TooltipContent {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 10%, 1);--backgroundHover:hsla(0, 0%, 14%, 1);--backgroundPress:hsla(0, 0%, 8%, 1);--backgroundFocus:hsla(0, 0%, 8%, 1);--borderColor:hsla(0, 0%, 20%, 1);--borderColorHover:hsla(0, 0%, 26%, 1);--borderColorFocus:hsla(0, 0%, 20%, 1);--borderColorPress:hsla(0, 0%, 16%, 1);}
+  }
+:root.t_dark .t_ProgressIndicator, :root.t_dark .t_SliderThumb, :root.t_dark .t_SwitchThumb, :root.t_dark .t_Tooltip, :root.t_dark .t_black_ProgressIndicator, :root.t_dark .t_black_SliderThumb, :root.t_dark .t_black_SwitchThumb, :root.t_dark .t_black_Tooltip, :root.t_light .t_dark .t_ProgressIndicator, :root.t_light .t_dark .t_SliderThumb, :root.t_light .t_dark .t_SwitchThumb, :root.t_light .t_dark .t_Tooltip, :root.t_light .t_dark .t_black_ProgressIndicator, :root.t_light .t_dark .t_black_SliderThumb, :root.t_light .t_dark .t_black_SwitchThumb, :root.t_light .t_dark .t_black_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 65%, 1);--color3:hsla(0, 0%, 38%, 1);--color4:hsla(0, 0%, 33%, 1);--color5:hsla(0, 0%, 29%, 1);--color6:hsla(0, 0%, 26%, 1);--color7:hsla(0, 0%, 20%, 1);--color8:hsla(0, 0%, 16%, 1);--color9:hsla(0, 0%, 14%, 1);--color10:hsla(0, 0%, 10%, 1);--color11:hsla(0, 0%, 8%, 1);--color12:hsla(0, 0%, 2%, 1);--color0:hsla(0, 0%, 2%, 0);--color02:hsla(0, 0%, 2%, 0.2);--color04:hsla(0, 0%, 2%, 0.4);--color06:hsla(0, 0%, 2%, 0.6);--color08:hsla(0, 0%, 2%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 65%, 1);--backgroundPress:hsla(0, 0%, 100%, 0.8);--backgroundFocus:hsla(0, 0%, 100%, 0.8);--borderColor:hsla(0, 0%, 33%, 1);--borderColorHover:hsla(0, 0%, 29%, 1);--borderColorPress:hsla(0, 0%, 38%, 1);--borderColorFocus:hsla(0, 0%, 33%, 1);--color:hsla(0, 0%, 2%, 1);--colorHover:hsla(0, 0%, 8%, 1);--colorPress:hsla(0, 0%, 2%, 1);--colorFocus:hsla(0, 0%, 8%, 1);--placeholderColor:hsla(0, 0%, 14%, 1);--outlineColor:hsla(0, 0%, 2%, 0.2);--colorTransparent:hsla(0, 0%, 2%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_ProgressIndicator, .t_SliderThumb, .t_SwitchThumb, .t_Tooltip, .t_black_ProgressIndicator, .t_black_SliderThumb, .t_black_SwitchThumb, .t_black_Tooltip {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 65%, 1);--color3:hsla(0, 0%, 38%, 1);--color4:hsla(0, 0%, 33%, 1);--color5:hsla(0, 0%, 29%, 1);--color6:hsla(0, 0%, 26%, 1);--color7:hsla(0, 0%, 20%, 1);--color8:hsla(0, 0%, 16%, 1);--color9:hsla(0, 0%, 14%, 1);--color10:hsla(0, 0%, 10%, 1);--color11:hsla(0, 0%, 8%, 1);--color12:hsla(0, 0%, 2%, 1);--color0:hsla(0, 0%, 2%, 0);--color02:hsla(0, 0%, 2%, 0.2);--color04:hsla(0, 0%, 2%, 0.4);--color06:hsla(0, 0%, 2%, 0.6);--color08:hsla(0, 0%, 2%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 65%, 1);--backgroundPress:hsla(0, 0%, 100%, 0.8);--backgroundFocus:hsla(0, 0%, 100%, 0.8);--borderColor:hsla(0, 0%, 33%, 1);--borderColorHover:hsla(0, 0%, 29%, 1);--borderColorPress:hsla(0, 0%, 38%, 1);--borderColorFocus:hsla(0, 0%, 33%, 1);--color:hsla(0, 0%, 2%, 1);--colorHover:hsla(0, 0%, 8%, 1);--colorPress:hsla(0, 0%, 2%, 1);--colorFocus:hsla(0, 0%, 8%, 1);--placeholderColor:hsla(0, 0%, 14%, 1);--outlineColor:hsla(0, 0%, 2%, 0.2);--colorTransparent:hsla(0, 0%, 2%, 0);}
+  }
+.t_dark_SwitchThumb ::selection, .t_dark_SliderThumb ::selection, .t_dark_Tooltip ::selection, .t_dark_ProgressIndicator ::selection, .t_dark_black_SwitchThumb ::selection, .t_dark_black_SliderThumb ::selection, .t_dark_black_Tooltip ::selection, .t_dark_black_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_accent_Card, :root.t_dark .t_light .t_accent_Input, :root.t_dark .t_light .t_accent_ListItem, :root.t_dark .t_light .t_accent_Progress, :root.t_dark .t_light .t_accent_SelectTrigger, :root.t_dark .t_light .t_accent_SliderTrack, :root.t_dark .t_light .t_accent_TextArea, :root.t_dark .t_light .t_accent_TooltipArrow, :root.t_dark .t_light .t_black_Card, :root.t_dark .t_light .t_black_Input, :root.t_dark .t_light .t_black_ListItem, :root.t_dark .t_light .t_black_Progress, :root.t_dark .t_light .t_black_SelectTrigger, :root.t_dark .t_light .t_black_SliderTrack, :root.t_dark .t_light .t_black_TextArea, :root.t_dark .t_light .t_black_TooltipArrow, :root.t_light .t_accent_Card, :root.t_light .t_accent_Input, :root.t_light .t_accent_ListItem, :root.t_light .t_accent_Progress, :root.t_light .t_accent_SelectTrigger, :root.t_light .t_accent_SliderTrack, :root.t_light .t_accent_TextArea, :root.t_light .t_accent_TooltipArrow, :root.t_light .t_black_Card, :root.t_light .t_black_Input, :root.t_light .t_black_ListItem, :root.t_light .t_black_Progress, :root.t_light .t_black_SelectTrigger, :root.t_light .t_black_SliderTrack, :root.t_light .t_black_TextArea, :root.t_light .t_black_TooltipArrow, .tm_xxt {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 8%, 1);--backgroundHover:hsla(0, 0%, 2%, 1);--backgroundPress:hsla(0, 0%, 10%, 1);--backgroundFocus:hsla(0, 0%, 10%, 1);--borderColor:hsla(0, 0%, 16%, 1);--borderColorHover:hsla(0, 0%, 14%, 1);--borderColorFocus:hsla(0, 0%, 16%, 1);--borderColorPress:hsla(0, 0%, 20%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_accent_Card, .t_accent_Input, .t_accent_ListItem, .t_accent_Progress, .t_accent_SelectTrigger, .t_accent_SliderTrack, .t_accent_TextArea, .t_accent_TooltipArrow, .t_black_Card, .t_black_Input, .t_black_ListItem, .t_black_Progress, .t_black_SelectTrigger, .t_black_SliderTrack, .t_black_TextArea, .t_black_TooltipArrow {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 8%, 1);--backgroundHover:hsla(0, 0%, 2%, 1);--backgroundPress:hsla(0, 0%, 10%, 1);--backgroundFocus:hsla(0, 0%, 10%, 1);--borderColor:hsla(0, 0%, 16%, 1);--borderColorHover:hsla(0, 0%, 14%, 1);--borderColorFocus:hsla(0, 0%, 16%, 1);--borderColorPress:hsla(0, 0%, 20%, 1);}
+  }
+:root.t_dark .t_light .t_accent_Button, :root.t_dark .t_light .t_accent_SliderTrackActive, :root.t_dark .t_light .t_black_Button, :root.t_dark .t_light .t_black_SliderTrackActive, :root.t_light .t_accent_Button, :root.t_light .t_accent_SliderTrackActive, :root.t_light .t_black_Button, :root.t_light .t_black_SliderTrackActive, .tm_xxt {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 14%, 1);--backgroundHover:hsla(0, 0%, 10%, 1);--backgroundPress:hsla(0, 0%, 16%, 1);--backgroundFocus:hsla(0, 0%, 16%, 1);--borderColor:hsla(0, 0%, 26%, 1);--borderColorHover:hsla(0, 0%, 20%, 1);--borderColorFocus:hsla(0, 0%, 26%, 1);--borderColorPress:hsla(0, 0%, 29%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_accent_Button, .t_accent_SliderTrackActive, .t_black_Button, .t_black_SliderTrackActive {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 14%, 1);--backgroundHover:hsla(0, 0%, 10%, 1);--backgroundPress:hsla(0, 0%, 16%, 1);--backgroundFocus:hsla(0, 0%, 16%, 1);--borderColor:hsla(0, 0%, 26%, 1);--borderColorHover:hsla(0, 0%, 20%, 1);--borderColorFocus:hsla(0, 0%, 26%, 1);--borderColorPress:hsla(0, 0%, 29%, 1);}
+  }
+:root.t_dark .t_light .t_accent_Checkbox, :root.t_dark .t_light .t_accent_RadioGroupItem, :root.t_dark .t_light .t_accent_Switch, :root.t_dark .t_light .t_accent_TooltipContent, :root.t_dark .t_light .t_black_Checkbox, :root.t_dark .t_light .t_black_RadioGroupItem, :root.t_dark .t_light .t_black_Switch, :root.t_dark .t_light .t_black_TooltipContent, :root.t_light .t_accent_Checkbox, :root.t_light .t_accent_RadioGroupItem, :root.t_light .t_accent_Switch, :root.t_light .t_accent_TooltipContent, :root.t_light .t_black_Checkbox, :root.t_light .t_black_RadioGroupItem, :root.t_light .t_black_Switch, :root.t_light .t_black_TooltipContent, .tm_xxt {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 10%, 1);--backgroundHover:hsla(0, 0%, 8%, 1);--backgroundPress:hsla(0, 0%, 14%, 1);--backgroundFocus:hsla(0, 0%, 14%, 1);--borderColor:hsla(0, 0%, 20%, 1);--borderColorHover:hsla(0, 0%, 16%, 1);--borderColorFocus:hsla(0, 0%, 20%, 1);--borderColorPress:hsla(0, 0%, 26%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_accent_Checkbox, .t_accent_RadioGroupItem, .t_accent_Switch, .t_accent_TooltipContent, .t_black_Checkbox, .t_black_RadioGroupItem, .t_black_Switch, .t_black_TooltipContent {--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 65%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 65%, 1);--placeholderColor:hsla(0, 0%, 33%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--background:hsla(0, 0%, 10%, 1);--backgroundHover:hsla(0, 0%, 8%, 1);--backgroundPress:hsla(0, 0%, 14%, 1);--backgroundFocus:hsla(0, 0%, 14%, 1);--borderColor:hsla(0, 0%, 20%, 1);--borderColorHover:hsla(0, 0%, 16%, 1);--borderColorFocus:hsla(0, 0%, 20%, 1);--borderColorPress:hsla(0, 0%, 26%, 1);}
+  }
+:root.t_dark .t_light .t_accent_ProgressIndicator, :root.t_dark .t_light .t_accent_SliderThumb, :root.t_dark .t_light .t_accent_SwitchThumb, :root.t_dark .t_light .t_accent_Tooltip, :root.t_light .t_accent_ProgressIndicator, :root.t_light .t_accent_SliderThumb, :root.t_light .t_accent_SwitchThumb, :root.t_light .t_accent_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 65%, 1);--color3:hsla(0, 0%, 38%, 1);--color4:hsla(0, 0%, 33%, 1);--color5:hsla(0, 0%, 29%, 1);--color6:hsla(0, 0%, 26%, 1);--color7:hsla(0, 0%, 20%, 1);--color8:hsla(0, 0%, 16%, 1);--color9:hsla(0, 0%, 14%, 1);--color10:hsla(0, 0%, 10%, 1);--color11:hsla(0, 0%, 8%, 1);--color12:hsla(0, 0%, 2%, 1);--color0:hsla(0, 0%, 2%, 0);--color02:hsla(0, 0%, 2%, 0.2);--color04:hsla(0, 0%, 2%, 0.4);--color06:hsla(0, 0%, 2%, 0.6);--color08:hsla(0, 0%, 2%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 100%, 0.8);--backgroundPress:hsla(0, 0%, 65%, 1);--backgroundFocus:hsla(0, 0%, 65%, 1);--borderColor:hsla(0, 0%, 33%, 1);--borderColorHover:hsla(0, 0%, 38%, 1);--borderColorPress:hsla(0, 0%, 29%, 1);--borderColorFocus:hsla(0, 0%, 33%, 1);--color:hsla(0, 0%, 2%, 1);--colorHover:hsla(0, 0%, 8%, 1);--colorPress:hsla(0, 0%, 2%, 1);--colorFocus:hsla(0, 0%, 8%, 1);--placeholderColor:hsla(0, 0%, 14%, 1);--outlineColor:hsla(0, 0%, 2%, 0.2);--colorTransparent:hsla(0, 0%, 2%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_accent_ProgressIndicator, .t_accent_SliderThumb, .t_accent_SwitchThumb, .t_accent_Tooltip {--accentBackground:hsla(0, 0%, 50%, 1);--accentColor:hsla(0, 0%, 93%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 65%, 1);--color3:hsla(0, 0%, 38%, 1);--color4:hsla(0, 0%, 33%, 1);--color5:hsla(0, 0%, 29%, 1);--color6:hsla(0, 0%, 26%, 1);--color7:hsla(0, 0%, 20%, 1);--color8:hsla(0, 0%, 16%, 1);--color9:hsla(0, 0%, 14%, 1);--color10:hsla(0, 0%, 10%, 1);--color11:hsla(0, 0%, 8%, 1);--color12:hsla(0, 0%, 2%, 1);--color0:hsla(0, 0%, 2%, 0);--color02:hsla(0, 0%, 2%, 0.2);--color04:hsla(0, 0%, 2%, 0.4);--color06:hsla(0, 0%, 2%, 0.6);--color08:hsla(0, 0%, 2%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 100%, 0.8);--backgroundPress:hsla(0, 0%, 65%, 1);--backgroundFocus:hsla(0, 0%, 65%, 1);--borderColor:hsla(0, 0%, 33%, 1);--borderColorHover:hsla(0, 0%, 38%, 1);--borderColorPress:hsla(0, 0%, 29%, 1);--borderColorFocus:hsla(0, 0%, 33%, 1);--color:hsla(0, 0%, 2%, 1);--colorHover:hsla(0, 0%, 8%, 1);--colorPress:hsla(0, 0%, 2%, 1);--colorFocus:hsla(0, 0%, 8%, 1);--placeholderColor:hsla(0, 0%, 14%, 1);--outlineColor:hsla(0, 0%, 2%, 0.2);--colorTransparent:hsla(0, 0%, 2%, 0);}
+  }
+.t_light_accent_SwitchThumb ::selection, .t_light_accent_SliderThumb ::selection, .t_light_accent_Tooltip ::selection, .t_light_accent_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_accent_Card, :root.t_dark .t_accent_Input, :root.t_dark .t_accent_ListItem, :root.t_dark .t_accent_Progress, :root.t_dark .t_accent_SelectTrigger, :root.t_dark .t_accent_SliderTrack, :root.t_dark .t_accent_TextArea, :root.t_dark .t_accent_TooltipArrow, :root.t_dark .t_white_Card, :root.t_dark .t_white_Input, :root.t_dark .t_white_ListItem, :root.t_dark .t_white_Progress, :root.t_dark .t_white_SelectTrigger, :root.t_dark .t_white_SliderTrack, :root.t_dark .t_white_TextArea, :root.t_dark .t_white_TooltipArrow, :root.t_light .t_dark .t_accent_Card, :root.t_light .t_dark .t_accent_Input, :root.t_light .t_dark .t_accent_ListItem, :root.t_light .t_dark .t_accent_Progress, :root.t_light .t_dark .t_accent_SelectTrigger, :root.t_light .t_dark .t_accent_SliderTrack, :root.t_light .t_dark .t_accent_TextArea, :root.t_light .t_dark .t_accent_TooltipArrow, :root.t_light .t_dark .t_white_Card, :root.t_light .t_dark .t_white_Input, :root.t_light .t_dark .t_white_ListItem, :root.t_light .t_dark .t_white_Progress, :root.t_light .t_dark .t_white_SelectTrigger, :root.t_light .t_dark .t_white_SliderTrack, :root.t_light .t_dark .t_white_TextArea, :root.t_light .t_dark .t_white_TooltipArrow, .tm_xxt {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 95%, 1);--backgroundHover:hsla(0, 0%, 93%, 1);--backgroundPress:hsla(0, 0%, 100%, 1);--backgroundFocus:hsla(0, 0%, 100%, 1);--borderColor:hsla(0, 0%, 88%, 1);--borderColorHover:hsla(0, 0%, 85%, 1);--borderColorFocus:hsla(0, 0%, 88%, 1);--borderColorPress:hsla(0, 0%, 91%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_accent_Card, .t_accent_Input, .t_accent_ListItem, .t_accent_Progress, .t_accent_SelectTrigger, .t_accent_SliderTrack, .t_accent_TextArea, .t_accent_TooltipArrow, .t_white_Card, .t_white_Input, .t_white_ListItem, .t_white_Progress, .t_white_SelectTrigger, .t_white_SliderTrack, .t_white_TextArea, .t_white_TooltipArrow {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 95%, 1);--backgroundHover:hsla(0, 0%, 93%, 1);--backgroundPress:hsla(0, 0%, 100%, 1);--backgroundFocus:hsla(0, 0%, 100%, 1);--borderColor:hsla(0, 0%, 88%, 1);--borderColorHover:hsla(0, 0%, 85%, 1);--borderColorFocus:hsla(0, 0%, 88%, 1);--borderColorPress:hsla(0, 0%, 91%, 1);}
+  }
+:root.t_dark .t_accent_Button, :root.t_dark .t_accent_SliderTrackActive, :root.t_dark .t_white_Button, :root.t_dark .t_white_SliderTrackActive, :root.t_light .t_dark .t_accent_Button, :root.t_light .t_dark .t_accent_SliderTrackActive, :root.t_light .t_dark .t_white_Button, :root.t_light .t_dark .t_white_SliderTrackActive, .tm_xxt {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 91%, 1);--backgroundHover:hsla(0, 0%, 88%, 1);--backgroundPress:hsla(0, 0%, 93%, 1);--backgroundFocus:hsla(0, 0%, 93%, 1);--borderColor:hsla(0, 0%, 82%, 1);--borderColorHover:hsla(0, 0%, 76%, 1);--borderColorFocus:hsla(0, 0%, 82%, 1);--borderColorPress:hsla(0, 0%, 85%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_accent_Button, .t_accent_SliderTrackActive, .t_white_Button, .t_white_SliderTrackActive {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 91%, 1);--backgroundHover:hsla(0, 0%, 88%, 1);--backgroundPress:hsla(0, 0%, 93%, 1);--backgroundFocus:hsla(0, 0%, 93%, 1);--borderColor:hsla(0, 0%, 82%, 1);--borderColorHover:hsla(0, 0%, 76%, 1);--borderColorFocus:hsla(0, 0%, 82%, 1);--borderColorPress:hsla(0, 0%, 85%, 1);}
+  }
+:root.t_dark .t_accent_Checkbox, :root.t_dark .t_accent_RadioGroupItem, :root.t_dark .t_accent_Switch, :root.t_dark .t_accent_TooltipContent, :root.t_dark .t_white_Checkbox, :root.t_dark .t_white_RadioGroupItem, :root.t_dark .t_white_Switch, :root.t_dark .t_white_TooltipContent, :root.t_light .t_dark .t_accent_Checkbox, :root.t_light .t_dark .t_accent_RadioGroupItem, :root.t_light .t_dark .t_accent_Switch, :root.t_light .t_dark .t_accent_TooltipContent, :root.t_light .t_dark .t_white_Checkbox, :root.t_light .t_dark .t_white_RadioGroupItem, :root.t_light .t_dark .t_white_Switch, :root.t_light .t_dark .t_white_TooltipContent, .tm_xxt {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 93%, 1);--backgroundHover:hsla(0, 0%, 91%, 1);--backgroundPress:hsla(0, 0%, 95%, 1);--backgroundFocus:hsla(0, 0%, 95%, 1);--borderColor:hsla(0, 0%, 85%, 1);--borderColorHover:hsla(0, 0%, 82%, 1);--borderColorFocus:hsla(0, 0%, 85%, 1);--borderColorPress:hsla(0, 0%, 88%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_accent_Checkbox, .t_accent_RadioGroupItem, .t_accent_Switch, .t_accent_TooltipContent, .t_white_Checkbox, .t_white_RadioGroupItem, .t_white_Switch, .t_white_TooltipContent {--color:hsla(0, 0%, 9%, 1);--colorHover:hsla(0, 0%, 42%, 1);--colorPress:hsla(0, 0%, 9%, 1);--colorFocus:hsla(0, 0%, 42%, 1);--placeholderColor:hsla(0, 0%, 56%, 1);--outlineColor:hsla(0, 0%, 9%, 0.2);--background:hsla(0, 0%, 93%, 1);--backgroundHover:hsla(0, 0%, 91%, 1);--backgroundPress:hsla(0, 0%, 95%, 1);--backgroundFocus:hsla(0, 0%, 95%, 1);--borderColor:hsla(0, 0%, 85%, 1);--borderColorHover:hsla(0, 0%, 82%, 1);--borderColorFocus:hsla(0, 0%, 85%, 1);--borderColorPress:hsla(0, 0%, 88%, 1);}
+  }
+:root.t_dark .t_accent_ProgressIndicator, :root.t_dark .t_accent_SliderThumb, :root.t_dark .t_accent_SwitchThumb, :root.t_dark .t_accent_Tooltip, :root.t_light .t_dark .t_accent_ProgressIndicator, :root.t_light .t_dark .t_accent_SliderThumb, :root.t_light .t_dark .t_accent_SwitchThumb, :root.t_light .t_dark .t_accent_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 0%, 9%, 0);--background02:hsla(0, 0%, 9%, 0.2);--background04:hsla(0, 0%, 9%, 0.4);--background06:hsla(0, 0%, 9%, 0.6);--background08:hsla(0, 0%, 9%, 0.8);--color1:hsla(0, 0%, 9%, 1);--color2:hsla(0, 0%, 42%, 1);--color3:hsla(0, 0%, 50%, 1);--color4:hsla(0, 0%, 56%, 1);--color5:hsla(0, 0%, 76%, 1);--color6:hsla(0, 0%, 82%, 1);--color7:hsla(0, 0%, 85%, 1);--color8:hsla(0, 0%, 88%, 1);--color9:hsla(0, 0%, 91%, 1);--color10:hsla(0, 0%, 93%, 1);--color11:hsla(0, 0%, 95%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 9%, 1);--backgroundHover:hsla(0, 0%, 42%, 1);--backgroundPress:hsla(0, 0%, 9%, 0.8);--backgroundFocus:hsla(0, 0%, 9%, 0.8);--borderColor:hsla(0, 0%, 56%, 1);--borderColorHover:hsla(0, 0%, 76%, 1);--borderColorPress:hsla(0, 0%, 50%, 1);--borderColorFocus:hsla(0, 0%, 56%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 95%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 95%, 1);--placeholderColor:hsla(0, 0%, 91%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_accent_ProgressIndicator, .t_accent_SliderThumb, .t_accent_SwitchThumb, .t_accent_Tooltip {--accentBackground:hsla(0, 0%, 10%, 1);--accentColor:hsla(0, 0%, 38%, 1);--background0:hsla(0, 0%, 9%, 0);--background02:hsla(0, 0%, 9%, 0.2);--background04:hsla(0, 0%, 9%, 0.4);--background06:hsla(0, 0%, 9%, 0.6);--background08:hsla(0, 0%, 9%, 0.8);--color1:hsla(0, 0%, 9%, 1);--color2:hsla(0, 0%, 42%, 1);--color3:hsla(0, 0%, 50%, 1);--color4:hsla(0, 0%, 56%, 1);--color5:hsla(0, 0%, 76%, 1);--color6:hsla(0, 0%, 82%, 1);--color7:hsla(0, 0%, 85%, 1);--color8:hsla(0, 0%, 88%, 1);--color9:hsla(0, 0%, 91%, 1);--color10:hsla(0, 0%, 93%, 1);--color11:hsla(0, 0%, 95%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 9%, 1);--backgroundHover:hsla(0, 0%, 42%, 1);--backgroundPress:hsla(0, 0%, 9%, 0.8);--backgroundFocus:hsla(0, 0%, 9%, 0.8);--borderColor:hsla(0, 0%, 56%, 1);--borderColorHover:hsla(0, 0%, 76%, 1);--borderColorPress:hsla(0, 0%, 50%, 1);--borderColorFocus:hsla(0, 0%, 56%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 95%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 95%, 1);--placeholderColor:hsla(0, 0%, 91%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+  }
+.t_dark_accent_SwitchThumb ::selection, .t_dark_accent_SliderThumb ::selection, .t_dark_accent_Tooltip ::selection, .t_dark_accent_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_black_ProgressIndicator, :root.t_dark .t_light .t_black_SliderThumb, :root.t_dark .t_light .t_black_SwitchThumb, :root.t_dark .t_light .t_black_Tooltip, :root.t_light .t_black_ProgressIndicator, :root.t_light .t_black_SliderThumb, :root.t_light .t_black_SwitchThumb, :root.t_light .t_black_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 65%, 1);--color3:hsla(0, 0%, 38%, 1);--color4:hsla(0, 0%, 33%, 1);--color5:hsla(0, 0%, 29%, 1);--color6:hsla(0, 0%, 26%, 1);--color7:hsla(0, 0%, 20%, 1);--color8:hsla(0, 0%, 16%, 1);--color9:hsla(0, 0%, 14%, 1);--color10:hsla(0, 0%, 10%, 1);--color11:hsla(0, 0%, 8%, 1);--color12:hsla(0, 0%, 2%, 1);--color0:hsla(0, 0%, 2%, 0);--color02:hsla(0, 0%, 2%, 0.2);--color04:hsla(0, 0%, 2%, 0.4);--color06:hsla(0, 0%, 2%, 0.6);--color08:hsla(0, 0%, 2%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 100%, 0.8);--backgroundPress:hsla(0, 0%, 65%, 1);--backgroundFocus:hsla(0, 0%, 65%, 1);--borderColor:hsla(0, 0%, 33%, 1);--borderColorHover:hsla(0, 0%, 38%, 1);--borderColorPress:hsla(0, 0%, 29%, 1);--borderColorFocus:hsla(0, 0%, 33%, 1);--color:hsla(0, 0%, 2%, 1);--colorHover:hsla(0, 0%, 8%, 1);--colorPress:hsla(0, 0%, 2%, 1);--colorFocus:hsla(0, 0%, 8%, 1);--placeholderColor:hsla(0, 0%, 14%, 1);--outlineColor:hsla(0, 0%, 2%, 0.2);--colorTransparent:hsla(0, 0%, 2%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_black_ProgressIndicator, .t_black_SliderThumb, .t_black_SwitchThumb, .t_black_Tooltip {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(0, 0%, 100%, 0);--background02:hsla(0, 0%, 100%, 0.2);--background04:hsla(0, 0%, 100%, 0.4);--background06:hsla(0, 0%, 100%, 0.6);--background08:hsla(0, 0%, 100%, 0.8);--color1:hsla(0, 0%, 100%, 1);--color2:hsla(0, 0%, 65%, 1);--color3:hsla(0, 0%, 38%, 1);--color4:hsla(0, 0%, 33%, 1);--color5:hsla(0, 0%, 29%, 1);--color6:hsla(0, 0%, 26%, 1);--color7:hsla(0, 0%, 20%, 1);--color8:hsla(0, 0%, 16%, 1);--color9:hsla(0, 0%, 14%, 1);--color10:hsla(0, 0%, 10%, 1);--color11:hsla(0, 0%, 8%, 1);--color12:hsla(0, 0%, 2%, 1);--color0:hsla(0, 0%, 2%, 0);--color02:hsla(0, 0%, 2%, 0.2);--color04:hsla(0, 0%, 2%, 0.4);--color06:hsla(0, 0%, 2%, 0.6);--color08:hsla(0, 0%, 2%, 0.8);--background:hsla(0, 0%, 100%, 1);--backgroundHover:hsla(0, 0%, 100%, 0.8);--backgroundPress:hsla(0, 0%, 65%, 1);--backgroundFocus:hsla(0, 0%, 65%, 1);--borderColor:hsla(0, 0%, 33%, 1);--borderColorHover:hsla(0, 0%, 38%, 1);--borderColorPress:hsla(0, 0%, 29%, 1);--borderColorFocus:hsla(0, 0%, 33%, 1);--color:hsla(0, 0%, 2%, 1);--colorHover:hsla(0, 0%, 8%, 1);--colorPress:hsla(0, 0%, 2%, 1);--colorFocus:hsla(0, 0%, 8%, 1);--placeholderColor:hsla(0, 0%, 14%, 1);--outlineColor:hsla(0, 0%, 2%, 0.2);--colorTransparent:hsla(0, 0%, 2%, 0);}
+  }
+.t_light_black_SwitchThumb ::selection, .t_light_black_SliderThumb ::selection, .t_light_black_Tooltip ::selection, .t_light_black_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_blue_Card, :root.t_dark .t_light .t_blue_Input, :root.t_dark .t_light .t_blue_ListItem, :root.t_dark .t_light .t_blue_Progress, :root.t_dark .t_light .t_blue_SelectTrigger, :root.t_dark .t_light .t_blue_SliderTrack, :root.t_dark .t_light .t_blue_TextArea, :root.t_dark .t_light .t_blue_TooltipArrow, :root.t_light .t_blue_Card, :root.t_light .t_blue_Input, :root.t_light .t_blue_ListItem, :root.t_light .t_blue_Progress, :root.t_light .t_blue_SelectTrigger, :root.t_light .t_blue_SliderTrack, :root.t_light .t_blue_TextArea, :root.t_light .t_blue_TooltipArrow, .tm_xxt {--color:hsla(211, 100%, 15%, 1);--colorHover:hsla(211, 100%, 43%, 1);--colorPress:hsla(211, 100%, 15%, 1);--colorFocus:hsla(211, 100%, 43%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(211, 100%, 15%, 0.2);--background:hsla(210, 100%, 98%, 1);--backgroundHover:hsla(210, 100%, 99%, 1);--backgroundPress:hsla(210, 100%, 96%, 1);--backgroundFocus:hsla(210, 100%, 96%, 1);--borderColor:hsla(209, 96%, 90%, 1);--borderColorHover:hsla(210, 100%, 94%, 1);--borderColorFocus:hsla(209, 96%, 90%, 1);--borderColorPress:hsla(209, 82%, 85%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_blue_Card, .t_blue_Input, .t_blue_ListItem, .t_blue_Progress, .t_blue_SelectTrigger, .t_blue_SliderTrack, .t_blue_TextArea, .t_blue_TooltipArrow {--color:hsla(211, 100%, 15%, 1);--colorHover:hsla(211, 100%, 43%, 1);--colorPress:hsla(211, 100%, 15%, 1);--colorFocus:hsla(211, 100%, 43%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(211, 100%, 15%, 0.2);--background:hsla(210, 100%, 98%, 1);--backgroundHover:hsla(210, 100%, 99%, 1);--backgroundPress:hsla(210, 100%, 96%, 1);--backgroundFocus:hsla(210, 100%, 96%, 1);--borderColor:hsla(209, 96%, 90%, 1);--borderColorHover:hsla(210, 100%, 94%, 1);--borderColorFocus:hsla(209, 96%, 90%, 1);--borderColorPress:hsla(209, 82%, 85%, 1);}
+  }
+:root.t_dark .t_light .t_blue_Button, :root.t_dark .t_light .t_blue_SliderTrackActive, :root.t_light .t_blue_Button, :root.t_light .t_blue_SliderTrackActive, .tm_xxt {--color:hsla(211, 100%, 15%, 1);--colorHover:hsla(211, 100%, 43%, 1);--colorPress:hsla(211, 100%, 15%, 1);--colorFocus:hsla(211, 100%, 43%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(211, 100%, 15%, 0.2);--background:hsla(210, 100%, 94%, 1);--backgroundHover:hsla(210, 100%, 96%, 1);--backgroundPress:hsla(209, 96%, 90%, 1);--backgroundFocus:hsla(209, 96%, 90%, 1);--borderColor:hsla(208, 78%, 77%, 1);--borderColorHover:hsla(209, 82%, 85%, 1);--borderColorFocus:hsla(208, 78%, 77%, 1);--borderColorPress:hsla(206, 82%, 65%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_blue_Button, .t_blue_SliderTrackActive {--color:hsla(211, 100%, 15%, 1);--colorHover:hsla(211, 100%, 43%, 1);--colorPress:hsla(211, 100%, 15%, 1);--colorFocus:hsla(211, 100%, 43%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(211, 100%, 15%, 0.2);--background:hsla(210, 100%, 94%, 1);--backgroundHover:hsla(210, 100%, 96%, 1);--backgroundPress:hsla(209, 96%, 90%, 1);--backgroundFocus:hsla(209, 96%, 90%, 1);--borderColor:hsla(208, 78%, 77%, 1);--borderColorHover:hsla(209, 82%, 85%, 1);--borderColorFocus:hsla(208, 78%, 77%, 1);--borderColorPress:hsla(206, 82%, 65%, 1);}
+  }
+:root.t_dark .t_light .t_blue_Checkbox, :root.t_dark .t_light .t_blue_RadioGroupItem, :root.t_dark .t_light .t_blue_Switch, :root.t_dark .t_light .t_blue_TooltipContent, :root.t_light .t_blue_Checkbox, :root.t_light .t_blue_RadioGroupItem, :root.t_light .t_blue_Switch, :root.t_light .t_blue_TooltipContent, .tm_xxt {--color:hsla(211, 100%, 15%, 1);--colorHover:hsla(211, 100%, 43%, 1);--colorPress:hsla(211, 100%, 15%, 1);--colorFocus:hsla(211, 100%, 43%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(211, 100%, 15%, 0.2);--background:hsla(210, 100%, 96%, 1);--backgroundHover:hsla(210, 100%, 98%, 1);--backgroundPress:hsla(210, 100%, 94%, 1);--backgroundFocus:hsla(210, 100%, 94%, 1);--borderColor:hsla(209, 82%, 85%, 1);--borderColorHover:hsla(209, 96%, 90%, 1);--borderColorFocus:hsla(209, 82%, 85%, 1);--borderColorPress:hsla(208, 78%, 77%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_blue_Checkbox, .t_blue_RadioGroupItem, .t_blue_Switch, .t_blue_TooltipContent {--color:hsla(211, 100%, 15%, 1);--colorHover:hsla(211, 100%, 43%, 1);--colorPress:hsla(211, 100%, 15%, 1);--colorFocus:hsla(211, 100%, 43%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(211, 100%, 15%, 0.2);--background:hsla(210, 100%, 96%, 1);--backgroundHover:hsla(210, 100%, 98%, 1);--backgroundPress:hsla(210, 100%, 94%, 1);--backgroundFocus:hsla(210, 100%, 94%, 1);--borderColor:hsla(209, 82%, 85%, 1);--borderColorHover:hsla(209, 96%, 90%, 1);--borderColorFocus:hsla(209, 82%, 85%, 1);--borderColorPress:hsla(208, 78%, 77%, 1);}
+  }
+:root.t_dark .t_light .t_blue_ProgressIndicator, :root.t_dark .t_light .t_blue_SliderThumb, :root.t_dark .t_light .t_blue_SwitchThumb, :root.t_dark .t_light .t_blue_Tooltip, :root.t_light .t_blue_ProgressIndicator, :root.t_light .t_blue_SliderThumb, :root.t_light .t_blue_SwitchThumb, :root.t_light .t_blue_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(211, 100%, 15%, 0);--background02:hsla(211, 100%, 15%, 0.2);--background04:hsla(211, 100%, 15%, 0.4);--background06:hsla(211, 100%, 15%, 0.6);--background08:hsla(211, 100%, 15%, 0.8);--color1:hsla(211, 100%, 15%, 1);--color2:hsla(211, 100%, 43%, 1);--color3:hsla(208, 100%, 47%, 1);--color4:hsla(206, 100%, 50%, 1);--color5:hsla(206, 82%, 65%, 1);--color6:hsla(208, 78%, 77%, 1);--color7:hsla(209, 82%, 85%, 1);--color8:hsla(209, 96%, 90%, 1);--color9:hsla(210, 100%, 94%, 1);--color10:hsla(210, 100%, 96%, 1);--color11:hsla(210, 100%, 98%, 1);--color12:hsla(210, 100%, 99%, 1);--color0:hsla(216, 100%, 99%, 0);--color02:hsla(216, 100%, 99%, 0.2);--color04:hsla(216, 100%, 99%, 0.4);--color06:hsla(216, 100%, 99%, 0.6);--color08:hsla(216, 100%, 99%, 0.8);--background:hsla(211, 100%, 15%, 1);--backgroundHover:hsla(211, 100%, 15%, 0.8);--backgroundPress:hsla(211, 100%, 43%, 1);--backgroundFocus:hsla(211, 100%, 43%, 1);--borderColor:hsla(206, 100%, 50%, 1);--borderColorHover:hsla(208, 100%, 47%, 1);--borderColorPress:hsla(206, 82%, 65%, 1);--borderColorFocus:hsla(206, 100%, 50%, 1);--color:hsla(210, 100%, 99%, 1);--colorHover:hsla(210, 100%, 98%, 1);--colorPress:hsla(210, 100%, 99%, 1);--colorFocus:hsla(210, 100%, 98%, 1);--placeholderColor:hsla(210, 100%, 94%, 1);--outlineColor:hsla(216, 100%, 99%, 0.2);--colorTransparent:hsla(216, 100%, 99%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_blue_ProgressIndicator, .t_blue_SliderThumb, .t_blue_SwitchThumb, .t_blue_Tooltip {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(211, 100%, 15%, 0);--background02:hsla(211, 100%, 15%, 0.2);--background04:hsla(211, 100%, 15%, 0.4);--background06:hsla(211, 100%, 15%, 0.6);--background08:hsla(211, 100%, 15%, 0.8);--color1:hsla(211, 100%, 15%, 1);--color2:hsla(211, 100%, 43%, 1);--color3:hsla(208, 100%, 47%, 1);--color4:hsla(206, 100%, 50%, 1);--color5:hsla(206, 82%, 65%, 1);--color6:hsla(208, 78%, 77%, 1);--color7:hsla(209, 82%, 85%, 1);--color8:hsla(209, 96%, 90%, 1);--color9:hsla(210, 100%, 94%, 1);--color10:hsla(210, 100%, 96%, 1);--color11:hsla(210, 100%, 98%, 1);--color12:hsla(210, 100%, 99%, 1);--color0:hsla(216, 100%, 99%, 0);--color02:hsla(216, 100%, 99%, 0.2);--color04:hsla(216, 100%, 99%, 0.4);--color06:hsla(216, 100%, 99%, 0.6);--color08:hsla(216, 100%, 99%, 0.8);--background:hsla(211, 100%, 15%, 1);--backgroundHover:hsla(211, 100%, 15%, 0.8);--backgroundPress:hsla(211, 100%, 43%, 1);--backgroundFocus:hsla(211, 100%, 43%, 1);--borderColor:hsla(206, 100%, 50%, 1);--borderColorHover:hsla(208, 100%, 47%, 1);--borderColorPress:hsla(206, 82%, 65%, 1);--borderColorFocus:hsla(206, 100%, 50%, 1);--color:hsla(210, 100%, 99%, 1);--colorHover:hsla(210, 100%, 98%, 1);--colorPress:hsla(210, 100%, 99%, 1);--colorFocus:hsla(210, 100%, 98%, 1);--placeholderColor:hsla(210, 100%, 94%, 1);--outlineColor:hsla(216, 100%, 99%, 0.2);--colorTransparent:hsla(216, 100%, 99%, 0);}
+  }
+.t_light_blue_SwitchThumb ::selection, .t_light_blue_SliderThumb ::selection, .t_light_blue_Tooltip ::selection, .t_light_blue_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_red_Card, :root.t_dark .t_light .t_red_Input, :root.t_dark .t_light .t_red_ListItem, :root.t_dark .t_light .t_red_Progress, :root.t_dark .t_light .t_red_SelectTrigger, :root.t_dark .t_light .t_red_SliderTrack, :root.t_dark .t_light .t_red_TextArea, :root.t_dark .t_light .t_red_TooltipArrow, :root.t_light .t_red_Card, :root.t_light .t_red_Input, :root.t_light .t_red_ListItem, :root.t_light .t_red_Progress, :root.t_light .t_red_SelectTrigger, :root.t_light .t_red_SliderTrack, :root.t_light .t_red_TextArea, :root.t_light .t_red_TooltipArrow, .tm_xxt {--color:hsla(355, 49%, 15%, 1);--colorHover:hsla(358, 65%, 49%, 1);--colorPress:hsla(355, 49%, 15%, 1);--colorFocus:hsla(358, 65%, 49%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(355, 48%, 15%, 0.2);--background:hsla(0, 100%, 99%, 1);--backgroundHover:hsla(0, 100%, 99%, 1);--backgroundPress:hsla(0, 100%, 97%, 1);--backgroundFocus:hsla(0, 100%, 97%, 1);--borderColor:hsla(0, 90%, 92%, 1);--borderColorHover:hsla(0, 100%, 95%, 1);--borderColorFocus:hsla(0, 90%, 92%, 1);--borderColorPress:hsla(0, 81%, 88%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_red_Card, .t_red_Input, .t_red_ListItem, .t_red_Progress, .t_red_SelectTrigger, .t_red_SliderTrack, .t_red_TextArea, .t_red_TooltipArrow {--color:hsla(355, 49%, 15%, 1);--colorHover:hsla(358, 65%, 49%, 1);--colorPress:hsla(355, 49%, 15%, 1);--colorFocus:hsla(358, 65%, 49%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(355, 48%, 15%, 0.2);--background:hsla(0, 100%, 99%, 1);--backgroundHover:hsla(0, 100%, 99%, 1);--backgroundPress:hsla(0, 100%, 97%, 1);--backgroundFocus:hsla(0, 100%, 97%, 1);--borderColor:hsla(0, 90%, 92%, 1);--borderColorHover:hsla(0, 100%, 95%, 1);--borderColorFocus:hsla(0, 90%, 92%, 1);--borderColorPress:hsla(0, 81%, 88%, 1);}
+  }
+:root.t_dark .t_light .t_red_Button, :root.t_dark .t_light .t_red_SliderTrackActive, :root.t_light .t_red_Button, :root.t_light .t_red_SliderTrackActive, .tm_xxt {--color:hsla(355, 49%, 15%, 1);--colorHover:hsla(358, 65%, 49%, 1);--colorPress:hsla(355, 49%, 15%, 1);--colorFocus:hsla(358, 65%, 49%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(355, 48%, 15%, 0.2);--background:hsla(0, 100%, 95%, 1);--backgroundHover:hsla(0, 100%, 97%, 1);--backgroundPress:hsla(0, 90%, 92%, 1);--backgroundFocus:hsla(0, 90%, 92%, 1);--borderColor:hsla(359, 74%, 82%, 1);--borderColorHover:hsla(0, 81%, 88%, 1);--borderColorFocus:hsla(359, 74%, 82%, 1);--borderColorPress:hsla(359, 69%, 74%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_red_Button, .t_red_SliderTrackActive {--color:hsla(355, 49%, 15%, 1);--colorHover:hsla(358, 65%, 49%, 1);--colorPress:hsla(355, 49%, 15%, 1);--colorFocus:hsla(358, 65%, 49%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(355, 48%, 15%, 0.2);--background:hsla(0, 100%, 95%, 1);--backgroundHover:hsla(0, 100%, 97%, 1);--backgroundPress:hsla(0, 90%, 92%, 1);--backgroundFocus:hsla(0, 90%, 92%, 1);--borderColor:hsla(359, 74%, 82%, 1);--borderColorHover:hsla(0, 81%, 88%, 1);--borderColorFocus:hsla(359, 74%, 82%, 1);--borderColorPress:hsla(359, 69%, 74%, 1);}
+  }
+:root.t_dark .t_light .t_red_Checkbox, :root.t_dark .t_light .t_red_RadioGroupItem, :root.t_dark .t_light .t_red_Switch, :root.t_dark .t_light .t_red_TooltipContent, :root.t_light .t_red_Checkbox, :root.t_light .t_red_RadioGroupItem, :root.t_light .t_red_Switch, :root.t_light .t_red_TooltipContent, .tm_xxt {--color:hsla(355, 49%, 15%, 1);--colorHover:hsla(358, 65%, 49%, 1);--colorPress:hsla(355, 49%, 15%, 1);--colorFocus:hsla(358, 65%, 49%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(355, 48%, 15%, 0.2);--background:hsla(0, 100%, 97%, 1);--backgroundHover:hsla(0, 100%, 99%, 1);--backgroundPress:hsla(0, 100%, 95%, 1);--backgroundFocus:hsla(0, 100%, 95%, 1);--borderColor:hsla(0, 81%, 88%, 1);--borderColorHover:hsla(0, 90%, 92%, 1);--borderColorFocus:hsla(0, 81%, 88%, 1);--borderColorPress:hsla(359, 74%, 82%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_red_Checkbox, .t_red_RadioGroupItem, .t_red_Switch, .t_red_TooltipContent {--color:hsla(355, 49%, 15%, 1);--colorHover:hsla(358, 65%, 49%, 1);--colorPress:hsla(355, 49%, 15%, 1);--colorFocus:hsla(358, 65%, 49%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(355, 48%, 15%, 0.2);--background:hsla(0, 100%, 97%, 1);--backgroundHover:hsla(0, 100%, 99%, 1);--backgroundPress:hsla(0, 100%, 95%, 1);--backgroundFocus:hsla(0, 100%, 95%, 1);--borderColor:hsla(0, 81%, 88%, 1);--borderColorHover:hsla(0, 90%, 92%, 1);--borderColorFocus:hsla(0, 81%, 88%, 1);--borderColorPress:hsla(359, 74%, 82%, 1);}
+  }
+:root.t_dark .t_light .t_red_ProgressIndicator, :root.t_dark .t_light .t_red_SliderThumb, :root.t_dark .t_light .t_red_SwitchThumb, :root.t_dark .t_light .t_red_Tooltip, :root.t_light .t_red_ProgressIndicator, :root.t_light .t_red_SliderThumb, :root.t_light .t_red_SwitchThumb, :root.t_light .t_red_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(355, 48%, 15%, 0);--background02:hsla(355, 48%, 15%, 0.2);--background04:hsla(355, 48%, 15%, 0.4);--background06:hsla(355, 48%, 15%, 0.6);--background08:hsla(355, 48%, 15%, 0.8);--color1:hsla(355, 49%, 15%, 1);--color2:hsla(358, 65%, 49%, 1);--color3:hsla(358, 69%, 55%, 1);--color4:hsla(358, 75%, 59%, 1);--color5:hsla(359, 69%, 74%, 1);--color6:hsla(359, 74%, 82%, 1);--color7:hsla(0, 81%, 88%, 1);--color8:hsla(0, 90%, 92%, 1);--color9:hsla(0, 100%, 95%, 1);--color10:hsla(0, 100%, 97%, 1);--color11:hsla(0, 100%, 99%, 1);--color12:hsla(0, 100%, 99%, 1);--color0:hsla(0, 100%, 99%, 0);--color02:hsla(0, 100%, 99%, 0.2);--color04:hsla(0, 100%, 99%, 0.4);--color06:hsla(0, 100%, 99%, 0.6);--color08:hsla(0, 100%, 99%, 0.8);--background:hsla(355, 49%, 15%, 1);--backgroundHover:hsla(355, 48%, 15%, 0.8);--backgroundPress:hsla(358, 65%, 49%, 1);--backgroundFocus:hsla(358, 65%, 49%, 1);--borderColor:hsla(358, 75%, 59%, 1);--borderColorHover:hsla(358, 69%, 55%, 1);--borderColorPress:hsla(359, 69%, 74%, 1);--borderColorFocus:hsla(358, 75%, 59%, 1);--color:hsla(0, 100%, 99%, 1);--colorHover:hsla(0, 100%, 99%, 1);--colorPress:hsla(0, 100%, 99%, 1);--colorFocus:hsla(0, 100%, 99%, 1);--placeholderColor:hsla(0, 100%, 95%, 1);--outlineColor:hsla(0, 100%, 99%, 0.2);--colorTransparent:hsla(0, 100%, 99%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_red_ProgressIndicator, .t_red_SliderThumb, .t_red_SwitchThumb, .t_red_Tooltip {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(355, 48%, 15%, 0);--background02:hsla(355, 48%, 15%, 0.2);--background04:hsla(355, 48%, 15%, 0.4);--background06:hsla(355, 48%, 15%, 0.6);--background08:hsla(355, 48%, 15%, 0.8);--color1:hsla(355, 49%, 15%, 1);--color2:hsla(358, 65%, 49%, 1);--color3:hsla(358, 69%, 55%, 1);--color4:hsla(358, 75%, 59%, 1);--color5:hsla(359, 69%, 74%, 1);--color6:hsla(359, 74%, 82%, 1);--color7:hsla(0, 81%, 88%, 1);--color8:hsla(0, 90%, 92%, 1);--color9:hsla(0, 100%, 95%, 1);--color10:hsla(0, 100%, 97%, 1);--color11:hsla(0, 100%, 99%, 1);--color12:hsla(0, 100%, 99%, 1);--color0:hsla(0, 100%, 99%, 0);--color02:hsla(0, 100%, 99%, 0.2);--color04:hsla(0, 100%, 99%, 0.4);--color06:hsla(0, 100%, 99%, 0.6);--color08:hsla(0, 100%, 99%, 0.8);--background:hsla(355, 49%, 15%, 1);--backgroundHover:hsla(355, 48%, 15%, 0.8);--backgroundPress:hsla(358, 65%, 49%, 1);--backgroundFocus:hsla(358, 65%, 49%, 1);--borderColor:hsla(358, 75%, 59%, 1);--borderColorHover:hsla(358, 69%, 55%, 1);--borderColorPress:hsla(359, 69%, 74%, 1);--borderColorFocus:hsla(358, 75%, 59%, 1);--color:hsla(0, 100%, 99%, 1);--colorHover:hsla(0, 100%, 99%, 1);--colorPress:hsla(0, 100%, 99%, 1);--colorFocus:hsla(0, 100%, 99%, 1);--placeholderColor:hsla(0, 100%, 95%, 1);--outlineColor:hsla(0, 100%, 99%, 0.2);--colorTransparent:hsla(0, 100%, 99%, 0);}
+  }
+.t_light_red_SwitchThumb ::selection, .t_light_red_SliderThumb ::selection, .t_light_red_Tooltip ::selection, .t_light_red_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_yellow_Card, :root.t_dark .t_light .t_yellow_Input, :root.t_dark .t_light .t_yellow_ListItem, :root.t_dark .t_light .t_yellow_Progress, :root.t_dark .t_light .t_yellow_SelectTrigger, :root.t_dark .t_light .t_yellow_SliderTrack, :root.t_dark .t_light .t_yellow_TextArea, :root.t_dark .t_light .t_yellow_TooltipArrow, :root.t_light .t_yellow_Card, :root.t_light .t_yellow_Input, :root.t_light .t_yellow_ListItem, :root.t_light .t_yellow_Progress, :root.t_light .t_yellow_SelectTrigger, :root.t_light .t_yellow_SliderTrack, :root.t_light .t_yellow_TextArea, :root.t_light .t_yellow_TooltipArrow, .tm_xxt {--color:hsla(41, 56%, 13%, 1);--colorHover:hsla(42, 100%, 29%, 1);--colorPress:hsla(41, 56%, 13%, 1);--colorFocus:hsla(42, 100%, 29%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(41, 55%, 13%, 0.2);--background:hsla(52, 100%, 95%, 1);--backgroundHover:hsla(60, 50%, 98%, 1);--backgroundPress:hsla(55, 100%, 91%, 1);--backgroundFocus:hsla(55, 100%, 91%, 1);--borderColor:hsla(52, 98%, 82%, 1);--borderColorHover:hsla(54, 100%, 87%, 1);--borderColorFocus:hsla(52, 98%, 82%, 1);--borderColorPress:hsla(50, 90%, 76%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow_Card, .t_yellow_Input, .t_yellow_ListItem, .t_yellow_Progress, .t_yellow_SelectTrigger, .t_yellow_SliderTrack, .t_yellow_TextArea, .t_yellow_TooltipArrow {--color:hsla(41, 56%, 13%, 1);--colorHover:hsla(42, 100%, 29%, 1);--colorPress:hsla(41, 56%, 13%, 1);--colorFocus:hsla(42, 100%, 29%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(41, 55%, 13%, 0.2);--background:hsla(52, 100%, 95%, 1);--backgroundHover:hsla(60, 50%, 98%, 1);--backgroundPress:hsla(55, 100%, 91%, 1);--backgroundFocus:hsla(55, 100%, 91%, 1);--borderColor:hsla(52, 98%, 82%, 1);--borderColorHover:hsla(54, 100%, 87%, 1);--borderColorFocus:hsla(52, 98%, 82%, 1);--borderColorPress:hsla(50, 90%, 76%, 1);}
+  }
+:root.t_dark .t_light .t_yellow_Button, :root.t_dark .t_light .t_yellow_SliderTrackActive, :root.t_light .t_yellow_Button, :root.t_light .t_yellow_SliderTrackActive, .tm_xxt {--color:hsla(41, 56%, 13%, 1);--colorHover:hsla(42, 100%, 29%, 1);--colorPress:hsla(41, 56%, 13%, 1);--colorFocus:hsla(42, 100%, 29%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(41, 55%, 13%, 0.2);--background:hsla(54, 100%, 87%, 1);--backgroundHover:hsla(55, 100%, 91%, 1);--backgroundPress:hsla(52, 98%, 82%, 1);--backgroundFocus:hsla(52, 98%, 82%, 1);--borderColor:hsla(47, 80%, 68%, 1);--borderColorHover:hsla(50, 90%, 76%, 1);--borderColorFocus:hsla(47, 80%, 68%, 1);--borderColorPress:hsla(48, 100%, 46%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow_Button, .t_yellow_SliderTrackActive {--color:hsla(41, 56%, 13%, 1);--colorHover:hsla(42, 100%, 29%, 1);--colorPress:hsla(41, 56%, 13%, 1);--colorFocus:hsla(42, 100%, 29%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(41, 55%, 13%, 0.2);--background:hsla(54, 100%, 87%, 1);--backgroundHover:hsla(55, 100%, 91%, 1);--backgroundPress:hsla(52, 98%, 82%, 1);--backgroundFocus:hsla(52, 98%, 82%, 1);--borderColor:hsla(47, 80%, 68%, 1);--borderColorHover:hsla(50, 90%, 76%, 1);--borderColorFocus:hsla(47, 80%, 68%, 1);--borderColorPress:hsla(48, 100%, 46%, 1);}
+  }
+:root.t_dark .t_light .t_yellow_Checkbox, :root.t_dark .t_light .t_yellow_RadioGroupItem, :root.t_dark .t_light .t_yellow_Switch, :root.t_dark .t_light .t_yellow_TooltipContent, :root.t_light .t_yellow_Checkbox, :root.t_light .t_yellow_RadioGroupItem, :root.t_light .t_yellow_Switch, :root.t_light .t_yellow_TooltipContent, .tm_xxt {--color:hsla(41, 56%, 13%, 1);--colorHover:hsla(42, 100%, 29%, 1);--colorPress:hsla(41, 56%, 13%, 1);--colorFocus:hsla(42, 100%, 29%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(41, 55%, 13%, 0.2);--background:hsla(55, 100%, 91%, 1);--backgroundHover:hsla(52, 100%, 95%, 1);--backgroundPress:hsla(54, 100%, 87%, 1);--backgroundFocus:hsla(54, 100%, 87%, 1);--borderColor:hsla(50, 90%, 76%, 1);--borderColorHover:hsla(52, 98%, 82%, 1);--borderColorFocus:hsla(50, 90%, 76%, 1);--borderColorPress:hsla(47, 80%, 68%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow_Checkbox, .t_yellow_RadioGroupItem, .t_yellow_Switch, .t_yellow_TooltipContent {--color:hsla(41, 56%, 13%, 1);--colorHover:hsla(42, 100%, 29%, 1);--colorPress:hsla(41, 56%, 13%, 1);--colorFocus:hsla(42, 100%, 29%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(41, 55%, 13%, 0.2);--background:hsla(55, 100%, 91%, 1);--backgroundHover:hsla(52, 100%, 95%, 1);--backgroundPress:hsla(54, 100%, 87%, 1);--backgroundFocus:hsla(54, 100%, 87%, 1);--borderColor:hsla(50, 90%, 76%, 1);--borderColorHover:hsla(52, 98%, 82%, 1);--borderColorFocus:hsla(50, 90%, 76%, 1);--borderColorPress:hsla(47, 80%, 68%, 1);}
+  }
+:root.t_dark .t_light .t_yellow_ProgressIndicator, :root.t_dark .t_light .t_yellow_SliderThumb, :root.t_dark .t_light .t_yellow_SwitchThumb, :root.t_dark .t_light .t_yellow_Tooltip, :root.t_light .t_yellow_ProgressIndicator, :root.t_light .t_yellow_SliderThumb, :root.t_light .t_yellow_SwitchThumb, :root.t_light .t_yellow_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(41, 55%, 13%, 0);--background02:hsla(41, 55%, 13%, 0.2);--background04:hsla(41, 55%, 13%, 0.4);--background06:hsla(41, 55%, 13%, 0.6);--background08:hsla(41, 55%, 13%, 0.8);--color1:hsla(41, 56%, 13%, 1);--color2:hsla(42, 100%, 29%, 1);--color3:hsla(50, 100%, 48%, 1);--color4:hsla(53, 92%, 50%, 1);--color5:hsla(48, 100%, 46%, 1);--color6:hsla(47, 80%, 68%, 1);--color7:hsla(50, 90%, 76%, 1);--color8:hsla(52, 98%, 82%, 1);--color9:hsla(54, 100%, 87%, 1);--color10:hsla(55, 100%, 91%, 1);--color11:hsla(52, 100%, 95%, 1);--color12:hsla(60, 50%, 98%, 1);--color0:hsla(60, 45%, 98%, 0);--color02:hsla(60, 45%, 98%, 0.2);--color04:hsla(60, 45%, 98%, 0.4);--color06:hsla(60, 45%, 98%, 0.6);--color08:hsla(60, 45%, 98%, 0.8);--background:hsla(41, 56%, 13%, 1);--backgroundHover:hsla(41, 55%, 13%, 0.8);--backgroundPress:hsla(42, 100%, 29%, 1);--backgroundFocus:hsla(42, 100%, 29%, 1);--borderColor:hsla(53, 92%, 50%, 1);--borderColorHover:hsla(50, 100%, 48%, 1);--borderColorPress:hsla(48, 100%, 46%, 1);--borderColorFocus:hsla(53, 92%, 50%, 1);--color:hsla(60, 50%, 98%, 1);--colorHover:hsla(52, 100%, 95%, 1);--colorPress:hsla(60, 50%, 98%, 1);--colorFocus:hsla(52, 100%, 95%, 1);--placeholderColor:hsla(54, 100%, 87%, 1);--outlineColor:hsla(60, 45%, 98%, 0.2);--colorTransparent:hsla(60, 45%, 98%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow_ProgressIndicator, .t_yellow_SliderThumb, .t_yellow_SwitchThumb, .t_yellow_Tooltip {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(41, 55%, 13%, 0);--background02:hsla(41, 55%, 13%, 0.2);--background04:hsla(41, 55%, 13%, 0.4);--background06:hsla(41, 55%, 13%, 0.6);--background08:hsla(41, 55%, 13%, 0.8);--color1:hsla(41, 56%, 13%, 1);--color2:hsla(42, 100%, 29%, 1);--color3:hsla(50, 100%, 48%, 1);--color4:hsla(53, 92%, 50%, 1);--color5:hsla(48, 100%, 46%, 1);--color6:hsla(47, 80%, 68%, 1);--color7:hsla(50, 90%, 76%, 1);--color8:hsla(52, 98%, 82%, 1);--color9:hsla(54, 100%, 87%, 1);--color10:hsla(55, 100%, 91%, 1);--color11:hsla(52, 100%, 95%, 1);--color12:hsla(60, 50%, 98%, 1);--color0:hsla(60, 45%, 98%, 0);--color02:hsla(60, 45%, 98%, 0.2);--color04:hsla(60, 45%, 98%, 0.4);--color06:hsla(60, 45%, 98%, 0.6);--color08:hsla(60, 45%, 98%, 0.8);--background:hsla(41, 56%, 13%, 1);--backgroundHover:hsla(41, 55%, 13%, 0.8);--backgroundPress:hsla(42, 100%, 29%, 1);--backgroundFocus:hsla(42, 100%, 29%, 1);--borderColor:hsla(53, 92%, 50%, 1);--borderColorHover:hsla(50, 100%, 48%, 1);--borderColorPress:hsla(48, 100%, 46%, 1);--borderColorFocus:hsla(53, 92%, 50%, 1);--color:hsla(60, 50%, 98%, 1);--colorHover:hsla(52, 100%, 95%, 1);--colorPress:hsla(60, 50%, 98%, 1);--colorFocus:hsla(52, 100%, 95%, 1);--placeholderColor:hsla(54, 100%, 87%, 1);--outlineColor:hsla(60, 45%, 98%, 0.2);--colorTransparent:hsla(60, 45%, 98%, 0);}
+  }
+.t_light_yellow_SwitchThumb ::selection, .t_light_yellow_SliderThumb ::selection, .t_light_yellow_Tooltip ::selection, .t_light_yellow_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_light .t_green_Card, :root.t_dark .t_light .t_green_Input, :root.t_dark .t_light .t_green_ListItem, :root.t_dark .t_light .t_green_Progress, :root.t_dark .t_light .t_green_SelectTrigger, :root.t_dark .t_light .t_green_SliderTrack, :root.t_dark .t_light .t_green_TextArea, :root.t_dark .t_light .t_green_TooltipArrow, :root.t_light .t_green_Card, :root.t_light .t_green_Input, :root.t_light .t_green_ListItem, :root.t_light .t_green_Progress, :root.t_light .t_green_SelectTrigger, :root.t_light .t_green_SliderTrack, :root.t_light .t_green_TextArea, :root.t_light .t_green_TooltipArrow, .tm_xxt {--color:hsla(155, 41%, 14%, 1);--colorHover:hsla(153, 67%, 28%, 1);--colorPress:hsla(155, 41%, 14%, 1);--colorFocus:hsla(153, 67%, 28%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(155, 41%, 14%, 0.2);--background:hsla(138, 63%, 97%, 1);--backgroundHover:hsla(140, 60%, 99%, 1);--backgroundPress:hsla(139, 57%, 95%, 1);--backgroundFocus:hsla(139, 57%, 95%, 1);--borderColor:hsla(141, 44%, 86%, 1);--borderColorHover:hsla(139, 48%, 91%, 1);--borderColorFocus:hsla(141, 44%, 86%, 1);--borderColorPress:hsla(142, 40%, 79%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_green_Card, .t_green_Input, .t_green_ListItem, .t_green_Progress, .t_green_SelectTrigger, .t_green_SliderTrack, .t_green_TextArea, .t_green_TooltipArrow {--color:hsla(155, 41%, 14%, 1);--colorHover:hsla(153, 67%, 28%, 1);--colorPress:hsla(155, 41%, 14%, 1);--colorFocus:hsla(153, 67%, 28%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(155, 41%, 14%, 0.2);--background:hsla(138, 63%, 97%, 1);--backgroundHover:hsla(140, 60%, 99%, 1);--backgroundPress:hsla(139, 57%, 95%, 1);--backgroundFocus:hsla(139, 57%, 95%, 1);--borderColor:hsla(141, 44%, 86%, 1);--borderColorHover:hsla(139, 48%, 91%, 1);--borderColorFocus:hsla(141, 44%, 86%, 1);--borderColorPress:hsla(142, 40%, 79%, 1);}
+  }
+:root.t_dark .t_light .t_green_Button, :root.t_dark .t_light .t_green_SliderTrackActive, :root.t_light .t_green_Button, :root.t_light .t_green_SliderTrackActive, .tm_xxt {--color:hsla(155, 41%, 14%, 1);--colorHover:hsla(153, 67%, 28%, 1);--colorPress:hsla(155, 41%, 14%, 1);--colorFocus:hsla(153, 67%, 28%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(155, 41%, 14%, 0.2);--background:hsla(139, 48%, 91%, 1);--backgroundHover:hsla(139, 57%, 95%, 1);--backgroundPress:hsla(141, 44%, 86%, 1);--backgroundFocus:hsla(141, 44%, 86%, 1);--borderColor:hsla(146, 38%, 69%, 1);--borderColorHover:hsla(142, 40%, 79%, 1);--borderColorFocus:hsla(146, 38%, 69%, 1);--borderColorPress:hsla(151, 40%, 54%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_green_Button, .t_green_SliderTrackActive {--color:hsla(155, 41%, 14%, 1);--colorHover:hsla(153, 67%, 28%, 1);--colorPress:hsla(155, 41%, 14%, 1);--colorFocus:hsla(153, 67%, 28%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(155, 41%, 14%, 0.2);--background:hsla(139, 48%, 91%, 1);--backgroundHover:hsla(139, 57%, 95%, 1);--backgroundPress:hsla(141, 44%, 86%, 1);--backgroundFocus:hsla(141, 44%, 86%, 1);--borderColor:hsla(146, 38%, 69%, 1);--borderColorHover:hsla(142, 40%, 79%, 1);--borderColorFocus:hsla(146, 38%, 69%, 1);--borderColorPress:hsla(151, 40%, 54%, 1);}
+  }
+:root.t_dark .t_light .t_green_Checkbox, :root.t_dark .t_light .t_green_RadioGroupItem, :root.t_dark .t_light .t_green_Switch, :root.t_dark .t_light .t_green_TooltipContent, :root.t_light .t_green_Checkbox, :root.t_light .t_green_RadioGroupItem, :root.t_light .t_green_Switch, :root.t_light .t_green_TooltipContent, .tm_xxt {--color:hsla(155, 41%, 14%, 1);--colorHover:hsla(153, 67%, 28%, 1);--colorPress:hsla(155, 41%, 14%, 1);--colorFocus:hsla(153, 67%, 28%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(155, 41%, 14%, 0.2);--background:hsla(139, 57%, 95%, 1);--backgroundHover:hsla(138, 63%, 97%, 1);--backgroundPress:hsla(139, 48%, 91%, 1);--backgroundFocus:hsla(139, 48%, 91%, 1);--borderColor:hsla(142, 40%, 79%, 1);--borderColorHover:hsla(141, 44%, 86%, 1);--borderColorFocus:hsla(142, 40%, 79%, 1);--borderColorPress:hsla(146, 38%, 69%, 1);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_green_Checkbox, .t_green_RadioGroupItem, .t_green_Switch, .t_green_TooltipContent {--color:hsla(155, 41%, 14%, 1);--colorHover:hsla(153, 67%, 28%, 1);--colorPress:hsla(155, 41%, 14%, 1);--colorFocus:hsla(153, 67%, 28%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(155, 41%, 14%, 0.2);--background:hsla(139, 57%, 95%, 1);--backgroundHover:hsla(138, 63%, 97%, 1);--backgroundPress:hsla(139, 48%, 91%, 1);--backgroundFocus:hsla(139, 48%, 91%, 1);--borderColor:hsla(142, 40%, 79%, 1);--borderColorHover:hsla(141, 44%, 86%, 1);--borderColorFocus:hsla(142, 40%, 79%, 1);--borderColorPress:hsla(146, 38%, 69%, 1);}
+  }
+:root.t_dark .t_light .t_green_ProgressIndicator, :root.t_dark .t_light .t_green_SliderThumb, :root.t_dark .t_light .t_green_SwitchThumb, :root.t_dark .t_light .t_green_Tooltip, :root.t_light .t_green_ProgressIndicator, :root.t_light .t_green_SliderThumb, :root.t_light .t_green_SwitchThumb, :root.t_light .t_green_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(155, 41%, 14%, 0);--background02:hsla(155, 41%, 14%, 0.2);--background04:hsla(155, 41%, 14%, 0.4);--background06:hsla(155, 41%, 14%, 0.6);--background08:hsla(155, 41%, 14%, 0.8);--color1:hsla(155, 41%, 14%, 1);--color2:hsla(153, 67%, 28%, 1);--color3:hsla(152, 57%, 38%, 1);--color4:hsla(151, 55%, 42%, 1);--color5:hsla(151, 40%, 54%, 1);--color6:hsla(146, 38%, 69%, 1);--color7:hsla(142, 40%, 79%, 1);--color8:hsla(141, 44%, 86%, 1);--color9:hsla(139, 48%, 91%, 1);--color10:hsla(139, 57%, 95%, 1);--color11:hsla(138, 63%, 97%, 1);--color12:hsla(140, 60%, 99%, 1);--color0:hsla(140, 60%, 99%, 0);--color02:hsla(140, 60%, 99%, 0.2);--color04:hsla(140, 60%, 99%, 0.4);--color06:hsla(140, 60%, 99%, 0.6);--color08:hsla(140, 60%, 99%, 0.8);--background:hsla(155, 41%, 14%, 1);--backgroundHover:hsla(155, 41%, 14%, 0.8);--backgroundPress:hsla(153, 67%, 28%, 1);--backgroundFocus:hsla(153, 67%, 28%, 1);--borderColor:hsla(151, 55%, 42%, 1);--borderColorHover:hsla(152, 57%, 38%, 1);--borderColorPress:hsla(151, 40%, 54%, 1);--borderColorFocus:hsla(151, 55%, 42%, 1);--color:hsla(140, 60%, 99%, 1);--colorHover:hsla(138, 63%, 97%, 1);--colorPress:hsla(140, 60%, 99%, 1);--colorFocus:hsla(138, 63%, 97%, 1);--placeholderColor:hsla(139, 48%, 91%, 1);--outlineColor:hsla(140, 60%, 99%, 0.2);--colorTransparent:hsla(140, 60%, 99%, 0);}
+@media(prefers-color-scheme:light){
+    body{background:var(--background);color:var(--color)}
+    .t_green_ProgressIndicator, .t_green_SliderThumb, .t_green_SwitchThumb, .t_green_Tooltip {--accentBackground:hsla(0, 0%, 38%, 1);--accentColor:hsla(0, 0%, 10%, 1);--background0:hsla(155, 41%, 14%, 0);--background02:hsla(155, 41%, 14%, 0.2);--background04:hsla(155, 41%, 14%, 0.4);--background06:hsla(155, 41%, 14%, 0.6);--background08:hsla(155, 41%, 14%, 0.8);--color1:hsla(155, 41%, 14%, 1);--color2:hsla(153, 67%, 28%, 1);--color3:hsla(152, 57%, 38%, 1);--color4:hsla(151, 55%, 42%, 1);--color5:hsla(151, 40%, 54%, 1);--color6:hsla(146, 38%, 69%, 1);--color7:hsla(142, 40%, 79%, 1);--color8:hsla(141, 44%, 86%, 1);--color9:hsla(139, 48%, 91%, 1);--color10:hsla(139, 57%, 95%, 1);--color11:hsla(138, 63%, 97%, 1);--color12:hsla(140, 60%, 99%, 1);--color0:hsla(140, 60%, 99%, 0);--color02:hsla(140, 60%, 99%, 0.2);--color04:hsla(140, 60%, 99%, 0.4);--color06:hsla(140, 60%, 99%, 0.6);--color08:hsla(140, 60%, 99%, 0.8);--background:hsla(155, 41%, 14%, 1);--backgroundHover:hsla(155, 41%, 14%, 0.8);--backgroundPress:hsla(153, 67%, 28%, 1);--backgroundFocus:hsla(153, 67%, 28%, 1);--borderColor:hsla(151, 55%, 42%, 1);--borderColorHover:hsla(152, 57%, 38%, 1);--borderColorPress:hsla(151, 40%, 54%, 1);--borderColorFocus:hsla(151, 55%, 42%, 1);--color:hsla(140, 60%, 99%, 1);--colorHover:hsla(138, 63%, 97%, 1);--colorPress:hsla(140, 60%, 99%, 1);--colorFocus:hsla(138, 63%, 97%, 1);--placeholderColor:hsla(139, 48%, 91%, 1);--outlineColor:hsla(140, 60%, 99%, 0.2);--colorTransparent:hsla(140, 60%, 99%, 0);}
+  }
+.t_light_green_SwitchThumb ::selection, .t_light_green_SliderThumb ::selection, .t_light_green_Tooltip ::selection, .t_light_green_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_white_ProgressIndicator, :root.t_dark .t_white_SliderThumb, :root.t_dark .t_white_SwitchThumb, :root.t_dark .t_white_Tooltip, :root.t_light .t_dark .t_white_ProgressIndicator, :root.t_light .t_dark .t_white_SliderThumb, :root.t_light .t_dark .t_white_SwitchThumb, :root.t_light .t_dark .t_white_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(0, 0%, 9%, 0);--background02:hsla(0, 0%, 9%, 0.2);--background04:hsla(0, 0%, 9%, 0.4);--background06:hsla(0, 0%, 9%, 0.6);--background08:hsla(0, 0%, 9%, 0.8);--color1:hsla(0, 0%, 9%, 1);--color2:hsla(0, 0%, 42%, 1);--color3:hsla(0, 0%, 50%, 1);--color4:hsla(0, 0%, 56%, 1);--color5:hsla(0, 0%, 76%, 1);--color6:hsla(0, 0%, 82%, 1);--color7:hsla(0, 0%, 85%, 1);--color8:hsla(0, 0%, 88%, 1);--color9:hsla(0, 0%, 91%, 1);--color10:hsla(0, 0%, 93%, 1);--color11:hsla(0, 0%, 95%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 9%, 1);--backgroundHover:hsla(0, 0%, 42%, 1);--backgroundPress:hsla(0, 0%, 9%, 0.8);--backgroundFocus:hsla(0, 0%, 9%, 0.8);--borderColor:hsla(0, 0%, 56%, 1);--borderColorHover:hsla(0, 0%, 76%, 1);--borderColorPress:hsla(0, 0%, 50%, 1);--borderColorFocus:hsla(0, 0%, 56%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 95%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 95%, 1);--placeholderColor:hsla(0, 0%, 91%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_white_ProgressIndicator, .t_white_SliderThumb, .t_white_SwitchThumb, .t_white_Tooltip {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(0, 0%, 9%, 0);--background02:hsla(0, 0%, 9%, 0.2);--background04:hsla(0, 0%, 9%, 0.4);--background06:hsla(0, 0%, 9%, 0.6);--background08:hsla(0, 0%, 9%, 0.8);--color1:hsla(0, 0%, 9%, 1);--color2:hsla(0, 0%, 42%, 1);--color3:hsla(0, 0%, 50%, 1);--color4:hsla(0, 0%, 56%, 1);--color5:hsla(0, 0%, 76%, 1);--color6:hsla(0, 0%, 82%, 1);--color7:hsla(0, 0%, 85%, 1);--color8:hsla(0, 0%, 88%, 1);--color9:hsla(0, 0%, 91%, 1);--color10:hsla(0, 0%, 93%, 1);--color11:hsla(0, 0%, 95%, 1);--color12:hsla(0, 0%, 100%, 1);--color0:hsla(0, 0%, 100%, 0);--color02:hsla(0, 0%, 100%, 0.2);--color04:hsla(0, 0%, 100%, 0.4);--color06:hsla(0, 0%, 100%, 0.6);--color08:hsla(0, 0%, 100%, 0.8);--background:hsla(0, 0%, 9%, 1);--backgroundHover:hsla(0, 0%, 42%, 1);--backgroundPress:hsla(0, 0%, 9%, 0.8);--backgroundFocus:hsla(0, 0%, 9%, 0.8);--borderColor:hsla(0, 0%, 56%, 1);--borderColorHover:hsla(0, 0%, 76%, 1);--borderColorPress:hsla(0, 0%, 50%, 1);--borderColorFocus:hsla(0, 0%, 56%, 1);--color:hsla(0, 0%, 100%, 1);--colorHover:hsla(0, 0%, 95%, 1);--colorPress:hsla(0, 0%, 100%, 1);--colorFocus:hsla(0, 0%, 95%, 1);--placeholderColor:hsla(0, 0%, 91%, 1);--outlineColor:hsla(0, 0%, 100%, 0.2);--colorTransparent:hsla(0, 0%, 100%, 0);}
+  }
+.t_dark_white_SwitchThumb ::selection, .t_dark_white_SliderThumb ::selection, .t_dark_white_Tooltip ::selection, .t_dark_white_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_blue_Card, :root.t_dark .t_blue_Input, :root.t_dark .t_blue_ListItem, :root.t_dark .t_blue_Progress, :root.t_dark .t_blue_SelectTrigger, :root.t_dark .t_blue_SliderTrack, :root.t_dark .t_blue_TextArea, :root.t_dark .t_blue_TooltipArrow, :root.t_light .t_dark .t_blue_Card, :root.t_light .t_dark .t_blue_Input, :root.t_light .t_dark .t_blue_ListItem, :root.t_light .t_dark .t_blue_Progress, :root.t_light .t_dark .t_blue_SelectTrigger, :root.t_light .t_dark .t_blue_SliderTrack, :root.t_light .t_dark .t_blue_TextArea, :root.t_light .t_dark .t_blue_TooltipArrow, .tm_xxt {--color:hsla(206, 100%, 96%, 1);--colorHover:hsla(210, 100%, 66%, 1);--colorPress:hsla(206, 100%, 96%, 1);--colorFocus:hsla(210, 100%, 66%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(207, 100%, 96%, 0.2);--background:hsla(216, 50%, 12%, 1);--backgroundHover:hsla(214, 59%, 15%, 1);--backgroundPress:hsla(212, 36%, 9%, 1);--backgroundFocus:hsla(212, 36%, 9%, 1);--borderColor:hsla(213, 71%, 20%, 1);--borderColorHover:hsla(212, 78%, 23%, 1);--borderColorFocus:hsla(213, 71%, 20%, 1);--borderColorPress:hsla(214, 65%, 18%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_blue_Card, .t_blue_Input, .t_blue_ListItem, .t_blue_Progress, .t_blue_SelectTrigger, .t_blue_SliderTrack, .t_blue_TextArea, .t_blue_TooltipArrow {--color:hsla(206, 100%, 96%, 1);--colorHover:hsla(210, 100%, 66%, 1);--colorPress:hsla(206, 100%, 96%, 1);--colorFocus:hsla(210, 100%, 66%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(207, 100%, 96%, 0.2);--background:hsla(216, 50%, 12%, 1);--backgroundHover:hsla(214, 59%, 15%, 1);--backgroundPress:hsla(212, 36%, 9%, 1);--backgroundFocus:hsla(212, 36%, 9%, 1);--borderColor:hsla(213, 71%, 20%, 1);--borderColorHover:hsla(212, 78%, 23%, 1);--borderColorFocus:hsla(213, 71%, 20%, 1);--borderColorPress:hsla(214, 65%, 18%, 1);}
+  }
+:root.t_dark .t_blue_Button, :root.t_dark .t_blue_SliderTrackActive, :root.t_light .t_dark .t_blue_Button, :root.t_light .t_dark .t_blue_SliderTrackActive, .tm_xxt {--color:hsla(206, 100%, 96%, 1);--colorHover:hsla(210, 100%, 66%, 1);--colorPress:hsla(206, 100%, 96%, 1);--colorFocus:hsla(210, 100%, 66%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(207, 100%, 96%, 0.2);--background:hsla(214, 65%, 18%, 1);--backgroundHover:hsla(213, 71%, 20%, 1);--backgroundPress:hsla(214, 59%, 15%, 1);--backgroundFocus:hsla(214, 59%, 15%, 1);--borderColor:hsla(211, 86%, 27%, 1);--borderColorHover:hsla(211, 90%, 34%, 1);--borderColorFocus:hsla(211, 86%, 27%, 1);--borderColorPress:hsla(212, 78%, 23%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_blue_Button, .t_blue_SliderTrackActive {--color:hsla(206, 100%, 96%, 1);--colorHover:hsla(210, 100%, 66%, 1);--colorPress:hsla(206, 100%, 96%, 1);--colorFocus:hsla(210, 100%, 66%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(207, 100%, 96%, 0.2);--background:hsla(214, 65%, 18%, 1);--backgroundHover:hsla(213, 71%, 20%, 1);--backgroundPress:hsla(214, 59%, 15%, 1);--backgroundFocus:hsla(214, 59%, 15%, 1);--borderColor:hsla(211, 86%, 27%, 1);--borderColorHover:hsla(211, 90%, 34%, 1);--borderColorFocus:hsla(211, 86%, 27%, 1);--borderColorPress:hsla(212, 78%, 23%, 1);}
+  }
+:root.t_dark .t_blue_Checkbox, :root.t_dark .t_blue_RadioGroupItem, :root.t_dark .t_blue_Switch, :root.t_dark .t_blue_TooltipContent, :root.t_light .t_dark .t_blue_Checkbox, :root.t_light .t_dark .t_blue_RadioGroupItem, :root.t_light .t_dark .t_blue_Switch, :root.t_light .t_dark .t_blue_TooltipContent, .tm_xxt {--color:hsla(206, 100%, 96%, 1);--colorHover:hsla(210, 100%, 66%, 1);--colorPress:hsla(206, 100%, 96%, 1);--colorFocus:hsla(210, 100%, 66%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(207, 100%, 96%, 0.2);--background:hsla(214, 59%, 15%, 1);--backgroundHover:hsla(214, 65%, 18%, 1);--backgroundPress:hsla(216, 50%, 12%, 1);--backgroundFocus:hsla(216, 50%, 12%, 1);--borderColor:hsla(212, 78%, 23%, 1);--borderColorHover:hsla(211, 86%, 27%, 1);--borderColorFocus:hsla(212, 78%, 23%, 1);--borderColorPress:hsla(213, 71%, 20%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_blue_Checkbox, .t_blue_RadioGroupItem, .t_blue_Switch, .t_blue_TooltipContent {--color:hsla(206, 100%, 96%, 1);--colorHover:hsla(210, 100%, 66%, 1);--colorPress:hsla(206, 100%, 96%, 1);--colorFocus:hsla(210, 100%, 66%, 1);--placeholderColor:hsla(206, 100%, 50%, 1);--outlineColor:hsla(207, 100%, 96%, 0.2);--background:hsla(214, 59%, 15%, 1);--backgroundHover:hsla(214, 65%, 18%, 1);--backgroundPress:hsla(216, 50%, 12%, 1);--backgroundFocus:hsla(216, 50%, 12%, 1);--borderColor:hsla(212, 78%, 23%, 1);--borderColorHover:hsla(211, 86%, 27%, 1);--borderColorFocus:hsla(212, 78%, 23%, 1);--borderColorPress:hsla(213, 71%, 20%, 1);}
+  }
+:root.t_dark .t_blue_ProgressIndicator, :root.t_dark .t_blue_SliderThumb, :root.t_dark .t_blue_SwitchThumb, :root.t_dark .t_blue_Tooltip, :root.t_light .t_dark .t_blue_ProgressIndicator, :root.t_light .t_dark .t_blue_SliderThumb, :root.t_light .t_dark .t_blue_SwitchThumb, :root.t_light .t_dark .t_blue_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(207, 100%, 96%, 0);--background02:hsla(207, 100%, 96%, 0.2);--background04:hsla(207, 100%, 96%, 0.4);--background06:hsla(207, 100%, 96%, 0.6);--background08:hsla(207, 100%, 96%, 0.8);--color1:hsla(206, 100%, 96%, 1);--color2:hsla(210, 100%, 66%, 1);--color3:hsla(209, 100%, 61%, 1);--color4:hsla(206, 100%, 50%, 1);--color5:hsla(211, 90%, 34%, 1);--color6:hsla(211, 86%, 27%, 1);--color7:hsla(212, 78%, 23%, 1);--color8:hsla(213, 71%, 20%, 1);--color9:hsla(214, 65%, 18%, 1);--color10:hsla(214, 59%, 15%, 1);--color11:hsla(216, 50%, 12%, 1);--color12:hsla(212, 36%, 9%, 1);--color0:hsla(214, 35%, 9%, 0);--color02:hsla(214, 35%, 9%, 0.2);--color04:hsla(214, 35%, 9%, 0.4);--color06:hsla(214, 35%, 9%, 0.6);--color08:hsla(214, 35%, 9%, 0.8);--background:hsla(206, 100%, 96%, 1);--backgroundHover:hsla(210, 100%, 66%, 1);--backgroundPress:hsla(207, 100%, 96%, 0.8);--backgroundFocus:hsla(207, 100%, 96%, 0.8);--borderColor:hsla(206, 100%, 50%, 1);--borderColorHover:hsla(211, 90%, 34%, 1);--borderColorPress:hsla(209, 100%, 61%, 1);--borderColorFocus:hsla(206, 100%, 50%, 1);--color:hsla(212, 36%, 9%, 1);--colorHover:hsla(216, 50%, 12%, 1);--colorPress:hsla(212, 36%, 9%, 1);--colorFocus:hsla(216, 50%, 12%, 1);--placeholderColor:hsla(214, 65%, 18%, 1);--outlineColor:hsla(214, 35%, 9%, 0.2);--colorTransparent:hsla(214, 35%, 9%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_blue_ProgressIndicator, .t_blue_SliderThumb, .t_blue_SwitchThumb, .t_blue_Tooltip {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(207, 100%, 96%, 0);--background02:hsla(207, 100%, 96%, 0.2);--background04:hsla(207, 100%, 96%, 0.4);--background06:hsla(207, 100%, 96%, 0.6);--background08:hsla(207, 100%, 96%, 0.8);--color1:hsla(206, 100%, 96%, 1);--color2:hsla(210, 100%, 66%, 1);--color3:hsla(209, 100%, 61%, 1);--color4:hsla(206, 100%, 50%, 1);--color5:hsla(211, 90%, 34%, 1);--color6:hsla(211, 86%, 27%, 1);--color7:hsla(212, 78%, 23%, 1);--color8:hsla(213, 71%, 20%, 1);--color9:hsla(214, 65%, 18%, 1);--color10:hsla(214, 59%, 15%, 1);--color11:hsla(216, 50%, 12%, 1);--color12:hsla(212, 36%, 9%, 1);--color0:hsla(214, 35%, 9%, 0);--color02:hsla(214, 35%, 9%, 0.2);--color04:hsla(214, 35%, 9%, 0.4);--color06:hsla(214, 35%, 9%, 0.6);--color08:hsla(214, 35%, 9%, 0.8);--background:hsla(206, 100%, 96%, 1);--backgroundHover:hsla(210, 100%, 66%, 1);--backgroundPress:hsla(207, 100%, 96%, 0.8);--backgroundFocus:hsla(207, 100%, 96%, 0.8);--borderColor:hsla(206, 100%, 50%, 1);--borderColorHover:hsla(211, 90%, 34%, 1);--borderColorPress:hsla(209, 100%, 61%, 1);--borderColorFocus:hsla(206, 100%, 50%, 1);--color:hsla(212, 36%, 9%, 1);--colorHover:hsla(216, 50%, 12%, 1);--colorPress:hsla(212, 36%, 9%, 1);--colorFocus:hsla(216, 50%, 12%, 1);--placeholderColor:hsla(214, 65%, 18%, 1);--outlineColor:hsla(214, 35%, 9%, 0.2);--colorTransparent:hsla(214, 35%, 9%, 0);}
+  }
+.t_dark_blue_SwitchThumb ::selection, .t_dark_blue_SliderThumb ::selection, .t_dark_blue_Tooltip ::selection, .t_dark_blue_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_red_Card, :root.t_dark .t_red_Input, :root.t_dark .t_red_ListItem, :root.t_dark .t_red_Progress, :root.t_dark .t_red_SelectTrigger, :root.t_dark .t_red_SliderTrack, :root.t_dark .t_red_TextArea, :root.t_dark .t_red_TooltipArrow, :root.t_light .t_dark .t_red_Card, :root.t_light .t_dark .t_red_Input, :root.t_light .t_dark .t_red_ListItem, :root.t_light .t_dark .t_red_Progress, :root.t_light .t_dark .t_red_SelectTrigger, :root.t_light .t_dark .t_red_SliderTrack, :root.t_light .t_dark .t_red_TextArea, :root.t_light .t_dark .t_red_TooltipArrow, .tm_xxt {--color:hsla(353, 90%, 96%, 1);--colorHover:hsla(358, 100%, 69%, 1);--colorPress:hsla(353, 90%, 96%, 1);--colorFocus:hsla(358, 100%, 69%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(353, 90%, 96%, 0.2);--background:hsla(357, 34%, 12%, 1);--backgroundHover:hsla(357, 43%, 16%, 1);--backgroundPress:hsla(350, 24%, 10%, 1);--backgroundFocus:hsla(350, 24%, 10%, 1);--borderColor:hsla(356, 51%, 22%, 1);--borderColorHover:hsla(357, 55%, 26%, 1);--borderColorFocus:hsla(356, 51%, 22%, 1);--borderColorPress:hsla(356, 47%, 19%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_red_Card, .t_red_Input, .t_red_ListItem, .t_red_Progress, .t_red_SelectTrigger, .t_red_SliderTrack, .t_red_TextArea, .t_red_TooltipArrow {--color:hsla(353, 90%, 96%, 1);--colorHover:hsla(358, 100%, 69%, 1);--colorPress:hsla(353, 90%, 96%, 1);--colorFocus:hsla(358, 100%, 69%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(353, 90%, 96%, 0.2);--background:hsla(357, 34%, 12%, 1);--backgroundHover:hsla(357, 43%, 16%, 1);--backgroundPress:hsla(350, 24%, 10%, 1);--backgroundFocus:hsla(350, 24%, 10%, 1);--borderColor:hsla(356, 51%, 22%, 1);--borderColorHover:hsla(357, 55%, 26%, 1);--borderColorFocus:hsla(356, 51%, 22%, 1);--borderColorPress:hsla(356, 47%, 19%, 1);}
+  }
+:root.t_dark .t_red_Button, :root.t_dark .t_red_SliderTrackActive, :root.t_light .t_dark .t_red_Button, :root.t_light .t_dark .t_red_SliderTrackActive, .tm_xxt {--color:hsla(353, 90%, 96%, 1);--colorHover:hsla(358, 100%, 69%, 1);--colorPress:hsla(353, 90%, 96%, 1);--colorFocus:hsla(358, 100%, 69%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(353, 90%, 96%, 0.2);--background:hsla(356, 47%, 19%, 1);--backgroundHover:hsla(356, 51%, 22%, 1);--backgroundPress:hsla(357, 43%, 16%, 1);--backgroundFocus:hsla(357, 43%, 16%, 1);--borderColor:hsla(357, 60%, 32%, 1);--borderColorHover:hsla(358, 65%, 40%, 1);--borderColorFocus:hsla(357, 60%, 32%, 1);--borderColorPress:hsla(357, 55%, 26%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_red_Button, .t_red_SliderTrackActive {--color:hsla(353, 90%, 96%, 1);--colorHover:hsla(358, 100%, 69%, 1);--colorPress:hsla(353, 90%, 96%, 1);--colorFocus:hsla(358, 100%, 69%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(353, 90%, 96%, 0.2);--background:hsla(356, 47%, 19%, 1);--backgroundHover:hsla(356, 51%, 22%, 1);--backgroundPress:hsla(357, 43%, 16%, 1);--backgroundFocus:hsla(357, 43%, 16%, 1);--borderColor:hsla(357, 60%, 32%, 1);--borderColorHover:hsla(358, 65%, 40%, 1);--borderColorFocus:hsla(357, 60%, 32%, 1);--borderColorPress:hsla(357, 55%, 26%, 1);}
+  }
+:root.t_dark .t_red_Checkbox, :root.t_dark .t_red_RadioGroupItem, :root.t_dark .t_red_Switch, :root.t_dark .t_red_TooltipContent, :root.t_light .t_dark .t_red_Checkbox, :root.t_light .t_dark .t_red_RadioGroupItem, :root.t_light .t_dark .t_red_Switch, :root.t_light .t_dark .t_red_TooltipContent, .tm_xxt {--color:hsla(353, 90%, 96%, 1);--colorHover:hsla(358, 100%, 69%, 1);--colorPress:hsla(353, 90%, 96%, 1);--colorFocus:hsla(358, 100%, 69%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(353, 90%, 96%, 0.2);--background:hsla(357, 43%, 16%, 1);--backgroundHover:hsla(356, 47%, 19%, 1);--backgroundPress:hsla(357, 34%, 12%, 1);--backgroundFocus:hsla(357, 34%, 12%, 1);--borderColor:hsla(357, 55%, 26%, 1);--borderColorHover:hsla(357, 60%, 32%, 1);--borderColorFocus:hsla(357, 55%, 26%, 1);--borderColorPress:hsla(356, 51%, 22%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_red_Checkbox, .t_red_RadioGroupItem, .t_red_Switch, .t_red_TooltipContent {--color:hsla(353, 90%, 96%, 1);--colorHover:hsla(358, 100%, 69%, 1);--colorPress:hsla(353, 90%, 96%, 1);--colorFocus:hsla(358, 100%, 69%, 1);--placeholderColor:hsla(358, 75%, 59%, 1);--outlineColor:hsla(353, 90%, 96%, 0.2);--background:hsla(357, 43%, 16%, 1);--backgroundHover:hsla(356, 47%, 19%, 1);--backgroundPress:hsla(357, 34%, 12%, 1);--backgroundFocus:hsla(357, 34%, 12%, 1);--borderColor:hsla(357, 55%, 26%, 1);--borderColorHover:hsla(357, 60%, 32%, 1);--borderColorFocus:hsla(357, 55%, 26%, 1);--borderColorPress:hsla(356, 51%, 22%, 1);}
+  }
+:root.t_dark .t_red_ProgressIndicator, :root.t_dark .t_red_SliderThumb, :root.t_dark .t_red_SwitchThumb, :root.t_dark .t_red_Tooltip, :root.t_light .t_dark .t_red_ProgressIndicator, :root.t_light .t_dark .t_red_SliderThumb, :root.t_light .t_dark .t_red_SwitchThumb, :root.t_light .t_dark .t_red_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(353, 90%, 96%, 0);--background02:hsla(353, 90%, 96%, 0.2);--background04:hsla(353, 90%, 96%, 0.4);--background06:hsla(353, 90%, 96%, 0.6);--background08:hsla(353, 90%, 96%, 0.8);--color1:hsla(353, 90%, 96%, 1);--color2:hsla(358, 100%, 69%, 1);--color3:hsla(358, 86%, 64%, 1);--color4:hsla(358, 75%, 59%, 1);--color5:hsla(358, 65%, 40%, 1);--color6:hsla(357, 60%, 32%, 1);--color7:hsla(357, 55%, 26%, 1);--color8:hsla(356, 51%, 22%, 1);--color9:hsla(356, 47%, 19%, 1);--color10:hsla(357, 43%, 16%, 1);--color11:hsla(357, 34%, 12%, 1);--color12:hsla(350, 24%, 10%, 1);--color0:hsla(351, 25%, 10%, 0);--color02:hsla(351, 25%, 10%, 0.2);--color04:hsla(351, 25%, 10%, 0.4);--color06:hsla(351, 25%, 10%, 0.6);--color08:hsla(351, 25%, 10%, 0.8);--background:hsla(353, 90%, 96%, 1);--backgroundHover:hsla(358, 100%, 69%, 1);--backgroundPress:hsla(353, 90%, 96%, 0.8);--backgroundFocus:hsla(353, 90%, 96%, 0.8);--borderColor:hsla(358, 75%, 59%, 1);--borderColorHover:hsla(358, 65%, 40%, 1);--borderColorPress:hsla(358, 86%, 64%, 1);--borderColorFocus:hsla(358, 75%, 59%, 1);--color:hsla(350, 24%, 10%, 1);--colorHover:hsla(357, 34%, 12%, 1);--colorPress:hsla(350, 24%, 10%, 1);--colorFocus:hsla(357, 34%, 12%, 1);--placeholderColor:hsla(356, 47%, 19%, 1);--outlineColor:hsla(351, 25%, 10%, 0.2);--colorTransparent:hsla(351, 25%, 10%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_red_ProgressIndicator, .t_red_SliderThumb, .t_red_SwitchThumb, .t_red_Tooltip {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(353, 90%, 96%, 0);--background02:hsla(353, 90%, 96%, 0.2);--background04:hsla(353, 90%, 96%, 0.4);--background06:hsla(353, 90%, 96%, 0.6);--background08:hsla(353, 90%, 96%, 0.8);--color1:hsla(353, 90%, 96%, 1);--color2:hsla(358, 100%, 69%, 1);--color3:hsla(358, 86%, 64%, 1);--color4:hsla(358, 75%, 59%, 1);--color5:hsla(358, 65%, 40%, 1);--color6:hsla(357, 60%, 32%, 1);--color7:hsla(357, 55%, 26%, 1);--color8:hsla(356, 51%, 22%, 1);--color9:hsla(356, 47%, 19%, 1);--color10:hsla(357, 43%, 16%, 1);--color11:hsla(357, 34%, 12%, 1);--color12:hsla(350, 24%, 10%, 1);--color0:hsla(351, 25%, 10%, 0);--color02:hsla(351, 25%, 10%, 0.2);--color04:hsla(351, 25%, 10%, 0.4);--color06:hsla(351, 25%, 10%, 0.6);--color08:hsla(351, 25%, 10%, 0.8);--background:hsla(353, 90%, 96%, 1);--backgroundHover:hsla(358, 100%, 69%, 1);--backgroundPress:hsla(353, 90%, 96%, 0.8);--backgroundFocus:hsla(353, 90%, 96%, 0.8);--borderColor:hsla(358, 75%, 59%, 1);--borderColorHover:hsla(358, 65%, 40%, 1);--borderColorPress:hsla(358, 86%, 64%, 1);--borderColorFocus:hsla(358, 75%, 59%, 1);--color:hsla(350, 24%, 10%, 1);--colorHover:hsla(357, 34%, 12%, 1);--colorPress:hsla(350, 24%, 10%, 1);--colorFocus:hsla(357, 34%, 12%, 1);--placeholderColor:hsla(356, 47%, 19%, 1);--outlineColor:hsla(351, 25%, 10%, 0.2);--colorTransparent:hsla(351, 25%, 10%, 0);}
+  }
+.t_dark_red_SwitchThumb ::selection, .t_dark_red_SliderThumb ::selection, .t_dark_red_Tooltip ::selection, .t_dark_red_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_yellow_Card, :root.t_dark .t_yellow_Input, :root.t_dark .t_yellow_ListItem, :root.t_dark .t_yellow_Progress, :root.t_dark .t_yellow_SelectTrigger, :root.t_dark .t_yellow_SliderTrack, :root.t_dark .t_yellow_TextArea, :root.t_dark .t_yellow_TooltipArrow, :root.t_light .t_dark .t_yellow_Card, :root.t_light .t_dark .t_yellow_Input, :root.t_light .t_dark .t_yellow_ListItem, :root.t_light .t_dark .t_yellow_Progress, :root.t_light .t_dark .t_yellow_SelectTrigger, :root.t_light .t_dark .t_yellow_SliderTrack, :root.t_light .t_dark .t_yellow_TextArea, :root.t_light .t_dark .t_yellow_TooltipArrow, .tm_xxt {--color:hsla(53, 100%, 91%, 1);--colorHover:hsla(48, 100%, 47%, 1);--colorPress:hsla(53, 100%, 91%, 1);--colorFocus:hsla(48, 100%, 47%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(53, 100%, 91%, 0.2);--background:hsla(46, 100%, 7%, 1);--backgroundHover:hsla(45, 100%, 9%, 1);--backgroundPress:hsla(45, 100%, 5%, 1);--backgroundFocus:hsla(45, 100%, 5%, 1);--borderColor:hsla(46, 100%, 12%, 1);--borderColorHover:hsla(49, 100%, 14%, 1);--borderColorFocus:hsla(46, 100%, 12%, 1);--borderColorPress:hsla(45, 100%, 10%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow_Card, .t_yellow_Input, .t_yellow_ListItem, .t_yellow_Progress, .t_yellow_SelectTrigger, .t_yellow_SliderTrack, .t_yellow_TextArea, .t_yellow_TooltipArrow {--color:hsla(53, 100%, 91%, 1);--colorHover:hsla(48, 100%, 47%, 1);--colorPress:hsla(53, 100%, 91%, 1);--colorFocus:hsla(48, 100%, 47%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(53, 100%, 91%, 0.2);--background:hsla(46, 100%, 7%, 1);--backgroundHover:hsla(45, 100%, 9%, 1);--backgroundPress:hsla(45, 100%, 5%, 1);--backgroundFocus:hsla(45, 100%, 5%, 1);--borderColor:hsla(46, 100%, 12%, 1);--borderColorHover:hsla(49, 100%, 14%, 1);--borderColorFocus:hsla(46, 100%, 12%, 1);--borderColorPress:hsla(45, 100%, 10%, 1);}
+  }
+:root.t_dark .t_yellow_Button, :root.t_dark .t_yellow_SliderTrackActive, :root.t_light .t_dark .t_yellow_Button, :root.t_light .t_dark .t_yellow_SliderTrackActive, .tm_xxt {--color:hsla(53, 100%, 91%, 1);--colorHover:hsla(48, 100%, 47%, 1);--colorPress:hsla(53, 100%, 91%, 1);--colorFocus:hsla(48, 100%, 47%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(53, 100%, 91%, 0.2);--background:hsla(45, 100%, 10%, 1);--backgroundHover:hsla(46, 100%, 12%, 1);--backgroundPress:hsla(45, 100%, 9%, 1);--backgroundFocus:hsla(45, 100%, 9%, 1);--borderColor:hsla(49, 89%, 18%, 1);--borderColorHover:hsla(50, 100%, 22%, 1);--borderColorFocus:hsla(49, 89%, 18%, 1);--borderColorPress:hsla(49, 100%, 14%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow_Button, .t_yellow_SliderTrackActive {--color:hsla(53, 100%, 91%, 1);--colorHover:hsla(48, 100%, 47%, 1);--colorPress:hsla(53, 100%, 91%, 1);--colorFocus:hsla(48, 100%, 47%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(53, 100%, 91%, 0.2);--background:hsla(45, 100%, 10%, 1);--backgroundHover:hsla(46, 100%, 12%, 1);--backgroundPress:hsla(45, 100%, 9%, 1);--backgroundFocus:hsla(45, 100%, 9%, 1);--borderColor:hsla(49, 89%, 18%, 1);--borderColorHover:hsla(50, 100%, 22%, 1);--borderColorFocus:hsla(49, 89%, 18%, 1);--borderColorPress:hsla(49, 100%, 14%, 1);}
+  }
+:root.t_dark .t_yellow_Checkbox, :root.t_dark .t_yellow_RadioGroupItem, :root.t_dark .t_yellow_Switch, :root.t_dark .t_yellow_TooltipContent, :root.t_light .t_dark .t_yellow_Checkbox, :root.t_light .t_dark .t_yellow_RadioGroupItem, :root.t_light .t_dark .t_yellow_Switch, :root.t_light .t_dark .t_yellow_TooltipContent, .tm_xxt {--color:hsla(53, 100%, 91%, 1);--colorHover:hsla(48, 100%, 47%, 1);--colorPress:hsla(53, 100%, 91%, 1);--colorFocus:hsla(48, 100%, 47%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(53, 100%, 91%, 0.2);--background:hsla(45, 100%, 9%, 1);--backgroundHover:hsla(45, 100%, 10%, 1);--backgroundPress:hsla(46, 100%, 7%, 1);--backgroundFocus:hsla(46, 100%, 7%, 1);--borderColor:hsla(49, 100%, 14%, 1);--borderColorHover:hsla(49, 89%, 18%, 1);--borderColorFocus:hsla(49, 100%, 14%, 1);--borderColorPress:hsla(46, 100%, 12%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow_Checkbox, .t_yellow_RadioGroupItem, .t_yellow_Switch, .t_yellow_TooltipContent {--color:hsla(53, 100%, 91%, 1);--colorHover:hsla(48, 100%, 47%, 1);--colorPress:hsla(53, 100%, 91%, 1);--colorFocus:hsla(48, 100%, 47%, 1);--placeholderColor:hsla(53, 92%, 50%, 1);--outlineColor:hsla(53, 100%, 91%, 0.2);--background:hsla(45, 100%, 9%, 1);--backgroundHover:hsla(45, 100%, 10%, 1);--backgroundPress:hsla(46, 100%, 7%, 1);--backgroundFocus:hsla(46, 100%, 7%, 1);--borderColor:hsla(49, 100%, 14%, 1);--borderColorHover:hsla(49, 89%, 18%, 1);--borderColorFocus:hsla(49, 100%, 14%, 1);--borderColorPress:hsla(46, 100%, 12%, 1);}
+  }
+:root.t_dark .t_yellow_ProgressIndicator, :root.t_dark .t_yellow_SliderThumb, :root.t_dark .t_yellow_SwitchThumb, :root.t_dark .t_yellow_Tooltip, :root.t_light .t_dark .t_yellow_ProgressIndicator, :root.t_light .t_dark .t_yellow_SliderThumb, :root.t_light .t_dark .t_yellow_SwitchThumb, :root.t_light .t_dark .t_yellow_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(53, 100%, 91%, 0);--background02:hsla(53, 100%, 91%, 0.2);--background04:hsla(53, 100%, 91%, 0.4);--background06:hsla(53, 100%, 91%, 0.6);--background08:hsla(53, 100%, 91%, 0.8);--color1:hsla(53, 100%, 91%, 1);--color2:hsla(48, 100%, 47%, 1);--color3:hsla(54, 100%, 68%, 1);--color4:hsla(53, 92%, 50%, 1);--color5:hsla(50, 100%, 22%, 1);--color6:hsla(49, 89%, 18%, 1);--color7:hsla(49, 100%, 14%, 1);--color8:hsla(46, 100%, 12%, 1);--color9:hsla(45, 100%, 10%, 1);--color10:hsla(45, 100%, 9%, 1);--color11:hsla(46, 100%, 7%, 1);--color12:hsla(45, 100%, 5%, 1);--color0:hsla(46, 100%, 5%, 0);--color02:hsla(46, 100%, 5%, 0.2);--color04:hsla(46, 100%, 5%, 0.4);--color06:hsla(46, 100%, 5%, 0.6);--color08:hsla(46, 100%, 5%, 0.8);--background:hsla(53, 100%, 91%, 1);--backgroundHover:hsla(48, 100%, 47%, 1);--backgroundPress:hsla(53, 100%, 91%, 0.8);--backgroundFocus:hsla(53, 100%, 91%, 0.8);--borderColor:hsla(53, 92%, 50%, 1);--borderColorHover:hsla(50, 100%, 22%, 1);--borderColorPress:hsla(54, 100%, 68%, 1);--borderColorFocus:hsla(53, 92%, 50%, 1);--color:hsla(45, 100%, 5%, 1);--colorHover:hsla(46, 100%, 7%, 1);--colorPress:hsla(45, 100%, 5%, 1);--colorFocus:hsla(46, 100%, 7%, 1);--placeholderColor:hsla(45, 100%, 10%, 1);--outlineColor:hsla(46, 100%, 5%, 0.2);--colorTransparent:hsla(46, 100%, 5%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_yellow_ProgressIndicator, .t_yellow_SliderThumb, .t_yellow_SwitchThumb, .t_yellow_Tooltip {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(53, 100%, 91%, 0);--background02:hsla(53, 100%, 91%, 0.2);--background04:hsla(53, 100%, 91%, 0.4);--background06:hsla(53, 100%, 91%, 0.6);--background08:hsla(53, 100%, 91%, 0.8);--color1:hsla(53, 100%, 91%, 1);--color2:hsla(48, 100%, 47%, 1);--color3:hsla(54, 100%, 68%, 1);--color4:hsla(53, 92%, 50%, 1);--color5:hsla(50, 100%, 22%, 1);--color6:hsla(49, 89%, 18%, 1);--color7:hsla(49, 100%, 14%, 1);--color8:hsla(46, 100%, 12%, 1);--color9:hsla(45, 100%, 10%, 1);--color10:hsla(45, 100%, 9%, 1);--color11:hsla(46, 100%, 7%, 1);--color12:hsla(45, 100%, 5%, 1);--color0:hsla(46, 100%, 5%, 0);--color02:hsla(46, 100%, 5%, 0.2);--color04:hsla(46, 100%, 5%, 0.4);--color06:hsla(46, 100%, 5%, 0.6);--color08:hsla(46, 100%, 5%, 0.8);--background:hsla(53, 100%, 91%, 1);--backgroundHover:hsla(48, 100%, 47%, 1);--backgroundPress:hsla(53, 100%, 91%, 0.8);--backgroundFocus:hsla(53, 100%, 91%, 0.8);--borderColor:hsla(53, 92%, 50%, 1);--borderColorHover:hsla(50, 100%, 22%, 1);--borderColorPress:hsla(54, 100%, 68%, 1);--borderColorFocus:hsla(53, 92%, 50%, 1);--color:hsla(45, 100%, 5%, 1);--colorHover:hsla(46, 100%, 7%, 1);--colorPress:hsla(45, 100%, 5%, 1);--colorFocus:hsla(46, 100%, 7%, 1);--placeholderColor:hsla(45, 100%, 10%, 1);--outlineColor:hsla(46, 100%, 5%, 0.2);--colorTransparent:hsla(46, 100%, 5%, 0);}
+  }
+.t_dark_yellow_SwitchThumb ::selection, .t_dark_yellow_SliderThumb ::selection, .t_dark_yellow_Tooltip ::selection, .t_dark_yellow_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+:root.t_dark .t_green_Card, :root.t_dark .t_green_Input, :root.t_dark .t_green_ListItem, :root.t_dark .t_green_Progress, :root.t_dark .t_green_SelectTrigger, :root.t_dark .t_green_SliderTrack, :root.t_dark .t_green_TextArea, :root.t_dark .t_green_TooltipArrow, :root.t_light .t_dark .t_green_Card, :root.t_light .t_dark .t_green_Input, :root.t_light .t_dark .t_green_ListItem, :root.t_light .t_dark .t_green_Progress, :root.t_light .t_dark .t_green_SelectTrigger, :root.t_light .t_dark .t_green_SliderTrack, :root.t_light .t_dark .t_green_TextArea, :root.t_light .t_dark .t_green_TooltipArrow, .tm_xxt {--color:hsla(136, 73%, 94%, 1);--colorHover:hsla(151, 50%, 53%, 1);--colorPress:hsla(136, 73%, 94%, 1);--colorFocus:hsla(151, 50%, 53%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(134, 73%, 94%, 0.2);--background:hsla(155, 44%, 8%, 1);--backgroundHover:hsla(155, 46%, 11%, 1);--backgroundPress:hsla(145, 32%, 7%, 1);--backgroundFocus:hsla(145, 32%, 7%, 1);--borderColor:hsla(155, 50%, 15%, 1);--borderColorHover:hsla(154, 51%, 18%, 1);--borderColorFocus:hsla(155, 50%, 15%, 1);--borderColorPress:hsla(154, 48%, 13%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_green_Card, .t_green_Input, .t_green_ListItem, .t_green_Progress, .t_green_SelectTrigger, .t_green_SliderTrack, .t_green_TextArea, .t_green_TooltipArrow {--color:hsla(136, 73%, 94%, 1);--colorHover:hsla(151, 50%, 53%, 1);--colorPress:hsla(136, 73%, 94%, 1);--colorFocus:hsla(151, 50%, 53%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(134, 73%, 94%, 0.2);--background:hsla(155, 44%, 8%, 1);--backgroundHover:hsla(155, 46%, 11%, 1);--backgroundPress:hsla(145, 32%, 7%, 1);--backgroundFocus:hsla(145, 32%, 7%, 1);--borderColor:hsla(155, 50%, 15%, 1);--borderColorHover:hsla(154, 51%, 18%, 1);--borderColorFocus:hsla(155, 50%, 15%, 1);--borderColorPress:hsla(154, 48%, 13%, 1);}
+  }
+:root.t_dark .t_green_Button, :root.t_dark .t_green_SliderTrackActive, :root.t_light .t_dark .t_green_Button, :root.t_light .t_dark .t_green_SliderTrackActive, .tm_xxt {--color:hsla(136, 73%, 94%, 1);--colorHover:hsla(151, 50%, 53%, 1);--colorPress:hsla(136, 73%, 94%, 1);--colorFocus:hsla(151, 50%, 53%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(134, 73%, 94%, 0.2);--background:hsla(154, 48%, 13%, 1);--backgroundHover:hsla(155, 50%, 15%, 1);--backgroundPress:hsla(155, 46%, 11%, 1);--backgroundFocus:hsla(155, 46%, 11%, 1);--borderColor:hsla(153, 51%, 22%, 1);--borderColorHover:hsla(151, 52%, 28%, 1);--borderColorFocus:hsla(153, 51%, 22%, 1);--borderColorPress:hsla(154, 51%, 18%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_green_Button, .t_green_SliderTrackActive {--color:hsla(136, 73%, 94%, 1);--colorHover:hsla(151, 50%, 53%, 1);--colorPress:hsla(136, 73%, 94%, 1);--colorFocus:hsla(151, 50%, 53%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(134, 73%, 94%, 0.2);--background:hsla(154, 48%, 13%, 1);--backgroundHover:hsla(155, 50%, 15%, 1);--backgroundPress:hsla(155, 46%, 11%, 1);--backgroundFocus:hsla(155, 46%, 11%, 1);--borderColor:hsla(153, 51%, 22%, 1);--borderColorHover:hsla(151, 52%, 28%, 1);--borderColorFocus:hsla(153, 51%, 22%, 1);--borderColorPress:hsla(154, 51%, 18%, 1);}
+  }
+:root.t_dark .t_green_Checkbox, :root.t_dark .t_green_RadioGroupItem, :root.t_dark .t_green_Switch, :root.t_dark .t_green_TooltipContent, :root.t_light .t_dark .t_green_Checkbox, :root.t_light .t_dark .t_green_RadioGroupItem, :root.t_light .t_dark .t_green_Switch, :root.t_light .t_dark .t_green_TooltipContent, .tm_xxt {--color:hsla(136, 73%, 94%, 1);--colorHover:hsla(151, 50%, 53%, 1);--colorPress:hsla(136, 73%, 94%, 1);--colorFocus:hsla(151, 50%, 53%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(134, 73%, 94%, 0.2);--background:hsla(155, 46%, 11%, 1);--backgroundHover:hsla(154, 48%, 13%, 1);--backgroundPress:hsla(155, 44%, 8%, 1);--backgroundFocus:hsla(155, 44%, 8%, 1);--borderColor:hsla(154, 51%, 18%, 1);--borderColorHover:hsla(153, 51%, 22%, 1);--borderColorFocus:hsla(154, 51%, 18%, 1);--borderColorPress:hsla(155, 50%, 15%, 1);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_green_Checkbox, .t_green_RadioGroupItem, .t_green_Switch, .t_green_TooltipContent {--color:hsla(136, 73%, 94%, 1);--colorHover:hsla(151, 50%, 53%, 1);--colorPress:hsla(136, 73%, 94%, 1);--colorFocus:hsla(151, 50%, 53%, 1);--placeholderColor:hsla(151, 55%, 42%, 1);--outlineColor:hsla(134, 73%, 94%, 0.2);--background:hsla(155, 46%, 11%, 1);--backgroundHover:hsla(154, 48%, 13%, 1);--backgroundPress:hsla(155, 44%, 8%, 1);--backgroundFocus:hsla(155, 44%, 8%, 1);--borderColor:hsla(154, 51%, 18%, 1);--borderColorHover:hsla(153, 51%, 22%, 1);--borderColorFocus:hsla(154, 51%, 18%, 1);--borderColorPress:hsla(155, 50%, 15%, 1);}
+  }
+:root.t_dark .t_green_ProgressIndicator, :root.t_dark .t_green_SliderThumb, :root.t_dark .t_green_SwitchThumb, :root.t_dark .t_green_Tooltip, :root.t_light .t_dark .t_green_ProgressIndicator, :root.t_light .t_dark .t_green_SliderThumb, :root.t_light .t_dark .t_green_SwitchThumb, :root.t_light .t_dark .t_green_Tooltip, .tm_xxt {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(134, 73%, 94%, 0);--background02:hsla(134, 73%, 94%, 0.2);--background04:hsla(134, 73%, 94%, 0.4);--background06:hsla(134, 73%, 94%, 0.6);--background08:hsla(134, 73%, 94%, 0.8);--color1:hsla(136, 73%, 94%, 1);--color2:hsla(151, 50%, 53%, 1);--color3:hsla(151, 49%, 46%, 1);--color4:hsla(151, 55%, 42%, 1);--color5:hsla(151, 52%, 28%, 1);--color6:hsla(153, 51%, 22%, 1);--color7:hsla(154, 51%, 18%, 1);--color8:hsla(155, 50%, 15%, 1);--color9:hsla(154, 48%, 13%, 1);--color10:hsla(155, 46%, 11%, 1);--color11:hsla(155, 44%, 8%, 1);--color12:hsla(145, 32%, 7%, 1);--color0:hsla(145, 33%, 7%, 0);--color02:hsla(145, 33%, 7%, 0.2);--color04:hsla(145, 33%, 7%, 0.4);--color06:hsla(145, 33%, 7%, 0.6);--color08:hsla(145, 33%, 7%, 0.8);--background:hsla(136, 73%, 94%, 1);--backgroundHover:hsla(151, 50%, 53%, 1);--backgroundPress:hsla(134, 73%, 94%, 0.8);--backgroundFocus:hsla(134, 73%, 94%, 0.8);--borderColor:hsla(151, 55%, 42%, 1);--borderColorHover:hsla(151, 52%, 28%, 1);--borderColorPress:hsla(151, 49%, 46%, 1);--borderColorFocus:hsla(151, 55%, 42%, 1);--color:hsla(145, 32%, 7%, 1);--colorHover:hsla(155, 44%, 8%, 1);--colorPress:hsla(145, 32%, 7%, 1);--colorFocus:hsla(155, 44%, 8%, 1);--placeholderColor:hsla(154, 48%, 13%, 1);--outlineColor:hsla(145, 33%, 7%, 0.2);--colorTransparent:hsla(145, 33%, 7%, 0);}
+@media(prefers-color-scheme:dark){
+    body{background:var(--background);color:var(--color)}
+    .t_green_ProgressIndicator, .t_green_SliderThumb, .t_green_SwitchThumb, .t_green_Tooltip {--accentBackground:hsla(0, 0%, 93%, 1);--accentColor:hsla(0, 0%, 50%, 1);--background0:hsla(134, 73%, 94%, 0);--background02:hsla(134, 73%, 94%, 0.2);--background04:hsla(134, 73%, 94%, 0.4);--background06:hsla(134, 73%, 94%, 0.6);--background08:hsla(134, 73%, 94%, 0.8);--color1:hsla(136, 73%, 94%, 1);--color2:hsla(151, 50%, 53%, 1);--color3:hsla(151, 49%, 46%, 1);--color4:hsla(151, 55%, 42%, 1);--color5:hsla(151, 52%, 28%, 1);--color6:hsla(153, 51%, 22%, 1);--color7:hsla(154, 51%, 18%, 1);--color8:hsla(155, 50%, 15%, 1);--color9:hsla(154, 48%, 13%, 1);--color10:hsla(155, 46%, 11%, 1);--color11:hsla(155, 44%, 8%, 1);--color12:hsla(145, 32%, 7%, 1);--color0:hsla(145, 33%, 7%, 0);--color02:hsla(145, 33%, 7%, 0.2);--color04:hsla(145, 33%, 7%, 0.4);--color06:hsla(145, 33%, 7%, 0.6);--color08:hsla(145, 33%, 7%, 0.8);--background:hsla(136, 73%, 94%, 1);--backgroundHover:hsla(151, 50%, 53%, 1);--backgroundPress:hsla(134, 73%, 94%, 0.8);--backgroundFocus:hsla(134, 73%, 94%, 0.8);--borderColor:hsla(151, 55%, 42%, 1);--borderColorHover:hsla(151, 52%, 28%, 1);--borderColorPress:hsla(151, 49%, 46%, 1);--borderColorFocus:hsla(151, 55%, 42%, 1);--color:hsla(145, 32%, 7%, 1);--colorHover:hsla(155, 44%, 8%, 1);--colorPress:hsla(145, 32%, 7%, 1);--colorFocus:hsla(155, 44%, 8%, 1);--placeholderColor:hsla(154, 48%, 13%, 1);--outlineColor:hsla(145, 33%, 7%, 0.2);--colorTransparent:hsla(145, 33%, 7%, 0);}
+  }
+.t_dark_green_SwitchThumb ::selection, .t_dark_green_SliderThumb ::selection, .t_dark_green_Tooltip ::selection, .t_dark_green_ProgressIndicator ::selection{background:var(--color5);color:var(--color11)}
+  
--- a/apps/next/public/vercel.svg
+++ b/apps/next/public/vercel.svg
@@ -0,0 +1,4 @@
+<svg width="283" height="64" viewBox="0 0 283 64" fill="none" 
+    xmlns="http://www.w3.org/2000/svg">
+    <path d="M141.04 16c-11.04 0-19 7.2-19 18s8.96 18 20 18c6.67 0 12.55-2.64 16.19-7.09l-7.65-4.42c-2.02 2.21-5.09 3.5-8.54 3.5-4.79 0-8.86-2.5-10.37-6.5h28.02c.22-1.12.35-2.28.35-3.5 0-10.79-7.96-17.99-19-17.99zm-9.46 14.5c1.25-3.99 4.67-6.5 9.45-6.5 4.79 0 8.21 2.51 9.45 6.5h-18.9zM248.72 16c-11.04 0-19 7.2-19 18s8.96 18 20 18c6.67 0 12.55-2.64 16.19-7.09l-7.65-4.42c-2.02 2.21-5.09 3.5-8.54 3.5-4.79 0-8.86-2.5-10.37-6.5h28.02c.22-1.12.35-2.28.35-3.5 0-10.79-7.96-17.99-19-17.99zm-9.45 14.5c1.25-3.99 4.67-6.5 9.45-6.5 4.79 0 8.21 2.51 9.45 6.5h-18.9zM200.24 34c0 6 3.92 10 10 10 4.12 0 7.21-1.87 8.8-4.92l7.68 4.43c-3.18 5.3-9.14 8.49-16.48 8.49-11.05 0-19-7.2-19-18s7.96-18 19-18c7.34 0 13.29 3.19 16.48 8.49l-7.68 4.43c-1.59-3.05-4.68-4.92-8.8-4.92-6.07 0-10 4-10 10zm82.48-29v46h-9V5h9zM36.95 0L73.9 64H0L36.95 0zm92.38 5l-27.71 48L73.91 5H84.3l17.32 30 17.32-30h10.39zm58.91 12v9.69c-1-.29-2.06-.49-3.2-.49-5.81 0-10 4-10 10V51h-9V17h9v9.2c0-5.08 5.91-9.2 13.2-9.2z" fill="#000"/>
+</svg>
--- a/apps/next/tsconfig.json
+++ b/apps/next/tsconfig.json
@@ -0,0 +1,29 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "baseUrl": ".",
+    "paths": {
+      "react-native": ["react-native-web"]
+    },
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ]
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}
--- a/apps/next/types.d.ts
+++ b/apps/next/types.d.ts
@@ -0,0 +1,7 @@
+import { config } from '@my/config'
+
+export type Conf = typeof config
+
+declare module '@my/ui' {
+  interface TamaguiCustomConfig extends Conf {}
+}
--- a/apps/next/vercel.json
+++ b/apps/next/vercel.json
@@ -0,0 +1,3 @@
+{
+  "installCommand": "yarn set version 4 && yarn install"
+}
--- a/apps/next/vitest.config.mts
+++ b/apps/next/vitest.config.mts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'vitest/config'
+
+export default defineConfig({
+  test: {
+    poolOptions: {
+      threads: {
+        singleThread: true,
+      },
+    },
+  },
+})
--- a/biome.json
+++ b/biome.json
@@ -0,0 +1,113 @@
+{
+  "$schema": "https://biomejs.dev/schemas/1.9.3/schema.json",
+  "organizeImports": {
+    "enabled": false
+  },
+  "linter": {
+    "enabled": true,
+    "ignore": [
+      ".tamagui",
+      "*/ios/**",
+      ".vscode",
+      "**/tamagui.css",
+      "**/*.d.ts",
+      "packages/vendor/**",
+      "packages/**/vendor/**",
+      "**/tsconfig.json",
+      "**/dist/**",
+      "**/package.json",
+      ".codesandbox",
+      "tsconfig.base.json"
+    ],
+
+    "rules": {
+      "correctness": {
+        "useExhaustiveDependencies": "off",
+        "noInnerDeclarations": "off",
+        "noUnnecessaryContinue": "off",
+        "noConstructorReturn": "off"
+      },
+      "suspicious": {
+        "noImplicitAnyLet": "off",
+        "noConfusingVoidType": "off",
+        "noEmptyInterface": "off",
+        "noExplicitAny": "off",
+        "noArrayIndexKey": "off",
+        "noDoubleEquals": "off",
+        "noConsoleLog": "error",
+        "noAssignInExpressions": "off",
+        "noRedeclare": "off"
+      },
+      "style": {
+        "noParameterAssign": "off",
+        "noNonNullAssertion": "off",
+        "noArguments": "off",
+        "noUnusedTemplateLiteral": "off",
+        "useDefaultParameterLast": "off",
+        "useConst": "off",
+        "useEnumInitializers": "off",
+        "useTemplate": "off",
+        "useSelfClosingElements": "off",
+        "useImportType": "error"
+      },
+      "security": {
+        "noDangerouslySetInnerHtml": "off",
+        "noDangerouslySetInnerHtmlWithChildren": "off"
+      },
+      "performance": {
+        "noDelete": "off",
+        "noAccumulatingSpread": "off"
+      },
+      "complexity": {
+        "noForEach": "off",
+        "noBannedTypes": "off",
+        "noUselessFragments": "off",
+        "useLiteralKeys": "off",
+        "useSimplifiedLogicExpression": "off",
+        "useOptionalChain": "off"
+      },
+      "a11y": {
+        "noSvgWithoutTitle": "off",
+        "useMediaCaption": "off",
+        "noHeaderScope": "off",
+        "useAltText": "off",
+        "useButtonType": "off"
+      }
+    }
+  },
+  "formatter": {
+    "enabled": true,
+    "formatWithErrors": false,
+    "indentStyle": "space",
+    "indentWidth": 2,
+    "lineWidth": 100,
+    "attributePosition": "multiline",
+    "ignore": [
+      ".tamagui",
+      "**/ios/**",
+      ".vscode",
+      "**/tamagui.css",
+      "**/*.d.ts",
+      "packages/vendor/**",
+      "packages/**/vendor/**",
+      "**/tsconfig.json",
+      "**/dist/**",
+      "**/package.json",
+      ".codesandbox",
+      "tsconfig.base.json"
+    ]
+  },
+  "javascript": {
+    "formatter": {
+      "trailingCommas": "es5",
+      "jsxQuoteStyle": "double",
+      "semicolons": "asNeeded",
+      "quoteStyle": "single"
+    }
+  },
+  "vcs": {
+    "enabled": true,
+    "clientKind": "git",
+    "useIgnoreFile": true
+  }
+}
--- a/eas.json
+++ b/eas.json
@@ -0,0 +1,21 @@
+{
+  "cli": {
+    "version": ">= 16.17.4",
+    "appVersionSource": "remote"
+  },
+  "build": {
+    "development": {
+      "developmentClient": true,
+      "distribution": "internal"
+    },
+    "preview": {
+      "distribution": "internal"
+    },
+    "production": {
+      "autoIncrement": true
+    }
+  },
+  "submit": {
+    "production": {}
+  }
+}
--- a/package.json
+++ b/package.json
@@ -0,0 +1,56 @@
+{
+  "name": "app-template",
+  "private": true,
+  "workspaces": [
+    "./apps/*",
+    "./packages/*"
+  ],
+  "scripts": {
+    "native": "cd apps/expo && yarn start",
+    "native:prebuild": "cd apps/expo && yarn prebuild",
+    "ios": "cd apps/expo && yarn ios",
+    "android": "cd apps/expo && yarn android",
+    "watch": "ultra -r --no-pretty --concurrency 400 watch",
+    "vercel:install": "yarn set version 3.5 && yarn install",
+    "web": "yarn build && cd apps/next && yarn next",
+    "web:extract": "DISABLE_EXTRACTION=false yarn workspace next-app dev",
+    "web:prod": "yarn workspace next-app build",
+    "web:prod:serve": "yarn workspace next-app serve",
+    "postinstall": "yarn check-tamagui && yarn build",
+    "build": "yarn workspaces foreach --all --exclude next-app run build",
+    "upgrade:tamagui": "yarn up '*tamagui*'@latest '@tamagui/*'@latest",
+    "upgrade:tamagui:canary": "yarn up '*tamagui*'@canary '@tamagui/*'@canary",
+    "check-tamagui": "tamagui check",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "prepare": "husky"
+  },
+  "resolutions": {
+    "react": "19.0.0",
+    "react-dom": "19.0.0",
+    "react-refresh": "^0.14.0",
+    "react-native-svg": "15.11.2",
+    "react-native-web": "~0.19.12"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.24.6",
+    "@tamagui/cli": "^1.132.18",
+    "check-dependency-version-consistency": "^4.1.0",
+    "eslint": "^9.3.0",
+    "expo-sqlite": "~15.2.14",
+    "husky": "^9.1.6",
+    "prettier": "^3.3.3",
+    "turbo": "^1.13.4",
+    "typescript": "~5.8.3",
+    "ultra-runner": "^3.10.5",
+    "vitest": "^2.1.1"
+  },
+  "packageManager": "yarn@4.5.0",
+  "engines": {
+    "node": "22",
+    "npm": "10.8"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "^1.9.3"
+  }
+}
--- a/packages/app/.gitignore
+++ b/packages/app/.gitignore
@@ -0,0 +1,3 @@
+node_modules/
+.DS_Store
+THUMBS_DB
--- a/packages/app/features/home/screen.tsx
+++ b/packages/app/features/home/screen.tsx
@@ -0,0 +1,127 @@
+import {
+  Anchor,
+  Button,
+  H1,
+  Paragraph,
+  Separator,
+  Sheet,
+  SwitchRouterButton,
+  SwitchThemeButton,
+  useToastController,
+  XStack,
+  YStack
+} from '@my/ui'
+import { ChevronDown, ChevronUp } from '@tamagui/lucide-icons'
+import { useState } from 'react'
+import { Platform } from 'react-native'
+import { useLink } from 'solito/navigation'
+
+export function HomeScreen({ pagesMode = false }: { pagesMode?: boolean }) {
+  const linkTarget = pagesMode ? '/pages-example-user' : '/user'
+  const linkProps = useLink({
+    href: `${linkTarget}/nate`,
+  })
+
+  return (
+    <YStack flex={1} justify="center" items="center" gap="$8" p="$4" bg="$background">      
+      <XStack
+        position="absolute"
+        width="100%"
+        t="$6"
+        gap="$6"
+        justify="center"
+        flexWrap="wrap"
+        $sm={{ position: 'relative', t: 0 }}
+      >
+        {Platform.OS === 'web' && (
+          <>
+            <SwitchRouterButton pagesMode={pagesMode} />
+            <SwitchThemeButton />
+          </>
+        )}
+      </XStack>
+
+      <YStack gap="$4">
+        <H1 text="center" color="$color12">
+          Welcome to Tamagui.
+        </H1>
+        <Paragraph color="$color10" text="center">
+          Here's a basic starter to show navigating from one screen to another.
+        </Paragraph>
+        <Separator />
+        <Paragraph text="center">
+          This screen uses the same code on Next.js and React Native.
+        </Paragraph>
+        <Separator />
+      </YStack>
+
+      <Button {...linkProps}>Link to user</Button>
+
+      <SheetDemo />
+    </YStack>
+  )
+}
+
+function SheetDemo() {
+  const toast = useToastController()
+
+  const [open, setOpen] = useState(false)
+  const [position, setPosition] = useState(0)
+
+  return (
+    <>
+      <Button
+        size="$6"
+        icon={open ? ChevronDown : ChevronUp}
+        circular
+        onPress={() => setOpen((x) => !x)}
+      />
+      <Sheet
+        modal
+        animation="medium"
+        open={open}
+        onOpenChange={setOpen}
+        snapPoints={[80]}
+        position={position}
+        onPositionChange={setPosition}
+        dismissOnSnapToBottom
+      >
+        <Sheet.Overlay
+          bg="$shadow4"
+          animation="lazy"
+          enterStyle={{ opacity: 0 }}
+          exitStyle={{ opacity: 0 }}
+        />
+        <Sheet.Handle bg="$color8" />
+        <Sheet.Frame items="center" justify="center" gap="$10" bg="$color2">
+          <XStack gap="$2">
+            <Paragraph text="center">Made by</Paragraph>
+            <Anchor color="$blue10" href="https://twitter.com/natebirdman" target="_blank">
+              @natebirdman,
+            </Anchor>
+            <Anchor
+              color="$blue10"
+              href="https://github.com/tamagui/tamagui"
+              target="_blank"
+              rel="noreferrer"
+            >
+              give it a ⭐️
+            </Anchor>
+          </XStack>
+
+          <Button
+            size="$6"
+            circular
+            icon={ChevronDown}
+            onPress={() => {
+              setOpen(false)
+              toast.show('Sheet closed!', {
+                message: 'Just showing how toast works...',
+              })
+            }}
+          />
+        </Sheet.Frame>
+      </Sheet>
+    </>
+  )
+}
--- a/packages/app/features/user/detail-screen.tsx
+++ b/packages/app/features/user/detail-screen.tsx
@@ -0,0 +1,18 @@
+import { Button, Paragraph, YStack } from '@my/ui'
+import { ChevronLeft } from '@tamagui/lucide-icons'
+import { useRouter } from 'solito/navigation'
+
+export function UserDetailScreen({ id }: { id: string }) {
+  const router = useRouter()
+  if (!id) {
+    return null
+  }
+  return (
+    <YStack flex={1} justify="center" items="center" gap="$4" bg="$background">
+      <Paragraph text="center" fontWeight="700" color="$blue10">{`User ID: ${id}`}</Paragraph>
+      <Button icon={ChevronLeft} onPress={() => router.back()}>
+        Go Home
+      </Button>
+    </YStack>
+  )
+}
--- a/packages/app/index.ts
+++ b/packages/app/index.ts
@@ -0,0 +1,4 @@
+// leave this blank
+// don't re-export files from this workspace. it'll break next.js tree shaking
+// https://github.com/vercel/next.js/issues/12557
+export {}
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -0,0 +1,28 @@
+{
+  "version": "0.0.0",
+  "name": "app",
+  "main": "index.ts",
+  "private": true,
+  "sideEffects": [
+    "*.css"
+  ],
+  "dependencies": {
+    "@my/ui": "0.0.1",
+    "@react-navigation/native": "^6.1.17",
+    "@tamagui/animations-react-native": "^1.132.18",
+    "@tamagui/colors": "^1.132.18",
+    "@tamagui/font-inter": "^1.132.18",
+    "@tamagui/lucide-icons": "^1.132.18",
+    "@tamagui/shorthands": "^1.132.18",
+    "@tamagui/themes": "^1.132.18",
+    "burnt": "^0.12.2",
+    "expo-constants": "~17.1.6",
+    "expo-linking": "~7.1.4",
+    "react-native-safe-area-context": "5.4.0",
+    "solito": "^4.2.2"
+  },
+  "devDependencies": {
+    "@types/react": "~19.0.10",
+    "@types/react-native": "^0.73.0"
+  }
+}
--- a/packages/app/provider/NextTamaguiProvider.tsx
+++ b/packages/app/provider/NextTamaguiProvider.tsx
@@ -0,0 +1,64 @@
+'use client'
+
+import '@tamagui/core/reset.css'
+import '@tamagui/font-inter/css/400.css'
+import '@tamagui/font-inter/css/700.css'
+import '@tamagui/polyfill-dev'
+
+import type { ReactNode } from 'react'
+import { useServerInsertedHTML } from 'next/navigation'
+import { NextThemeProvider, useRootTheme } from '@tamagui/next-theme'
+import { config } from '@my/ui'
+import { Provider } from 'app/provider'
+import { StyleSheet } from 'react-native'
+
+export const NextTamaguiProvider = ({ children }: { children: ReactNode }) => {
+  const [theme, setTheme] = useRootTheme()
+
+  useServerInsertedHTML(() => {
+    // @ts-ignore
+    const rnwStyle = StyleSheet.getSheet()
+    return (
+      <>
+        <link rel="stylesheet" href="/tamagui.css" />
+        <style dangerouslySetInnerHTML={{ __html: rnwStyle.textContent }} id={rnwStyle.id} />
+        <style
+          dangerouslySetInnerHTML={{
+            // the first time this runs you'll get the full CSS including all themes
+            // after that, it will only return CSS generated since the last call
+            __html: config.getNewCSS(),
+          }}
+        />
+
+        <style
+          dangerouslySetInnerHTML={{
+            __html: config.getCSS({
+              exclude: process.env.NODE_ENV === 'production' ? 'design-system' : null,
+            }),
+          }}
+        />
+
+        <script
+          dangerouslySetInnerHTML={{
+            // avoid flash of animated things on enter:
+            __html: `document.documentElement.classList.add('t_unmounted')`,
+          }}
+        />
+      </>
+    )
+  })
+
+  return (
+    <NextThemeProvider
+      skipNextHead
+      defaultTheme="light"
+      onChangeTheme={(next) => {
+        setTheme(next as any)
+      }}
+    >
+      <Provider disableRootThemeClass defaultTheme={theme || 'light'}>
+        {children}
+      </Provider>
+    </NextThemeProvider>
+  )
+}
--- a/packages/app/provider/ToastViewport.tsx
+++ b/packages/app/provider/ToastViewport.tsx
@@ -0,0 +1,11 @@
+import { ToastViewport as ToastViewportOg } from '@my/ui'
+
+export const ToastViewport = () => {
+  return (
+    <ToastViewportOg
+      top="$8"
+      left={0}
+      right={0}
+    />
+  )
+}
--- a/packages/app/provider/ToastViewport.web.tsx
+++ b/packages/app/provider/ToastViewport.web.tsx
@@ -0,0 +1,11 @@
+import { ToastViewport as ToastViewportOg } from '@my/ui'
+
+export const ToastViewport = () => {
+  return (
+    <ToastViewportOg
+      left={0}
+      right={0}
+      top={10}
+    />
+  )
+}
--- a/packages/app/provider/index.tsx
+++ b/packages/app/provider/index.tsx
@@ -0,0 +1,29 @@
+import { useColorScheme } from 'react-native'
+import {
+  CustomToast,
+  TamaguiProvider,
+  type TamaguiProviderProps,
+  ToastProvider,
+  config,
+  isWeb,
+} from '@my/ui'
+import { ToastViewport } from './ToastViewport'
+
+export function Provider({
+  children,
+  defaultTheme = 'light',
+  ...rest
+}: Omit<TamaguiProviderProps, 'config'> & { defaultTheme?: string }) {
+  const colorScheme = useColorScheme()
+  const theme = defaultTheme || (colorScheme === 'dark' ? 'dark' : 'light')
+
+  return (
+    <TamaguiProvider config={config} defaultTheme={theme} {...rest}>
+      <ToastProvider swipeDirection="horizontal" duration={6000} native={isWeb ? [] : ['mobile']}>
+        {children}
+        <CustomToast />
+        <ToastViewport />
+      </ToastProvider>
+    </TamaguiProvider>
+  )
+}
--- a/packages/app/provider/safe-area/index.tsx
+++ b/packages/app/provider/safe-area/index.tsx
@@ -0,0 +1 @@
+export { SafeAreaProvider as SafeArea } from 'react-native-safe-area-context'
--- a/packages/app/provider/safe-area/index.web.tsx
+++ b/packages/app/provider/safe-area/index.web.tsx
@@ -0,0 +1,10 @@
+// on Web, we don't use React Navigation, so we are going to avoid the safe area provider
+// instead, we just have a no-op here
+// for more, see: https://solito.dev/recipes/tree-shaking
+
+// if you need safe area hooks yourself, you can implement this yourself
+// however, you may be better off using the CSS selector for env(safe-area-inset-top) on Web
+
+// for more, see the `./use-safe-area.web.ts` file
+
+export const SafeArea = ({ children }: { children: React.ReactElement }) => <>{children}</>
--- a/packages/app/provider/safe-area/use-safe-area.ts
+++ b/packages/app/provider/safe-area/use-safe-area.ts
@@ -0,0 +1,6 @@
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
+
+const useSafeArea = useSafeAreaInsets
+
+// `export { useSafeAreaInsets as useSafeArea }` breaks autoimport, so do this instead
+export { useSafeArea }
--- a/packages/app/provider/safe-area/use-safe-area.web.ts
+++ b/packages/app/provider/safe-area/use-safe-area.web.ts
@@ -0,0 +1,31 @@
+// I don't use the real useSafeAreaInsets() hook, since
+// 1) the SafeAreaProvider forces you to render null on Web until it measures
+// 2) you might not need to support it, unless you're doing landscape stuff
+// 3) react-native-safe-area-context has a massive import on Web
+// see: https://github.com/th3rdwave/react-native-safe-area-context/pull/189#issuecomment-815274313
+// 4) most importantly, I think you can just use the env(safe-area-inset-bottom) CSS variable instead
+// after all, safe area code is few-and-far-between, so if you have to write some platform-speciifc code for it,
+// that is probably better than a massive bundle size for little benefit
+
+import type { useSafeArea as nativeHook } from './use-safe-area'
+
+const area = {
+  bottom: 0,
+  left: 0,
+  right: 0,
+  top: 0,
+
+  // you could also use CSS env variables like below:
+  // but you'll have to be sure to override the types for `useSafeArea`
+  // and make sure to never add numbers and strings when you consue useSafeArea
+  // just keep in mind that the env() doesn't work on older browsers I think
+
+  // top: `env(safe-area-inset-top)`,
+  // right: `env(safe-area-inset-right)`,
+  // bottom: `env(safe-area-inset-bottom)`,
+  // left: `env(safe-area-inset-left)`,
+}
+
+export function useSafeArea(): ReturnType<typeof nativeHook> {
+  return area
+}
--- a/packages/app/tsconfig.json
+++ b/packages/app/tsconfig.json
@@ -0,0 +1,13 @@
+{
+  "extends": "../../tsconfig.base",
+  "include": ["**/*.ts", "**/*.tsx"],
+  "compilerOptions": {
+    "composite": true,
+    "jsx": "react-jsx",
+    "paths": {
+      "app/*": ["./packages/app/*"],
+      "@my/ui/*": ["./packages/ui/*"]
+    }
+  },
+  "references": []
+}
--- a/packages/app/types.d.ts
+++ b/packages/app/types.d.ts
@@ -0,0 +1,7 @@
+import { config } from '@my/config'
+
+export type Conf = typeof config
+
+declare module '@my/ui' {
+  interface TamaguiCustomConfig extends Conf {}
+}
--- a/packages/config/package.json
+++ b/packages/config/package.json
@@ -0,0 +1,28 @@
+{
+  "name": "@my/config",
+  "version": "0.0.1",
+  "sideEffects": [
+    "*.css"
+  ],
+  "private": true,
+  "types": "./src",
+  "main": "src/index.ts",
+  "files": [
+    "types",
+    "dist"
+  ],
+  "scripts": {
+    "build": "tamagui-build --skip-types",
+    "watch": "tamagui-build --skip-types --watch"
+  },
+  "dependencies": {
+    "@tamagui/animations-react-native": "^1.132.18",
+    "@tamagui/font-inter": "^1.132.18",
+    "@tamagui/shorthands": "^1.132.18",
+    "@tamagui/themes": "^1.132.18",
+    "tamagui": "^1.132.18"
+  },
+  "devDependencies": {
+    "@tamagui/build": "^1.132.18"
+  }
+}
--- a/packages/config/src/animations.ts
+++ b/packages/config/src/animations.ts
@@ -0,0 +1,36 @@
+import { createAnimations } from '@tamagui/animations-react-native'
+
+export const animations = createAnimations({
+  '100ms': {
+    type: 'timing',
+    duration: 100,
+  },
+  bouncy: {
+    damping: 9,
+    mass: 0.9,
+    stiffness: 150,
+  },
+  lazy: {
+    damping: 18,
+    stiffness: 50,
+  },
+  medium: {
+    damping: 15,
+    stiffness: 120,
+    mass: 1,
+  },
+  slow: {
+    damping: 15,
+    stiffness: 40,
+  },
+  quick: {
+    damping: 20,
+    mass: 1.2,
+    stiffness: 250,
+  },
+  tooltip: {
+    damping: 10,
+    mass: 0.9,
+    stiffness: 100,
+  },
+})
--- a/packages/config/src/fonts.ts
+++ b/packages/config/src/fonts.ts
@@ -0,0 +1,45 @@
+import { createInterFont } from '@tamagui/font-inter'
+
+export const headingFont = createInterFont({
+  size: {
+    6: 15,
+  },
+  transform: {
+    6: 'uppercase',
+    7: 'none',
+  },
+  weight: {
+    6: '400',
+    7: '700',
+  },
+  color: {
+    6: '$colorFocus',
+    7: '$color',
+  },
+  letterSpacing: {
+    5: 2,
+    6: 1,
+    7: 0,
+    8: -1,
+    9: -2,
+    10: -3,
+    12: -4,
+    14: -5,
+    15: -6,
+  },
+  face: {
+    700: { normal: 'InterBold' },
+  },
+})
+
+export const bodyFont = createInterFont(
+  {
+    face: {
+      700: { normal: 'InterBold' },
+    },
+  },
+  {
+    sizeSize: (size) => Math.round(size * 1.1),
+    sizeLineHeight: (size) => Math.round(size * 1.1 + (size > 20 ? 10 : 10)),
+  }
+)
--- a/packages/config/src/index.ts
+++ b/packages/config/src/index.ts
@@ -0,0 +1 @@
+export * from './tamagui.config'
--- a/packages/config/src/tamagui.config.ts
+++ b/packages/config/src/tamagui.config.ts
@@ -0,0 +1,17 @@
+import { defaultConfig } from '@tamagui/config/v4'
+import { createTamagui } from 'tamagui'
+import { bodyFont, headingFont } from './fonts'
+import { animations } from './animations'
+
+export const config = createTamagui({
+  ...defaultConfig,
+  animations,
+  fonts: {
+    body: bodyFont,
+    heading: headingFont,
+  },
+  settings:{
+    ...defaultConfig.settings,
+    onlyAllowShorthands: false
+  }
+})
--- a/packages/ui/.gitignore
+++ b/packages/ui/.gitignore
@@ -0,0 +1,5 @@
+dist/
+.DS_Store
+THUMBS_DB
+node_modules/
+types/
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -0,0 +1,27 @@
+{
+  "name": "@my/ui",
+  "version": "0.0.1",
+  "sideEffects": [
+    "*.css"
+  ],
+  "private": true,
+  "types": "./src",
+  "main": "src/index.tsx",
+  "module:jsx": "src",
+  "files": [
+    "types",
+    "dist"
+  ],
+  "scripts": {
+    "build": "tamagui-build --skip-types",
+    "watch": "tamagui-build --skip-types --watch"
+  },
+  "dependencies": {
+    "@my/config": "0.0.1",
+    "@tamagui/toast": "^1.132.18",
+    "tamagui": "^1.132.18"
+  },
+  "devDependencies": {
+    "@tamagui/build": "^1.132.18"
+  }
+}
--- a/packages/ui/src/CustomToast.tsx
+++ b/packages/ui/src/CustomToast.tsx
@@ -0,0 +1,11 @@
+import Constants, { ExecutionEnvironment } from 'expo-constants'
+import { NativeToast as Toast } from './NativeToast'
+
+const isExpo = Constants.executionEnvironment === ExecutionEnvironment.StoreClient
+
+export const CustomToast = () => {
+  if (isExpo) {
+    return null
+  }
+  return <Toast />
+}
--- a/packages/ui/src/MyComponent.tsx
+++ b/packages/ui/src/MyComponent.tsx
@@ -0,0 +1,14 @@
+import { YStack, styled } from 'tamagui'
+
+export const MyComponent = styled(YStack, {
+  name: 'MyComponent',
+  bg: 'red',
+
+  variants: {
+    blue: {
+      true: {
+        bg: 'blue',
+      },
+    },
+  } as const,
+})
--- a/packages/ui/src/NativeToast.tsx
+++ b/packages/ui/src/NativeToast.tsx
@@ -0,0 +1,29 @@
+import { Toast, useToastState } from '@tamagui/toast'
+import { YStack } from 'tamagui'
+
+export const NativeToast = () => {
+  const currentToast = useToastState()
+
+  if (!currentToast || currentToast.isHandledNatively) {
+    return null
+  }
+
+  return (
+    <Toast
+      key={currentToast.id}
+      duration={currentToast.duration}
+      viewportName={currentToast.viewportName}
+      enterStyle={{ opacity: 0, scale: 0.5, y: -25 }}
+      exitStyle={{ opacity: 0, scale: 1, y: -20 }}
+      y={0}
+      opacity={1}
+      scale={1}
+      animation="quick"
+    >
+      <YStack py="$1.5" px="$2">
+        <Toast.Title lineHeight="$1">{currentToast.title}</Toast.Title>
+        {!!currentToast.message && <Toast.Description>{currentToast.message}</Toast.Description>}
+      </YStack>
+    </Toast>
+  )
+}
--- a/packages/ui/src/SwitchRouterButton.tsx
+++ b/packages/ui/src/SwitchRouterButton.tsx
@@ -0,0 +1,9 @@
+import { Anchor, Button } from 'tamagui'
+
+export const SwitchRouterButton = ({ pagesMode = false }: { pagesMode?: boolean }) => {
+  return (
+    <Anchor text="center" color="$color12" href={pagesMode ? '/' : '/pages-example'}>
+      <Button>Change router: {pagesMode ? 'pages' : 'app'}</Button>
+    </Anchor>
+  )
+}
--- a/packages/ui/src/SwitchThemeButton.tsx
+++ b/packages/ui/src/SwitchThemeButton.tsx
@@ -0,0 +1,16 @@
+import { useState } from 'react'
+import { Button, useIsomorphicLayoutEffect } from 'tamagui'
+import { useThemeSetting, useRootTheme } from '@tamagui/next-theme'
+
+export const SwitchThemeButton = () => {
+  const themeSetting = useThemeSetting()
+  const [theme] = useRootTheme()
+
+  const [clientTheme, setClientTheme] = useState<string | undefined>('light')
+
+  useIsomorphicLayoutEffect(() => {
+    setClientTheme(themeSetting.forcedTheme || themeSetting.current || theme)
+  }, [themeSetting.current, themeSetting.resolvedTheme])
+
+  return <Button onPress={themeSetting.toggle}>Change theme: {clientTheme}</Button>
+}
--- a/packages/ui/src/index.tsx
+++ b/packages/ui/src/index.tsx
@@ -0,0 +1,7 @@
+export * from 'tamagui'
+export * from '@tamagui/toast'
+export * from './MyComponent'
+export { config } from '@my/config'
+export * from './CustomToast'
+export * from './SwitchThemeButton'
+export * from './SwitchRouterButton'
--- a/packages/ui/src/types.d.ts
+++ b/packages/ui/src/types.d.ts
@@ -0,0 +1,7 @@
+import { config } from '@my/config'
+
+export type Conf = typeof config
+
+declare module 'tamagui' {
+  interface TamaguiCustomConfig extends Conf {}
+}
--- a/packages/ui/tsconfig.json
+++ b/packages/ui/tsconfig.json
@@ -0,0 +1,9 @@
+{
+  "extends": "../../tsconfig.base",
+  "include": ["**/*.ts", "**/*.tsx", "../config/src/tamagui.config.ts"],
+  "compilerOptions": {
+    "composite": true,
+    "jsx": "react-jsx"
+  },
+  "references": []
+}
--- a/tsconfig.base.json
+++ b/tsconfig.base.json
@@ -0,0 +1,35 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "rootDir": ".",
+    "importHelpers": true,
+    "allowJs": false,
+    "allowSyntheticDefaultImports": true,
+    "downlevelIteration": true,
+    "esModuleInterop": true,
+    "preserveSymlinks": true,
+    "incremental": true,
+    "jsx": "react-jsx",
+    "module": "system",
+    "moduleResolution": "node",
+    "noEmitOnError": false,
+    "noImplicitAny": false,
+    "noImplicitReturns": false,
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "useUnknownInCatchVariables": false,
+    "preserveConstEnums": true,
+    // DONT DO THIS so jsdoc will remain
+    "removeComments": false,
+    "skipLibCheck": true,
+    "sourceMap": false,
+    "strictNullChecks": true,
+    "target": "es2020",
+    "types": ["node"],
+    "lib": ["dom", "esnext"]
+  },
+  "exclude": ["_"],
+  "typeAcquisition": {
+    "enable": true
+  }
+}
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "esModuleInterop": true,
+    "strictNullChecks": true,
+    "noUncheckedIndexedAccess": true,
+    "paths": {
+      "app/*": ["./packages/app/*"],
+      "@my/ui/*": ["./packages/ui/*"]
+    }
+  },
+  "extends": "./tsconfig.base",
+  "exclude": [
+    "**/node_modules",
+    "**/dist",
+    "**/types",
+    "apps/next/out",
+    "apps/next/.next",
+    "apps/next/.tamagui"
+  ]
+}
--- a/turbo.json
+++ b/turbo.json
@@ -0,0 +1,15 @@
+{
+  "$schema": "https://turborepo.org/schema.json",
+  "globalEnv": ["DISABLE_EXTRACTION", "NODE_ENV", "EAS_BUILD_PLATFORM"],
+  "pipeline": {
+    "build": {
+      "env": ["DISABLE_EXTRACTION", "NODE_ENV", "EAS_BUILD_PLATFORM"],
+      "dependsOn": ["^build"],
+      "outputs": [".next/**", "!.next/cache/**", "build/**", "node_modules/.cache/metro/**"]
+    },
+    "dev": {
+      "cache": false,
+      "persistent": true
+    }
+  }
+}
--- a/vitest.config.mts
+++ b/vitest.config.mts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'vitest/config'
+
+export default defineConfig({
+  test: {
+    poolOptions: {
+      threads: {
+        singleThread: true,
+      },
+    },
+  },
+})
--- a/yarn.lock
+++ b/yarn.lock
				`@@ -0,0 +1 @@`
				`export { SafeAreaProvider as SafeArea } from 'react-native-safe-area-context'`