Update app.py

app.py

@@ -16,70 +16,31 @@ from lzstring import LZString
 # =========================
 NEBIUS_BASE_URL = "https://api.studio.nebius.com/v1/"
 
-# Vision models that work well with Nebius
+# Vision models that are confirmed to work with Nebius
 DEFAULT_VISION_MODEL = "Qwen/Qwen2.5-VL-72B-Instruct"
 VISION_MODELS = [
     DEFAULT_VISION_MODEL,
     "Qwen/Qwen2.5-VL-7B-Instruct",
-    "Qwen/Qwen2-VL-72B-Instruct",
-    "Qwen/Qwen2-VL-7B-Instruct",
 ]
 
-# Code generation models with best performance on Nebius
-DEFAULT_CODE_MODEL = "deepseek-ai/DeepSeek-V3"
+# Code generation models confirmed to work on Nebius
+DEFAULT_CODE_MODEL = "Qwen/Qwen2.5-72B-Instruct"
 CODE_MODELS = [
     DEFAULT_CODE_MODEL,
     "Qwen/Qwen2.5-Coder-32B-Instruct",
-    "Qwen/QwQ-32B-Preview",
-    "Qwen/Qwen2.5-72B-Instruct",
     "Qwen/Qwen2.5-7B-Instruct",
+    "deepseek-ai/DeepSeek-V3",
     "deepseek-ai/DeepSeek-R1-Distill-Qwen-32B",
     "deepseek-ai/DeepSeek-R1-Distill-Qwen-7B",
-    "meta-llama/Meta-Llama-3.1-405B-Instruct",
     "meta-llama/Meta-Llama-3.1-70B-Instruct",
     "meta-llama/Meta-Llama-3.1-8B-Instruct",
-    "meta-llama/Llama-3.2-90B-Vision-Instruct",
-    "meta-llama/Llama-3.2-11B-Vision-Instruct",
-    "mistralai/Mixtral-8x22B-Instruct-v0.1",
-    "mistralai/Mixtral-8x7B-Instruct-v0.1",
-    "mistralai/Mistral-7B-Instruct-v0.3",
-    "mistralai/Mistral-Nemo-Instruct-2407",
-    "mistralai/Pixtral-12B-2409",
-    "nvidia/Llama-3.1-Nemotron-70B-Instruct-HF",
 ]
 
-# Model capabilities mapping (for better selection)
-MODEL_CAPABILITIES = {
-    "vision": [
-        "Qwen/Qwen2.5-VL-72B-Instruct",
-        "Qwen/Qwen2.5-VL-7B-Instruct",
-        "Qwen/Qwen2-VL-72B-Instruct",
-        "Qwen/Qwen2-VL-7B-Instruct",
-        "meta-llama/Llama-3.2-90B-Vision-Instruct",
-        "meta-llama/Llama-3.2-11B-Vision-Instruct",
-        "mistralai/Pixtral-12B-2409",
-    ],
-    "code": [
-        "deepseek-ai/DeepSeek-V3",
-        "Qwen/Qwen2.5-Coder-32B-Instruct",
-        "Qwen/QwQ-32B-Preview",
-        "deepseek-ai/DeepSeek-R1-Distill-Qwen-32B",
-        "deepseek-ai/DeepSeek-R1-Distill-Qwen-7B",
-    ],
-    "general": [
-        "Qwen/Qwen2.5-72B-Instruct",
-        "meta-llama/Meta-Llama-3.1-405B-Instruct",
-        "meta-llama/Meta-Llama-3.1-70B-Instruct",
-        "nvidia/Llama-3.1-Nemotron-70B-Instruct-HF",
-        "mistralai/Mixtral-8x22B-Instruct-v0.1",
-    ]
-}
-
-# Performance recommendations
+# Performance recommendations based on working models
 MODEL_RECOMMENDATIONS = {
-    "fast": ["Qwen/Qwen2.5-7B-Instruct", "mistralai/Mistral-7B-Instruct-v0.3", "deepseek-ai/DeepSeek-R1-Distill-Qwen-7B"],
-    "balanced": ["Qwen/Qwen2.5-Coder-32B-Instruct", "meta-llama/Meta-Llama-3.1-70B-Instruct", "Qwen/QwQ-32B-Preview"],
-    "quality": ["deepseek-ai/DeepSeek-V3", "meta-llama/Meta-Llama-3.1-405B-Instruct", "Qwen/Qwen2.5-72B-Instruct"],
+    "fast": ["Qwen/Qwen2.5-7B-Instruct", "deepseek-ai/DeepSeek-R1-Distill-Qwen-7B", "meta-llama/Meta-Llama-3.1-8B-Instruct"],
+    "balanced": ["Qwen/Qwen2.5-Coder-32B-Instruct", "deepseek-ai/DeepSeek-R1-Distill-Qwen-32B"],
+    "quality": ["Qwen/Qwen2.5-72B-Instruct", "deepseek-ai/DeepSeek-V3", "meta-llama/Meta-Llama-3.1-70B-Instruct"],
 }
 
 # Timeouts and retries
