diff --git a/readme.md b/readme.md
index f768e33..4d2e8e2 100644
--- a/readme.md
+++ b/readme.md
@@ -1,8 +1,96 @@
-# React + Vite
+# React TMDB Client
 
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+A React Movies application using [The Movie Database (TMDb)](https://developers.themoviedb.org) API.
 
-Currently, two official plugins are available:
+## Quick Setup
 
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+1. **Clone the repository:**
+
+   ```bash
+   git clone https://github.com/pirateIV/react.movies.git
+   cd react-movies
+   ```
+
+2. **Create and configure the environment file:**
+
+   - Rename your `.env.sample` file to `.env`.
+
+3. **Obtain API keys:**
+
+   - Get your [TMDb API key](https://developers.themoviedb.org/3/getting-started/introduction).
+   - (Optional) Get your [YouTube API key](https://developers.google.com/youtube/v3/getting-started) for video data.
+
+4. **Enter the API keys into the `.env` file:**
+   ```env
+   VITE_TMDB_API_KEY=your_tmdb_api_key
+   VITE_YOUTUBE_API_KEY=your_youtube_api_key
+   ```
+
+## Running the Application
+
+1. **Install dependencies:**
+
+   ```bash
+   npm install
+   ```
+
+2. **Start the development server at `localhost:5173`:**
+   ```bash
+   npm run dev
+   ```
+
+## Project Structure
+
+```
+react-movies/
+├── .husky/                 # Husky config. for Git hooks.
+├── public/                 # Static files.
+├── src/                    # Source files.
+│   ├── assets/             # Assets like images, icons, etc.
+│   ├── components/         # React components.
+│   ├── config/             # Configuration files.
+│   ├── constants/          # Constants and enums.
+│   ├── pages/              # Application pages.
+│   ├── locales/            # Translations.
+│   ├── routes/             # Routes configuration.
+│   ├── services/           # Service utilities and API calls.
+├── .env.sample             # Sample environment variables.
+├── .gitignore              # Git ignore file.
+├── package.json            # NPM package configuration.
+├── README.md               # Project documentation.
+```
+
+## Available Scripts
+
+- `npm run dev`: Starts the development server.
+<!-- - `npm run build`: Builds the application for production.
+- `npm run lint`: Lints the code for errors and warnings.
+- `npm run test`: Runs the test suite. -->
+
+## API Integration Overview
+
+### TMDb API
+
+- **Base URL:** `https://api.themoviedb.org/3`
+- **Authentication:** API Key (stored in `.env` file)
+
+### YouTube API (Optional)
+
+- **Base URL:** `https://www.googleapis.com/youtube/v3`
+- **Authentication:** API Key (stored in `.env` file)
+
+## Contributing
+
+1. Fork the repository.
+2. Create your feature branch (`git checkout -b feature/YourFeature`).
+3. Commit your changes (`git commit -m 'Add some feature'`).
+4. Push to the branch (`git push origin feature/YourFeature`).
+5. Open a pull request.
+
+# Credits
+
+This project idea is gotten from the foundational work by [jason.codes](https://movies.jason.codes/)
+
+## License
+
+This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
diff --git a/src/assets/base.css b/src/assets/base.css
index 205e1d4..15042dc 100644
--- a/src/assets/base.css
+++ b/src/assets/base.css
@@ -13,47 +13,45 @@
   --un-translate-x: 0;
   --un-translate-y: 0;
   --un-translate-z: 0;
-  --un-pan-x: ;
-  --un-pan-y: ;
-  --un-pinch-zoom: ;
+  --un-pan-x:;
+  --un-pan-y:;
+  --un-pinch-zoom:;
   --un-scroll-snap-strictness: proximity;
-  --un-ordinal: ;
-  --un-slashed-zero: ;
-  --un-numeric-figure: ;
-  --un-numeric-spacing: ;
-  --un-numeric-fraction: ;
+  --un-ordinal:;
+  --un-slashed-zero:;
+  --un-numeric-figure:;
+  --un-numeric-spacing:;
+  --un-numeric-fraction:;
   --un-border-spacing-x: 0;
   --un-border-spacing-y: 0;
   --un-ring-offset-shadow: 0 0 transparent;
   --un-ring-shadow: 0 0 transparent;
-  --un-shadow-inset: ;
+  --un-shadow-inset:;
   --un-shadow: 0 0 transparent;
-  --un-ring-inset: ;
-  --un-ring-offset-width: 0px;
+  --un-ring-inset:;
+  --un-ring-offset-width: 0;
   --un-ring-offset-color: #fff;
-  --un-ring-width: 0px;
+  --un-ring-width: 0;
   --un-ring-color: rgba(147, 197, 253, 0.5);
-  --un-blur: ;
-  --un-brightness: ;
-  --un-contrast: ;
-  --un-drop-shadow: ;
-  --un-grayscale: ;
-  --un-hue-rotate: ;
-  --un-invert: ;
-  --un-saturate: ;
-  --un-sepia: ;
-  --un-backdrop-blur: ;
-  --un-backdrop-brightness: ;
-  --un-backdrop-contrast: ;
-  --un-backdrop-grayscale: ;
-  --un-backdrop-hue-rotate: ;
-  --un-backdrop-invert: ;
-  --un-backdrop-opacity: ;
-  --un-backdrop-saturate: ;
-  --un-backdrop-sepia: 
-;
-}
-
+  --un-blur:;
+  --un-brightness:;
+  --un-contrast:;
+  --un-drop-shadow:;
+  --un-grayscale:;
+  --un-hue-rotate:;
+  --un-invert:;
+  --un-saturate:;
+  --un-sepia:;
+  --un-backdrop-blur:;
+  --un-backdrop-brightness:;
+  --un-backdrop-contrast:;
+  --un-backdrop-grayscale:;
+  --un-backdrop-hue-rotate:;
+  --un-backdrop-invert:;
+  --un-backdrop-opacity:;
+  --un-backdrop-saturate:;
+  --un-backdrop-sepia:;
+}
 ::backdrop {
   --un-rotate: 0;
   --un-rotate-x: 0;
@@ -67,47 +65,45 @@
   --un-translate-x: 0;
   --un-translate-y: 0;
   --un-translate-z: 0;
-  --un-pan-x: ;
-  --un-pan-y: ;
-  --un-pinch-zoom: ;
+  --un-pan-x:;
+  --un-pan-y:;
+  --un-pinch-zoom:;
   --un-scroll-snap-strictness: proximity;
-  --un-ordinal: ;
-  --un-slashed-zero: ;
-  --un-numeric-figure: ;
-  --un-numeric-spacing: ;
-  --un-numeric-fraction: ;
+  --un-ordinal:;
+  --un-slashed-zero:;
+  --un-numeric-figure:;
+  --un-numeric-spacing:;
+  --un-numeric-fraction:;
   --un-border-spacing-x: 0;
   --un-border-spacing-y: 0;
   --un-ring-offset-shadow: 0 0 transparent;
   --un-ring-shadow: 0 0 transparent;
-  --un-shadow-inset: ;
+  --un-shadow-inset:;
   --un-shadow: 0 0 transparent;
-  --un-ring-inset: ;
-  --un-ring-offset-width: 0px;
+  --un-ring-inset:;
+  --un-ring-offset-width: 0;
   --un-ring-offset-color: #fff;
-  --un-ring-width: 0px;
+  --un-ring-width: 0;
   --un-ring-color: rgba(147, 197, 253, 0.5);
-  --un-blur: ;
-  --un-brightness: ;
-  --un-contrast: ;
-  --un-drop-shadow: ;
-  --un-grayscale: ;
-  --un-hue-rotate: ;
-  --un-invert: ;
-  --un-saturate: ;
-  --un-sepia: ;
-  --un-backdrop-blur: ;
-  --un-backdrop-brightness: ;
-  --un-backdrop-contrast: ;
-  --un-backdrop-grayscale: ;
-  --un-backdrop-hue-rotate: ;
-  --un-backdrop-invert: ;
-  --un-backdrop-opacity: ;
-  --un-backdrop-saturate: ;
-  --un-backdrop-sepia: 
-;
-}
-
+  --un-blur:;
+  --un-brightness:;
+  --un-contrast:;
+  --un-drop-shadow:;
+  --un-grayscale:;
+  --un-hue-rotate:;
+  --un-invert:;
+  --un-saturate:;
+  --un-sepia:;
+  --un-backdrop-blur:;
+  --un-backdrop-brightness:;
+  --un-backdrop-contrast:;
+  --un-backdrop-grayscale:;
+  --un-backdrop-hue-rotate:;
+  --un-backdrop-invert:;
+  --un-backdrop-opacity:;
+  --un-backdrop-saturate:;
+  --un-backdrop-sepia:;
+}
 @font-face {
   font-display: swap;
   font-family: DM Mono;
@@ -118,7 +114,6 @@
   unicode-range: u+0100-02af, u+0304, u+0308, u+0329, u+1e00-1e9f, u+1ef2-1eff,
     u+2020, u+20a0-20ab, u+20ad-20c0, u+2113, u+2c60-2c7f, u+a720-a7ff;
 }
-
 @font-face {
   font-display: swap;
   font-family: DM Mono;
@@ -130,7 +125,6 @@
     u+02dc, u+0304, u+0308, u+0329, u+2000-206f, u+2074, u+20ac, u+2122, u+2191,
     u+2193, u+2212, u+2215, u+feff, u+fffd;
 }
-
 @font-face {
   font-display: swap;
   font-family: DM Sans;
@@ -141,7 +135,6 @@
   unicode-range: u+0100-02af, u+0304, u+0308, u+0329, u+1e00-1e9f, u+1ef2-1eff,
     u+2020, u+20a0-20ab, u+20ad-20c0, u+2113, u+2c60-2c7f, u+a720-a7ff;
 }
-
 @font-face {
   font-display: swap;
   font-family: DM Sans;
@@ -153,7 +146,6 @@
     u+02dc, u+0304, u+0308, u+0329, u+2000-206f, u+2074, u+20ac, u+2122, u+2191,
     u+2193, u+2212, u+2215, u+feff, u+fffd;
 }
-
 @font-face {
   font-display: swap;
   font-family: "DM Serif Display";
@@ -164,7 +156,6 @@
   unicode-range: u+0100-02af, u+0304, u+0308, u+0329, u+1e00-1e9f, u+1ef2-1eff,
     u+2020, u+20a0-20ab, u+20ad-20c0, u+2113, u+2c60-2c7f, u+a720-a7ff;
 }
-
 @font-face {
   font-display: swap;
   font-family: "DM Serif Display";
@@ -176,7 +167,6 @@
     u+02dc, u+0304, u+0308, u+0329, u+2000-206f, u+2074, u+20ac, u+2122, u+2191,
     u+2193, u+2212, u+2215, u+feff, u+fffd;
 }
-
 .i-carbon-close,
 [i-carbon-close=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M17.414 16L24 9.414L22.586 8L16 14.586L9.414 8L8 9.414L14.586 16L8 22.586L9.414 24L16 17.414L22.586 24L24 22.586z'/%3E%3C/svg%3E");
@@ -189,7 +179,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-carbon\:circle-dash,
 [i-carbon\:circle-dash=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M7.7 4.7a14.7 14.7 0 0 0-3 3.1L6.3 9a13.26 13.26 0 0 1 2.6-2.7zm-3.1 7.6l-1.9-.6A12.51 12.51 0 0 0 2 16h2a11.48 11.48 0 0 1 .6-3.7m-1.9 8.1a14.4 14.4 0 0 0 2 3.9l1.6-1.2a12.89 12.89 0 0 1-1.7-3.3zm5.1 6.9a14.4 14.4 0 0 0 3.9 2l.6-1.9A12.89 12.89 0 0 1 9 25.7zm3.9-24.6l.6 1.9A11.48 11.48 0 0 1 16 4V2a12.51 12.51 0 0 0-4.3.7m12.5 24.6a15.18 15.18 0 0 0 3.1-3.1L25.7 23a11.53 11.53 0 0 1-2.7 2.7zm3.2-7.6l1.9.6A15.47 15.47 0 0 0 30 16h-2a11.48 11.48 0 0 1-.6 3.7m1.8-8.1a14.4 14.4 0 0 0-2-3.9l-1.6 1.2a12.89 12.89 0 0 1 1.7 3.3zm-5.1-7a14.4 14.4 0 0 0-3.9-2l-.6 1.9a12.89 12.89 0 0 1 3.3 1.7zm-3.8 24.7l-.6-1.9a11.48 11.48 0 0 1-3.7.6v2a21.42 21.42 0 0 0 4.3-.7'/%3E%3C/svg%3E");
@@ -202,7 +191,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-cib\:imdb,
 [i-cib\:imdb=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 32 32' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M19.078 12.786v.005c-.099-.063-.302-.094-.557-.094v6.422c.359 0 .583-.083.667-.224c.083-.135.125-.536.125-1.177v-3.823c0-.438-.005-.719-.042-.839c-.031-.13-.089-.219-.188-.271zM29.885 0H2.161A2.299 2.299 0 0 0 0 2.13v27.708c.078 1.167.948 2.057 2.073 2.156c.021.005.042.005.063.005h27.792a2.303 2.303 0 0 0 2.073-2.281V2.28a2.3 2.3 0 0 0-2.115-2.281zM6.391 20.833H3.849v-9.818h2.542zm8.718 0h-2.214v-6.63l-.896 6.625h-1.583l-.932-6.479l-.01 6.479H7.255v-9.813h3.286c.115.693.214 1.396.307 2.099l.359 2.49l.594-4.589h3.307zm6.636-2.906c0 .87-.057 1.458-.141 1.76a1.273 1.273 0 0 1-.432.693a1.632 1.632 0 0 1-.76.354c-.297.057-.76.099-1.359.099l-.005-.005h-3.073v-9.813h1.901c1.219 0 1.932.063 2.359.167c.432.12.766.302.995.563c.219.24.365.536.417.859c.068.313.099.938.099 1.87zm6.594.63c0 .599-.063 1.021-.12 1.323c-.083.297-.26.536-.542.755c-.302.224-.641.323-1.042.323c-.292 0-.667-.083-.906-.182a2.192 2.192 0 0 1-.688-.573l-.151.63h-2.292v-9.818l-.026-.005h2.401v3.198c.198-.234.422-.411.677-.531a2.62 2.62 0 0 1 .922-.172c.302 0 .599.047.88.156c.229.094.427.245.583.438c.12.167.198.359.24.563c.036.182.057.573.057 1.156v2.74zm-2.901-3.619c-.156 0-.255.057-.297.161c-.042.109-.078.385-.078.833v2.594c0 .432.036.714.078.833a.312.312 0 0 0 .302.177c.156 0 .359-.063.401-.188c.036-.13.057-.427.057-.896l.042-.005v-2.521c0-.401-.021-.677-.078-.802c-.063-.135-.26-.188-.422-.188z'/%3E%3C/svg%3E");
@@ -215,7 +203,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-caret-left-light,
 [i-ph-caret-left-light=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M164.24 203.76a6 6 0 1 1-8.48 8.48l-80-80a6 6 0 0 1 0-8.48l80-80a6 6 0 0 1 8.48 8.48L88.49 128Z'/%3E%3C/svg%3E");
@@ -228,7 +215,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-caret-right-light,
 [i-ph-caret-right-light=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m180.24 132.24l-80 80a6 6 0 0 1-8.48-8.48L167.51 128L91.76 52.24a6 6 0 0 1 8.48-8.48l80 80a6 6 0 0 1 0 8.48'/%3E%3C/svg%3E");
@@ -241,7 +227,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-envelope-simple,
 [i-ph-envelope-simple=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M224 48H32a8 8 0 0 0-8 8v136a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V56a8 8 0 0 0-8-8m-20.57 16L128 133.15L52.57 64ZM216 192H40V74.19l82.59 75.71a8 8 0 0 0 10.82 0L216 74.19z'/%3E%3C/svg%3E");
@@ -254,7 +239,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-film-strip {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M216 40H40a16 16 0 0 0-16 16v144a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V56a16 16 0 0 0-16-16M40 88h80v80H40Zm96-16V56h32v16Zm-16 0H88V56h32Zm0 112v16H88v-16Zm16 0h32v16h-32Zm0-16V88h80v80Zm80-96h-32V56h32ZM72 56v16H40V56ZM40 184h32v16H40Zm176 16h-32v-16h32z'/%3E%3C/svg%3E");
   background-color: currentColor;
@@ -266,7 +250,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-film-strip-fill {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M216 40H40a16 16 0 0 0-16 16v144a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V56a16 16 0 0 0-16-16m-32 16h32v16h-32ZM72 200H40v-16h32Zm0-128H40V56h32Zm48 128H88v-16h32Zm0-128H88V56h32Zm48 128h-32v-16h32Zm0-128h-32V56h32Zm48 128h-32v-16h32z'/%3E%3C/svg%3E");
   background-color: currentColor;
@@ -278,7 +261,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-house {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='m219.31 108.68l-80-80a16 16 0 0 0-22.62 0l-80 80A15.87 15.87 0 0 0 32 120v96a8 8 0 0 0 8 8h64a8 8 0 0 0 8-8v-56h32v56a8 8 0 0 0 8 8h64a8 8 0 0 0 8-8v-96a15.87 15.87 0 0 0-4.69-11.32M208 208h-48v-56a8 8 0 0 0-8-8h-48a8 8 0 0 0-8 8v56H48v-88l80-80l80 80Z'/%3E%3C/svg%3E");
   background-color: currentColor;
@@ -290,7 +272,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-house-fill {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M224 120v96a8 8 0 0 1-8 8h-56a8 8 0 0 1-8-8v-52a4 4 0 0 0-4-4h-40a4 4 0 0 0-4 4v52a8 8 0 0 1-8 8H40a8 8 0 0 1-8-8v-96a16 16 0 0 1 4.69-11.31l80-80a16 16 0 0 1 22.62 0l80 80A16 16 0 0 1 224 120'/%3E%3C/svg%3E");
   background-color: currentColor;
@@ -302,7 +283,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-link-simple,
 [i-ph-link-simple=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M165.66 90.34a8 8 0 0 1 0 11.32l-64 64a8 8 0 0 1-11.32-11.32l64-64a8 8 0 0 1 11.32 0M215.6 40.4a56 56 0 0 0-79.2 0l-30.06 30.05a8 8 0 0 0 11.32 11.32l30.06-30a40 40 0 0 1 56.57 56.56l-30.07 30.06a8 8 0 0 0 11.31 11.32l30.07-30.11a56 56 0 0 0 0-79.2m-77.26 133.82l-30.06 30.06a40 40 0 1 1-56.56-56.57l30.05-30.05a8 8 0 0 0-11.32-11.32L40.4 136.4a56 56 0 0 0 79.2 79.2l30.06-30.07a8 8 0 0 0-11.32-11.31'/%3E%3C/svg%3E");
@@ -315,7 +295,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-magnifying-glass,
 .i-ph\:magnifying-glass,
 [i-ph\:magnifying-glass=""] {
@@ -329,7 +308,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-magnifying-glass-fill {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M168 112a56 56 0 1 1-56-56a56 56 0 0 1 56 56m61.66 117.66a8 8 0 0 1-11.32 0l-50.06-50.07a88 88 0 1 1 11.32-11.31l50.06 50.06a8 8 0 0 1 0 11.32M112 184a72 72 0 1 0-72-72a72.08 72.08 0 0 0 72 72'/%3E%3C/svg%3E");
   background-color: currentColor;
@@ -341,7 +319,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-play,
 [i-ph-play=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M232.4 114.49L88.32 26.35a16 16 0 0 0-16.2-.3A15.86 15.86 0 0 0 64 39.87v176.26A15.94 15.94 0 0 0 80 232a16.07 16.07 0 0 0 8.36-2.35l144.04-88.14a15.81 15.81 0 0 0 0-27ZM80 215.94V40l143.83 88Z'/%3E%3C/svg%3E");
@@ -354,7 +331,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-play-circle-light,
 [i-ph-play-circle-light=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M128 26a102 102 0 1 0 102 102A102.12 102.12 0 0 0 128 26m0 192a90 90 0 1 1 90-90a90.1 90.1 0 0 1-90 90m47.18-95.09l-64-40A6 6 0 0 0 102 88v80a6 6 0 0 0 9.18 5.09l64-40a6 6 0 0 0 0-10.18M114 157.17V98.83L160.68 128Z'/%3E%3C/svg%3E");
@@ -367,7 +343,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-television-simple {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M216 64h-68.69l34.35-34.34a8 8 0 1 0-11.32-11.32L128 60.69L85.66 18.34a8 8 0 0 0-11.32 11.32L108.69 64H40a16 16 0 0 0-16 16v120a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V80a16 16 0 0 0-16-16m0 136H40V80h176z'/%3E%3C/svg%3E");
   background-color: currentColor;
@@ -379,7 +354,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph-television-simple-fill {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M216 64h-68.69l34.35-34.34a8 8 0 1 0-11.32-11.32L128 60.69L85.66 18.34a8 8 0 0 0-11.32 11.32L108.69 64H40a16 16 0 0 0-16 16v120a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V80a16 16 0 0 0-16-16m0 136H40V80h176zm-16-100v80a4 4 0 0 1-4 4H60a4 4 0 0 1-4-4v-80a4 4 0 0 1 4-4h136a4 4 0 0 1 4 4'/%3E%3C/svg%3E");
   background-color: currentColor;
@@ -391,7 +365,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph\:question,
 [i-ph\:question=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M140 180a12 12 0 1 1-12-12a12 12 0 0 1 12 12M128 72c-22.06 0-40 16.15-40 36v4a8 8 0 0 0 16 0v-4c0-11 10.77-20 24-20s24 9 24 20s-10.77 20-24 20a8 8 0 0 0-8 8v8a8 8 0 0 0 16 0v-.72c18.24-3.35 32-17.9 32-35.28c0-19.85-17.94-36-40-36m104 56A104 104 0 1 1 128 24a104.11 104.11 0 0 1 104 104m-16 0a88 88 0 1 0-88 88a88.1 88.1 0 0 0 88-88'/%3E%3C/svg%3E");
@@ -404,7 +377,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-ph\:user,
 [i-ph\:user=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 256 256' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M230.92 212c-15.23-26.33-38.7-45.21-66.09-54.16a72 72 0 1 0-73.66 0c-27.39 8.94-50.86 27.82-66.09 54.16a8 8 0 1 0 13.85 8c18.84-32.56 52.14-52 89.07-52s70.23 19.44 89.07 52a8 8 0 1 0 13.85-8M72 96a56 56 0 1 1 56 56a56.06 56.06 0 0 1-56-56'/%3E%3C/svg%3E");
@@ -417,7 +389,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-simple-icons\:facebook,
 [i-simple-icons\:facebook=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M9.101 23.691v-7.98H6.627v-3.667h2.474v-1.58c0-4.085 1.848-5.978 5.858-5.978c.401 0 .955.042 1.468.103a9 9 0 0 1 1.141.195v3.325a9 9 0 0 0-.653-.036a27 27 0 0 0-.733-.009c-.707 0-1.259.096-1.675.309a1.7 1.7 0 0 0-.679.622c-.258.42-.374.995-.374 1.752v1.297h3.919l-.386 2.103l-.287 1.564h-3.246v8.245C19.396 23.238 24 18.179 24 12.044c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.628 3.874 10.35 9.101 11.647'/%3E%3C/svg%3E");
@@ -430,7 +401,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-simple-icons\:github,
 [i-simple-icons\:github=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M12 .297c-6.63 0-12 5.373-12 12c0 5.303 3.438 9.8 8.205 11.385c.6.113.82-.258.82-.577c0-.285-.01-1.04-.015-2.04c-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729c1.205.084 1.838 1.236 1.838 1.236c1.07 1.835 2.809 1.305 3.495.998c.108-.776.417-1.305.76-1.605c-2.665-.3-5.466-1.332-5.466-5.93c0-1.31.465-2.38 1.235-3.22c-.135-.303-.54-1.523.105-3.176c0 0 1.005-.322 3.3 1.23c.96-.267 1.98-.399 3-.405c1.02.006 2.04.138 3 .405c2.28-1.552 3.285-1.23 3.285-1.23c.645 1.653.24 2.873.12 3.176c.765.84 1.23 1.91 1.23 3.22c0 4.61-2.805 5.625-5.475 5.92c.42.36.81 1.096.81 2.22c0 1.606-.015 2.896-.015 3.286c0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E");
@@ -443,7 +413,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-simple-icons\:instagram,
 [i-simple-icons\:instagram=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M7.03.084c-1.277.06-2.149.264-2.91.563a5.9 5.9 0 0 0-2.124 1.388a5.9 5.9 0 0 0-1.38 2.127C.321 4.926.12 5.8.064 7.076s-.069 1.688-.063 4.947s.021 3.667.083 4.947c.061 1.277.264 2.149.563 2.911c.308.789.72 1.457 1.388 2.123a5.9 5.9 0 0 0 2.129 1.38c.763.295 1.636.496 2.913.552c1.278.056 1.689.069 4.947.063s3.668-.021 4.947-.082c1.28-.06 2.147-.265 2.91-.563a5.9 5.9 0 0 0 2.123-1.388a5.9 5.9 0 0 0 1.38-2.129c.295-.763.496-1.636.551-2.912c.056-1.28.07-1.69.063-4.948c-.006-3.258-.02-3.667-.081-4.947c-.06-1.28-.264-2.148-.564-2.911a5.9 5.9 0 0 0-1.387-2.123a5.9 5.9 0 0 0-2.128-1.38c-.764-.294-1.636-.496-2.914-.55C15.647.009 15.236-.006 11.977 0S8.31.021 7.03.084m.14 21.693c-1.17-.05-1.805-.245-2.228-.408a3.7 3.7 0 0 1-1.382-.895a3.7 3.7 0 0 1-.9-1.378c-.165-.423-.363-1.058-.417-2.228c-.06-1.264-.072-1.644-.08-4.848c-.006-3.204.006-3.583.061-4.848c.05-1.169.246-1.805.408-2.228c.216-.561.477-.96.895-1.382a3.7 3.7 0 0 1 1.379-.9c.423-.165 1.057-.361 2.227-.417c1.265-.06 1.644-.072 4.848-.08c3.203-.006 3.583.006 4.85.062c1.168.05 1.804.244 2.227.408c.56.216.96.475 1.382.895s.681.817.9 1.378c.165.422.362 1.056.417 2.227c.06 1.265.074 1.645.08 4.848c.005 3.203-.006 3.583-.061 4.848c-.051 1.17-.245 1.805-.408 2.23c-.216.56-.477.96-.896 1.38a3.7 3.7 0 0 1-1.378.9c-.422.165-1.058.362-2.226.418c-1.266.06-1.645.072-4.85.079s-3.582-.006-4.848-.06m9.783-16.192a1.44 1.44 0 1 0 1.437-1.442a1.44 1.44 0 0 0-1.437 1.442M5.839 12.012a6.161 6.161 0 1 0 12.323-.024a6.162 6.162 0 0 0-12.323.024M8 12.008A4 4 0 1 1 12.008 16A4 4 0 0 1 8 12.008'/%3E%3C/svg%3E");
@@ -456,7 +425,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-simple-icons\:linkedin,
 [i-simple-icons\:linkedin=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037c-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85c3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.06 2.06 0 0 1-2.063-2.065a2.064 2.064 0 1 1 2.063 2.065m1.782 13.019H3.555V9h3.564zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0z'/%3E%3C/svg%3E");
@@ -469,7 +437,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .i-simple-icons\:twitter,
 [i-simple-icons\:twitter=""] {
   --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M21.543 7.104c.015.211.015.423.015.636c0 6.507-4.954 14.01-14.01 14.01v-.003A13.94 13.94 0 0 1 0 19.539a9.88 9.88 0 0 0 7.287-2.041a4.93 4.93 0 0 1-4.6-3.42a4.9 4.9 0 0 0 2.223-.084A4.926 4.926 0 0 1 .96 9.167v-.062a4.9 4.9 0 0 0 2.235.616A4.93 4.93 0 0 1 1.67 3.148a13.98 13.98 0 0 0 10.15 5.144a4.929 4.929 0 0 1 8.39-4.49a9.9 9.9 0 0 0 3.128-1.196a4.94 4.94 0 0 1-2.165 2.724A9.8 9.8 0 0 0 24 4.555a10 10 0 0 1-2.457 2.549'/%3E%3C/svg%3E");
@@ -482,7 +449,6 @@
   mask-size: 100% 100%;
   width: 1.2em;
 }
-
 .n-tab,
 [n-tab=""] {
   border-bottom-width: 2px;
@@ -526,16 +492,13 @@
     -webkit-backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
-
 [border~="base"] {
   border-color: #9ca3af33;
 }
-
 .n-tab-active {
   border-color: currentColor;
   opacity: 1;
 }
-
 .n-link:hover,
 [n-link=""]:hover,
 [n-link-text=""]:hover {
@@ -543,7 +506,6 @@
   color: rgb(64 193 173 / var(--un-text-opacity));
   opacity: 1;
 }
-
 [n-link-text=""] {
   opacity: 0.5;
   text-decoration-line: underline;
@@ -580,7 +542,6 @@
     -webkit-backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
-
 .n-link,
 [n-link=""] {
   opacity: 0.5;
@@ -617,27 +578,22 @@
     -webkit-backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
-
 .absolute,
 [absolute=""] {
   position: absolute;
 }
-
 .fixed,
 [fixed=""] {
   position: fixed;
 }
-
 .relative,
 [relative=""] {
   position: relative;
 }
-
 .sticky,
 [sticky=""] {
   position: sticky;
 }
-
 .inset-0,
 [inset-0=""] {
   top: 0;
@@ -645,50 +601,40 @@
   bottom: 0;
   left: 0;
 }
-
 .bottom-0,
 [bottom-0=""] {
   bottom: 0;
 }
-
 .bottom-2,
 [bottom-2=""] {
   bottom: 0.5rem;
 }
-
 .left-0,
 [left-0=""] {
   left: 0;
 }
-
 .left-1\/3 {
   left: 33.3333333333%;
 }
-
 .right-0,
 [right-0=""] {
   right: 0;
 }
-
 .right-1,
 [right-1=""] {
   right: 0.25rem;
 }
-
 .top-0,
 [top-0=""] {
   top: 0;
 }
-
 .top-1,
 [top-1=""] {
   top: 0.25rem;
 }
-
 [top~="1/2"] {
   top: 50%;
 }
-
 .line-clamp-2,
 [line-clamp-2=""] {
   display: -webkit-box;
@@ -697,7 +643,6 @@
   -webkit-line-clamp: 2;
   line-clamp: 2;
 }
-
 .line-clamp-3 {
   display: -webkit-box;
   overflow: hidden;
@@ -705,252 +650,201 @@
   -webkit-line-clamp: 3;
   line-clamp: 3;
 }
-
 .z-10,
 .z10,
 [z-10=""],
 [hover~="z10"]:hover {
   z-index: 10;
 }
-
 .z-100,
 [z-100=""] {
   z-index: 100;
 }
-
 .grid,
 [grid~="~"] {
   display: grid;
 }
-
 .cols-\[max-content_1fr\],
 [grid~="cols-[max-content_1fr]"] {
   grid-template-columns: max-content 1fr;
 }
-
 .cols-minmax-10rem,
 [grid~="cols-minmax-10rem"] {
   grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
 }
-
 .cols-minmax-20rem,
 [grid~="cols-minmax-20rem"] {
   grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
 }
-
 .m5,
 [m5=""] {
   margin: 1.25rem;
 }
-
 .ma,
 [ma=""] {
   margin: auto;
 }
-
 .mx-auto,
 [mx-auto=""] {
   margin-left: auto;
   margin-right: auto;
 }
-
 [my2=""] {
   margin-bottom: 0.5rem;
   margin-top: 0.5rem;
 }
-
 .mb4,
 [mb4=""] {
   margin-bottom: 1rem;
 }
-
 .mt-10,
 [mt-10=""] {
   margin-top: 2.5rem;
 }
-
 .mt-2,
 [mt-2=""] {
   margin-top: 0.5rem;
 }
-
 .mt-5,
 .mt5,
 [mt-5=""],
 [mt5=""] {
   margin-top: 1.25rem;
 }
-
 .mt4,
 [mt4=""] {
   margin-top: 1rem;
 }
-
 .inline,
 [inline=""] {
   display: inline;
 }
-
 .block,
 [block=""] {
   display: block;
 }
-
 .hidden {
   display: none;
 }
-
 .aspect-10\/16,
 [aspect~="10/16"] {
   aspect-ratio: 10/16;
 }
-
 .aspect-16\/9 {
   aspect-ratio: 16/9;
 }
-
 .aspect-9\/16 {
   aspect-ratio: 9/16;
 }
-
 .aspect-ratio-3\/2 {
   aspect-ratio: 3/2;
 }
-
 [aspect~="11/2"] {
   aspect-ratio: 11/2;
 }
-
 [aspect~="3/4"] {
   aspect-ratio: 3/4;
 }
-
 .h-8 {
   height: 2rem;
 }
-
 .h-full,
 [h-full=""] {
   height: 100%;
 }
-
 .h-screen,
 [h-screen=""] {
   height: 100vh;
 }
-
 .h1 {
   height: 0.25rem;
 }
-
 .h2 {
   height: 0.5rem;
 }
-
 .h4,
 [h4=""] {
   height: 1rem;
 }
-
 .h5,
 [h5=""] {
   height: 1.25rem;
 }
-
 .max-h-full,
 [max-h-full=""] {
   max-height: 100%;
 }
-
 .max-w-300,
 [max-w-300=""] {
   max-width: 75rem;
 }
-
 .max-w-full,
 [max-w-full=""] {
   max-width: 100%;
 }
-
 .w-2\/3 {
   width: 66.6666666667%;
 }
-
 .w-20,
 [w-20=""] {
   width: 5rem;
 }
-
 .w-25,
 [w-25=""] {
   width: 6.25rem;
 }
-
 .w-40,
 [w-40=""] {
   width: 10rem;
 }
-
 .w-50,
 [w-50=""] {
   width: 12.5rem;
 }
-
 .w-70,
 [w-70=""] {
   width: 17.5rem;
 }
-
 .w-79,
 [w-79=""] {
   width: 19.75rem;
 }
-
 .w-full,
 [w-full=""] {
   width: 100%;
 }
-
 .w-max,
 [w-max=""] {
   width: -moz-max-content;
   width: max-content;
 }
-
 [h~="2/3"] {
   height: 66.6666666667%;
 }
-
 .flex,
 [flex=""],
 [flex~="~"] {
   display: flex;
 }
-
 .flex-1,
 [flex-1=""] {
   flex: 1 1 0%;
 }
-
 .flex-auto,
 [flex-auto=""] {
   flex: 1 1 auto;
 }
-
 [flex~="row"] {
   flex-direction: row;
 }
-
 .flex-col,
 [flex-col=""],
 [flex~="col"] {
   flex-direction: column;
 }
-
 [flex~="wrap"] {
   flex-wrap: wrap;
 }
-
 [translate~="y--1/2"] {
   --un-translate-y: -50%;
   transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y))
@@ -960,7 +854,6 @@
     scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y))
     scaleZ(var(--un-scale-z));
 }
-
 .scale-102 {
   --un-scale-x: 1.02;
   --un-scale-y: 1.02;
@@ -971,7 +864,6 @@
     scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y))
     scaleZ(var(--un-scale-z));
 }
-
 .scale-105 {
   --un-scale-x: 1.05;
   --un-scale-y: 1.05;
@@ -982,7 +874,6 @@
     scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y))
     scaleZ(var(--un-scale-z));
 }
-
 .scale-120,
 [scale-120=""] {
   --un-scale-x: 1.2;
@@ -994,7 +885,6 @@
     scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y))
     scaleZ(var(--un-scale-z));
 }
-
 [hover~="scale-102"]:hover {
   --un-scale-x: 1.02;
   --un-scale-y: 1.02;
@@ -1005,7 +895,6 @@
     scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y))
     scaleZ(var(--un-scale-z));
 }
-
 [hover~="scale-105"]:hover {
   --un-scale-x: 1.05;
   --un-scale-y: 1.05;
@@ -1016,7 +905,6 @@
     scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y))
     scaleZ(var(--un-scale-z));
 }
-
 .transform {
   transform: translate(var(--un-translate-x)) translateY(var(--un-translate-y))
     translateZ(var(--un-translate-z)) rotate(var(--un-rotate))
@@ -1025,68 +913,55 @@
     scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y))
     scaleZ(var(--un-scale-z));
 }
-
 @keyframes pulse {
   0%,
   to {
     opacity: 1;
   }
-
   50% {
     opacity: 0.5;
   }
 }
-
 @keyframes spin {
   0% {
     transform: rotate(0);
   }
-
   to {
     transform: rotate(1turn);
   }
 }
-
 .animate-pulse,
 [animate-pulse=""] {
   animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
 }
-
 .animate-spin,
 [animate-spin=""] {
   animation: spin 1s linear infinite;
 }
-
 .items-start,
 [items-start=""] {
   align-items: flex-start;
 }
-
 .items-center,
 [items-center=""] {
   align-items: center;
 }
-
 .items-baseline,
 [items-baseline=""] {
   align-items: baseline;
 }
-
 .self-start,
 [self-start=""] {
   align-self: flex-start;
 }
-
 .justify-center,
 [justify-center=""] {
   justify-content: center;
 }
-
 .justify-evenly,
 [justify-evenly=""] {
   justify-content: space-evenly;
 }
-
 .gap-2,
 .gap2,
 [flex~="gap2"],
@@ -1094,7 +969,6 @@
 [gap2=""] {
   gap: 0.5rem;
 }
-
 .gap-3,
 .gap3,
 [gap-3=""],
@@ -1102,122 +976,99 @@
 [grid~="gap3"] {
   gap: 0.75rem;
 }
-
 .gap-8,
 .gap8,
 [gap-8=""],
 [gap8=""] {
   gap: 2rem;
 }
-
 .gap1,
 [flex~="gap1"],
 [gap1=""] {
   gap: 0.25rem;
 }
-
 .gap4,
 [flex~="gap4"],
 [gap4=""] {
   gap: 1rem;
 }
-
 .gap5,
 [flex~="gap5"],
 [gap5=""] {
   gap: 1.25rem;
 }
-
 .gap6,
 [gap6=""] {
   gap: 1.5rem;
 }
-
 .of-hidden,
 [of-hidden=""] {
   overflow: hidden;
 }
-
 .of-x-hidden,
 [of-x-hidden=""] {
   overflow-x: hidden;
 }
-
 .of-y-auto,
 .overflow-y-auto,
 [of-y-auto=""],
 [overflow-y-auto=""] {
   overflow-y: auto;
 }
-
 .ws-pre-wrap,
 [ws-pre-wrap=""] {
   white-space: pre-wrap;
 }
-
 .border,
 [border=""] {
   border-width: 1px;
 }
-
 [border~="4"] {
   border-width: 4px;
 }
-
 [border~="t"] {
   border-top-width: 1px;
 }
-
 [border~="gray4/10"] {
   border-color: #9ca3af1a;
 }
-
 .rounded,
 [rounded=""] {
   border-radius: 0.25rem;
 }
-
 .rounded-full,
 [rounded-full=""] {
   border-radius: 9999px;
 }
-
 .rounded-md,
 [rounded-md=""] {
   border-radius: 0.375rem;
 }
-
 .border-none,
 [border-none=""] {
   border-style: none;
 }
-
 .bg-black,
 [bg-black=""] {
   --un-bg-opacity: 1;
   background-color: rgb(0 0 0 / var(--un-bg-opacity));
 }
-
 .bg-black\:30,
 [bg-black\:30=""] {
   background-color: #0000004d;
 }
-
 .bg-black\:50,
 [bg-black\:50=""] {
   background-color: #00000080;
 }
-
 .bg-black\:60,
 [bg-black\:60=""] {
   background-color: #0009;
 }
-
 .bg-black\:90,
 [bg-black\:90=""] {
   background-color: #000000e6;
 }
-
 .bg-gray4\:10,
 .bg-gray\:10,
 [bg-gray4\:10=""],
@@ -1225,35 +1076,29 @@
 [bg~="gray/10"] {
   background-color: #9ca3af1a;
 }
-
 .bg-gray\:5,
 [bg-gray\:5=""] {
   background-color: #9ca3af0d;
 }
-
 .bg-transparent,
 [bg-transparent=""] {
   background-color: transparent;
 }
-
 [bg~="gray/15"] {
   background-color: #9ca3af26;
 }
-
 [bg~="hover:gray/20"]:hover {
   background-color: #9ca3af33;
 }
-
 .from-black,
 [from-black=""] {
-  --un-gradient-from-position: 0%;
+  --un-gradient-from-position: 0;
   --un-gradient-from: rgb(0 0 0 / var(--un-from-opacity, 1))
     var(--un-gradient-from-position);
   --un-gradient-to-position: 100%;
   --un-gradient-to: transparent var(--un-gradient-to-position);
   --un-gradient-stops: var(--un-gradient-from), var(--un-gradient-to);
 }
-
 .via-black,
 [via-black=""] {
   --un-gradient-via-position: 50%;
@@ -1262,79 +1107,65 @@
     rgb(0 0 0 / var(--un-via-opacity, 1)) var(--un-gradient-via-position),
     var(--un-gradient-to);
 }
-
 .to-transparent,
 [to-transparent=""] {
   --un-gradient-to-position: 100%;
   --un-gradient-to: transparent var(--un-gradient-to-position);
 }
-
 .bg-gradient-to-r {
   --un-gradient-shape: to right;
   --un-gradient: var(--un-gradient-shape), var(--un-gradient-stops);
   background-image: linear-gradient(var(--un-gradient));
 }
-
 .bg-gradient-to-t {
   --un-gradient-shape: to top;
   --un-gradient: var(--un-gradient-shape), var(--un-gradient-stops);
   background-image: linear-gradient(var(--un-gradient));
 }
-
 [stroke~="#5E5E5E"] {
   --un-stroke-opacity: 1;
   stroke: rgb(94 94 94 / var(--un-stroke-opacity));
 }
-
 .object-cover,
 [object-cover=""] {
   -o-object-fit: cover;
   object-fit: cover;
 }
-
 .object-contain,
 [object-contain=""] {
   -o-object-fit: contain;
   object-fit: contain;
 }
-
 .p-1,
 .p1,
 [p-1=""],
 [p1=""] {
   padding: 0.25rem;
 }
-
 .p-2,
 [p-2=""] {
   padding: 0.5rem;
 }
-
 .p10,
 [p10=""] {
   padding: 2.5rem;
 }
-
 .p3,
 [p3=""] {
   padding: 0.75rem;
 }
-
 .p4,
 [p4=""] {
   padding: 1rem;
 }
-
 .p5,
 [p5=""] {
   padding: 1.25rem;
 }
-
 .p8,
 [p8=""] {
   padding: 2rem;
 }
-
 .px-10,
 .px10,
 [px-10=""],
@@ -1342,209 +1173,173 @@
   padding-left: 2.5rem;
   padding-right: 2.5rem;
 }
-
 .px16,
 [px16=""] {
   padding-left: 4rem;
   padding-right: 4rem;
 }
-
 .px2,
 [px2=""],
 [p~="x2"] {
   padding-left: 0.5rem;
   padding-right: 0.5rem;
 }
-
 .px25 {
   padding-left: 6.25rem;
   padding-right: 6.25rem;
 }
-
 .px4,
 [px4=""] {
   padding-left: 1rem;
   padding-right: 1rem;
 }
-
 .px6,
 [px6=""],
 [p~="x6"] {
   padding-left: 1.5rem;
   padding-right: 1.5rem;
 }
-
 .px8,
 [px8=""] {
   padding-left: 2rem;
   padding-right: 2rem;
 }
-
 .py1,
 [py1=""],
 [p~="y1"] {
   padding-bottom: 0.25rem;
   padding-top: 0.25rem;
 }
-
 .py10,
 [py10=""] {
   padding-bottom: 2.5rem;
   padding-top: 2.5rem;
 }
-
 .py2,
 [py2=""] {
   padding-bottom: 0.5rem;
   padding-top: 0.5rem;
 }
-
 .py3,
 [py3=""],
 [p~="y3"] {
   padding-bottom: 0.75rem;
   padding-top: 0.75rem;
 }
-
 .py4,
 [py4=""] {
   padding-bottom: 1rem;
   padding-top: 1rem;
 }
-
 .py5,
 [py5=""] {
   padding-bottom: 1.25rem;
   padding-top: 1.25rem;
 }
-
 .py6,
 [py6=""] {
   padding-bottom: 1.5rem;
   padding-top: 1.5rem;
 }
-
 .py8,
 [py8=""] {
   padding-bottom: 2rem;
   padding-top: 2rem;
 }
-
 [p~="x15"] {
   padding-left: 3.75rem;
   padding-right: 3.75rem;
 }
-
 [p~="y15"] {
   padding-bottom: 3.75rem;
   padding-top: 3.75rem;
 }
-
 .pb2,
 [pb2=""] {
   padding-bottom: 0.5rem;
 }
-
 .pb4,
 [pb4=""] {
   padding-bottom: 1rem;
 }
-
 .pt8,
 [pt8=""] {
   padding-top: 2rem;
 }
-
 .text-center,
 [text-center=""] {
   text-align: center;
 }
-
 .text-left,
 [text-left=""] {
   text-align: left;
 }
-
 .text-2xl,
 [text-2xl=""] {
   font-size: 1.5rem;
   line-height: 2rem;
 }
-
 .text-3xl,
 [text-3xl=""] {
   font-size: 1.875rem;
   line-height: 2.25rem;
 }
-
 .text-4xl,
 [text-4xl=""] {
   font-size: 2.25rem;
   line-height: 2.5rem;
 }
-
 .text-5xl,
 [text-5xl=""] {
   font-size: 3rem;
   line-height: 1;
 }
-
 .text-lg,
 [text-lg=""] {
   font-size: 1.125rem;
   line-height: 1.75rem;
 }
-
 .text-sm,
 [text-sm=""] {
   font-size: 0.875rem;
   line-height: 1.25rem;
 }
-
 .text-xl,
 [text-xl=""] {
   font-size: 1.25rem;
   line-height: 1.75rem;
 }
-
 .text-xs,
 [text-xs=""] {
   font-size: 0.75rem;
   line-height: 1rem;
 }
-
 .text-primary {
   --un-text-opacity: 1;
   color: rgb(64 193 173 / var(--un-text-opacity));
 }
-
 .text-red,
 [text-red=""] {
   --un-text-opacity: 1;
   color: rgb(248 113 113 / var(--un-text-opacity));
 }
-
 .text-true-gray\:90,
 [text-true-gray\:90=""] {
   color: #a3a3a3e6;
 }
-
 .text-white,
 [text-white=""] {
   --un-text-opacity: 1;
   color: rgb(255 255 255 / var(--un-text-opacity));
 }
-
 .font-100,
 [font-100=""] {
   font-weight: 100;
 }
-
 .leading-relaxed,
 [leading-relaxed=""] {
   line-height: 1.625;
 }
-
 .font-sans,
 [font-sans=""] {
   font-family:
@@ -1564,17 +1359,14 @@
     Segoe UI Symbol,
     Noto Color Emoji;
 }
-
 .case-capital,
 [case-capital=""] {
   text-transform: capitalize;
 }
-
 .italic,
 [italic=""] {
   font-style: italic;
 }
-
 .tabular-nums,
 [tabular-nums=""] {
   --un-numeric-spacing: tabular-nums;
@@ -1582,70 +1374,56 @@
     var(--un-numeric-figure) var(--un-numeric-spacing)
     var(--un-numeric-fraction);
 }
-
 .tab {
   -moz-tab-size: 4;
   -o-tab-size: 4;
   tab-size: 4;
 }
-
 .op0,
 [op0=""] {
   opacity: 0;
 }
-
 .op10,
 [op10=""] {
   opacity: 0.1;
 }
-
 .op100,
 [op100=""] {
   opacity: 1;
 }
-
 .op20,
 [op20=""] {
   opacity: 0.2;
 }
-
 .op50,
 [op50=""] {
   opacity: 0.5;
 }
-
 .op60,
 [op60=""] {
   opacity: 0.6;
 }
-
 .op80,
 [op80=""] {
   opacity: 0.8;
 }
-
 .hover\:op100:hover {
   opacity: 1;
 }
-
 .hover\:op80:hover {
   opacity: 0.8;
 }
-
 [hover\:op100=""]:hover {
   opacity: 1;
 }
-
 [hover\:op80=""]:hover {
   opacity: 0.8;
 }
-
 .outline-none,
 [outline-none=""] {
   outline: 2px solid transparent;
   outline-offset: 2px;
 }
-
 .filter-hue-rotate-320deg,
 [filter-hue-rotate-320deg=""] {
   --un-hue-rotate: hue-rotate(320deg);
@@ -1653,7 +1431,6 @@
     var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate)
     var(--un-invert) var(--un-saturate) var(--un-sepia);
 }
-
 .transition,
 [transition=""] {
   transition-duration: 0.15s;
@@ -1689,70 +1466,56 @@
     -webkit-backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
-
 .duration-0,
 [duration-0=""] {
   transition-duration: 0s;
 }
-
 .duration-400,
 [duration-400=""] {
   transition-duration: 0.4s;
 }
-
 [placeholder~="$t("]::-moz-placeholder {
   color: var(--t\();
 }
-
 [placeholder~="$t("]::placeholder {
   color: var(--t\();
 }
-
 .view-transition-app,
 [view-transition-app=""] {
   view-transition-name: app;
 }
-
 .view-transition-name {
   view-transition-name: name;
 }
-
 @media (max-width: 1023.9px) {
   [lt-lg~="left-0"] {
     left: 0;
   }
-
   [lt-lg~="right-0"] {
     right: 0;
   }
-
   .lt-lg\:rows-\[1fr_max-content\],
   [grid~="lt-lg:rows-[1fr_max-content]"] {
     grid-template-rows: 1fr max-content;
   }
-
   [lt-lg~="bg-gradient-to-t"] {
     --un-gradient-shape: to top;
     --un-gradient: var(--un-gradient-shape), var(--un-gradient-stops);
     background-image: linear-gradient(var(--un-gradient));
   }
-
   [lt-lg~="p10"] {
     padding: 2.5rem;
   }
 }
-
 @media (max-width: 767.9px) {
   .lt-md\:hidden,
   [lt-md\:hidden=""] {
     display: none;
   }
-
   [lt-md\:w~="[calc(100vw-2rem)]"] {
     width: calc(100vw - 2rem);
   }
 }
-
 @media (min-width: 768px) {
   .md\:line-clamp-5 {
     display: -webkit-box;
@@ -1761,127 +1524,102 @@
     -webkit-line-clamp: 5;
     line-clamp: 5;
   }
-
   .md\:cols-\[max-content_1fr\],
   [grid~="md:cols-[max-content_1fr]"] {
     grid-template-columns: max-content 1fr;
   }
-
   .md\:block {
     display: block;
   }
-
   .md\:w-60,
   [md\:w-60=""] {
     width: 15rem;
   }
-
   .md\:p4,
   [md\:p4=""] {
     padding: 1rem;
   }
-
   .md\:px14,
   [md\:px14=""] {
     padding-left: 3.5rem;
     padding-right: 3.5rem;
   }
-
   .md\:px16,
   [md\:px16=""] {
     padding-left: 4rem;
     padding-right: 4rem;
   }
-
   .md\:text-base {
     font-size: 1rem;
     line-height: 1.5rem;
   }
 }
-
 @media (min-width: 1024px) {
   [lg~="bottom-0"] {
     bottom: 0;
   }
-
   [lg~="left-1/3"] {
     left: 33.3333333333%;
   }
-
   .lg\:order-first,
   [lg\:order-first=""] {
     order: -9999;
   }
-
   .lg\:cols-\[max-content_1fr_max-content_1fr\],
   [grid~="lg:cols-[max-content_1fr_max-content_1fr]"] {
     grid-template-columns: max-content 1fr max-content 1fr;
   }
-
   .lg\:cols-\[max-content_1fr\],
   [grid~="lg:cols-[max-content_1fr]"] {
     grid-template-columns: max-content 1fr;
   }
-
   .lg\:cols-minmax-15rem,
   [grid~="lg:cols-minmax-15rem"] {
     grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
   }
-
   .lg\:m20,
   [lg\:m20=""] {
     margin: 5rem;
   }
-
   .lg\:block {
     display: block;
   }
-
   .lg\:hidden,
   [lg\:hidden=""] {
     display: none;
   }
-
   .lg\:aspect-ratio-25\/9 {
     aspect-ratio: 25/9;
   }
-
   [lg~="w-2/3"] {
     width: 66.6666666667%;
   }
-
   [flex~="lg:col"] {
     flex-direction: column;
   }
-
   [border~="lg:r"] {
     border-right-width: 1px;
   }
-
   [lg~="bg-gradient-to-r"] {
     --un-gradient-shape: to right;
     --un-gradient: var(--un-gradient-shape), var(--un-gradient-stops);
     background-image: linear-gradient(var(--un-gradient));
   }
-
   .lg\:px5,
   [lg\:px5=""] {
     padding-left: 1.25rem;
     padding-right: 1.25rem;
   }
-
   [lg~="px25"] {
     padding-left: 6.25rem;
     padding-right: 6.25rem;
   }
-
   .lg\:text-5xl,
   [lg\:text-5xl=""] {
     font-size: 3rem;
     line-height: 1;
   }
 }
-
 *,
 :after,
 :before {
@@ -1890,12 +1628,10 @@
   border-width: 0;
   box-sizing: border-box;
 }
-
 :after,
 :before {
   --un-content: "";
 }
-
 :host,
 html {
   line-height: 1.5;
@@ -1915,23 +1651,19 @@ html {
   tab-size: 4;
   -webkit-tap-highlight-color: transparent;
 }
-
 body {
   line-height: inherit;
   margin: 0;
 }
-
 hr {
   border-top-width: 1px;
   color: inherit;
   height: 0;
 }
-
 abbr:where([title]) {
   -webkit-text-decoration: underline dotted;
   text-decoration: underline dotted;
 }
-
 h1,
 h2,
 h3,
@@ -1941,17 +1673,14 @@ h6 {
   font-size: inherit;
   font-weight: inherit;
 }
-
 a {
   color: inherit;
   text-decoration: inherit;
 }
-
 b,
 strong {
   font-weight: bolder;
 }
-
 code,
 kbd,
 pre,
@@ -1969,11 +1698,9 @@ samp {
   font-size: 1em;
   font-variation-settings: normal;
 }
-
 small {
   font-size: 80%;
 }
-
 sub,
 sup {
   font-size: 75%;
@@ -1981,21 +1708,17 @@ sup {
   position: relative;
   vertical-align: baseline;
 }
-
 sub {
   bottom: -0.25em;
 }
-
 sup {
   top: -0.5em;
 }
-
 table {
   border-collapse: collapse;
   border-color: inherit;
   text-indent: 0;
 }
-
 button,
 input,
 optgroup,
@@ -2011,12 +1734,10 @@ textarea {
   margin: 0;
   padding: 0;
 }
-
 button,
 select {
   text-transform: none;
 }
-
 [type="button"],
 [type="reset"],
 [type="submit"],
@@ -2025,42 +1746,33 @@ button {
   background-color: transparent;
   background-image: none;
 }
-
 :-moz-focusring {
   outline: auto;
 }
-
 :-moz-ui-invalid {
   box-shadow: none;
 }
-
 progress {
   vertical-align: baseline;
 }
-
 ::-webkit-inner-spin-button,
 ::-webkit-outer-spin-button {
   height: auto;
 }
-
 [type="search"] {
   -webkit-appearance: textfield;
   outline-offset: -2px;
 }
-
 ::-webkit-search-decoration {
   -webkit-appearance: none;
 }
-
 ::-webkit-file-upload-button {
   -webkit-appearance: button;
   font: inherit;
 }
-
 summary {
   display: list-item;
 }
-
 blockquote,
 dd,
 dl,
@@ -2076,16 +1788,13 @@ p,
 pre {
   margin: 0;
 }
-
 fieldset {
   margin: 0;
   padding: 0;
 }
-
 legend {
   padding: 0;
 }
-
 menu,
 ol,
 ul {
@@ -2093,36 +1802,29 @@ ul {
   margin: 0;
   padding: 0;
 }
-
 dialog {
   padding: 0;
 }
-
 textarea {
   resize: vertical;
 }
-
 input::-moz-placeholder,
 textarea::-moz-placeholder {
   color: #9ca3af;
   opacity: 1;
 }
-
 input::placeholder,
 textarea::placeholder {
   color: #9ca3af;
   opacity: 1;
 }
-
 [role="button"],
 button {
   cursor: pointer;
 }
-
 :disabled {
   cursor: default;
 }
-
 audio,
 canvas,
 embed,
@@ -2134,17 +1836,14 @@ video {
   display: block;
   vertical-align: middle;
 }
-
 img,
 video {
   height: auto;
   max-width: 100%;
 }
-
 [hidden] {
   display: none;
 }
-
 #__nuxt,
 body,
 html {