<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>StylePrompts Pro - 100 Estilos UI para WebForge</title>
<style>
:root{--bg:#0a0a0a;--card:#141414;--border:#222;--text:#fff;--muted:#888;--accent:#6366f1}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);padding:1.5rem;line-height:1.5}
.header{text-align:center;padding:2rem 0;border-bottom:1px solid var(--border);margin-bottom:2rem}
.header h1{font-size:2.2rem;background:linear-gradient(135deg,#6366f1,#a855f7,#ec4899);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem}
.header p{color:var(--muted);font-size:.95rem}
.stats{display:flex;justify-content:center;gap:2rem;margin-top:1rem}
.stat-val{font-size:1.8rem;font-weight:700;color:var(--accent)}
.stat-lbl{font-size:.75rem;color:var(--muted)}
.filters{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1.5rem;padding:1rem;background:var(--card);border-radius:10px;border:1px solid var(--border)}
.filter-group{display:flex;flex-direction:column;gap:.3rem}
.filter-group label{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
select,input[type=text]{padding:.6rem .8rem;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text);font-size:.85rem;min-width:180px}
.count{font-size:.85rem;color:var(--muted);margin-bottom:1rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:1rem}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.4)}
.card-top{padding:1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid var(--border)}
.card-id{font-size:.7rem;font-weight:700;background:var(--accent);color:#fff;padding:.2rem .5rem;border-radius:5px;white-space:nowrap}
.card-cat{font-size:.65rem;padding:.15rem .4rem;border-radius:4px;background:rgba(99,102,241,.12);color:var(--accent);border:1px solid rgba(99,102,241,.25)}
.card-name{flex:1;font-size:1rem;font-weight:600}
.card-body{padding:1rem;font-size:.8rem}
.card-body h4{font-size:.7rem;text-transform:uppercase;color:var(--muted);letter-spacing:.04em;margin:0 0 .3rem}
.dna{color:var(--muted);margin-bottom:.75rem}
.dna span{display:block;margin-bottom:.2rem}
.dna strong{color:#ccc}
.lists{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:.75rem}
.do,.dont{font-size:.72rem;padding:.5rem;border-radius:6px}
.do{background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.2)}
.dont{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.2)}
.do h5{color:#10b981;font-size:.65rem;margin-bottom:.3rem}
.dont h5{color:#ef4444;font-size:.65rem;margin-bottom:.3rem}
.do li,.dont li{list-style:none;margin-bottom:.15rem}
.card-footer{padding:.75rem 1rem;background:rgba(0,0,0,.3);display:flex;justify-content:space-between;align-items:center}
.btn{display:inline-flex;align-items:center;gap:.3rem;padding:.4rem .8rem;background:var(--accent);color:#fff;text-decoration:none;border-radius:6px;font-size:.8rem;font-weight:500;transition:background .15s}
.btn:hover{background:#818cf8}
.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--muted)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}
@media(max-width:768px){body{padding:.75rem}.grid{grid-template-columns:1fr}.filters{flex-direction:column}select,input{width:100%}}
</style>
</head>
<body>
<div class="header">
<h1>🎨 StylePrompts Pro — Catálogo Completo</h1>
<p>100 estilos de diseño UI extraídos con prompts, tokens y especificaciones completas</p>
<p style="color:#6366f1;font-size:.8rem;margin-top:.5rem">Para WebForge · Fuente: styleprompt.zeabur.app</p>
<div class="stats">
<div><div class="stat-val">100</div><div class="stat-lbl">Estilos</div></div>
<div><div class="stat-val">13</div><div class="stat-lbl">Categorías</div></div>
<div><div class="stat-val">232KB</div><div class="stat-lbl">Datos extraídos</div></div>
</div>
</div>
<div class="filters">
<div class="filter-group"><label>Buscar</label><input type="text" id="search" placeholder="Nombre, estilo, color..."></div>
<div class="filter-group"><label>Categoría</label><select id="cat">
<option value="">Todas</option>
<option value="minimalist">🔲 Minimalista</option>
<option value="bold">💥 Bold/Audaz</option>
<option value="retro">📻 Retro</option>
<option value="futuristic">🚀 Futurista</option>
<option value="organic">🌿 Orgánico</option>
<option value="geometric">🔷 Geométrico</option>
<option value="artistic">🎨 Artístico</option>
<option value="material">🧱 Material/Textura</option>
<option value="dark">🌑 Dark/Oscuro</option>
<option value="3d">🧊 3D</option>
<option value="editorial">📰 Editorial</option>
<option value="themed">🌍 Temático</option>
<option value="zen">☯️ Zen</option>
</select></div>
</div>
<div class="count" id="count"></div>
<div class="grid" id="grid"></div>
<script>
const S=[{"id":"S01","name":"Tech Minimal","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Neutral grays with a single accent color. Clean backgrounds, subtle borders.","typo":"System fonts or geometric sans-serif. Clean hierarchy with consistent weights.","radius":"Small to medium radius (4-8px). Consistent across components.","shadow":"Subtle elevation shadows. Minimal depth.","motion":"Subtle, quick transitions (150-200ms). Ease-out curves.","dos":["Use clean lines and ample whitespace","Keep typography simple and readable","Use subtle animations","Maintain consistent spacing"],"donts":["Don't use excessive decorations","Don't overcrowd the layout","Don't use too many colors"],"url":"https://styleprompt.zeabur.app/pro/S01","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S01"},{"id":"S02","name":"Minimalist Monochrome","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Pure black and white with occasional gray. No colors.","typo":"Bold editorial fonts. Strong contrast between sizes. Serif or geometric sans.","radius":"Sharp corners (0-2px). Architectural precision.","shadow":"None or hard shadows only.","motion":"Minimal. Instant or very quick transitions.","dos":["Use strong black and white contrast","Emphasize typography hierarchy","Use bold editorial layouts","Keep imagery minimal"],"donts":["Don't use colors unless intentional","Don't add unnecessary elements","Don't use rounded corners excessively"],"url":"https://styleprompt.zeabur.app/pro/S02","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S02"},{"id":"S03","name":"Mondrian / De Stijl","category":"geometric","categoryLabel":"🔷 Geométrico","palette":"Primary colors only (red, blue, yellow) on white/black. No gradients.","typo":"Geometric sans-serif. Bold weights. Grid-aligned.","radius":"Zero radius. All rectangles.","shadow":"None. Flat color blocks only.","motion":"Stiff, mechanical. No easing.","dos":["Use primary colors (red, blue, yellow)","Create grid-based compositions","Use thick black lines","Keep shapes geometric"],"donts":["Don't use gradients","Don't use curves or organic shapes","Don't mix too many colors"],"url":"https://styleprompt.zeabur.app/pro/S03","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S03"},{"id":"S04","name":"Swiss / International Typographic","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Limited palette. Often monochromatic with one accent.","typo":"Helvetica, Univers, or similar grotesque. Strict hierarchy.","radius":"Zero to minimal (0-4px).","shadow":"None. Rely on spacing and typography.","motion":"Precise and functional. No flourishes.","dos":["Use grid systems rigorously","Emphasize sans-serif typography","Use asymmetric layouts","Keep design clean and functional"],"donts":["Don't use decorative fonts","Don't ignore the grid","Don't use excessive imagery"],"url":"https://styleprompt.zeabur.app/pro/S04","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S04"},{"id":"S05","name":"Brutalist","category":"bold","categoryLabel":"💥 Bold/Audaz","palette":"Raw, unrefined colors. High contrast. Often monochrome.","typo":"System fonts, monospace, or intentionally ugly fonts. Large sizes.","radius":"Zero. No rounding.","shadow":"None or harsh, offset shadows.","motion":"Abrupt or none. Intentionally jarring.","dos":["Use raw, unpolished aesthetics","Embrace bold typography","Use high contrast","Be intentionally unconventional"],"donts":["Don't over-polish the design","Don't use subtle effects","Don't follow conventional layouts"],"url":"https://styleprompt.zeabur.app/pro/S05","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S05"},{"id":"S06","name":"Cyberpunk","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Neon colors (cyan, magenta, yellow) on dark backgrounds. Glowing effects.","typo":"Futuristic, tech-inspired fonts. Glowing text effects.","radius":"Mixed. Sharp for panels, rounded for buttons.","shadow":"Neon glows. Colored shadows.","motion":"Glitch effects. Fast, erratic.","dos":["Use neon colors on dark backgrounds","Add glitch effects sparingly","Use futuristic typography","Create depth with layers"],"donts":["Don't use warm, natural colors","Don't use traditional layouts","Don't make it too clean"],"url":"https://styleprompt.zeabur.app/pro/S06","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S06"},{"id":"S07","name":"Retro 80s (Synthwave)","category":"retro","categoryLabel":"📻 Retro","palette":"Gradient neons (pink, purple, cyan). Sunset palettes. Dark backgrounds.","typo":"Retro-futuristic fonts. Chrome effects. Outlined text.","radius":"Rounded (8-16px). Soft edges.","shadow":"Neon glows. Gradient shadows.","motion":"Smooth, flowing. Pulsing glows.","dos":["Use gradient neons (pink, purple, cyan)","Add grid patterns","Use retro-futuristic imagery","Create depth with perspective"],"donts":["Don't use flat colors","Don't use modern minimalism","Don't forget the sunset gradients"],"url":"https://styleprompt.zeabur.app/pro/S07","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S07"},{"id":"S08","name":"Retro 60s–70s (Print Grain)","category":"retro","categoryLabel":"📻 Retro","palette":"Warm, muted colors. Earthy tones. Vintage palette.","typo":"Vintage display fonts. Rounded sans-serif. Varied weights.","radius":"Rounded (8-16px). Organic feel.","shadow":"Subtle or none. Rely on texture.","motion":"Gentle, organic movements.","dos":["Use warm, muted colors","Add grain textures","Use vintage typography","Create organic compositions"],"donts":["Don't use sharp, digital aesthetics","Don't use neon colors","Don't make it too clean"],"url":"https://styleprompt.zeabur.app/pro/S08","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S08"},{"id":"S09","name":"Memphis","category":"bold","categoryLabel":"💥 Bold/Audaz","palette":"Bold, clashing colors. Primary + pastels. High saturation.","typo":"Playful, varied fonts. Mixed styles. Bold and fun.","radius":"Mixed. Geometric shapes.","shadow":"Hard, offset shadows. Colorful.","motion":"Bouncy, playful. Exaggerated easing.","dos":["Use bold, vibrant colors","Add geometric patterns","Use playful shapes","Create dynamic compositions"],"donts":["Don't use muted colors","Don't be too serious","Don't use traditional layouts"],"url":"https://styleprompt.zeabur.app/pro/S09","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S09"},{"id":"S10","name":"Luxury Editorial","category":"editorial","categoryLabel":"📰 Editorial","palette":"Muted, sophisticated colors. Gold accents. Cream backgrounds.","typo":"Elegant serifs. Refined spacing. Light weights.","radius":"Minimal (0-4px). Refined edges.","shadow":"Subtle, soft shadows. Elegant depth.","motion":"Slow, elegant transitions. Graceful.","dos":["Use elegant serif typography","Create generous whitespace","Use high-quality imagery","Maintain refined aesthetics"],"donts":["Don't use playful elements","Don't overcrowd layouts","Don't use bright colors"],"url":"https://styleprompt.zeabur.app/pro/S10","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S10"},{"id":"S11","name":"Japanese Minimal","category":"zen","categoryLabel":"☯️ Zen","palette":"Muted, natural colors. Lots of white space. Subtle accents.","typo":"Clean, minimal fonts. Light weights. Generous spacing.","radius":"Subtle (2-6px). Soft but not round.","shadow":"Very subtle or none. Rely on space.","motion":"Slow, deliberate. Zen-like.","dos":["Embrace whitespace (ma)","Use subtle, natural colors","Create balance and harmony","Use delicate typography"],"donts":["Don't overcrowd the design","Don't use bold, loud colors","Don't add unnecessary elements"],"url":"https://styleprompt.zeabur.app/pro/S11","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S11"},{"id":"S12","name":"Nature Organic","category":"organic","categoryLabel":"🌿 Orgánico","palette":"Earthy, natural colors. Greens, browns, blues. Organic feel.","typo":"Humanist sans-serif. Natural flow. Mixed weights.","radius":"Organic (4-12px). Natural shapes.","shadow":"Soft, diffused shadows. Natural depth.","motion":"Gentle, flowing. Natural rhythms.","dos":["Use earth tones and natural colors","Add organic shapes and curves","Use natural textures","Create flowing layouts"],"donts":["Don't use harsh geometric shapes","Don't use artificial colors","Don't make it too rigid"],"url":"https://styleprompt.zeabur.app/pro/S12","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S12"},{"id":"S13","name":"Material-ish","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Bold primary colors. White backgrounds. Systematic palette.","typo":"Roboto or similar. Clear hierarchy. Medium weights.","radius":"Consistent (4-8px). Systematic.","shadow":"Elevation system. Multiple levels.","motion":"Responsive animations. Standard curves.","dos":["Use elevation and shadows","Follow material principles","Use bold colors with purpose","Create clear hierarchy"],"donts":["Don't use flat design","Don't ignore elevation","Don't use too many elevations"],"url":"https://styleprompt.zeabur.app/pro/S13","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S13"},{"id":"S14","name":"Glassmorphism","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Translucent colors. Gradient backgrounds. Frosted effects.","typo":"Modern sans-serif. Clean and readable.","radius":"Large radius (16-24px). Soft, pill shapes.","shadow":"Soft, diffused shadows. Layered depth.","motion":"Smooth animations. Parallax effects.","dos":["Use frosted glass effects","Add subtle transparency","Create depth with layers","Use soft shadows"],"donts":["Don't use opaque backgrounds","Don't forget the blur effect","Don't use harsh edges"],"url":"https://styleprompt.zeabur.app/pro/S14","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S14"},{"id":"S15","name":"Neumorphism","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Monochromatic. Soft, muted backgrounds. Subtle color shifts.","typo":"Clean sans-serif. Subtle shadows on text.","radius":"Large radius (12-20px). Soft, pillowy.","shadow":"Dual shadows (light + dark). Embossed/debossed.","motion":"Subtle press effects. Tactile feedback.","dos":["Use soft shadows for depth","Create embossed/debossed effects","Use monochromatic colors","Keep it subtle"],"donts":["Don't use high contrast","Don't use flat design","Don't use too many colors"],"url":"https://styleprompt.zeabur.app/pro/S15","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S15"},{"id":"S16","name":"Terminal / Hacker","category":"dark","categoryLabel":"🌑 Dark/Oscuro","palette":"Green/amber on black. Monochrome terminal colors.","typo":"Monospace only. Fixed-width. Courier, Fira Code.","radius":"Zero. Sharp terminal aesthetic.","shadow":"None or subtle glow.","motion":"Typing effects. Cursor blinks. Instant.","dos":["Use monospace typography","Use green/amber on black","Add terminal-like elements","Create a tech atmosphere"],"donts":["Don't use colorful palettes","Don't use rounded corners","Don't use images heavily"],"url":"https://styleprompt.zeabur.app/pro/S16","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S16"},{"id":"S17","name":"Bauhaus Modernism","category":"geometric","categoryLabel":"🔷 Geométrico","palette":"Primary colors only. Red, blue, yellow. Bold contrasts.","typo":"Geometric sans-serif. Bold. Grid-aligned.","radius":"Mixed. Circles and rectangles.","shadow":"None or hard shadows.","motion":"Linear transitions. No easing.","dos":["Use bold geometry and rules","Keep copy concise","Treat layout like a poster","Accessibility of text must be considered"],"donts":["Don't use gradients or glassmorphism","Don't over-animate","Don't round everything"],"url":"https://styleprompt.zeabur.app/pro/S17","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S17"},{"id":"S18","name":"Retro Pixel UI","category":"retro","categoryLabel":"📻 Retro","palette":"Limited palette. Pixel art colors. Retro gaming.","typo":"Pixel fonts. Monospace. Blocky.","radius":"Zero. Pixel-perfect.","shadow":"None or pixelated.","motion":"Frame-by-frame. Limited frames.","dos":["Use pixel-perfect grids","Add dither patterns","Use 8-bit color palettes","Create nostalgic interfaces"],"donts":["Don't use smooth gradients","Don't use high-resolution imagery","Don't use modern effects"],"url":"https://styleprompt.zeabur.app/pro/S18","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S18"},{"id":"S19","name":"Aesthetic Harmony","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Analogous color harmony with strategic accent. Soft linear gradients create depth while maintaining visual comfort. High contrast ratios (WCAG AA) achieved through sophisticated value shifts rather than harsh color jumps.","typo":"Humanist sans-serif with optical sizing. Refined letter-spacing (-0.025em for headlines) enhances readability. Clear visual hierarchy through weight variations (400-600) and calculated scale ratios (1.250). Line height optimized for scannability (1.625 for body).","radius":"Golden ratio-based corner radius (8-16px). Balanced curvature provides perceived affordance without sacrificing perceived precision. Larger radius for interactive elements, smaller for content containers.","shadow":"Multi-layered colored shadows following elevation guidelines. Tinted shadows (brand color at 8-15% opacity) create natural depth. Shadow blur radius scales with elevation (8-32px). No harsh black shadows.","motion":"Cognitive-load-aware micro-interactions. 200ms entry, 300ms exit timing follows human perception. Custom easing curves (cubic-bezier(0.25, 0.46, 0.45, 0.94)) for natural feel. Hover states provide immediate feedback (100ms).","dos":["Use analogous color harmonies","Create subtle gradients","Apply golden ratio proportions","Use refined typography"],"donts":["Don't use harsh contrasts","Don't ignore visual hierarchy","Don't overcomplicate animations"],"url":"https://styleprompt.zeabur.app/pro/S19","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S19"},{"id":"S20","name":"Aurora Borealis","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Aurora-inspired color flows. Ethereal gradients with organic transitions. Bioluminescent accents against dark backgrounds.","typo":"Light, airy fonts with subtle glow effects. Increased tracking for dreamy readability. Weight variations create hierarchy.","radius":"Organic, flowing curves (12-24px). No hard edges, mimicking natural aurora movements.","shadow":"Luminous glow shadows. Outer glow effects with color bleeding. Soft inner shadows for depth.","motion":"Slow, organic movements (300-500ms). Easing curves follow natural sine waves. Floating animations.","dos":["Use iridescent gradients","Add glowing effects","Create layered transparency","Use neon accents"],"donts":["Don't use flat colors","Don't ignore the glow","Don't make it opaque"],"url":"https://styleprompt.zeabur.app/pro/S20","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S20"},{"id":"S21","name":"Claymorphism","category":"3d","categoryLabel":"🧊 3D","palette":"Earthy, muted tones. Soft clay colors with natural warmth. Subtle variations create tactile depth.","typo":"Rounded, friendly fonts. Soft edges match clay aesthetic. Medium weights for substance.","radius":"Extra rounded (16-32px). All elements feel moldable and soft.","shadow":"Soft, pressed-in shadows. Multiple layers create clay depth. Inner shadows dominate.","motion":"Bouncy, playful animations (400-600ms). Ease-out-back for tactile feedback.","dos":["Use soft, rounded shapes","Create pressed-in effects","Use earthy colors","Add tactile shadows"],"donts":["Don't use sharp edges","Don't ignore the depth","Don't make it flat"],"url":"https://styleprompt.zeabur.app/pro/S21","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S21"},{"id":"S22","name":"Dark Mode Elegance","category":"dark","categoryLabel":"🌑 Dark/Oscuro","palette":"Dark mode with cyan/purple accents. High contrast for readability. Subtle gradients for depth.","typo":"Clean monospace for tech feel. Mixed with sans-serif for readability. Consistent spacing.","radius":"Minimal (4-8px). Tech aesthetic with slight softening.","shadow":"Glow effects and subtle elevation. Colored shadows for tech feel.","motion":"Fast, responsive animations (150-200ms). Tech feel.","dos":["Use high contrast for readability","Add subtle cyan/purple accents","Create depth with shadows","Use clean typography"],"donts":["Don't use low contrast text","Don't ignore accessibility","Don't overdo the effects"],"url":"https://styleprompt.zeabur.app/pro/S22","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S22"},{"id":"S23","name":"Doodle Sketch","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Playful pastel palette. Bright, cheerful colors. Hand-drawn aesthetic.","typo":"Mixed fonts. Handwritten feel with sans-serif readability. Varied styles.","radius":"Mixed. Organic shapes. Hand-drawn feel.","shadow":"Soft, playful shadows. Colorful depth.","motion":"Bouncy, playful animations (300-500ms). Fun easing.","dos":["Use hand-drawn elements","Add playful patterns","Use vibrant colors","Create organic shapes"],"donts":["Don't be too rigid","Don't use perfect lines","Don't forget the fun"],"url":"https://styleprompt.zeabur.app/pro/S23","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S23"},{"id":"S24","name":"Minimalist Line Art","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Minimal cyan/blue palette. Clean tech aesthetic. High contrast.","typo":"Geometric monospace. Tech feel. Clean lines.","radius":"Minimal (0-4px). Sharp, tech aesthetic.","shadow":"Subtle tech shadows. Glow effects.","motion":"Fast, precise animations (150-300ms). Tech feel.","dos":["Use clean geometric lines","Create minimal compositions","Use cyan/blue accents","Keep it precise"],"donts":["Don't add unnecessary details","Don't use complex shapes","Don't overcomplicate"],"url":"https://styleprompt.zeabur.app/pro/S24","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S24"},{"id":"S25","name":"Paper Craft","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Pastel, paper-like colors. White, beige, light blue, soft shadows.","typo":"Handwritten or serif headings. Clean sans-serif body.","radius":"Slightly irregular or rounded edges to mimic paper cuts.","shadow":"Layered, deep shadows to create depth (cutout effect).","motion":"Fold, unfold, slide in like paper sheets.","dos":["Use layered shadows","Use pastel colors","Mimic physical paper properties","Keep layouts clean"],"donts":["Don't use neon colors","Don't use flat design without depth","Don't use harsh metallic gradients"],"url":"https://styleprompt.zeabur.app/pro/S25","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S25"},{"id":"S26","name":"Flat 2.0","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Vibrant colors, white background. Material Design 3 inspired.","typo":"Google Sans or Roboto. Friendly and readable.","radius":"Rounded corners (12px-24px).","shadow":"Subtle, consistent elevation usage.","motion":"Standard Material ease. Playful but functional.","dos":["Use consistent rounded corners","Use vibrant primary colors","Follow material spacing guidelines","Use meaningful motion"],"donts":["Don't use sharp corners","Don't use heavy textures","Don't clutter the UI"],"url":"https://styleprompt.zeabur.app/pro/S26","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S26"},{"id":"S27","name":"Y2K Aesthetic","category":"retro","categoryLabel":"📻 Retro","palette":"Hot pink, electric blue, silver/chrome, black.","typo":"Extended sans-serif, futuristic fonts.","radius":"Mixed: Pills and sharp angles.","shadow":"Glows, metallic reflections.","motion":"Bouncy, fast, energetic.","dos":["Use chrome textures","Use bright neon colors","Use futuristic shapes","Embrace 2000s tech nostalgia"],"donts":["Don't make it boring","Don't use muted colors","Don't stick to standard grids"],"url":"https://styleprompt.zeabur.app/pro/S27","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S27"},{"id":"S28","name":"Solarpunk","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Natural greens, warm yellows, white/cream. Organic feel.","typo":"Rounded sans-serif or soft serif.","radius":"Organic, heavily rounded corners.","shadow":"Soft, diffused sunlight shadows.","motion":"Gentle, growing, flowing.","dos":["Use nature-inspired colors","Emphasize sustainability","Use organic shapes","Keep it hopeful"],"donts":["Don't use industrial grays","Don't use sharp, aggressive shapes","Don't make it look dystopian"],"url":"https://styleprompt.zeabur.app/pro/S28","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S28"},{"id":"S29","name":"Art Deco","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Gold, black, navy blue, emerald green. Luxury contrast.","typo":"Geometric sans or stylized serif (e.g., Broadway style).","radius":"Sharp angles mixed with perfect circles.","shadow":"Hard shadows or gold glow.","motion":"Fast, precise, elegant.","dos":["Use gold accents","Use geometric patterns","Keep typography elegant","Use high contrast"],"donts":["Don't use slopy fonts","Don't use grunge textures","Don't use cheap-looking colors"],"url":"https://styleprompt.zeabur.app/pro/S29","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S29"},{"id":"S30","name":"Industrial","category":"bold","categoryLabel":"💥 Bold/Audaz","palette":"Safety yellow, black, concrete gray. Warning stripes.","typo":"Stencil fonts, bold industrial sans-serif.","radius":"Chamfered corners or slightly rounded industrial.","shadow":"Heavy drop shadows, utilitarian.","motion":"Mechanical, clunky (in a good way).","dos":["Use safety yellow","Use industrial textures","Use bold, readable fonts","Make it look functional"],"donts":["Don't use delicate serifs","Don't use pastel colors","Don't hide the structure"],"url":"https://styleprompt.zeabur.app/pro/S30","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S30"},{"id":"S31","name":"Skeuomorphic","category":"retro","categoryLabel":"📻 Retro","palette":"Realistic textures: Leather (browns), Brushed Metal (silvers), Wood. High detailed gradients.","typo":"Serif for elegance or systemic sans for UI elements. Embossed text effects.","radius":"Rounded corners realistic to materials (e.g. leather stitching).","shadow":"Deep, realistic drop shadows and inner shadows to create volume.","motion":"Physical, heavy, mechanical transitions.","dos":["Use realistic textures","Use inner shadows for depth","Mimic real-world mateirals","Pay attention to lighting direction"],"donts":["Don't use flat colors","Don't use impossible physics","Don't mix clashing materials"],"url":"https://styleprompt.zeabur.app/pro/S31","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S31"},{"id":"S32","name":"Windows 95","category":"retro","categoryLabel":"📻 Retro","palette":"Windows 95 Gray (#C0C0C0), Black, White, Navy Blue title bars.","typo":"Pixelated sans-serif (MS Sans Serif) or System fonts.","radius":"Zero radius for windows, sligthly rounded for some modern interpretations but mostly sharp.","shadow":"Classic bevels: Light top-left, dark bottom-right.","motion":"Instant, snapping windows. No smooth reformations.","dos":["Use #C0C0C0 background","Use beveled buttons","Use pixel fonts","Keep it nostalgic"],"donts":["Don't use smooth gradients","Don't use rounded corners (unless necessary)","Don't use transparency"],"url":"https://styleprompt.zeabur.app/pro/S32","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S32"},{"id":"S33","name":"Liquid Metal","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Silver, Chrome, Mercury, iridescent highlights. Dark or reflective background.","typo":"Bold, futuristic, liquid-like fonts.","radius":"Fluid, amorphous shapes. Blobs.","shadow":"High contrast reflections, specular highlights.","motion":"Flowing, dripping, morphing.","dos":["Use metallic gradients","Use fluid shapes","Simulate reflection","Keep it slick"],"donts":["Don't use rough textures","Don't use geometric grids","Don't make it static"],"url":"https://styleprompt.zeabur.app/pro/S33","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S33"},{"id":"S34","name":"Holographic","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Iridescent, pastel gradients (pink, cyan, purple), silver/white accents.","typo":"Thin, modern sans-serif. Often white or holographic color.","radius":"Rounded, bubble-like.","shadow":"Soft colored glows, pearl effects.","motion":"Shimmering, tilting (parallax), floating.","dos":["Use rainbow gradients","Use soft blurs","Simulate foil texture","Keep it ethereal"],"donts":["Don't use muddy colors","Don't use harsh blacks","Don't make it opaque"],"url":"https://styleprompt.zeabur.app/pro/S34","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S34"},{"id":"S35","name":"Blueprint","category":"themed","categoryLabel":"🌍 Temático","palette":"Blueprint Blue (#0055AA), White lines. Technical high contrast.","typo":"Technical lettering (hand-drawn technical or monospace).","radius":"Sharp or strictly geometric arcs.","shadow":"None (flat) or schematic shading (hatching).","motion":"Drawing effect, writing on path.","dos":["Use blueprint blue","Use white lines","Show measurements","Make it look architectural"],"donts":["Don't use fills (mostly)","Don't use random colors","Don't ignore the grid"],"url":"https://styleprompt.zeabur.app/pro/S35","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S35"},{"id":"S36","name":"Chalkboard","category":"themed","categoryLabel":"🌍 Temático","palette":"Chalkboard Green or Black, Chalk White, Pastel accent chalks.","typo":"Handwritten chalk style. Rough edges.","radius":"Rough, hand-drawn circles and boxes.","shadow":"Smudge effects, dust.","motion":"Writing, erasing, dusty transitions.","dos":["Use chalkboard texture","Use handwritten fonts","Allow imperfections","Use chalk colors"],"donts":["Don't use vector-perfect lines","Don't use digital colors","Don't make it too clean"],"url":"https://styleprompt.zeabur.app/pro/S36","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S36"},{"id":"S37","name":"Newspaper","category":"editorial","categoryLabel":"📰 Editorial","palette":"Newsprint Grey (#F0F0F0), Ink Black (#1A1A1A). High contrast monochrome.","typo":"Classic Serif (Times New Roman or similar) for body, Bold Serif/Sans for headlines.","radius":"Sharp edges (0px) or very slight rounding for paper sections.","shadow":"Flat or subtle drop shadows to distinguish paper sheets.","motion":"Page flip, scrolling ticker.","dos":["Use multiple columns","Use justified text","Use bold headlines","Keep it monochromatic"],"donts":["Don't use vibrant colors","Don't use excessive negative space","Don't use glossy effects"],"url":"https://styleprompt.zeabur.app/pro/S37","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S37"},{"id":"S38","name":"Magazine","category":"editorial","categoryLabel":"📰 Editorial","palette":"High fashion contrast. Black/White base with bold accent colors (Hot Pink, Electric Blue).","typo":"Didone (Bodoni/Didot) for titles, clean geometric Sans for geometric layouts.","radius":"Zero radius for images, sharp cuts.","shadow":"None or hard, defining shadows.","motion":"Parallax, smooth sliding, mask reveals.","dos":["Use high quality imagery","Use large titles","Overlay text on images","Be bold"],"donts":["Don't use small text everywhere","Don't use low res images","Don't clutter"],"url":"https://styleprompt.zeabur.app/pro/S38","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S38"},{"id":"S39","name":"Comic Book","category":"artistic","categoryLabel":"🎨 Artístico","palette":"CMYK primaries (Cyan, Magenta, Yellow, Black). Halftone textures.","typo":"Comic Sans style lettering, SFX text (Boom! Pow!).","radius":"Hand-drawn panels, varying/rough borders.","shadow":"Hard black drop shadows (pop art style).","motion":"Panel sliding, scale bouncing (pop-in).","dos":["Use speech bubbles","Use halftone patterns","Use thick outlines","Have fun"],"donts":["Don't use subtle gradients","Don't be serious","Don't use thin fonts"],"url":"https://styleprompt.zeabur.app/pro/S39","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S39"},{"id":"S40","name":"Postcard","category":"retro","categoryLabel":"📻 Retro","palette":"Warm, sun-faded colors. Sepia tones, muted blues and greens.","typo":"Handwritten scripts, stamp fonts.","radius":"Slightly rounded corners (worn paper).","shadow":"Soft, lifting shadows (card effect).","motion":"Flip (front/back), slide in.","dos":["Use paper textures","Use handwriting","Make it personal","Simulate travel"],"donts":["Don't use pristine lines","Don't use neon colors","Don't look digital"],"url":"https://styleprompt.zeabur.app/pro/S40","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S40"},{"id":"S41","name":"Polaroid","category":"retro","categoryLabel":"📻 Retro","palette":"White frame, saturated/filtered photo area. Marker ink colors.","typo":"Marker handwriting (Sharpie style).","radius":"Sharp corners on photo, rounded on frame.","shadow":"Realistic drop shadows to simulate stacking.","motion":"Developing (fade in), stacking, tilting.","dos":["Use the classic frame ratio","Use marker fonts","Simulate film imperfections","Create nostalgia"],"donts":["Don't remove the white border","Don't use digital fonts in the handwritten area","Don't align perfectly"],"url":"https://styleprompt.zeabur.app/pro/S41","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S41"},{"id":"S42","name":"Ticket Stub","category":"themed","categoryLabel":"🌍 Temático","palette":"Faded paper colors (yellows, pinks, blues), Black ink. Grunge textures.","typo":"Monospace (typewriter), Dot matrix.","radius":"Perforated edges, torn corners.","shadow":"Flat, close to surface.","motion":"Tearing, printing, sliding out.","dos":["Use perforated lines","Use monospace fonts","Simulate ink bleed","Keep it functional"],"donts":["Don't use gradients","Don't use variable width fonts","Don't clean it up too much"],"url":"https://styleprompt.zeabur.app/pro/S42","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S42"},{"id":"S43","name":"Low Poly","category":"3d","categoryLabel":"🧊 3D","palette":"Vibrant polygons with computed lighting (facets). Bright saturated colors.","typo":"Geometric Sans (low detail, clean shapes).","radius":"Sharp, angular edges.","shadow":"Hard faceted shadows (no blurs).","motion":"Snappy rotations, faceted transitions.","dos":["Use triangles","Use flat shading","Keep it geometric","Simulate 3D"],"donts":["Don't use gradients","Don't use curves","Don't use realistic textures"],"url":"https://styleprompt.zeabur.app/pro/S43","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S43"},{"id":"S44","name":"Isometric","category":"3d","categoryLabel":"🧊 3D","palette":"Pastel colors with distinct light/dark sides for 3D effect.","typo":"Monospace or Technical Sans.","radius":"Consistent rounding or sharp, depending on object type.","shadow":"Long casting shadows (45 degrees).","motion":"Elevator lifts, sliding on grid axes.","dos":["Use strict 30-degree angles","Stack elements","Use consistent lighting"," Build vertically"],"donts":["Don't mix perspectives","Don't flatter the design","Don't ignore depth"],"url":"https://styleprompt.zeabur.app/pro/S44","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S44"},{"id":"S45","name":"Voxel","category":"3d","categoryLabel":"🧊 3D","palette":"Blocky colors, pixel art palette translated to 3D.","typo":"Pixel fonts or chunky Sans Serif.","radius":"Zero radius (cubes).","shadow":"Drop shadows or ambient occlusion.","motion":"Step-by-step movement, building up blocks.","dos":["Think in cubes","Use grid layouts","Simulate Minecraft/Lego","Keep it chunky"],"donts":["Don't use smooth curves","Don't use high-res textures","Don't break the grid"],"url":"https://styleprompt.zeabur.app/pro/S45","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S45"},{"id":"S46","name":"Abstract Memphis","category":"bold","categoryLabel":"💥 Bold/Audaz","palette":"Pastel pinks, blues, yellows with black patterns.","typo":"Geometrical Sans, quirky display fonts.","radius":"Mixed: some pills, some circles, some triangles.","shadow":"Offset hard shadows (confetti style).","motion":"Floating, bouncing, rotating.","dos":["Use geometric shapes","Be playful","Mix patterns","Use asymmetry"],"donts":["Don't align everything","Don't be boring","Don't adhere to a strict grid"],"url":"https://styleprompt.zeabur.app/pro/S46","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S46"},{"id":"S47","name":"Brutalist 3D","category":"3d","categoryLabel":"🧊 3D","palette":"Concrete greys, raw materials, metallic accents.","typo":"Massive, bold, industrial Sans Serif.","radius":"Minimal or zero.","shadow":"Deep, heavy shadows to show mass.","motion":"Heavy impacts, slow sturdy movements.","dos":["Use large text","Show structure","Use raw materials","Be imposing"],"donts":["Don't decorate","Don't be soft","Don't use delicate fonts"],"url":"https://styleprompt.zeabur.app/pro/S47","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S47"},{"id":"S48","name":"Fluid 3D","category":"3d","categoryLabel":"🧊 3D","palette":"Liquid gradients, iridescent colors, oil slicks.","typo":"Warped or floating Sans Serif.","radius":"Organic, fluid shapes (blobs).","shadow":"Soft, colored glows.","motion":"Morphing, flowing, dripping.","dos":["Use organic shapes","Use gradients","Make it flow","Simulate liquid"],"donts":["Don't use straight lines","Don't use solid flat colors","Don't be static"],"url":"https://styleprompt.zeabur.app/pro/S48","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S48"},{"id":"S49","name":"Watercolor","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Washed out pastels, translucent layers, paper textures.","typo":"Artistic Serif or handwritten Script.","radius":"Organic, bleeding edges.","shadow":"Soft, diffuse spreading shadows (wet look).","motion":"Flowing, seeping, slow fade-ins.","dos":["Use texture","Layer transparencies","Be subtle","Use natural colors"],"donts":["Don't use sharp vectors","Don't use harsh blacks","Don't be rigid"],"url":"https://styleprompt.zeabur.app/pro/S49","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S49"},{"id":"S50","name":"Collage","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Mixed media colors, newsprint greys, bright cutouts.","typo":"Ransom note style, mixed fonts.","radius":"Rough cut edges (scissors).","shadow":"Hard drop shadows to suggest layered paper.","motion":"Stop motion, jerky movements.","dos":["Mix retro photos","Use tape textures","Overlapping elements","Look handmade"],"donts":["Don't align perfectly","Don't be clean","Don't use flat digital colors"],"url":"https://styleprompt.zeabur.app/pro/S50","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S50"},{"id":"S51","name":"Hand Drawn","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Black ink on white/cream paper. Minimal color accents.","typo":"Handwritten, sketchy fonts.","radius":"Wobbly hand-drawn circles and boxes.","shadow":"Hatched shading lines.","motion":"Drawing animations, wiggle effect.","dos":["Use subtle wobbly lines","Look like a sketchbook","Keep it simple","Use negative space"],"donts":["Don't use straight vector lines","Don't perfect the shapes","Don't overuse color"],"url":"https://styleprompt.zeabur.app/pro/S51","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S51"},{"id":"S52","name":"Pop Art","category":"artistic","categoryLabel":"🎨 Artístico","palette":"CMYK primaries, extremely vibrant and contrasting.","typo":"Bold comic fonts, Ben-Day dots.","radius":"Standard rounding or sharp.","shadow":"Black halftone drop shadows.","motion":"Pop-in, comic pow effects.","dos":["Use halftones","Use bold outlines","Be loud","Reference Lichtenstein/Warhol"],"donts":["Don't use muted colors","Don't be subtle","Don't use realistic gradients"],"url":"https://styleprompt.zeabur.app/pro/S52","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S52"},{"id":"S53","name":"Graffiti","category":"bold","categoryLabel":"💥 Bold/Audaz","palette":"Neon sprays on dark concrete/brick walls.","typo":"Graffiti tags, bubble letters.","radius":"None or sprayed soft edges.","shadow":"Spray glow or drip shadows.","motion":"Spray reveal, dripping paint.","dos":["Use street art vibes","Use vibrant neon","Look urban","Be rebellious"],"donts":["Don't use corporate fonts","Don't be clean","Don't use white backgrounds"],"url":"https://styleprompt.zeabur.app/pro/S53","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S53"},{"id":"S54","name":"Art Nouveau","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Muted golds, olive greens, floral tones.","typo":"Ornamental, flowing Serif.","radius":"Complex curves, floral motifs.","shadow":"Soft, natural shadows.","motion":"Growing vines, elegant fades.","dos":["Use curves","Be ornamental","Reference nature","Use muted elegance"],"donts":["Don't use straight lines","Don't use neon","Don't be minimal"],"url":"https://styleprompt.zeabur.app/pro/S54","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S54"},{"id":"S55","name":"Oceanic","category":"themed","categoryLabel":"🌍 Temático","palette":"Deep blues, teals, foam whites.","typo":"Fluid rounded sans-serif.","radius":"Rounded fluid shapes.","shadow":"Soft blue glows, caustic light effects.","motion":"Floating, swaying, ripple effects.","dos":["Use gradients","Mimic water physics","Keep it cool","Use transparency"],"donts":["Don't use sharp corners","Don't use dry colors","Don't be static"],"url":"https://styleprompt.zeabur.app/pro/S55","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S55"},{"id":"S56","name":"Forest","category":"themed","categoryLabel":"🌍 Temático","palette":"Forest greens, earthy browns, sun rays.","typo":"Rustic serif or rounded organic.","radius":"Organic roughness or soft curves.","shadow":"Dappled light shadows.","motion":"Gentle sway, rustling.","dos":["Use textures","Feel organic","Layer depth","Use green heavily"],"donts":["Don't look plastic","Don't use neon","Don't align perfectly"],"url":"https://styleprompt.zeabur.app/pro/S56","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S56"},{"id":"S57","name":"Desert","category":"themed","categoryLabel":"🌍 Temático","palette":"Warm sands, oranges, scorched reds, bright sky blue.","typo":"Weathered or sharp sans.","radius":"Eroded edges.","shadow":"Hard hot shadows.","motion":"Shimmering heat, wind blowing sand.","dos":["Use warm gradients","Feel dry","High contrast","Minimalism"],"donts":["Don't use cool colors (except sky)","Don't look wet","Don't clutter"],"url":"https://styleprompt.zeabur.app/pro/S57","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S57"},{"id":"S58","name":"Polar","category":"themed","categoryLabel":"🌍 Temático","palette":"Icy whites, pale cyans, deep freeze blues.","typo":"Sharp, crystalline fonts.","radius":"Sharp jagged edges or smooth ice.","shadow":"Reflective, glass-like properties.","motion":"Slow freeze, shatter effects.","dos":["Use frost textures","Be bright","Sharp angles","Translucency"],"donts":["Don't use warm colors","Don't be soft/fuzzy","Don't be dark"],"url":"https://styleprompt.zeabur.app/pro/S58","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S58"},{"id":"S59","name":"Jungle","category":"themed","categoryLabel":"🌍 Temático","palette":"Vibrant tropical greens, exotic flower pinks/yellows.","typo":"Exotic display fonts.","radius":"Big organic curves.","shadow":"Deep canopy shadows.","motion":"Grow in, bounce.","dos":["Be lush","Oversaturated colors","Dense layout","Exotic vibes"],"donts":["Don't be sparse","Don't be dull","Don't be techy"],"url":"https://styleprompt.zeabur.app/pro/S59","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S59"},{"id":"S60","name":"Volcanic","category":"themed","categoryLabel":"🌍 Temático","palette":"Charcoal blacks, magma reds, ash greys.","typo":"Bold, cracked or burnt fonts.","radius":"Jagged rock edges.","shadow":"Inner glow (magma).","motion":"Slow flow, particle embers.","dos":["High contrast","Dark mode","Glowing elements","Texture heavy"],"donts":["Don't use water colors","Don't be clean","Don't be friendly"],"url":"https://styleprompt.zeabur.app/pro/S60","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S60"},{"id":"S61","name":"Leather","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Rich tans, browns, stitching yellows.","typo":"Debossed or stamped style font.","radius":"Rounded corners (leather patch).","shadow":"Soft ambient occlusion.","motion":"Tactile press.","dos":["Use stitch effects","Leather texture","Gold/Brass accents","Warmth"],"donts":["Don't look flat","Don't look plastic","Don't use neon"],"url":"https://styleprompt.zeabur.app/pro/S61","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S61"},{"id":"S62","name":"Denim","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Indigo blues, white stitching, copper rivets.","typo":"Bold slab serif (label style).","radius":"Soft fabric folds.","shadow":"Fabric shadows.","motion":"Instant snap.","dos":["Use denim texture","Stitching","Rivets/Tags","Casual vibe"],"donts":["Don't look silky","Don't be too formal","Don't look synthetic"],"url":"https://styleprompt.zeabur.app/pro/S62","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S62"},{"id":"S63","name":"Brushed Steel","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Silvers, greys, reflections.","typo":"Industrial sans serif.","radius":"Micro-bevels.","shadow":"Sharp metallic reflections.","motion":"Mechanical sliding.","dos":["Look heavy","Reflective","Machined","Precision"],"donts":["Don't look soft","Don't look warm","Don't look organic"],"url":"https://styleprompt.zeabur.app/pro/S63","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S63"},{"id":"S64","name":"Carbon Fiber","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Black and dark grey weave.","typo":"Race car digital font.","radius":"Sleek aerodynamic curves.","shadow":"Subtle glossy highlights.","motion":"Fast, high FPS.","dos":["Use the weave","High performance feel","Glossy finish","Sporty"],"donts":["Don't use bright backgrounds","Don't look heavy","Don't look retro"],"url":"https://styleprompt.zeabur.app/pro/S64","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S64"},{"id":"S65","name":"Stained Glass","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Vibrant translucent colors, black lead lines.","typo":"Gothic or blackletter.","radius":"Sharp geometric glass panes.","shadow":"Colored light projection.","motion":"Shine, light passing through.","dos":["Use rich colors","Black outlines","Light effects","Artistic"],"donts":["Don't be dull","Don't be opaque","Don't use modern minimal"],"url":"https://styleprompt.zeabur.app/pro/S65","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S65"},{"id":"S66","name":"Knitwear","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Soft pastels, whites, gray textures.","typo":"Rounded and cozy.","radius":"Very round.","shadow":"Soft fabric occlusion.","motion":"Squishy, soft.","dos":["Feel comfy","Use pattern overlay","Soft colors","Hyge"],"donts":["Don't look hard","Don't look cold","Don't be sharp"],"url":"https://styleprompt.zeabur.app/pro/S66","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S66"},{"id":"S67","name":"Cybernetic","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Black, cyan, electric blue, HUD green.","typo":"Monospace or futuristic sans.","radius":"Angled, chamfered or straight.","shadow":"Glows, no realistic shadows.","motion":"Glitches, scanning, instant snappy.","dos":["Use HUD elements","Scan lines","Data density","Blue/Green glows"],"donts":["Don't be organic","Don't be slow","Don't use serif"],"url":"https://styleprompt.zeabur.app/pro/S67","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S67"},{"id":"S68","name":"Steampunk","category":"retro","categoryLabel":"📻 Retro","palette":"Brass, copper, dark wood, rich velvet red.","typo":"Victorian ornate serif.","radius":"Ornate scrolls and mechanical gears.","shadow":"Deep moody shadows.","motion":"Mechanical ticking, rotating gears.","dos":["Use textures","Gears/Cogs","Warm metallic","Victorian flair"],"donts":["Don't use neon","Don't be clean","Don't use plastic"],"url":"https://styleprompt.zeabur.app/pro/S68","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S68"},{"id":"S69","name":"Alien","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Deep purple, bioluminescent blue/pink.","typo":"Alien hieroglyphs or flowy curves.","radius":"Biological curves, slime.","shadow":"Internal glow.","motion":"Pulsing, breathing.","dos":["Look organic","Alien flora","Mysterious lighting","Glow"],"donts":["Don't stick to grid","Don't use earth tones","Don't be geometric"],"url":"https://styleprompt.zeabur.app/pro/S69","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S69"},{"id":"S70","name":"Fantasy","category":"themed","categoryLabel":"🌍 Temático","palette":"Parchment beige, ink black, magical gold/purple.","typo":"Calligraphy or fantasy serif.","radius":"Hand drawn scrolls.","shadow":"Candlelight flickering.","motion":"Sparkles, floating dust, writing.","dos":["Use parchment texture","Magical effects","Old fonts","Runes"],"donts":["Don't look modern","Don't use sans-serif","Don't be sterile"],"url":"https://styleprompt.zeabur.app/pro/S70","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S70"},{"id":"S71","name":"Wasteland","category":"themed","categoryLabel":"🌍 Temático","palette":"Rust orange, olive green, dirt brown, slate grey.","typo":"Stencil or distressed type.","radius":"Broken, uneven.","shadow":"Gritty, dirty.","motion":"Jittery, failing tech.","dos":["Look dirty","Survival theme","Distressed textures","Grunge"],"donts":["Don't be clean","Don't be perfect","Don't use bright primary colors"],"url":"https://styleprompt.zeabur.app/pro/S71","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S71"},{"id":"S72","name":"Starship","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Stark white, black panels, glowing blue/orange indicators.","typo":"Clean futuristic sans (Eurostile).","radius":"Pill shapes and perfect circles.","shadow":"Soft clean ambient occlusion.","motion":"Smooth sliding panels, FUI.","dos":["Clean sci-fi","Panel gaps","Functional UI","Space station"],"donts":["Don't be dirty","Don't be chaotic","Don't use serif"],"url":"https://styleprompt.zeabur.app/pro/S72","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S72"},{"id":"S73","name":"Impressionist","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Pastel dabs, vibrant light, mixing colors.","typo":"Artistic brush font or elegant serif.","radius":"Paint daubs.","shadow":"Painted shadows.","motion":"Fading in, painting on.","dos":["Look painted","Light and airy","Visible strokes","Monet vibes"],"donts":["Don't be sharp","Don't be digital","Don't use black"],"url":"https://styleprompt.zeabur.app/pro/S73","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S73"},{"id":"S74","name":"Cubist","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Muted earth tones, browns, greys, ochre.","typo":"Blocky sans serif.","radius":"Sharp angles, fragmented geometry.","shadow":"Hard planes.","motion":"Shift and reassemble.","dos":["Geometric abstraction","Multiple perspectives","Picasso vibes","Fragment"],"donts":["Don't be realistic","Don't be smooth","Don't be curvy"],"url":"https://styleprompt.zeabur.app/pro/S74","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S74"},{"id":"S75","name":"Surrealist","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Dreamlike gradients, odd juxtapositions.","typo":"Surreal distorted type.","radius":"Melting shapes.","shadow":"Long impossible shadows.","motion":"Morphing, floating.","dos":["Be weird","Dali vibes","Dream logic","Unexpected"],"donts":["Don't be boring","Don't be standard","Don't make sense"],"url":"https://styleprompt.zeabur.app/pro/S75","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S75"},{"id":"S76","name":"Renaissance","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Sepia ink, parchment, faded red chalk.","typo":"Humanist serif or handwriting.","radius":"Hand drawn circles.","shadow":"Hatching lines.","motion":"Drawing in, ink heavy.","dos":["Da Vinci vibes","Sketchy","Intellectual","Historical"],"donts":["Don't use modern colors","Don't be digital","Don't be shiny"],"url":"https://styleprompt.zeabur.app/pro/S76","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S76"},{"id":"S77","name":"Ukiyo-e","category":"artistic","categoryLabel":"🎨 Artístico","palette":"Indigo, prussian blue, salmon pink, washi white.","typo":"Brush calligraphy.","radius":"Soft curves.","shadow":"Flat layers.","motion":"Slide ins, reveal.","dos":["Japanese aesthetic","Flat colors","Woodblock texture","Nature"],"donts":["Don't use gradients","Don't be 3D","Don't be chaotic"],"url":"https://styleprompt.zeabur.app/pro/S77","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S77"},{"id":"S78","name":"Gothic","category":"dark","categoryLabel":"🌑 Dark/Oscuro","palette":"Dark stone greys, deep reds, black.","typo":"Blackletter / Old English.","radius":"Pointed arches (Ogee).","shadow":"Deep castle shadows.","motion":"Slow, solemn.","dos":["Medieval","Dark mode","Ornate","Verticality"],"donts":["Don't be cute","Don't be bright","Don't be modern"],"url":"https://styleprompt.zeabur.app/pro/S78","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S78"},{"id":"S79","name":"Corporate Clean","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Safe reliable blue tones, white background, high contrast text.","typo":"Inter or Roboto, clean sans-serif, legible.","radius":"Small consistent radius (4px).","shadow":"Minimal or none, flat design.","motion":"Minimal, instant, efficient.","dos":["Use blue/grey","Be structured","High readability","Professional"],"donts":["Don't be eclectic","Don't use neon","Don't be chaotic"],"url":"https://styleprompt.zeabur.app/pro/S79","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S79"},{"id":"S80","name":"Startup Vibrant","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Blurple, cyan, gradients, high energy.","typo":"Plus Jakarta Sans or modern geometric sans.","radius":"Full rounded pills (999px).","shadow":"Soft colored shadows, elevation.","motion":"Bouncy, smooth, playful.","dos":["Use gradients","Rounded buttons","Energetic","Modern"],"donts":["Don't be dull","Don't be square","Don't use serif"],"url":"https://styleprompt.zeabur.app/pro/S80","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S80"},{"id":"S81","name":"Enterprise Blue","category":"dark","categoryLabel":"🌑 Dark/Oscuro","palette":"Navy blue, grey, information dense.","typo":"Roboto or system fonts, compact.","radius":"Square or very small radius (2px).","shadow":"Subtle functional shadows.","motion":"None or very fast.","dos":["Information density","Blue header","Clear hierarchy","Trust"],"donts":["Don't use too much whitespace","Don't be playful","Don't hide data"],"url":"https://styleprompt.zeabur.app/pro/S81","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S81"},{"id":"S82","name":"Fintech Trust","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Deep purple, growth green, navy.","typo":"DM Sans, clean and modern.","radius":"Modern rounded corners (12px).","shadow":"Clean sophisticated shadows.","motion":"Secure, smooth transitions.","dos":["Look secure","Use growth green","Clean lines","Trustworthy"],"donts":["Don't be risky","Don't be messy","Don't use red (unless error)"],"url":"https://styleprompt.zeabur.app/pro/S82","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S82"},{"id":"S83","name":"Health Medical","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Teal, white, soft grey, sterile.","typo":"Lato or humanist sans.","radius":"Soft approachable radius (16px).","shadow":"Very soft diffuse shadows.","motion":"Gentle, reassuring.","dos":["Look clean","Use teal/cyan","Comforting","Professional"],"donts":["Don't be dark","Don't be sharp","Don't look dirty"],"url":"https://styleprompt.zeabur.app/pro/S83","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S83"},{"id":"S84","name":"Eco Green","category":"organic","categoryLabel":"🌿 Orgánico","palette":"Forest green, earth brown, leaf light green.","typo":"Nunito or rounded sans.","radius":"Organic shapes, leaf corners.","shadow":"Natural soft shadows.","motion":"Organic, growing, wind.","dos":["Use nature colors","Leaf shapes","Sustainable vibes","Organic"],"donts":["Don't look plastic","Don't use industrial colors","Don't be sharp"],"url":"https://styleprompt.zeabur.app/pro/S84","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S84"},{"id":"S85","name":"Kids Playful","category":"bold","categoryLabel":"💥 Bold/Audaz","palette":"Primary colors (Red, Yellow, Blue), bright, high saturation.","typo":"Nunito, Comic Neue, or rounded sans-serif.","radius":"Large, exaggerated rounded corners (24px-32px).","shadow":"Hard distinct shadows, non-blurred.","motion":"Bouncy, elastic, fun.","dos":["Use bright colors","Big buttons","Playful icons","Simple language"],"donts":["Don't be serious","Don't use small text","Don't use sharp corners"],"url":"https://styleprompt.zeabur.app/pro/S85","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S85"},{"id":"S86","name":"Gamer RGB","category":"dark","categoryLabel":"🌑 Dark/Oscuro","palette":"Black background, neon RGB (Red, Green, Blue) accents.","typo":"Orbitron, Rajdhani, or aggressive futuristic sans.","radius":"Sharp angles, cut corners.","shadow":"Neon glows, colored drop shadows.","motion":"Fast, glitchy, high refresh rate feel.","dos":["Use dark mode","RGB lighting","Aggressive shapes","High contrast"],"donts":["Don't be subtle","Don't use pastel","corporate"],"url":"https://styleprompt.zeabur.app/pro/S86","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S86"},{"id":"S87","name":"Luxury Gold","category":"dark","categoryLabel":"🌑 Dark/Oscuro","palette":"Black, Gold, Rich dark textures.","typo":"Playfair Display, Cinzel, or elegant serif.","radius":"Sharp or very slightly rounded (1px-2px).","shadow":"Subtle ambient glows, gold reflections.","motion":"Slow, elegant, fade-ins.","dos":["Use gold","Serif fonts","Minimal layout","High quality imagery"],"donts":["Don't be cheap","Don't clutter","Don't use bright primary colors"],"url":"https://styleprompt.zeabur.app/pro/S87","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S87"},{"id":"S88","name":"Luxury Silver","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"White, Silver, Platinum, Cool Greys.","typo":"Montserrat, Lato (Ultralight weights).","radius":"Clean sharp edges.","shadow":"Cool soft shadows, metallic sheen.","motion":"Smooth, fluid, polished.","dos":["Look expensive","Use whitespace","Cool tones","Silver gradients"],"donts":["Don't use gold","Don't be warm","Don't be heavy"],"url":"https://styleprompt.zeabur.app/pro/S88","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S88"},{"id":"S89","name":"Minimalist Serif","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Beige, Cream, Soft Brown, Charcoal.","typo":"Beautiful serif headings, clean sans body.","radius":"Zero radius or very slight.","shadow":"None or very subtle.","motion":"Slow aesthetic fades.","dos":["Use big photography","Serif titles","Lots of breathing room","Editorial"],"donts":["Don't clutter","Don't use bright colors","Don't be techy"],"url":"https://styleprompt.zeabur.app/pro/S89","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S89"},{"id":"S90","name":"Brutalist Color","category":"bold","categoryLabel":"💥 Bold/Audaz","palette":"Clashing colors (Pink/Green, Blue/Orange), high saturation.","typo":"Bold grotesque sans, massive sizes.","radius":"Zero radius.","shadow":"Hard solid black shadows.","motion":"Jerky, instant, hover effects.","dos":["Be bold","Clash colors","Use borders","Anti-design"],"donts":["Don't be subtle","Don't use gradients","pretty"],"url":"https://styleprompt.zeabur.app/pro/S90","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S90"},{"id":"S91","name":"E-ink Paper","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Strict grayscale, high contrast black/white.","typo":"Serif for body (Merriweather), Sans for UI.","radius":"Minimal (2px) or none.","shadow":"None, uses borders.","motion":"Stepped update, slow refresh feel.","dos":["Use high contrast","Black on white","Serif fonts","Minimal UI"],"donts":["Don't use color","Don't be blurry","Don't use gradients"],"url":"https://styleprompt.zeabur.app/pro/S91","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S91"},{"id":"S92","name":"OLED Black","category":"dark","categoryLabel":"🌑 Dark/Oscuro","palette":"Pure #000000 background, vibrant neon accents.","typo":"Modern sans-serif (Inter/Roboto).","radius":"Rounded (12px).","shadow":"Colored glow shadows.","motion":"Smooth, fluid, 60fps.","dos":["Use pure black","Vibrant colors","Dark mode","Clean"],"donts":["Don't use grey background","Don't be dull","Don't cluster"],"url":"https://styleprompt.zeabur.app/pro/S92","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S92"},{"id":"S93","name":"Terminal Retro","category":"retro","categoryLabel":"📻 Retro","palette":"Black background, Amber or Green text.","typo":"Monospace (VT323, Fira Code).","radius":"Zero radius.","shadow":"CRT glow.","motion":"Typing effects, blinking cursor.","dos":["Use monospace","Amber color","Scanlines","Retro vibe"],"donts":["Don't use sans-serif","Don't be high res","Don't use white"],"url":"https://styleprompt.zeabur.app/pro/S93","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S93"},{"id":"S94","name":"Code Editor","category":"dark","categoryLabel":"🌑 Dark/Oscuro","palette":"Dark blue-grey (Dracula/Nord), pastel syntax colors.","typo":"Fira Code, JetBrains Mono.","radius":"Small radius (4px).","shadow":"Deep ambient shadows.","motion":"Fast, efficient.","dos":["Use syntax colors","Monospace","Dark theme","Clean"],"donts":["Don't be bright","Don't use serif","Don't be cluttered"],"url":"https://styleprompt.zeabur.app/pro/S94","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S94"},{"id":"S95","name":"Data Dashboard","category":"minimalist","categoryLabel":"🔲 Minimalista","palette":"Low contrast greys, specific data colors.","typo":"Condensed sans (Roboto Condensed).","radius":"Small radius (2px).","shadow":"None or card outlines.","motion":"Instant.","dos":["Dense info","Clear hierarchy","Data viz","Neutral background"],"donts":["Don't use space waste","Don't be decorative","Don't use large text"],"url":"https://styleprompt.zeabur.app/pro/S95","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S95"},{"id":"S96","name":"SciFi HUD","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Transparent, cyan/blue, white.","typo":"Technical sans (Eurostile, Rajdhani).","radius":"Angled corners (45deg cuts).","shadow":"Text shadows/glows.","motion":"Sliding, locking, targeting.","dos":["Use transparency","Technical look","Cyan/Blue","Overlays"],"donts":["Don't be opaque","Don't be organic","Don't rely on background"],"url":"https://styleprompt.zeabur.app/pro/S96","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S96"},{"id":"S97","name":"Frosted Glass","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Pastel gradients background, white semi-transparent surfaces.","typo":"Modern sans-serif (Inter/SF Pro).","radius":"Large (24px).","shadow":"Soft diffuse shadows.","motion":"Floating, slow drifts.","dos":["Use backdrop-filter","White text shadows","Gradients","Clean"],"donts":["Don't be opaque","Don't use sharp corners","Don't use heavy borders"],"url":"https://styleprompt.zeabur.app/pro/S97","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S97"},{"id":"S98","name":"Acrylic Fluid","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Dark/Light adaptive, noise texture overlay.","typo":"Segoe UI / System default.","radius":"Medium (8px).","shadow":"Elevation shadows.","motion":"Fast, responsive.","dos":["Use texture","Blur","System fonts","Adaptive"],"donts":["Don't use solid flat colors","Don't be flashy","Don't block background"],"url":"https://styleprompt.zeabur.app/pro/S98","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S98"},{"id":"S99","name":"Material You","category":"material","categoryLabel":"🧱 Material/Textura","palette":"Dynamic color extraction from wallpaper.","typo":"Roboto Flex / Google Sans.","radius":"Pill shapes, large rounded corners.","shadow":"Tonal surface colors, no drop shadows.","motion":"Material easing, spring physics.","dos":["Use tonal surfaces","Rounded FABs","Dynamic color","Modern Material"],"donts":["Don't use shadows for elevation","Don't use gradients","Don't use borders"],"url":"https://styleprompt.zeabur.app/pro/S99","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S99"},{"id":"S100","name":"The Ultimate","category":"futuristic","categoryLabel":"🚀 Futurista","palette":"Black background with holographic pink/purple gradients (#FF0080 to #7928CA). Glowing orb effects.","typo":"Space Grotesk for futuristic, modern feel. Large display sizes.","radius":"Large rounded (32px for cards). Pills for buttons.","shadow":"Colored glows with mix-blend-mode. Neon effect shadows.","motion":"3D tilt on mouse move. Hover scale. Animated gradient text.","dos":["Use black backgrounds","Add holographic gradient text","Create 3D tilt effects","Use glassmorphism cards"],"donts":["Don't use flat colors","Don't skip the depth effects","Don't use serif fonts"],"url":"https://styleprompt.zeabur.app/pro/S100","previewUrl":"https://styleprompt.zeabur.app/styles/pro/S100"}];
function render(list){
document.getElementById('count').textContent='Mostrando '+list.length+' de 100 estilos';
document.getElementById('grid').innerHTML=list.map(s=>`
<div class="card" data-cat="${s.category}">
<div class="card-top">
<span class="card-id">${s.id}</span>
<span class="card-name">${s.name}</span>
<span class="card-cat">${s.categoryLabel}</span>
</div>
<div class="card-body">
<h4>Style DNA</h4>
<div class="dna">
<span><strong>Paleta:</strong> ${s.palette}</span>
<span><strong>Tipografía:</strong> ${s.typo}</span>
<span><strong>Motion:</strong> ${s.motion}</span>
</div>
<div class="lists">
<div class="do"><h5>✅ DO</h5><ul>${s.dos.map(d=>'<li>'+d+'</li>').join('')}</ul></div>
<div class="dont"><h5>❌ DON'T</h5><ul>${s.donts.map(d=>'<li>'+d+'</li>').join('')}</ul></div>
</div>
</div>
<div class="card-footer">
<a href="${s.url}" target="_blank" class="btn">Editor →</a>
<a href="${s.previewUrl}" target="_blank" class="btn btn-ghost">Preview</a>
</div>
</div>`).join('');
}
function filter(){
const q=document.getElementById('search').value.toLowerCase();
const c=document.getElementById('cat').value;
render(S.filter(s=>{
const mq=!q||s.name.toLowerCase().includes(q)||s.palette.toLowerCase().includes(q)||s.typo.toLowerCase().includes(q);
const mc=!c||s.category===c;
return mq&&mc;
}));
}
document.getElementById('search').addEventListener('input',filter);
document.getElementById('cat').addEventListener('change',filter);
render(S);
</script>
</body>
</html>