@@ -91,10 +52,6 @@ DEFAULT_NEBIUS_API_KEY = (
     "eyJhbGciOiJIUzI1NiIsImtpZCI6IlV6SXJWd1h0dnprLVRvdzlLZWstc0M1akptWXBvX1VaVkxUZlpnMDRlOFUiLCJ0eXAiOiJKV1QifQ.eyJzdWIiOiJnb29nbGUtb2F1dGgyfDEwNTA1MTQzMDg2MDMwMzIxNDEwMiIsInNjb3BlIjoib3BlbmlkIG9mZmxpbmVfYWNjZXNzIiwiaXNzIjoiYXBpX2tleV9pc3N1ZXIiLCJhdWQiOlsiaHR0cHM6Ly9uZWJpdXMtaW5mZXJlbmNlLmV1LmF1dGgwLmNvbS9hcGkvdjIvIl0sImV4cCI6MTkwNjU5ODA0NCwidXVpZCI6ImNkOGFiMWZlLTIxN2QtNDJlMy04OWUwLWM1YTg4MjcwMGVhNyIsIm5hbWUiOiJodW5nZ2luZyIsImV4cGlyZXNfYXQiOiIyMDMwLTA2LTAyVDAyOjM0OjA0KzAwMDAifQ.MA52QuIiNruK7_lX688RXAEI2TkcCOjcf_02XrpnhI8"
 )
 
-# Cache for available models
-_available_models_cache = None
-_cache_timestamp = 0
-
 # =========================
 # Helpers
 # =========================
@@ -108,74 +65,6 @@ def get_api_key(user_key: str = "") -> str:
     return (user_key or "").strip() or os.getenv("NEBIUS_API_KEY", "").strip() or DEFAULT_NEBIUS_API_KEY
 
 
-def get_available_models(api_key: str) -> Dict[str, List[str]]:
-    """
-    Fetch available models from Nebius API and categorize them.
-    Returns a dict with 'vision' and 'code' keys.
-    """
-    global _available_models_cache, _cache_timestamp
-    import time
-    
-    # Cache for 5 minutes
-    if _available_models_cache and (time.time() - _cache_timestamp) < 300:
-        return _available_models_cache
-    
-    try:
-        url = f"{NEBIUS_BASE_URL}models"
-        headers = {"Authorization": f"Bearer {api_key}"}
-        
-        with httpx.Client(timeout=httpx.Timeout(10.0)) as client:
-            resp = client.get(url, headers=headers)
-            if resp.status_code == 200:
-                data = resp.json()
-                models = data.get("data", [])
-                
-                vision_models = []
-                code_models = []
-                
-                for model in models:
-                    model_id = model.get("id", "")
-                    # Categorize based on known patterns
-                    if any(v in model_id.lower() for v in ["vision", "vl", "pixtral", "llama-3.2-90b", "llama-3.2-11b"]):
-                        vision_models.append(model_id)
-                    if any(c in model_id.lower() for c in ["coder", "deepseek", "instruct", "llama", "mistral", "mixtral", "qwen"]):
-                        code_models.append(model_id)
-                
-                _available_models_cache = {
-                    "vision": vision_models or VISION_MODELS,
-                    "code": code_models or CODE_MODELS
-                }
-                _cache_timestamp = time.time()
-                return _available_models_cache
-    except Exception:
-        pass
-    
-    # Return defaults if API call fails
-    return {"vision": VISION_MODELS, "code": CODE_MODELS}
-
-
-def validate_model_availability(model: str, api_key: str, model_type: str = "general") -> bool:
-    """
-    Check if a model is available by making a test request.
-    """
-    try:
-        test_message = "Hi" if model_type != "vision" else [{"type": "text", "text": "Hi"}]
-        url = f"{NEBIUS_BASE_URL}chat/completions"
-        payload = {
-            "model": model,
-            "messages": [{"role": "user", "content": test_message}],
-            "max_tokens": 10,
-            "temperature": 0.1,
-        }
-        headers = {"Authorization": f"Bearer {api_key}", "Content-Type": "application/json"}
-        
-        with httpx.Client(timeout=httpx.Timeout(5.0)) as client:
-            resp = client.post(url, headers=headers, json=payload)
-            return resp.status_code == 200
-    except Exception:
-        return False
-
-
 def call_chat_completions(
     model: str,
     messages: list,
@@ -215,7 +104,7 @@ def call_chat_completions(
                         # Try a fallback model
                         fallback_models = {
                             "vision": ["Qwen/Qwen2.5-VL-7B-Instruct"],
-                            "code": ["Qwen/Qwen2.5-7B-Instruct", "mistralai/Mistral-7B-Instruct-v0.3"],
+                            "code": ["Qwen/Qwen2.5-7B-Instruct"],
                         }
                         
                         # Detect model type and use appropriate fallback
@@ -258,8 +147,7 @@ def call_chat_completions(
 
 def _strip_fenced_code(text: str) -> str:
     """
-    Removes ```html ... ``` fences from a content block if present.
-    Also handles other code fence variations.
+    Removes code fences from a content block if present.
     """
     s = text.strip()
     
@@ -271,24 +159,39 @@ def _strip_fenced_code(text: str) -> str:
     ]
     
     for start_pattern, end_pattern in patterns:
-        if re.match(start_pattern, s):
-            s = re.sub(start_pattern, '', s)
-            s = re.sub(end_pattern, '', s)
+        if re.match(start_pattern, s, re.IGNORECASE):
+            s = re.sub(start_pattern, '', s, flags=re.IGNORECASE)
+            s = re.sub(end_pattern, '', s, flags=re.IGNORECASE)
             break
     
     return s.strip()
 
 
-def ensure_complete_html(html_code: str) -> str:
+def ensure_complete_html_with_css(html_code: str) -> str:
     """
     Ensures the HTML code is complete with proper structure and inline CSS.
+    Forces inclusion of styles within the HTML document.
     """
     # Check if it's already a complete HTML document
-    if "<!DOCTYPE html>" in html_code.upper() and "<html" in html_code.lower():
+    has_doctype = "<!DOCTYPE html>" in html_code.upper()
+    has_html_tag = "<html" in html_code.lower()
+    has_style = "<style" in html_code.lower() or "style=" in html_code.lower()
+    
+    # If it's complete and has styles, return as is
+    if has_doctype and has_html_tag and has_style:
         return html_code
     
-    # If it's just a fragment, wrap it in a complete HTML structure
-    if not "<html" in html_code.lower():
+    # If it's missing styles or structure, create a complete document
+    if not has_doctype or not has_html_tag:
+        # Extract any existing styles
+        existing_styles = ""
+        style_matches = re.findall(r'<style[^>]*>(.*?)</style>', html_code, re.IGNORECASE | re.DOTALL)
+        if style_matches:
+            existing_styles = '\n'.join(style_matches)
+        
+        # Remove style tags from body content
+        body_content = re.sub(r'<style[^>]*>.*?</style>', '', html_code, flags=re.IGNORECASE | re.DOTALL)
+        
         html_code = f"""<!DOCTYPE html>
 <html lang="en">
 <head>
@@ -303,17 +206,30 @@ def ensure_complete_html(html_code: str) -> str:
             box-sizing: border-box;
         }}
         body {{
-            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
             line-height: 1.6;
-            color: #333;
+            color: #1a202c;
         }}
+        .container {{
+            max-width: 1200px;
+            margin: 0 auto;
+            padding: 0 20px;
+        }}
+        {existing_styles}
     </style>
 </head>
 <body>
-    {html_code}
+    {body_content}
 </body>
 </html>"""
     
+    # Ensure TailwindCSS is included
+    if "tailwindcss" not in html_code.lower():
+        html_code = html_code.replace(
+            "</head>",
+            '    <script src="https://cdn.tailwindcss.com"></script>\n</head>'
+        )
+    
     return html_code
 
 
@@ -361,8 +277,6 @@ def _split_assets(html_code: str) -> Tuple[str, str, str]:
                 html,
                 flags=re.IGNORECASE,
             )
-        else:
-            html = f"<!DOCTYPE html>\n<html>\n<head>\n  <meta charset=\"utf-8\"/>\n  <link rel=\"stylesheet\" href=\"style.css\">\n</head>\n{html}"
 
     # If JS collected, ensure script tag before </body> or at end
     if js_text:
@@ -373,8 +287,6 @@ def _split_assets(html_code: str) -> Tuple[str, str, str]:
                 html,
                 flags=re.IGNORECASE,
             )
