{"owner":"tailwindlabs","repo":"tailwindcss","hasSkills":true,"totalSkillsCount":10,"totalTokensCount":5816,"categories":["plugin-manifest","cursor-rule"],"hasMcp":false,"mcpConfig":null,"found":["packages/@tailwindcss-browser/README.md","packages/@tailwindcss-cli/README.md","packages/@tailwindcss-node/README.md","packages/@tailwindcss-postcss/README.md","packages/@tailwindcss-turbopack/README.md","packages/@tailwindcss-upgrade/README.md","packages/@tailwindcss-vite/README.md","packages/@tailwindcss-webpack/README.md","packages/tailwindcss/README.md",".cursorrules (html-tailwind-css-javascript-cursorrules-prompt-fi.mdc)"],"skills":{"packages/@tailwindcss-browser/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","packages/@tailwindcss-cli/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","packages/@tailwindcss-node/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","packages/@tailwindcss-postcss/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## `@tailwindcss/postcss` plugin API\n\n### Changing where the plugin searches for source files\n\nYou can use the `base` option (defaults to the current working directory) to change the directory in which the plugin searches for source files:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      base: path.resolve(__dirname, './path'),\n    }),\n  ],\n}\n```\n\n### Enabling or disabling Lightning CSS\n\nBy default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.\n\nIf you want to always enable or disable Lightning CSS the `optimize` option may be used:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      // Enable or disable Lightning CSS\n      optimize: false,\n    }),\n  ],\n}\n```\n\nIt's also possible to keep Lightning CSS enabled but disable minification:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      optimize: { minify: false },\n    }),\n  ],\n}\n```\n\n### Enabling or disabling `url(…)` rewriting\n\nOur PostCSS plugin can rewrite `url(…)`s for you since it also handles `@import` (no `postcss-import` is needed). This feature is enabled by default.\n\nIn some situations the bundler or framework you're using may provide this feature itself. In this case you can set `transformAssetUrls` to `false` to disable this feature:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      // Disable `url(…)` rewriting\n      transformAssetUrls: false,\n\n      // Enable `url(…)` rewriting (the default)\n      transformAssetUrls: true,\n    }),\n  ],\n}\n```\n","packages/@tailwindcss-turbopack/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## @tailwindcss/turbopack\n\nA Turbopack loader for Tailwind CSS v4.\n\n## Installation\n\n```sh\nnpm install @tailwindcss/turbopack\n```\n\n### Usage\n\n```javascript\n// next.config.js\nmodule.exports = {\n  turbopack: {\n    rules: {\n      '*.css': {\n        loaders: ['@tailwindcss/turbopack'],\n        as: '*.css',\n      },\n    },\n  },\n}\n```\n\nThen create a CSS file that imports Tailwind:\n\n```css\n/* src/index.css */\n@import 'tailwindcss';\n```\n\n### Options\n\n#### `base`\n\nThe base directory to scan for class candidates. Defaults to the current working directory.\n\n```javascript\n{\n  loader: '@tailwindcss/turbopack',\n  options: {\n    base: process.cwd(),\n  },\n}\n```\n\n#### `optimize`\n\nWhether to optimize and minify the output CSS. Defaults to `true` in production mode.\n\n```javascript\n{\n  loader: '@tailwindcss/turbopack',\n  options: {\n    optimize: true, // or { minify: true }\n  },\n}\n```\n","packages/@tailwindcss-upgrade/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","packages/@tailwindcss-vite/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## `@tailwindcss/vite` plugin API\n\n### Enabling or disabling Lightning CSS\n\nBy default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.\n\nIf you want to always enable or disable Lightning CSS the `optimize` option may be used:\n\n```js\nimport tailwindcss from '@tailwindcss/vite'\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss({\n      // Disable Lightning CSS optimization\n      optimize: false,\n    }),\n  ],\n})\n```\n\nIt's also possible to keep Lightning CSS enabled but disable minification:\n\n```js\nimport tailwindcss from '@tailwindcss/vite'\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss({\n      // Enable Lightning CSS but disable minification\n      optimize: { minify: false },\n    }),\n  ],\n})\n```\n","packages/@tailwindcss-webpack/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## @tailwindcss/webpack\n\nA webpack loader for Tailwind CSS v4.\n\n## Installation\n\n```sh\nnpm install @tailwindcss/webpack\n```\n\n### Usage\n\n```javascript\n// webpack.config.js\nconst MiniCssExtractPlugin = require('mini-css-extract-plugin')\n\nmodule.exports = {\n  plugins: [new MiniCssExtractPlugin()],\n  module: {\n    rules: [\n      {\n        test: /\\.css$/i,\n        use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],\n      },\n    ],\n  },\n}\n```\n\nThen create a CSS file that imports Tailwind:\n\n```css\n/* src/index.css */\n@import 'tailwindcss';\n```\n\n### Options\n\n#### `base`\n\nThe base directory to scan for class candidates. Defaults to the current working directory.\n\n```javascript\n{\n  loader: '@tailwindcss/webpack',\n  options: {\n    base: process.cwd(),\n  },\n}\n```\n\n#### `optimize`\n\nWhether to optimize and minify the output CSS. Defaults to `true` in production mode.\n\n```javascript\n{\n  loader: '@tailwindcss/webpack',\n  options: {\n    optimize: true, // or { minify: true }\n  },\n}\n```\n","packages/tailwindcss/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n",".cursorrules (html-tailwind-css-javascript-cursorrules-prompt-fi.mdc)":"---\ndescription: \"Cursor rules for HTML development with Tailwind CSS and JavaScript integration.\"\nglobs: **/*\nalwaysApply: false\n---\nYou are an expert AI programming assistant that primarily focuses on producing clear, readable HTML, Tailwind CSS and vanilla JavaScript code.\n\nYou always use the latest version of HTML, Tailwind CSS and vanilla JavaScript, and you are familiar with the latest features and best practices.\n\nYou carefully provide accurate, factual, thoughtful answers, and excel at reasoning.\n\n- Follow the user’s requirements carefully & to the letter.\n- Confirm, then write code!\n- Suggest solutions that I didn't think about-anticipate my needs\n- Treat me as an expert\n- Always write correct, up to date, bug free, fully functional and working, secure, performant and efficient code.\n- Focus on readability over being performant.\n- Fully implement all requested functionality.\n- Leave NO todo’s, placeholders or missing pieces.\n- Be concise. Minimize any other prose.\n- Consider new technologies and contrarian ideas, not just the conventional wisdom\n- If you think there might not be a correct answer, you say so. If you do not know the answer, say so instead of guessing.\n- If I ask for adjustments to code, do not repeat all of my code unnecessarily. Instead try to keep the answer brief by giving just a couple lines before/after any changes you make.\n"},"files":{"packages/@tailwindcss-browser/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","packages/@tailwindcss-cli/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","packages/@tailwindcss-node/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","packages/@tailwindcss-postcss/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## `@tailwindcss/postcss` plugin API\n\n### Changing where the plugin searches for source files\n\nYou can use the `base` option (defaults to the current working directory) to change the directory in which the plugin searches for source files:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      base: path.resolve(__dirname, './path'),\n    }),\n  ],\n}\n```\n\n### Enabling or disabling Lightning CSS\n\nBy default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.\n\nIf you want to always enable or disable Lightning CSS the `optimize` option may be used:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      // Enable or disable Lightning CSS\n      optimize: false,\n    }),\n  ],\n}\n```\n\nIt's also possible to keep Lightning CSS enabled but disable minification:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      optimize: { minify: false },\n    }),\n  ],\n}\n```\n\n### Enabling or disabling `url(…)` rewriting\n\nOur PostCSS plugin can rewrite `url(…)`s for you since it also handles `@import` (no `postcss-import` is needed). This feature is enabled by default.\n\nIn some situations the bundler or framework you're using may provide this feature itself. In this case you can set `transformAssetUrls` to `false` to disable this feature:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      // Disable `url(…)` rewriting\n      transformAssetUrls: false,\n\n      // Enable `url(…)` rewriting (the default)\n      transformAssetUrls: true,\n    }),\n  ],\n}\n```\n","packages/@tailwindcss-turbopack/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## @tailwindcss/turbopack\n\nA Turbopack loader for Tailwind CSS v4.\n\n## Installation\n\n```sh\nnpm install @tailwindcss/turbopack\n```\n\n### Usage\n\n```javascript\n// next.config.js\nmodule.exports = {\n  turbopack: {\n    rules: {\n      '*.css': {\n        loaders: ['@tailwindcss/turbopack'],\n        as: '*.css',\n      },\n    },\n  },\n}\n```\n\nThen create a CSS file that imports Tailwind:\n\n```css\n/* src/index.css */\n@import 'tailwindcss';\n```\n\n### Options\n\n#### `base`\n\nThe base directory to scan for class candidates. Defaults to the current working directory.\n\n```javascript\n{\n  loader: '@tailwindcss/turbopack',\n  options: {\n    base: process.cwd(),\n  },\n}\n```\n\n#### `optimize`\n\nWhether to optimize and minify the output CSS. Defaults to `true` in production mode.\n\n```javascript\n{\n  loader: '@tailwindcss/turbopack',\n  options: {\n    optimize: true, // or { minify: true }\n  },\n}\n```\n","packages/@tailwindcss-upgrade/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","packages/@tailwindcss-vite/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## `@tailwindcss/vite` plugin API\n\n### Enabling or disabling Lightning CSS\n\nBy default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.\n\nIf you want to always enable or disable Lightning CSS the `optimize` option may be used:\n\n```js\nimport tailwindcss from '@tailwindcss/vite'\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss({\n      // Disable Lightning CSS optimization\n      optimize: false,\n    }),\n  ],\n})\n```\n\nIt's also possible to keep Lightning CSS enabled but disable minification:\n\n```js\nimport tailwindcss from '@tailwindcss/vite'\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss({\n      // Enable Lightning CSS but disable minification\n      optimize: { minify: false },\n    }),\n  ],\n})\n```\n","packages/@tailwindcss-webpack/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## @tailwindcss/webpack\n\nA webpack loader for Tailwind CSS v4.\n\n## Installation\n\n```sh\nnpm install @tailwindcss/webpack\n```\n\n### Usage\n\n```javascript\n// webpack.config.js\nconst MiniCssExtractPlugin = require('mini-css-extract-plugin')\n\nmodule.exports = {\n  plugins: [new MiniCssExtractPlugin()],\n  module: {\n    rules: [\n      {\n        test: /\\.css$/i,\n        use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],\n      },\n    ],\n  },\n}\n```\n\nThen create a CSS file that imports Tailwind:\n\n```css\n/* src/index.css */\n@import 'tailwindcss';\n```\n\n### Options\n\n#### `base`\n\nThe base directory to scan for class candidates. Defaults to the current working directory.\n\n```javascript\n{\n  loader: '@tailwindcss/webpack',\n  options: {\n    base: process.cwd(),\n  },\n}\n```\n\n#### `optimize`\n\nWhether to optimize and minify the output CSS. Defaults to `true` in production mode.\n\n```javascript\n{\n  loader: '@tailwindcss/webpack',\n  options: {\n    optimize: true, // or { minify: true }\n  },\n}\n```\n","packages/tailwindcss/README.md":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n",".cursorrules (html-tailwind-css-javascript-cursorrules-prompt-fi.mdc)":"---\ndescription: \"Cursor rules for HTML development with Tailwind CSS and JavaScript integration.\"\nglobs: **/*\nalwaysApply: false\n---\nYou are an expert AI programming assistant that primarily focuses on producing clear, readable HTML, Tailwind CSS and vanilla JavaScript code.\n\nYou always use the latest version of HTML, Tailwind CSS and vanilla JavaScript, and you are familiar with the latest features and best practices.\n\nYou carefully provide accurate, factual, thoughtful answers, and excel at reasoning.\n\n- Follow the user’s requirements carefully & to the letter.\n- Confirm, then write code!\n- Suggest solutions that I didn't think about-anticipate my needs\n- Treat me as an expert\n- Always write correct, up to date, bug free, fully functional and working, secure, performant and efficient code.\n- Focus on readability over being performant.\n- Fully implement all requested functionality.\n- Leave NO todo’s, placeholders or missing pieces.\n- Be concise. Minimize any other prose.\n- Consider new technologies and contrarian ideas, not just the conventional wisdom\n- If you think there might not be a correct answer, you say so. If you do not know the answer, say so instead of guessing.\n- If I ask for adjustments to code, do not repeat all of my code unnecessarily. Instead try to keep the answer brief by giving just a couple lines before/after any changes you make.\n"},"items":[{"name":"README.md","path":"packages/@tailwindcss-browser/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/@tailwindcss-browser/README.md","title":"@tailwindcss-browser Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","isInternal":false,"tokens":487,"sizeBytes":1838},{"name":"README.md","path":"packages/@tailwindcss-cli/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/@tailwindcss-cli/README.md","title":"@tailwindcss-cli Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","isInternal":false,"tokens":487,"sizeBytes":1838},{"name":"README.md","path":"packages/@tailwindcss-node/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/@tailwindcss-node/README.md","title":"@tailwindcss-node Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","isInternal":false,"tokens":487,"sizeBytes":1838},{"name":"README.md","path":"packages/@tailwindcss-postcss/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/@tailwindcss-postcss/README.md","title":"@tailwindcss-postcss Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## `@tailwindcss/postcss` plugin API\n\n### Changing where the plugin searches for source files\n\nYou can use the `base` option (defaults to the current working directory) to change the directory in which the plugin searches for source files:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      base: path.resolve(__dirname, './path'),\n    }),\n  ],\n}\n```\n\n### Enabling or disabling Lightning CSS\n\nBy default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.\n\nIf you want to always enable or disable Lightning CSS the `optimize` option may be used:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      // Enable or disable Lightning CSS\n      optimize: false,\n    }),\n  ],\n}\n```\n\nIt's also possible to keep Lightning CSS enabled but disable minification:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      optimize: { minify: false },\n    }),\n  ],\n}\n```\n\n### Enabling or disabling `url(…)` rewriting\n\nOur PostCSS plugin can rewrite `url(…)`s for you since it also handles `@import` (no `postcss-import` is needed). This feature is enabled by default.\n\nIn some situations the bundler or framework you're using may provide this feature itself. In this case you can set `transformAssetUrls` to `false` to disable this feature:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      // Disable `url(…)` rewriting\n      transformAssetUrls: false,\n\n      // Enable `url(…)` rewriting (the default)\n      transformAssetUrls: true,\n    }),\n  ],\n}\n```\n","isInternal":false,"tokens":914,"sizeBytes":3674},{"name":"README.md","path":"packages/@tailwindcss-turbopack/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/@tailwindcss-turbopack/README.md","title":"@tailwindcss-turbopack Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## @tailwindcss/turbopack\n\nA Turbopack loader for Tailwind CSS v4.\n\n## Installation\n\n```sh\nnpm install @tailwindcss/turbopack\n```\n\n### Usage\n\n```javascript\n// next.config.js\nmodule.exports = {\n  turbopack: {\n    rules: {\n      '*.css': {\n        loaders: ['@tailwindcss/turbopack'],\n        as: '*.css',\n      },\n    },\n  },\n}\n```\n\nThen create a CSS file that imports Tailwind:\n\n```css\n/* src/index.css */\n@import 'tailwindcss';\n```\n\n### Options\n\n#### `base`\n\nThe base directory to scan for class candidates. Defaults to the current working directory.\n\n```javascript\n{\n  loader: '@tailwindcss/turbopack',\n  options: {\n    base: process.cwd(),\n  },\n}\n```\n\n#### `optimize`\n\nWhether to optimize and minify the output CSS. Defaults to `true` in production mode.\n\n```javascript\n{\n  loader: '@tailwindcss/turbopack',\n  options: {\n    optimize: true, // or { minify: true }\n  },\n}\n```\n","isInternal":false,"tokens":730,"sizeBytes":2722},{"name":"README.md","path":"packages/@tailwindcss-upgrade/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/@tailwindcss-upgrade/README.md","title":"@tailwindcss-upgrade Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","isInternal":false,"tokens":487,"sizeBytes":1838},{"name":"README.md","path":"packages/@tailwindcss-vite/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/@tailwindcss-vite/README.md","title":"@tailwindcss-vite Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## `@tailwindcss/vite` plugin API\n\n### Enabling or disabling Lightning CSS\n\nBy default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.\n\nIf you want to always enable or disable Lightning CSS the `optimize` option may be used:\n\n```js\nimport tailwindcss from '@tailwindcss/vite'\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss({\n      // Disable Lightning CSS optimization\n      optimize: false,\n    }),\n  ],\n})\n```\n\nIt's also possible to keep Lightning CSS enabled but disable minification:\n\n```js\nimport tailwindcss from '@tailwindcss/vite'\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss({\n      // Enable Lightning CSS but disable minification\n      optimize: { minify: false },\n    }),\n  ],\n})\n```\n","isInternal":false,"tokens":704,"sizeBytes":2800},{"name":"README.md","path":"packages/@tailwindcss-webpack/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/@tailwindcss-webpack/README.md","title":"@tailwindcss-webpack Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## @tailwindcss/webpack\n\nA webpack loader for Tailwind CSS v4.\n\n## Installation\n\n```sh\nnpm install @tailwindcss/webpack\n```\n\n### Usage\n\n```javascript\n// webpack.config.js\nconst MiniCssExtractPlugin = require('mini-css-extract-plugin')\n\nmodule.exports = {\n  plugins: [new MiniCssExtractPlugin()],\n  module: {\n    rules: [\n      {\n        test: /\\.css$/i,\n        use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],\n      },\n    ],\n  },\n}\n```\n\nThen create a CSS file that imports Tailwind:\n\n```css\n/* src/index.css */\n@import 'tailwindcss';\n```\n\n### Options\n\n#### `base`\n\nThe base directory to scan for class candidates. Defaults to the current working directory.\n\n```javascript\n{\n  loader: '@tailwindcss/webpack',\n  options: {\n    base: process.cwd(),\n  },\n}\n```\n\n#### `optimize`\n\nWhether to optimize and minify the output CSS. Defaults to `true` in production mode.\n\n```javascript\n{\n  loader: '@tailwindcss/webpack',\n  options: {\n    optimize: true, // or { minify: true }\n  },\n}\n```\n","isInternal":false,"tokens":748,"sizeBytes":2850},{"name":"README.md","path":"packages/tailwindcss/README.md","rawUrl":"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/packages/tailwindcss/README.md","title":"tailwindcss Documentation","category":"plugin-manifest","format":"markdown","content":"<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n","isInternal":false,"tokens":487,"sizeBytes":1838},{"name":".cursorrules","path":".cursorrules (html-tailwind-css-javascript-cursorrules-prompt-fi.mdc)","rawUrl":"https://raw.githubusercontent.com/PatrickJS/awesome-cursorrules/main/rules/html-tailwind-css-javascript-cursorrules-prompt-fi.mdc","title":"Awesome Cursorrules: html tailwind css javascript cursorrules prompt fi","category":"cursor-rule","format":"markdown","content":"---\ndescription: \"Cursor rules for HTML development with Tailwind CSS and JavaScript integration.\"\nglobs: **/*\nalwaysApply: false\n---\nYou are an expert AI programming assistant that primarily focuses on producing clear, readable HTML, Tailwind CSS and vanilla JavaScript code.\n\nYou always use the latest version of HTML, Tailwind CSS and vanilla JavaScript, and you are familiar with the latest features and best practices.\n\nYou carefully provide accurate, factual, thoughtful answers, and excel at reasoning.\n\n- Follow the user’s requirements carefully & to the letter.\n- Confirm, then write code!\n- Suggest solutions that I didn't think about-anticipate my needs\n- Treat me as an expert\n- Always write correct, up to date, bug free, fully functional and working, secure, performant and efficient code.\n- Focus on readability over being performant.\n- Fully implement all requested functionality.\n- Leave NO todo’s, placeholders or missing pieces.\n- Be concise. Minimize any other prose.\n- Consider new technologies and contrarian ideas, not just the conventional wisdom\n- If you think there might not be a correct answer, you say so. If you do not know the answer, say so instead of guessing.\n- If I ask for adjustments to code, do not repeat all of my code unnecessarily. Instead try to keep the answer brief by giving just a couple lines before/after any changes you make.\n","tokens":285,"sizeBytes":1380}],"systemPromptSnippet":"<yakaai_skills repo=\"tailwindlabs/tailwindcss\">\n<!-- File: packages/@tailwindcss-browser/README.md (Tokens: ~487 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n<!-- File: packages/@tailwindcss-cli/README.md (Tokens: ~487 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n<!-- File: packages/@tailwindcss-node/README.md (Tokens: ~487 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n<!-- File: packages/@tailwindcss-postcss/README.md (Tokens: ~914 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## `@tailwindcss/postcss` plugin API\n\n### Changing where the plugin searches for source files\n\nYou can use the `base` option (defaults to the current working directory) to change the directory in which the plugin searches for source files:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      base: path.resolve(__dirname, './path'),\n    }),\n  ],\n}\n```\n\n### Enabling or disabling Lightning CSS\n\nBy default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.\n\nIf you want to always enable or disable Lightning CSS the `optimize` option may be used:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      // Enable or disable Lightning CSS\n      optimize: false,\n    }),\n  ],\n}\n```\n\nIt's also possible to keep Lightning CSS enabled but disable minification:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      optimize: { minify: false },\n    }),\n  ],\n}\n```\n\n### Enabling or disabling `url(…)` rewriting\n\nOur PostCSS plugin can rewrite `url(…)`s for you since it also handles `@import` (no `postcss-import` is needed). This feature is enabled by default.\n\nIn some situations the bundler or framework you're using may provide this feature itself. In this case you can set `transformAssetUrls` to `false` to disable this feature:\n\n```js\nimport tailwindcss from '@tailwindcss/postcss'\n\nexport default {\n  plugins: [\n    tailwindcss({\n      // Disable `url(…)` rewriting\n      transformAssetUrls: false,\n\n      // Enable `url(…)` rewriting (the default)\n      transformAssetUrls: true,\n    }),\n  ],\n}\n```\n\n<!-- File: packages/@tailwindcss-turbopack/README.md (Tokens: ~730 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## @tailwindcss/turbopack\n\nA Turbopack loader for Tailwind CSS v4.\n\n## Installation\n\n```sh\nnpm install @tailwindcss/turbopack\n```\n\n### Usage\n\n```javascript\n// next.config.js\nmodule.exports = {\n  turbopack: {\n    rules: {\n      '*.css': {\n        loaders: ['@tailwindcss/turbopack'],\n        as: '*.css',\n      },\n    },\n  },\n}\n```\n\nThen create a CSS file that imports Tailwind:\n\n```css\n/* src/index.css */\n@import 'tailwindcss';\n```\n\n### Options\n\n#### `base`\n\nThe base directory to scan for class candidates. Defaults to the current working directory.\n\n```javascript\n{\n  loader: '@tailwindcss/turbopack',\n  options: {\n    base: process.cwd(),\n  },\n}\n```\n\n#### `optimize`\n\nWhether to optimize and minify the output CSS. Defaults to `true` in production mode.\n\n```javascript\n{\n  loader: '@tailwindcss/turbopack',\n  options: {\n    optimize: true, // or { minify: true }\n  },\n}\n```\n\n<!-- File: packages/@tailwindcss-upgrade/README.md (Tokens: ~487 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n<!-- File: packages/@tailwindcss-vite/README.md (Tokens: ~704 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## `@tailwindcss/vite` plugin API\n\n### Enabling or disabling Lightning CSS\n\nBy default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.\n\nIf you want to always enable or disable Lightning CSS the `optimize` option may be used:\n\n```js\nimport tailwindcss from '@tailwindcss/vite'\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss({\n      // Disable Lightning CSS optimization\n      optimize: false,\n    }),\n  ],\n})\n```\n\nIt's also possible to keep Lightning CSS enabled but disable minification:\n\n```js\nimport tailwindcss from '@tailwindcss/vite'\nimport { defineConfig } from 'vite'\n\nexport default defineConfig({\n  plugins: [\n    tailwindcss({\n      // Enable Lightning CSS but disable minification\n      optimize: { minify: false },\n    }),\n  ],\n})\n```\n\n<!-- File: packages/@tailwindcss-webpack/README.md (Tokens: ~748 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n---\n\n## @tailwindcss/webpack\n\nA webpack loader for Tailwind CSS v4.\n\n## Installation\n\n```sh\nnpm install @tailwindcss/webpack\n```\n\n### Usage\n\n```javascript\n// webpack.config.js\nconst MiniCssExtractPlugin = require('mini-css-extract-plugin')\n\nmodule.exports = {\n  plugins: [new MiniCssExtractPlugin()],\n  module: {\n    rules: [\n      {\n        test: /\\.css$/i,\n        use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],\n      },\n    ],\n  },\n}\n```\n\nThen create a CSS file that imports Tailwind:\n\n```css\n/* src/index.css */\n@import 'tailwindcss';\n```\n\n### Options\n\n#### `base`\n\nThe base directory to scan for class candidates. Defaults to the current working directory.\n\n```javascript\n{\n  loader: '@tailwindcss/webpack',\n  options: {\n    base: process.cwd(),\n  },\n}\n```\n\n#### `optimize`\n\nWhether to optimize and minify the output CSS. Defaults to `true` in production mode.\n\n```javascript\n{\n  loader: '@tailwindcss/webpack',\n  options: {\n    optimize: true, // or { minify: true }\n  },\n}\n```\n\n<!-- File: packages/tailwindcss/README.md (Tokens: ~487 | Category: plugin-manifest) -->\n<p align=\"center\">\n  <a href=\"https://tailwindcss.com\" target=\"_blank\">\n    <picture>\n      <source media=\"(prefers-color-scheme: dark)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg\">\n      <source media=\"(prefers-color-scheme: light)\" srcset=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\">\n      <img alt=\"Tailwind CSS\" src=\"https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg\" width=\"350\" height=\"70\" style=\"max-width: 100%;\">\n    </picture>\n  </a>\n</p>\n\n<p align=\"center\">\n  A utility-first CSS framework for rapidly building custom user interfaces.\n</p>\n\n<p align=\"center\">\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/actions\"><img src=\"https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main\" alt=\"Build Status\"></a>\n    <a href=\"https://www.npmjs.com/package/tailwindcss\"><img src=\"https://img.shields.io/npm/dt/tailwindcss.svg\" alt=\"Total Downloads\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/releases\"><img src=\"https://img.shields.io/npm/v/tailwindcss.svg\" alt=\"Latest Release\"></a>\n    <a href=\"https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE\"><img src=\"https://img.shields.io/npm/l/tailwindcss.svg\" alt=\"License\"></a>\n</p>\n\n---\n\n## Documentation\n\nFor full documentation, visit [tailwindcss.com](https://tailwindcss.com).\n\n## Community\n\nFor help, discussion about best practices, or feature ideas:\n\n[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)\n\n## Contributing\n\nIf you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.\n\n<!-- File: .cursorrules (html-tailwind-css-javascript-cursorrules-prompt-fi.mdc) (Tokens: ~285 | Category: cursor-rule) -->\n---\ndescription: \"Cursor rules for HTML development with Tailwind CSS and JavaScript integration.\"\nglobs: **/*\nalwaysApply: false\n---\nYou are an expert AI programming assistant that primarily focuses on producing clear, readable HTML, Tailwind CSS and vanilla JavaScript code.\n\nYou always use the latest version of HTML, Tailwind CSS and vanilla JavaScript, and you are familiar with the latest features and best practices.\n\nYou carefully provide accurate, factual, thoughtful answers, and excel at reasoning.\n\n- Follow the user’s requirements carefully & to the letter.\n- Confirm, then write code!\n- Suggest solutions that I didn't think about-anticipate my needs\n- Treat me as an expert\n- Always write correct, up to date, bug free, fully functional and working, secure, performant and efficient code.\n- Focus on readability over being performant.\n- Fully implement all requested functionality.\n- Leave NO todo’s, placeholders or missing pieces.\n- Be concise. Minimize any other prose.\n- Consider new technologies and contrarian ideas, not just the conventional wisdom\n- If you think there might not be a correct answer, you say so. If you do not know the answer, say so instead of guessing.\n- If I ask for adjustments to code, do not repeat all of my code unnecessarily. Instead try to keep the answer brief by giving just a couple lines before/after any changes you make.\n</yakaai_skills>"}