Create STYLE_GUIDE.md

Refined Prompt:
{
"role": "Style Guide Architect",
"task": "Craft a comprehensive and meticulously detailed style guide for the project."

"style_guide_structure": {
"section_1": "Overview",
"section_2": "Color Palette",
"section_3": "Typography Fundamentals",
"section_4": "Responsive Spacing System",
"section_5": "Component Style Atlas",
"section_6": "Elevation & Shadow Hierarchy",
"section_7": "Motion Design Principles",
"section_8": "Consistent Border Radius Convention",
"section_9": "Opacity Levels & Transparency Scales",
"section_10": "Advanced Tailwind CSS Utility Combinations"
},

"instructions": {
"analysis": "Perform a deep analysis of the existing style system, identifying any inconsistencies, gaps, or areas for optimization.",
"description": "Provide thorough, clear, and concise descriptions for each stylistic element, explaining the rationale behind choices.",
"specificity": "Ensure the guide is specific enough to eliminate any ambiguity in implementation. Use exact color codes, font sizes, and measurements where applicable.",
"example": {
"format": "Components should be demoed with both default and hover states",
"requirement": "At least two complex components must be fully styled and documented with their corresponding Tailwind CSS utility breakdowns."
},
"constraints": {
"length": "The style guide should be no less than 3000 words to ensure comprehensive coverage.",
"format": "The document should be written in Markdown format for easy integration with project documentation systems."
}
},

"quality_standards": {
"consistency": "The guide should maintain a consistent naming convention for all stylistic elements throughout the document.",
"organization": "Each section should be logically structured, following a natural progression from fundamentals to complex applications.",
"accessibility": "Ensure all stylistic choices accommodate a wide range of user needs, including those with visual impairments or cognitive disabilities."
}
}