Delete app.py

app.py

@@ -1,534 +0,0 @@
-import base64
-import os
-import urllib.parse
-from io import BytesIO
-
-import numpy as np
-import pandas as pd
-import torch
-import gradio as gr
-import faiss
-from datasets import load_dataset
-from PIL import Image
-from transformers import (
-    CLIPModel, CLIPProcessor, pipeline as hf_pipeline,
-    BlipProcessor, BlipForQuestionAnswering,
-    SegformerImageProcessor, AutoModelForSemanticSegmentation,
-)
-from diffusers import StableDiffusionInpaintPipeline
-
-# ---------------------------------------------------------------------------
-# CONFIG
-# ---------------------------------------------------------------------------
-HF_DATASET_REPO = "lihicarmeli/fashion-stylist-multimodal-v2"
-HF_WINNING_MODEL = "openai/clip-vit-base-patch32"
-EMBEDDINGS_FILE = "final_image_embeddings.npy"
-METADATA_FILE = "catalog_metadata.parquet"
-
-DEVICE = "cuda" if torch.cuda.is_available() else "cpu"
-
-# ---------------------------------------------------------------------------
-# LOAD DATA + WINNING EMBEDDING MODEL
-# ---------------------------------------------------------------------------
-print("Loading dataset from HF Hub...")
-ds = load_dataset(HF_DATASET_REPO)
-df = ds["train"].to_pandas()
-images = [ds["train"][i]["image_improved"] for i in range(len(ds["train"]))]
-
-print("Generating Quick Starter sample photos...")
-SAMPLES_DIR = "samples_cache"
-os.makedirs(SAMPLES_DIR, exist_ok=True)
-
-def _pick_index(filter_fn, fallback_idx=0):
-    matches = df[df.apply(filter_fn, axis=1)]
-    return int(matches.index[0]) if len(matches) else fallback_idx
-
-_sample_specs = [
-    ("demo_woman.jpg", lambda r: r["gender"] == "woman"),
-    ("demo_man.jpg", lambda r: r["gender"] == "man"),
-    ("demo_teen.jpg", lambda r: r["age_group"] == "teen"),
-]
-
-SAMPLE_PHOTOS = []
-for _filename, _filt in _sample_specs:
-    _idx = _pick_index(_filt, fallback_idx=len(SAMPLE_PHOTOS))
-    _path = os.path.join(SAMPLES_DIR, _filename)
-    images[_idx].convert("RGB").save(_path)
-    SAMPLE_PHOTOS.append(_path)
-
-print("Loading precomputed embeddings...")
-image_embeddings = np.load(EMBEDDINGS_FILE).astype("float32")
-
-print("Loading winning embedding model (CLIP)...")
-win_model = CLIPModel.from_pretrained(HF_WINNING_MODEL).to(DEVICE).eval()
-win_processor = CLIPProcessor.from_pretrained(HF_WINNING_MODEL)
-
-print("Building FAISS index...")
-dimension = image_embeddings.shape[1]
-faiss_img_index = faiss.IndexFlatL2(dimension)
-faiss.normalize_L2(image_embeddings)
-faiss_img_index.add(image_embeddings)
-
-# ---------------------------------------------------------------------------
-# GENERATION MODELS
-# ---------------------------------------------------------------------------
-print("Loading text and VQA generation pipelines...")
-caption_gen_pipe = hf_pipeline("text-generation", model="Qwen/Qwen2.5-0.5B-Instruct", device=0 if DEVICE == "cuda" else -1)
-vqa_processor = BlipProcessor.from_pretrained("Salesforce/blip-vqa-base")
-vqa_model = BlipForQuestionAnswering.from_pretrained("Salesforce/blip-vqa-base").to(DEVICE)
-
-print("Loading clothing segmentation and Stable Diffusion pipelines...")
-seg_processor = SegformerImageProcessor.from_pretrained("mattmdjaga/segformer_b2_clothes")
-seg_model = AutoModelForSemanticSegmentation.from_pretrained("mattmdjaga/segformer_b2_clothes").to(DEVICE)
-inpaint_pipe = StableDiffusionInpaintPipeline.from_pretrained(
-    "runwayml/stable-diffusion-inpainting",
-    torch_dtype=torch.float16 if DEVICE == "cuda" else torch.float32,
-    safety_checker=None,
-).to(DEVICE)
-
-GENDERS = sorted(df["gender"].unique().tolist())
-AGE_GROUPS = sorted(df["age_group"].unique().tolist())
-SKIN_TONES = sorted(df["skin_tone"].unique().tolist())
-UNDERTONES = sorted(df["undertone"].unique().tolist())
-STYLES = sorted(df["style_preference"].unique().tolist())
-
-# ---------------------------------------------------------------------------
-# UTILS & VISUAL CONFIG
-# ---------------------------------------------------------------------------
-_SWATCH_CSS = {
-    "ice white": "#f4f3ee", "bold blue": "#1d4ed8", "royal blue": "#1e3a8a",
-    "fuchsia": "#c026d3", "cool red": "#dc2626", "deep teal": "#0f766e",
-    "plum": "#6b21a8", "silver": "#cbd5e1", "bright pink": "#ec4899",
-    "deep jewel tones": "#581c87", "rust": "#b45309", "camel": "#c19a6b",
-    "coral": "#fb7185", "ivory": "#fffff0", "olive": "#65730a",
-    "terracotta": "#c2643a", "peach": "#FBC299", "warm camel": "#C69E6E"
-}
-
-def _swatch_color(name):
-    key = str(name).strip().lower()
-    if key in _SWATCH_CSS:
-        return _SWATCH_CSS[key]
-    palette = ["#b45309", "#1d4ed8", "#c026d3", "#0f766e", "#dc2626", "#6b21a8"]
-    return palette[hash(key) % len(palette)]
-
-def _lighten_hex(hex_color, factor=0.85):
-    hex_color = hex_color.lstrip("#")
-    if len(hex_color) != 6:
-        return "#F5E6E1"
-    r, g, b = int(hex_color[0:2], 16), int(hex_color[2:4], 16), int(hex_color[4:6], 16)
-    r = int(r + (255 - r) * factor)
-    g = int(g + (255 - g) * factor)
-    b = int(b + (255 - b) * factor)
-    return f"#{r:02x}{g:02x}{b:02x}"
-
-_PALETTE_NAMES = {
-    "fair":   {"cool": "Porcelain Frost",   "warm": "Champagne Silk",  "neutral": "Pale Linen"},
-    "light":  {"cool": "Moonlit Pearl",     "warm": "Gilded Honey",    "neutral": "Quiet Ivory"},
-    "medium": {"cool": "Dusk Orchid",       "warm": "Spiced Amber",    "neutral": "Warm Alabaster"},
-    "olive":  {"cool": "Sage Noir",         "warm": "Burnished Olive", "neutral": "Terracotta Earth"},
-    "tan":    {"cool": "Copper Veil",       "warm": "Gilded Sand",     "neutral": "Desert Rosé"},
-    "deep":   {"cool": "Midnight Sapphire", "warm": "Mahogany Gold",   "neutral": "Onyx Velvet"},
-}
-
-def get_palette_name(skin_tone, undertone):
-    return _PALETTE_NAMES.get(str(skin_tone).strip().lower(), {}).get(
-        str(undertone).strip().lower(), "Signature Palette"
-    )
-
-def pil_to_base64(img, max_size=280):
-    img = img.convert("RGB").copy()
-    img.thumbnail((max_size, max_size))
-    buf = BytesIO()
-    img.save(buf, format="JPEG", quality=85)
-    return base64.b64encode(buf.getvalue()).decode("utf-8")
-
-# ---------------------------------------------------------------------------
-# EMBEDDING + FAISS SEARCH
-# ---------------------------------------------------------------------------
-@torch.no_grad()
-def embed_query_image(pil_image):
-    inputs = win_processor(images=pil_image, return_tensors="pt").to(DEVICE)
-    outputs = win_model(**inputs)
-    
-    if hasattr(outputs, "image_embeds") and outputs.image_embeds is not None:
-        feats = outputs.image_embeds
-    elif hasattr(outputs, "pooler_output") and outputs.pooler_output is not None:
-        feats = outputs.pooler_output
-    elif isinstance(outputs, tuple) or isinstance(outputs, list):
-        feats = outputs[0]
-    else:
-        feats = outputs
-
-    if hasattr(feats, "detach"):
-        feats = feats.detach()
-    return feats.cpu().numpy().astype("float32")
-
-@torch.no_grad()
-def embed_query_text(sentence):
-    inputs = win_processor(text=[sentence], return_tensors="pt", padding=True, truncation=True).to(DEVICE)
-    outputs = win_model(**inputs)
-    
-    if hasattr(outputs, "text_embeds") and outputs.text_embeds is not None:
-        feats = outputs.text_embeds
-    elif hasattr(outputs, "pooler_output") and outputs.pooler_output is not None:
-        feats = outputs.pooler_output
-    elif isinstance(outputs, tuple) or isinstance(outputs, list):
-        feats = outputs[0]
-    else:
-        feats = outputs
-        
-    if hasattr(feats, "detach"):
-        feats = feats.detach()
-    return feats.cpu().numpy().astype("float32")
-
-def build_feature_sentence(skin_tone, undertone, style_preference, gender=None, age_group=None):
-    descriptor = " ".join(p for p in [age_group, gender] if p) or "person"
-    return f"a {descriptor} with {skin_tone} skin tone and {undertone} undertone, wearing a {style_preference} style outfit"
-
-def faiss_filtered_search(query_emb, top_k=3, exclude_idx=None, gender=None, age_group=None):
-    faiss.normalize_L2(query_emb)
-    k = len(df)
-    distances, indices = faiss_img_index.search(query_emb, k)
-    distances, indices = distances[0], indices[0]
-
-    def collect(require_gender, require_age):
-        kept_i, kept_d = [], []
-        for idx, dist in zip(indices, distances):
-            if idx == -1 or (exclude_idx is not None and idx == exclude_idx):
-                continue
-            row = df.iloc[idx]
-            # תיקון השגיאה: החלפת ה-&& ב-and פייתון תקני לחלוטין
-            if require_gender and gender and str(row["gender"]).lower() != str(gender).lower():
-                continue
-            if require_age and age_group and str(row["age_group"]).lower() != str(age_group).lower():
-                continue
-            kept_i.append(idx)
-            kept_d.append(dist)
-            if len(kept_i) == top_k:
-                break
-        return kept_i, kept_d
-
-    kept_i, kept_d = collect(True, True)
-    if len(kept_i) < top_k:
-        kept_i, kept_d = collect(True, False)
-    if len(kept_i) < top_k:
-        kept_i, kept_d = collect(False, False)
-
-    return np.array(kept_i), df.iloc[kept_i], np.array(kept_d)
-
-# ---------------------------------------------------------------------------
-# PATTERN LOGIC & COMPONENT BUILDERS
-# ---------------------------------------------------------------------------
-def generate_stylist_caption(row):
-    user_prompt = (
-        f"Write one short, warm sentence (max 25 words) from a fashion stylist, recommending this look: "
-        f"a {row['style_preference']} style outfit in {row['primary_color']} and {row['secondary_color']}. "
-        f"Be specific and stylish, no hashtags."
-    )
-    messages = [{"role": "user", "content": user_prompt}]
-    output = caption_gen_pipe(messages, max_new_tokens=40, do_sample=True, temperature=0.7)
-    return output[0]["generated_text"][-1]["content"].strip()
-
-@torch.no_grad()
-def answer_question_about_image(pil_image, question):
-    inputs = vqa_processor(pil_image.convert("RGB"), question, return_tensors="pt").to(DEVICE)
-    output_ids = vqa_model.generate(**inputs, max_new_tokens=20)
-    return vqa_processor.decode(output_ids[0], skip_special_tokens=True)
-
-@torch.no_grad()
-def get_face_protect_mask(pil_image, use_geometric_fallback=True):
-    inputs = seg_processor(images=pil_image, return_tensors="pt").to(DEVICE)
-    logits = seg_model(**inputs).logits
-    upsampled = torch.nn.functional.interpolate(logits, size=pil_image.size[::-1], mode="bilinear", align_corners=False)
-    pred_seg = upsampled.argmax(dim=1)[0].cpu().numpy()
-    seg_protect = np.isin(pred_seg, [11, 2])
-    if not use_geometric_fallback:
-        return seg_protect
-    h, w = seg_protect.shape
-    yy, xx = np.mgrid[0:h, 0:w]
-    geometric_protect = (((xx - w*0.5) / (w*0.22)) ** 2 + ((yy - h*0.42) / (h*0.30)) ** 2) <= 1.0
-    return seg_protect | geometric_protect
-
-def generate_new_outfit_image(pil_image, row, target_gender=None):
-    base = pil_image.convert("RGB")
-    protect = get_face_protect_mask(base)
-    canvas_w, canvas_h = 512, 1024
-    head_w = int(canvas_w * 0.45)
-    scale = head_w / base.width
-    head_h = int(base.height * scale)
-    
-    resized_face_crop = base.resize((head_w, head_h))
-    resized_protect_img = Image.fromarray(protect.astype(np.uint8) * 255).resize((head_w, head_h), resample=Image.NEAREST)
-    
-    # תיקון סדר שורות: המיקומים paste_x ו-paste_y מוגדרים כאן לפני השימוש בהם
-    paste_x = (canvas_w - head_w) // 2
-    paste_y = int(canvas_h * 0.03)
-    
-    canvas = Image.new("RGB", (canvas_w, canvas_h), color=(240, 238, 235))
-    canvas.paste(resized_face_crop, (paste_x, paste_y))
-    
-    mask_arr = np.full((canvas_h, canvas_w), 255, dtype=np.uint8)
-    mask_arr[paste_y:paste_y + head_h, paste_x:paste_x + head_w][np.array(resized_protect_img) > 127] = 0
-    mask = Image.fromarray(mask_arr).convert("L")
-    
-    gender_word = "man" if str(row["gender"]).lower() in ("man", "male") else "woman"
-    prompt = (
-        f"full body fashion photo of a {row['age_group']} {gender_word}, standing, wearing a {row['style_preference']} style outfit: "
-        f"{row['outfit_top']}, {row['outfit_bottom']}, {row['outfit_shoes']}, in {row['primary_color']}, quality photography"
-    )
-    generated = inpaint_pipe(prompt=prompt, image=canvas, mask_image=mask, num_inference_steps=25, height=canvas_h, width=canvas_w).images[0]
-    return Image.composite(generated, canvas, mask), prompt
-
-def build_style_card_html(row, caption):
-    colors = [c.strip() for c in str(row["recommended_colors"]).split(",") if c.strip()][:4]
-    swatches = "".join(
-        f'<div class="swatch-card"><div class="color-bubble" style="background-color:{_swatch_color(c)};"></div><p>{c.title()}</p></div>'
-        for c in colors
-    )
-    palette_name = get_palette_name(row["skin_tone"], row["undertone"])
-    
-    html = f'<div class="palette-premium-banner">'
-    html += f'<div style="font-size:11px; letter-spacing:2px; color:#9C7A4E; font-weight:700; text-transform:uppercase;">YOUR COLOR PALETTE</div>'
-    html += f'<div class="palette-name" style="font-size:32px; font-weight:700; margin:6px 0; color:#1B1814;">{palette_name}</div>'
-    html += f'<div style="font-size:13px; color:#666;">{str(row["skin_tone"]).title()} Skin · {str(row["undertone"]).title()} Undertone · {str(row["style_preference"]).title()} Style</div>'
-    html += f'</div>'
-    html += f'<div class="section-split">'
-    html += f'<div class="results-box"><h3>COLORS FOR YOU</h3><div class="swatch-grid">{swatches}</div></div>'
-    html += f'<div class="results-box"><h3>STYLIST TIP</h3><p class="tip-text">{caption}</p></div>'
-    html += f'</div>'
-    return html
-
-def build_outfit_component_cards_html(row):
-    colors = [c.strip() for c in str(row["recommended_colors"]).split(",") if c.strip()] or ["neutral"]
-    components = [
-        ("TOP", row.get("outfit_top", "Top"), "zara", "search_query_zara"),
-        ("TROUSERS", row.get("outfit_bottom", "Trousers"), "asos", "search_query_asos"),
-        ("SHOES", row.get("outfit_shoes", "Shoes"), "zara", "search_query_zara"),
-        ("JACKET", "Tailored Jacket Profile", "hm", "search_query_hm"),
-        {"category": "BAG", "name": "Minimalist Tote Bag", "retailer": "asos", "query": "structured tan tote bag"},
-        {"category": "DRESS", "name": "Classic Slip Midi Dress", "retailer": "zara", "query": "terracotta slip midi dress"}
-    ]
-    
-    cards = []
-    for i, comp in enumerate(components):
-        if isinstance(comp, dict):
-            label, item_name, retailer = comp["category"], comp["name"], comp["retailer"]
-            link = to_shop_link(retailer, comp["query"], row["gender"])
-        else:
-            label, item_name, retailer, col = comp
-            link = to_shop_link(retailer, row.get(col, item_name), row["gender"])
-            
-        raw_color = _swatch_color(colors[i % len(colors)])
-        banner_color = _lighten_hex(raw_color, 0.88)
-        
-        card_html = f'<div class="product-card">'
-        card_html += f'<div class="card-color-header" style="background-color:{banner_color};">'
-        card_html += f'<div class="prod-bubble" style="background-color:{raw_color};"></div>'
-        card_html += f'</div>'
-        card_html += f'<div class="prod-meta">'
-        card_html += f'<span class="prod-cat">{label}</span>'
-        card_html += f'<p class="prod-title">{str(item_name).title()}</p>'
-        card_html += f'<span class="prod-brand">{retailer.upper()}</span>'
-        card_html += f'<a href="{link}" target="_blank" rel="noopener noreferrer" class="shop-btn">Shop ↗</a>'
-        card_html += f'</div>'
-        card_html += f'</div>'
-        cards.append(card_html)
-        
-    return f'<div class="outfit-grid">{"".join(cards)}</div>'
-
-def build_more_matches_html(matched_indices, similarities):
-    cards = []
-    for idx, sim in list(zip(matched_indices, similarities))[1:4]:
-        row = df.iloc[idx]
-        img_b64 = pil_to_base64(images[idx])
-        link = to_shop_link("zara", row.get("search_query_zara", "clothing"), row["gender"])
-        card_html = f'<div class="product-card">'
-        card_html += f'<img src="data:image/jpeg;base64,{img_b64}" style="width:100%;height:150px;object-fit:cover;display:block;"/>'
-        card_html += f'<div class="prod-meta">'
-        card_html += f'<span class="prod-brand">Match score: {sim}</span>'
-        card_html += f'<a href="{link}" target="_blank" rel="noopener noreferrer" class="shop-btn">Shop ↗</a>'
-        card_html += f'</div></div>'
-        cards.append(card_html)
-    return f'<div class="more-matches-label">MORE MATCHES LIKE THIS</div><div class="outfit-grid">{"".join(cards)}</div>'
-
-# ---------------------------------------------------------------------------
-# MAIN PIPELINES
-# ---------------------------------------------------------------------------
-def run_pipeline(matched_indices, matched_rows, matched_scores, base_image=None, question=None, expected_gender=None):
-    if len(matched_indices) == 0:
-        return "<i>No matches found — try different filters.</i>", None, "", "<div></div>"
-    similarity = [round(1.0 - (d / 2.0), 3) for d in matched_scores]
-    top_row = matched_rows.iloc[0]
-    edit_base_image = base_image if base_image is not None else images[matched_indices[0]]
-    gender_for_generation = expected_gender or top_row["gender"]
-
-    caption = generate_stylist_caption(top_row)
-    new_image, _ = generate_new_outfit_image(edit_base_image, top_row, target_gender=gender_for_generation)
-    answer = answer_question_about_image(edit_base_image, question) if question else ""
-
-    style_card_html = build_style_card_html(top_row, caption)
-    outfit_cards_html = build_outfit_component_cards_html(top_row) + build_more_matches_html(matched_indices, similarity)
-    return style_card_html, new_image, answer, outfit_cards_html
-
-def recommend_from_photo(photo, gender, age_group, question):
-    if photo is None:
-        return "<i>Please upload a photo or pick a Quick Starter.</i>", None, "", "<div></div>"
-    query_emb = embed_query_image(photo)
-    idx, rows, scores = faiss_filtered_search(query_emb, gender=gender or None, age_group=age_group or None)
-    return run_pipeline(idx, rows, scores, base_image=photo, question=question, expected_gender=gender)
-
-def recommend_from_features(skin_tone, undertone, style, gender, age_group, question):
-    sentence = build_feature_sentence(skin_tone, undertone, style, gender, age_group)
-    query_emb = embed_query_text(sentence)
-    idx, rows, scores = faiss_filtered_search(query_emb, gender=gender or None, age_group=age_group or None)
-    return run_pipeline(idx, rows, scores, base_image=None, question=question, expected_gender=gender)
-
-def build_feature_pills_html(labels, selected, title):
-    pills = ""
-    for label in labels:
-        active = str(label).strip().lower() == str(selected).strip().lower()
-        border = "2px solid #D2527F" if active else "1.5px solid #ECE4D6"
-        bg = "#FFF0F5" if active else "#FFFFFF"
-        tcol = "#D2527F" if active else "#2C2A29"
-        dot = _swatch_color(label) if title != "Style" else "#C69E6E"
-        pills += f'<div style="display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:30px;border:{border};background:{bg};margin:4px;"><div style="width:12px;height:12px;border-radius:50%;background:{dot};border:1px solid rgba(0,0,0,.1);"></div><span style="font-size:13px;font-weight:600;color:{tcol};">{str(label).title()}</span></div>'
-    return f'<div style="margin-bottom:14px;"><div style="font-size:11px;font-weight:700;color:#8A7F6E;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;">{title}</div><div style="display:flex;flex-wrap:wrap;margin:-4px;">{pills}</div></div>'
-
-def build_features_recap_html(skin_tone, undertone, style):
-    return f'<div style="background:#fff;border-radius:16px;padding:24px;margin-bottom:20px;border:1px solid #ECE4D6;"><div style="font-size:12px;font-weight:700;color:#D2527F;text-transform:uppercase;letter-spacing:.1em;margin-bottom:16px;">Your Selected Specifications</div>{build_feature_pills_html(SKIN_TONES, skin_tone, "Skin tone")}{build_feature_pills_html(UNDERTONES, undertone, "Undertone")}{build_feature_pills_html(STYLES, style, "Style")}</div>'
-
-# ---------------------------------------------------------------------------
-# FIXED GRADIO 6 COMPLIANT LUXURY THEME
-# ---------------------------------------------------------------------------
-CUSTOM_CSS = """
-@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght=600;700&family=Inter:wght=400;500;600;700&display=swap');
-body, .gradio-container { background-color: #F8F5F5 !important; font-family: 'Inter', sans-serif !important; }
-.gradio-container { max-width: 850px !important; margin: 0 auto !important; padding-top: 20px !important; }
-footer { display: none !important; }
-
-h1, h2, h3, p, span, label, input, select, textarea, button { color: #2C2A29 !important; }
-
-.tab-nav button { font-size: 14px !important; font-weight: 600 !important; padding: 14px 24px !important; color: #555 !important; }
-.tab-nav button.selected { color: #D2527F !important; border-bottom: 2px solid #D2527F !important; }
-
-#find-btn, .big-btn { background: #161617 !important; color: #FFFFFF !important; border: none !important; border-radius: 8px !important; font-weight: 700 !important; font-size: 14px !important; padding: 14px !important; text-transform: uppercase; letter-spacing: .08em !important; width: 100% !important; margin-top: 10px; }
-#find-btn:hover, .big-btn:hover { background: #2D2D2F !important; }
-
-.dark-panel { background: #FFFFFF !important; border-radius: 16px !important; padding: 24px !important; border: 1px solid #ECE4D6 !important; margin-bottom: 20px; }
-.dark-panel label, .dark-panel span { color: #2C2A29 !important; font-weight: 600; }
-
-input, select, .secondary, .wrap, .slots, .single-select, .select-wrap { 
-    color: #2C2A29 !important; 
-    background-color: #FFFFFF !important;
-    border: 1px solid #E3DFDA !important;
-    border-radius: 4px !important;
-}
-div.form { background: transparent !important; border: none !important; box-shadow: none !important; }
-fieldset { display: flex !important; justify-content: center !important; gap: 24px !important; border: none !important; background: transparent !important; }
-
-.palette-premium-banner { background: #FAF3ED; padding: 24px; border-radius: 12px; margin-bottom: 20px; border-left: 5px solid #C69E6E; }
-.section-split { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 20px !important; margin-top: 20px !important; width: 100% !important; }
-@media (max-width: 768px) { .section-split { grid-template-columns: 1fr !important; } }
-
-.results-box { background: #FFFFFF; border-radius: 16px; padding: 24px; border: 1px solid #EFECE8; }
-.results-box h3 { font-size: 11px; font-weight: 700; color: #9C8E82 !important; letter-spacing: 1.5px; text-transform: uppercase; margin: 0 0 14px; }
-.swatch-grid { display: flex; gap: 16px; flex-wrap: wrap; }
-.swatch-card { text-align: center; font-size: 12px; color: #666666 !important; width: 60px; }
-.color-bubble { width: 44px; height: 44px; border-radius: 50%; margin: 0 auto 6px; border: 1px solid rgba(0,0,0,.06); box-shadow: inset 0 0 0 2px #FFF; }
-.tip-text { font-size: 15px; color: #222222 !important; line-height: 1.6; margin: 0; font-style: italic; }
-
-.outfit-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 20px !important; margin-top: 20px !important; width: 100% !important; }
-@media (max-width: 768px) { .outfit-grid { grid-template-columns: repeat(2, 1fr) !important; } }
-@media (max-width: 480px) { .outfit-grid { grid-template-columns: 1fr !important; } }
-
-.product-card { background: #FFFFFF; border: 1px solid #EFECE8; border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 4px 12px rgba(0,0,0,0.01); width: 100% !important; }
-.card-color-header { width: 100%; height: 95px; display: flex; align-items: center; justify-content: center; }
-.prod-bubble { width: 46px; height: 46px; border-radius: 50%; box-shadow: 0 2px 8px rgba(0,0,0,0.04); }
-.prod-meta { padding: 20px; display: flex; flex-direction: column; align-items: flex-start; text-align: left; width: 100%; }
-.prod-cat { font-size: 11px; font-weight: 700; color: #D2527F !important; letter-spacing: 0.5px; text-transform: uppercase; margin-bottom: 4px; }
-.prod-title { font-size: 15px; font-weight: 700; color: #111111 !important; margin: 0 0 4px 0; line-height: 1.3; min-height: 40px; display: flex; align-items: center; }
-.prod-brand { font-size: 13px; color: #999999 !important; margin-bottom: 14px; display: block; }
-
-.shop-btn { display: block; width: 100%; background: #161617; color: #FFFFFF !important; text-align: center; padding: 11px 0; border-radius: 8px; font-size: 13px; font-weight: 700; text-decoration: none !important; letter-spacing: 0.5px; }
-.shop-btn:hover { background: #2D2D2F; color: #FFFFFF !important; }
-.more-matches-label { font-size: 11px; font-weight: 700; color: #9C8E82 !important; letter-spacing: 1.6px; text-transform: uppercase; margin: 24px 0 12px; }
-.palette-name { font-family: 'Playfair Display', serif !important; }
-"""
-
-# ---------------------------------------------------------------------------
-# INTERFACE BUILD
-# ---------------------------------------------------------------------------
-with gr.Blocks(title="Personal Color Styling") as demo:
-    gr.HTML("""
-    <div style="text-align:center; padding:24px 20px 10px;">
-      <div style="font-size:11px; font-weight:700; color:#D2527F; letter-spacing:.18em; text-transform:uppercase; margin-bottom:8px;">Personal Color Styling</div>
-      <div class="palette-name" style="font-size:38px; font-weight:700; color:#111; margin-bottom:6px;">LookMatch</div>
-      <div style="font-size:14px; color:#666; max-width:480px; margin:0 auto; line-height:1.6;">
-        Upload a photo or describe your features — receive a curated palette, a personal stylist note, and a brand-new look generated just for you.
-      </div>
-    </div>
-    """)
-
-    with gr.Tab("📸 Upload a Photo"):
-        with gr.Row():
-            photo_in = gr.Image(type="pil", label="Your photo")
-            with gr.Column():
-                gender_a = gr.Dropdown(GENDERS, label="Gender (optional)")
-                age_a = gr.Dropdown(AGE_GROUPS, label="Age group (optional)")
-                question_a = gr.Textbox(label="Ask the stylist a question about your photo (optional)", placeholder="e.g. What style would suit me best?")
-                btn_a = gr.Button("Get my look ✨", elem_id="find-btn", variant="primary")
-                
-        style_card_a = gr.HTML()
-        new_img_a = gr.Image(label="✨ Your New AI-Generated Look")
-        answer_a = gr.Textbox(label="Answer to your question")
-        outfit_cards_a = gr.HTML()
-
-        btn_a.click(
-            recommend_from_photo,
-            [photo_in, gender_a, age_a, question_a],
-            [style_card_a, new_img_a, answer_a, outfit_cards_a],
-        )
-
-        gr.Examples(
-            examples=[
-                [SAMPLE_PHOTOS[0], "woman", "adult", "What style would suit me best?"],
-                [SAMPLE_PHOTOS[1], "man", "adult", "What style would suit me best?"],
-                [SAMPLE_PHOTOS[2], "woman", "teen", "What style would suit me best?"]
-            ],
-            inputs=[photo_in, gender_a, age_a, question_a],
-            outputs=[style_card_a, new_img_a, answer_a, outfit_cards_a],
-            fn=recommend_from_photo,
-            cache_examples=False,
-            label="Quick Starters",
-        )
-
-    with gr.Tab("🎨 Choose Manually"):
-        gr.Markdown("Select your skin tone, undertone and style below.")
-        with gr.Group(elem_classes="dark-panel"):
-            with gr.Row():
-                skin_b = gr.Dropdown(SKIN_TONES, label="Skin tone", value=SKIN_TONES[0])
-                undertone_b = gr.Dropdown(UNDERTONES, label="Undertone", value=UNDERTONES[0])
-                style_b = gr.Dropdown(STYLES, label="Style preference", value=STYLES[0])
-            with gr.Row():
-                gender_b = gr.Dropdown(GENDERS, label="Gender", value=GENDERS[0])
-                age_b = gr.Dropdown(AGE_GROUPS, label="Age group", value=AGE_GROUPS[0])
-            question_b = gr.Textbox(label="Ask the stylist a question about the top match (optional)", placeholder="e.g. Is this outfit formal or casual?")
-            btn_b = gr.Button("Get my look ✨", elem_id="find-btn", variant="primary")
-            
-        features_recap_b = gr.HTML(build_features_recap_html(SKIN_TONES[0], UNDERTONES[0], STYLES[0]))
-        for _dropdown in (skin_b, undertone_b, style_b):
-            _dropdown.change(build_features_recap_html, [skin_b, undertone_b, style_b], features_recap_b)
-            
-        style_card_b = gr.HTML()
-        new_img_b = gr.Image(label="✨ Your New AI-Generated Look")
-        answer_b = gr.Textbox(label="Answer to your question")
-        outfit_cards_b = gr.HTML()
-        
-        btn_b.click(
-            recommend_from_features,
-            [skin_b, undertone_b, style_b, gender_b, age_b, question_b],
-            [style_card_b, new_img_b, answer_b, outfit_cards_b],
-        )
-
-if __name__ == "__main__":
-    demo.launch(css=CUSTOM_CSS, theme=gr.themes.Soft(primary_hue="amber"))