-        else:
-            html = html.rstrip() + '\n  <script src="script.js"></script>\n'
 
     return html, css_text, js_text
 
@@ -388,7 +300,7 @@ def analyze_image(
     vision_model: str = DEFAULT_VISION_MODEL,
 ) -> str:
     """
-    Analyze an uploaded image and provide a concise description of its content and layout.
+    Analyze an uploaded image and provide a detailed description of its content and layout.
     """
     if image is None:
         return "Error: No image provided."
@@ -409,17 +321,19 @@ def analyze_image(
         img_b64 = base64.b64encode(buffered.getvalue()).decode("utf-8")
 
         prompt = (
-            "Analyze this image and provide a detailed description for recreating it as a website. "
-            "Include: "
-            "1. Layout structure (header, sections, footer, grid/flex layouts) "
-            "2. Color scheme (exact colors if possible) "
-            "3. Typography (font sizes, weights, styles) "
-            "4. UI components (buttons, forms, cards, navigation) "
-            "5. Images and media placement "
-            "6. Spacing and alignment "
-            "7. Any animations or interactive elements visible "
-            "8. Responsive design considerations "
-            "Be specific about CSS properties and HTML structure needed."
+            "Analyze this image and provide a comprehensive description for recreating it as a website. "
+            "Include the following details:\n"
+            "1. Overall layout structure (header, main sections, sidebars, footer)\n"
+            "2. Color scheme with specific hex codes or RGB values if identifiable\n"
+            "3. Typography details (font families, sizes, weights, line heights)\n"
+            "4. UI components (navigation bars, buttons, forms, cards, modals, etc.)\n"
+            "5. Content sections and their arrangement\n"
+            "6. Images, icons, and media elements placement\n"
+            "7. Spacing, padding, and margins between elements\n"
+            "8. Any animations, hover effects, or interactive elements visible\n"
+            "9. Responsive design considerations and breakpoints\n"
+            "10. Background patterns, gradients, or textures\n"
+            "Be as specific as possible about CSS properties and HTML structure needed."
         )
 
         messages = [
@@ -437,7 +351,7 @@ def analyze_image(
             model=vision_model,
             messages=messages,
             api_key=api_key,
-            max_tokens=1500,
+            max_tokens=2000,
             temperature=0.7,
             retry_with_fallback=True,
         )
@@ -445,7 +359,7 @@ def analyze_image(
     except Exception as e:
         error_msg = str(e)
         if "404" in error_msg or "not found" in error_msg.lower():
-            return f"Error: Model '{vision_model}' not available. Try using one of the recommended vision models: {', '.join(VISION_MODELS[:3])}"
+            return f"Error: Model '{vision_model}' not available. Try using: {', '.join(VISION_MODELS)}"
         return f"Error analyzing image: {error_msg}"
 
 
@@ -457,7 +371,7 @@ def generate_html_code(
     code_temperature: float = 0.7,
 ) -> str:
     """
-    Generate HTML/CSS/JavaScript code based on a website description.
+    Generate complete HTML/CSS/JavaScript code based on a website description.
     """
     if not description or description.startswith("Error"):
         return "Error: Invalid or missing description."
@@ -467,30 +381,36 @@ def generate_html_code(
         return "Error: Nebius API key not provided."
 
     prompt = f"""
-Generate a complete, single-file HTML webpage based on this description:
+You are an expert web developer. Generate a complete, single-file HTML webpage based on this description:
 
 {description}
 
-REQUIREMENTS:
-1. Create a SINGLE HTML file with ALL styles and scripts INLINE
-2. Use modern HTML5 semantic elements
-3. Include ALL CSS inside <style> tags in the <head>
-4. Include ALL JavaScript inside <script> tags before </body>
-5. Use TailwindCSS via CDN: <script src="https://cdn.tailwindcss.com"></script>
-6. Add custom CSS for animations and advanced styling in <style> tags
-7. Make it fully responsive using Tailwind classes and/or CSS media queries
-8. Use placeholder images from: https://picsum.photos/WIDTH/HEIGHT
-9. Include smooth animations and transitions
-10. Add interactive JavaScript for any dynamic elements
-11. Use modern CSS features (flexbox, grid, custom properties)
-12. Include proper meta tags for viewport and charset
-13. Ensure high contrast and readability
-14. DO NOT split code into separate files
-15. DO NOT use external CSS files
-16. ALL styles must be inline in the HTML
-
-The response must be a complete HTML document starting with <!DOCTYPE html> and ending with </html>.
-Include ALL styling inline. Do not reference external CSS files.
+CRITICAL REQUIREMENTS:
+1. Create ONE SINGLE HTML file with ALL code inline
+2. Include ALL CSS inside <style> tags within the <head> section
+3. Include ALL JavaScript inside <script> tags before the closing </body> tag
+4. Use TailwindCSS via CDN: <script src="https://cdn.tailwindcss.com"></script>
+5. Combine Tailwind utility classes with custom CSS in <style> tags
+6. Make the page fully responsive with mobile-first design
+7. Use high-quality placeholder images from: https://picsum.photos/WIDTH/HEIGHT
+8. Add smooth transitions and hover effects
+9. Include interactive JavaScript for dynamic functionality
+10. Use semantic HTML5 elements
+11. Add proper meta tags for viewport and charset
+12. Ensure accessibility with proper ARIA labels
+13. Use modern CSS (flexbox, grid, custom properties)
+14. DO NOT create separate files
+15. DO NOT reference external stylesheets except CDNs
+16. ALL custom styles MUST be in <style> tags
+
+OUTPUT FORMAT:
+- Start with: <!DOCTYPE html>
+- End with: </html>
+- Include complete HTML structure
+- All CSS in <style> tags
+- All JS in <script> tags
+
+Provide ONLY the HTML code, no explanations or markdown fences.
 """.strip()
 
     try:
@@ -506,7 +426,7 @@ Include ALL styling inline. Do not reference external CSS files.
         
         # Clean and validate the HTML
         html_code = _strip_fenced_code(content)
-        html_code = ensure_complete_html(html_code)
+        html_code = ensure_complete_html_with_css(html_code)
         
         # Extract the complete HTML document
         if "<!DOCTYPE html>" in html_code.upper():
@@ -527,17 +447,16 @@ Include ALL styling inline. Do not reference external CSS files.
     except Exception as e:
         error_msg = str(e)
         if "404" in error_msg or "not found" in error_msg.lower():
-            return f"Error: Model '{code_model}' not available. Try using one of the recommended code models: {', '.join(CODE_MODELS[:3])}"
+            return f"Error: Model '{code_model}' not available. Try using: {', '.join(CODE_MODELS[:3])}"
         if "timeout" in error_msg.lower():
-            return f"Error: Request timed out. Try reducing max tokens or using a faster model like: {', '.join(MODEL_RECOMMENDATIONS['fast'])}"
+            return f"Error: Request timed out. Try reducing max tokens or using: {', '.join(MODEL_RECOMMENDATIONS['fast'])}"
         return f"Error generating HTML code: {error_msg}"
 
 
 def create_codesandbox(html_code: str) -> str:
     """
     Create a CodeSandbox project from HTML code.
-    Splits inline CSS/JS into separate files so you can open index.html and style.css directly.
-    Returns Markdown with direct links to open index.html (and style.css/script.js if present) in the editor.
+    Returns Markdown with direct links to open files in the editor.
     """
     if not html_code or html_code.startswith("Error"):
         return "Error: No valid HTML code provided."
@@ -553,7 +472,7 @@ def create_codesandbox(html_code: str) -> str:
         if js_text:
             files["script.js"] = {"content": js_text, "isBinary": False}
 
-        # package.json is optional for static template
+        # package.json for static template
         files["package.json"] = {
             "content": json.dumps(
                 {
@@ -571,15 +490,13 @@ def create_codesandbox(html_code: str) -> str:
 
         parameters = {"files": files, "template": "static"}
 
-        # Fallback GET URL with compressed parameters
+        # Create compressed URL parameters
         json_str = json.dumps(parameters, separators=(",", ":"))
         lz = LZString()
         compressed = lz.compressToBase64(json_str)
         compressed = compressed.replace("+", "-").replace("/", "_").rstrip("=")
         prefill_base = "https://codesandbox.io/api/v1/sandboxes/define"
         prefill_index = f"{prefill_base}?parameters={compressed}&file=/index.html"
-        prefill_css = f"{prefill_base}?parameters={compressed}&file=/style.css" if "style.css" in files else ""
-        prefill_js = f"{prefill_base}?parameters={compressed}&file=/script.js" if "script.js" in files else ""
 
         # Try POST API to get a sandbox_id
         url = "https://codesandbox.io/api/v1/sandboxes/define"
@@ -594,25 +511,13 @@ def create_codesandbox(html_code: str) -> str:
                     preview_base = f"https://codesandbox.io/s/{sandbox_id}"
                     lines = [
                         f"**Successfully deployed to CodeSandbox!**\n",
-                        f"- Open index.html in editor: [{editor_base}?file=/index.html]({editor_base}?file=/index.html)",
+                        f"- Editor: [{editor_base}]({editor_base}?file=/index.html)",
+                        f"- Live Preview: [{preview_base}]({preview_base})",
                     ]
-                    if "style.css" in files:
-                        lines.append(f"- Open style.css in editor: [{editor_base}?file=/style.css]({editor_base}?file=/style.css)")
-                    if "script.js" in files:
-                        lines.append(f"- Open script.js in editor: [{editor_base}?file=/script.js]({editor_base}?file=/script.js)")
-                    lines.append(f"- Live preview: [{preview_base}]({preview_base})")
                     return "\n".join(lines)
 
-        # Fallback to prefill URLs if POST fails
-        lines = [
-            "**CodeSandbox Links (click to deploy):**\n",
-            f"- Open index.html: [{prefill_index}]({prefill_index})"
-        ]
-        if prefill_css:
-            lines.append(f"- Open style.css: [{prefill_css}]({prefill_css})")
-        if prefill_js:
-            lines.append(f"- Open script.js: [{prefill_js}]({prefill_js})")
-        return "\n".join(lines)
+        # Fallback to prefill URL
+        return f"**Click to deploy to CodeSandbox:**\n[Open in CodeSandbox]({prefill_index})"
 
     except Exception as e:
         return f"Error creating CodeSandbox: {str(e)}"
@@ -671,9 +576,9 @@ def get_model_recommendations(performance_tier: str) -> Tuple[str, str]:
     Returns (vision_model, code_model)
     """
     tier_map = {
-        "Fast (7B models)": ("Qwen/Qwen2.5-VL-7B-Instruct", "deepseek-ai/DeepSeek-R1-Distill-Qwen-7B"),
-        "Balanced (32B-70B)": ("Qwen/Qwen2.5-VL-72B-Instruct", "Qwen/Qwen2.5-Coder-32B-Instruct"),
-        "Quality (Large models)": ("Qwen/Qwen2.5-VL-72B-Instruct", "deepseek-ai/DeepSeek-V3"),
+        "Fast (7B-8B models)": ("Qwen/Qwen2.5-VL-7B-Instruct", "Qwen/Qwen2.5-7B-Instruct"),
+        "Balanced (32B models)": ("Qwen/Qwen2.5-VL-7B-Instruct", "Qwen/Qwen2.5-Coder-32B-Instruct"),
+        "Quality (70B+ models)": ("Qwen/Qwen2.5-VL-72B-Instruct", "Qwen/Qwen2.5-72B-Instruct"),
     }
     return tier_map.get(performance_tier, (DEFAULT_VISION_MODEL, DEFAULT_CODE_MODEL))
 
@@ -681,53 +586,53 @@ def get_model_recommendations(performance_tier: str) -> Tuple[str, str]:
 # =========================
 # Gradio UI
 # =========================
-BRIZY_PRIMARY = "#6C5CE7"
-BRIZY_SECONDARY = "#00C2FF"
-BRIZY_BG = "#F7F9FC"
-BRIZY_SURFACE = "#FFFFFF"
-BRIZY_TEXT = "#1F2937"
-BRIZY_MUTED = "#6B7280"
-BRIZY_BORDER = "#E5E7EB"
-BRIZY_GRADIENT = f"linear-gradient(135deg, {BRIZY_PRIMARY} 0%, {BRIZY_SECONDARY} 100%)"
+THEME_PRIMARY = "#6C5CE7"
+THEME_SECONDARY = "#00C2FF"
+THEME_BG = "#F7F9FC"
+THEME_SURFACE = "#FFFFFF"
+THEME_TEXT = "#1F2937"
+THEME_MUTED = "#6B7280"
+THEME_BORDER = "#E5E7EB"
+THEME_GRADIENT = f"linear-gradient(135deg, {THEME_PRIMARY} 0%, {THEME_SECONDARY} 100%)"
 
 custom_css = f"""
     :root {{
-        --app-primary: {BRIZY_PRIMARY};
-        --app-secondary: {BRIZY_SECONDARY};
-        --app-bg: {BRIZY_BG};
-        --app-surface: {BRIZY_SURFACE};
-        --app-text: {BRIZY_TEXT};
-        --app-muted: {BRIZY_MUTED};
-        --app-border: {BRIZY_BORDER};
+        --primary: {THEME_PRIMARY};
+        --secondary: {THEME_SECONDARY};
+        --bg: {THEME_BG};
+        --surface: {THEME_SURFACE};
+        --text: {THEME_TEXT};
+        --muted: {THEME_MUTED};
+        --border: {THEME_BORDER};
     }}
 
     body {{
-        background: var(--app-bg);
-        color: var(--app-text);
+        background: var(--bg);
+        color: var(--text);
     }}
 
     .section {{
-        border: 1px solid var(--app-border);
+        border: 1px solid var(--border);
         padding: 16px;
         border-radius: 12px;
-        background: var(--app-surface);
+        background: var(--surface);
         box-shadow: 0 1px 2px rgba(0,0,0,0.03);
         margin: 10px 0;
     }}
 
     .muted {{
-        color: var(--app-muted);
+        color: var(--muted);
         font-size: 0.92em;
     }}
 
     .footer {{
         text-align: center;
-        color: var(--app-muted);
+        color: var(--muted);
         padding: 8px 0;
     }}
 
     .title h1 {{
-        background: {BRIZY_GRADIENT};
+        background: {THEME_GRADIENT};
         -webkit-background-clip: text;
         background-clip: text;
         color: transparent;
@@ -736,7 +641,7 @@ custom_css = f"""
     }}
 
     .primary-btn button {{
-        background: {BRIZY_GRADIENT} !important;
+        background: {THEME_GRADIENT} !important;
         color: #fff !important;
         border: none !important;
         font-weight: 600 !important;
@@ -750,56 +655,21 @@ custom_css = f"""
     }}
 
     .secondary-btn button {{
-        background: var(--app-surface) !important;
-        color: var(--app-text) !important;
-        border: 1px solid var(--app-border) !important;
+        background: var(--surface) !important;
+        color: var(--text) !important;
+        border: 1px solid var(--border) !important;
         font-weight: 500 !important;
     }}
     .secondary-btn button:hover {{
-        border-color: {BRIZY_PRIMARY} !important;
-        color: {BRIZY_PRIMARY} !important;
+        border-color: {THEME_PRIMARY} !important;
+        color: {THEME_PRIMARY} !important;
     }}
 
-    /* Inputs focus */
     input:focus, textarea:focus, select:focus {{
-        outline-color: {BRIZY_PRIMARY} !important;
-        border-color: {BRIZY_PRIMARY} !important;
+        outline-color: {THEME_PRIMARY} !important;
+        border-color: {THEME_PRIMARY} !important;
         box-shadow: 0 0 0 3px rgba(108,92,231,0.15) !important;
     }}
-
-    /* Code block accents */
-    .gr-code .cm-editor, .gr-code textarea {{
-        border-radius: 10px !important;
-        border: 1px solid var(--app-border) !important;
-    }}
-
-    /* Tabs accent */
-    .gradio-container .tabs .tab-nav button[aria-selected="true"] {{
-        color: {BRIZY_PRIMARY} !important;
-        border-bottom: 2px solid {BRIZY_PRIMARY} !important;
-    }}
-    
-    /* Model recommendation badge */
-    .model-badge {{
-        display: inline-block;
-        padding: 4px 8px;
-        border-radius: 4px;
-        font-size: 12px;
-        font-weight: 600;
-        margin-left: 8px;
-    }}
-    .badge-fast {{
-        background-color: #10B981;
-        color: white;
-    }}
-    .badge-balanced {{
-        background-color: #3B82F6;
-        color: white;
-    }}
-    .badge-quality {{
-        background-color: #8B5CF6;
-        color: white;
-    }}
 """
 
 with gr.Blocks(
@@ -810,27 +680,22 @@ with gr.Blocks(
     gr.Markdown(
         """
 # AI Website Generator (Nebius)
-Turn website screenshots into functional HTML using state-of-the-art Nebius-compatible models.
-
-### Features:
-- **Vision Models**: Qwen VL series, Llama 3.2 Vision, Pixtral for image analysis
-- **Code Models**: DeepSeek V3, Qwen Coder, Llama 3.1, Mixtral for code generation
-- **Smart Fallbacks**: Automatic model switching if primary model is unavailable
-- **One-click Deployment**: Direct CodeSandbox integration
-- **Performance Tiers**: Choose between speed and quality
+Transform website screenshots into functional HTML code using Nebius AI models.
+
+### Key Features:
+- Vision Analysis with Qwen VL models
+- Code Generation with Qwen, DeepSeek, and Llama models  
+- Single-file HTML output with inline CSS
+- Direct CodeSandbox deployment
+- Automatic fallback for unavailable models
         """,
         elem_classes=["title"],
     )
 
-    with gr.Accordion("API & Model Configuration", open=True):
+    with gr.Accordion("Configuration", open=True):
         gr.Markdown(
             """
-            Configure your Nebius API key and select models. The app includes a default key for testing.
-            
-            **Model Recommendations:**
-            - **Fast**: 7B models for quick prototyping
-            - **Balanced**: 32B-70B models for good quality/speed ratio
-            - **Quality**: Large models for best results
+            Configure your API settings and model preferences. A default API key is provided for testing.
             """,
             elem_classes=["muted"]
         )
@@ -839,65 +704,60 @@ Turn website screenshots into functional HTML using state-of-the-art Nebius-comp
             nebius_key = gr.Textbox(
                 label="Nebius API Key",
                 type="password",
-                placeholder="Paste your Nebius API key, or use the default",
+                placeholder="Enter your Nebius API key or use default",
                 value=DEFAULT_NEBIUS_API_KEY,
             )
             performance_tier = gr.Radio(
                 label="Performance Tier",
-                choices=["Fast (7B models)", "Balanced (32B-70B)", "Quality (Large models)"],
-                value="Balanced (32B-70B)",
-                info="Automatically selects optimal models for your needs"
+                choices=["Fast (7B-8B models)", "Balanced (32B models)", "Quality (70B+ models)"],
+                value="Balanced (32B models)",
+                info="Select based on speed vs quality preference"
             )
         
         with gr.Row():
             vision_model_dd = gr.Dropdown(
-                label="Vision Model (for image analysis)",
+                label="Vision Model",
                 choices=VISION_MODELS,
                 value=DEFAULT_VISION_MODEL,
                 allow_custom_value=True,
-                info="Select or type a custom vision-capable model",
+                info="Model for image analysis",
             )
             code_model_dd = gr.Dropdown(
-                label="Code Generation Model",
+                label="Code Model",
                 choices=CODE_MODELS,
                 value=DEFAULT_CODE_MODEL,
                 allow_custom_value=True,
-                info="Select or type a custom code generation model",
+                info="Model for HTML generation",
             )
         
         with gr.Row():
             code_max_tokens = gr.Slider(
-                label="Max tokens (code generation)",
-                minimum=500,
+                label="Max Tokens",
+                minimum=1000,
                 maximum=8000,
-                step=100,
+                step=500,
                 value=4000,
-                info="Lower this if you experience timeouts",
+                info="Lower if experiencing timeouts",
             )
             code_temperature = gr.Slider(
                 label="Temperature",
-                minimum=0.0,
-                maximum=1.5,
+                minimum=0.1,
+                maximum=1.0,
                 step=0.1,
                 value=0.7,
-                info="Higher = more creative, Lower = more consistent",
+                info="Creativity level",
             )
         
-        # Auto-select models based on performance tier
-        def update_models_from_tier(tier):
-            vision, code = get_model_recommendations(tier)
-            return vision, code
-        
         performance_tier.change(
-            fn=update_models_from_tier,
+            fn=get_model_recommendations,
             inputs=[performance_tier],
             outputs=[vision_model_dd, code_model_dd]
         )
 
-    with gr.Tab("Quick Generate"):
+    with gr.Tab("Generate"):
         with gr.Row():
             with gr.Column(scale=1):
-                gr.Markdown("### Step 1: Upload Screenshot", elem_classes=["section"])
+                gr.Markdown("### Upload Screenshot", elem_classes=["section"])
                 image_input = gr.Image(
                     type="pil",
                     label="Website Screenshot",
@@ -907,30 +767,30 @@ Turn website screenshots into functional HTML using state-of-the-art Nebius-comp
                 
                 gr.Markdown(
                     """
-                    **Tips for best results:**
-                    - Use clear, high-quality screenshots
-                    - Include full page layouts
-                    - Avoid complex animations in source
+                    **Best Practices:**
+                    - Use clear, complete screenshots
+                    - Include all important UI elements
+                    - Higher resolution produces better results
                     """,
                     elem_classes=["muted"]
                 )
                 
-                generate_btn = gr.Button("Generate Website", elem_classes=["primary-btn"], size="lg")
+                generate_btn = gr.Button("Generate HTML", elem_classes=["primary-btn"], size="lg")
 
             with gr.Column(scale=2):
-                gr.Markdown("### Step 2: Review Results", elem_classes=["section"])
+                gr.Markdown("### Results", elem_classes=["section"])
                 
                 with gr.Tabs():
                     with gr.TabItem("Analysis"):
                         description_output = gr.Textbox(
-                            label="Image Analysis Result",
+                            label="Image Analysis",
                             lines=8,
                             interactive=False,
                         )
                     
-                    with gr.TabItem("Generated Code"):
+                    with gr.TabItem("HTML Code"):
                         html_output = gr.Code(
-                            label="Generated HTML (copy or download)",
+                            label="Generated HTML",
                             language="html",
                             lines=20,
                         )
@@ -938,55 +798,55 @@ Turn website screenshots into functional HTML using state-of-the-art Nebius-comp
                 with gr.Row():
                     codesandbox_btn = gr.Button("Deploy to CodeSandbox", elem_classes=["secondary-btn"])
                     download_btn = gr.Button("Download HTML", elem_classes=["secondary-btn"])
-                    copy_btn = gr.Button("Copy Code", elem_classes=["secondary-btn"])
 
-                codesandbox_links = gr.Markdown(value="")
+                deployment_result = gr.Markdown(value="")
                 download_file = gr.File(
-                    label="Download (index.html)",
+                    label="Download",
                     interactive=False,
                     visible=False,
                 )
 
-    with gr.Tab("Individual Tools"):
+    with gr.Tab("Tools"):
         with gr.Row():
             with gr.Column():
-                gr.Markdown("### Image Analysis Tool", elem_classes=["section"])
-                img_tool = gr.Image(type="pil", label="Upload Image")
-                analyze_btn = gr.Button("Analyze Image", elem_classes=["secondary-btn"])
-                analysis_result = gr.Textbox(label="Analysis Result", lines=8)
+                gr.Markdown("### Image Analyzer", elem_classes=["section"])
+                img_tool = gr.Image(type="pil", label="Image")
+                analyze_btn = gr.Button("Analyze", elem_classes=["secondary-btn"])
+                analysis_result = gr.Textbox(label="Analysis", lines=8)
 
             with gr.Column():
-                gr.Markdown("### Code Generation Tool", elem_classes=["section"])
+                gr.Markdown("### Code Generator", elem_classes=["section"])
                 desc_input = gr.Textbox(
-                    label="Website Description",
+                    label="Description",
                     lines=6,
-                    placeholder="Describe the website you want to create...\n\nExample: A modern landing page with a hero section, navigation bar, features grid, and contact form..."
+                    placeholder="Describe the website to generate..."
                 )
-                code_btn = gr.Button("Generate Code", elem_classes=["secondary-btn"])
-                code_result = gr.Code(label="Generated Code", language="html", lines=12)
+                code_btn = gr.Button("Generate", elem_classes=["secondary-btn"])
+                code_result = gr.Code(label="HTML Output", language="html", lines=12)
 
-    with gr.Tab("Model Information"):
+    with gr.Tab("Models"):
         gr.Markdown(
             """
-            ## Available Models on Nebius
+            ## Working Models on Nebius
             
-            ### Vision Models (Image Analysis)
-            - **Qwen/Qwen2.5-VL-72B-Instruct** - Best quality, latest Qwen vision model
-            - **Qwen/Qwen2.5-VL-7B-Instruct** - Fast, efficient vision model
-            - **meta-llama/Llama-3.2-90B-Vision-Instruct** - Meta's powerful vision model
-            - **mistralai/Pixtral-12B-2409** - Mistral's vision model
+            ### Vision Models
+            - **Qwen/Qwen2.5-VL-72B-Instruct** - High quality vision analysis
+            - **Qwen/Qwen2.5-VL-7B-Instruct** - Fast vision processing
             
-            ### Code Generation Models
-            - **deepseek-ai/DeepSeek-V3** - State-of-the-art code generation
-            - **Qwen/Qwen2.5-Coder-32B-Instruct** - Specialized for coding tasks
-            - **Qwen/QwQ-32B-Preview** - Advanced reasoning capabilities
-            - **meta-llama/Meta-Llama-3.1-405B-Instruct** - Largest Llama model
-            - **mistralai/Mixtral-8x22B-Instruct-v0.1** - MOE architecture for efficiency
+            ### Code Generation Models  
+            - **Qwen/Qwen2.5-72B-Instruct** - Best overall quality
+            - **Qwen/Qwen2.5-Coder-32B-Instruct** - Optimized for code
+            - **Qwen/Qwen2.5-7B-Instruct** - Fast generation
+            - **deepseek-ai/DeepSeek-V3** - Advanced code generation
+            - **deepseek-ai/DeepSeek-R1-Distill-Qwen-32B** - Balanced performance
+            - **deepseek-ai/DeepSeek-R1-Distill-Qwen-7B** - Fast alternative
+            - **meta-llama/Meta-Llama-3.1-70B-Instruct** - High quality
+            - **meta-llama/Meta-Llama-3.1-8B-Instruct** - Fast Llama option
             
-            ### Performance Guidelines
-            - **Timeouts?** → Reduce max tokens or use smaller models
-            - **Quality issues?** → Use larger models or increase temperature
-            - **Model not found?** → The app will automatically try fallback models
+            ### Tips
+            - Start with Balanced tier for best results
+            - Use Fast tier for quick prototypes
+            - Quality tier for production-ready code
             """,
             elem_classes=["section"]
         )
@@ -994,63 +854,38 @@ Turn website screenshots into functional HTML using state-of-the-art Nebius-comp
     gr.Markdown(
         """
         ---
-        Made with Gradio • Powered by Nebius AI Studio
-        
-        [GitHub](https://github.com) | [Documentation](https://nebius.com/docs) | [API Reference](https://nebius.com/api)
+        Powered by Nebius AI Studio | Built with Gradio
         """,
         elem_classes=["footer"]
     )
 
-    # Event bindings
+    # Event handlers
     generate_btn.click(
         fn=screenshot_to_code,
         inputs=[image_input, nebius_key, vision_model_dd, code_model_dd, code_max_tokens, code_temperature],
         outputs=[description_output, html_output],
     )
 
-    def _deploy_to_codesandbox(html_code: str) -> str:
-        if not html_code or html_code.startswith("Error"):
-            return "**No valid code to deploy.** Generate code first."
-        return create_codesandbox(html_code)
-
     codesandbox_btn.click(
-        fn=_deploy_to_codesandbox,
+        fn=lambda code: create_codesandbox(code) if code and not code.startswith("Error") else "No valid code to deploy.",
         inputs=[html_output],
-        outputs=[codesandbox_links],
+        outputs=[deployment_result],
     )
 
-    def _download_html(html_code: str):
-        path = export_html_to_file(html_code)
-        return gr.update(value=path, visible=bool(path))
-
     download_btn.click(
-        fn=_download_html,
+        fn=lambda code: gr.update(value=export_html_to_file(code), visible=bool(export_html_to_file(code))),
         inputs=[html_output],
         outputs=[download_file],
     )
-    
-    def _copy_to_clipboard(html_code: str) -> str:
-        if not html_code or html_code.startswith("Error"):
-            return "No valid code to copy"
-        # Note: Actual clipboard copying happens client-side
-        return "Code copied to clipboard!"
-    
-    copy_btn.click(
-        fn=_copy_to_clipboard,
-        inputs=[html_output],
-        outputs=[codesandbox_links],
-    )
 
     analyze_btn.click(
-        fn=lambda img, key, vmod: analyze_image(img, key, vmod),
+        fn=analyze_image,
         inputs=[img_tool, nebius_key, vision_model_dd],
         outputs=[analysis_result],
     )
 
     code_btn.click(
-        fn=lambda desc, key, cmod, mtoks, temp: generate_html_code(
-            desc, key, code_model=cmod, code_max_tokens=mtoks, code_temperature=temp
-        ),
+        fn=generate_html_code,
         inputs=[desc_input, nebius_key, code_model_dd, code_max_tokens, code_temperature],
         outputs=[code_result],
     )