Phase 6: Template System

- Added 8 pre-designed templates across 8 categories
- Templates: Team Sport, Band Merch, Minimal Quote, Funny Cat,
  Gradient Vibes, Vintage Badge, Nature Lover, Tech Geek
- Templates tab with category filter pills
- Template preview cards with 2-column grid
- One-click template application to canvas

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

client/src/index.css

@@ -389,6 +389,72 @@ input, textarea, select {
   text-align: center;
 }
 
+/* Templates Tab */
+.templates-tab h3 {
+  font-size: 0.875rem;
+  margin: 0 0 1rem 0;
+}
+
+.templates-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 0.75rem;
+  max-height: 400px;
+  overflow-y: auto;
+}
+
+.template-card {
+  display: flex;
+  flex-direction: column;
+  padding: 0.75rem;
+  border: 1px solid var(--border);
+  border-radius: var(--radius-md);
+  background: var(--bg-primary);
+  cursor: pointer;
+  transition: all 0.2s;
+  text-align: left;
+}
+
+.template-card:hover {
+  border-color: var(--accent);
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-md);
+}
+
+.template-preview {
+  height: 60px;
+  background: var(--bg-tertiary);
+  border-radius: var(--radius-sm);
+  margin-bottom: 0.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.25rem;
+  flex-wrap: wrap;
+  padding: 0.25rem;
+}
+
+.template-preview-element {
+  font-weight: 500;
+}
+
+.template-info {
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+}
+
+.template-name {
+  font-size: 0.75rem;
+  font-weight: 500;
+  color: var(--text-primary);
+}
+
+.template-category {
+  font-size: 0.625rem;
+  color: var(--text-muted);
+}
+
 /* Properties Panel */
 .properties-panel {
   padding: 1rem;