Sprint 3 = production assets (logo, icons, hero, textures). Most deliverables
are physical artistic work (artist Renaud + Nikola scans). This commit lays
the CODE scaffold so assets drop in without friction when delivered.
New : apps/web/src/components/branding/
- Logo.tsx — single source of truth for Talas / Veza brand rendering.
Replaces ad-hoc inline wordmarks (Sidebar/Navbar/Footer/landing each had
their own VEZA <h2>). Variants: wordmark / symbol / lockup. Sizes xs..xl.
Colors auto/ink/cyan/inverse. Optional tagline. Horizontal/vertical orient.
- assets/SymbolPlaceholder.tsx — geometric ink stroke + arc + dot, monochrome,
currentColor inheritance, scalable. Mirrors charte §3.1 brief. Replaced by
artist's hand-drawn mark in P0.1 of BRIEF_ARTISTE.
- Logo.stories.tsx — full Storybook coverage: variants, sizes, colors,
orientation, Talas vs Veza, all-sizes ladder.
- index.ts — barrel exports.
New : apps/web/src/components/icons/sumi/
- Play.tsx — first calligraphic icon stub (programmatic approximation per
charte §6.3). 9 more to come (Pause, Search, Profile, Chat, Upload,
Settings, Home, Close, Volume).
- index.ts — barrel + commented TODO list per priority.
- Used via existing components/icons/SumiIcon.tsx wrapper which falls back to
Lucide when no Sumi version exists.
Brand alignment of platform metadata :
- public/favicon.svg — Mizu cyan placeholder (#0098B5) replacing default
vite.svg. Mirrors SymbolPlaceholder geometry.
- public/manifest.json — theme_color #1a1a1a -> #0098B5 (SUMI accent),
background_color #ffffff -> #0D0D0F (charte §4.4 rule 1: no pure white).
- index.html — theme-color meta + msapplication-TileColor aligned to SUMI.
Favicon link points to /favicon.svg.
New doc : apps/web/docs/BRANDING.md
- Architecture map of brand assets in apps/web.
- Logo component API + usage examples.
- Asset deliverables status table (P0/P1/P2 from brief artiste, all 🟡 placeholders).
- Naming convention for raw scans + processed SVGs.
- Step-by-step "how to integrate a delivered asset" for wordmark and Sumi icon.
- Brand color guard (ESLint rule pointer).
Build OK (vite 12.6s). Typecheck clean. No visual regression — Sidebar/Navbar
inline wordmarks intentionally NOT migrated yet (they use fontWeight 300 which
contradicts charte's Bold requirement; a per-screen migration call later).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Document migration approach in ZUSTAND_MIGRATION_STRATEGY.md
- Add persistWithMigration utility for future stores
- Add version and migrate to authStore, library, ui, cartStore, playerStore
- Remove packages/design-system/ directory (superseded by SUMI tokens
in apps/web/src/index.css, confirmed no imports exist)
- Update package.json keywords from kodo-design-system to sumi-design-system
- Create docs/STORYBOOK_CONTRACT.md defining mandatory story structure:
Default, Loading, Error, Empty states for feature components
- Typography audit: SUMI utility classes defined in index.css, codebase
correctly uses Tailwind classes with SUMI tokens via @theme — no
migration needed
Co-authored-by: Cursor <cursoragent@cursor.com>
- Created COMMENTED_CODE_AUDIT.md documenting findings
- Found ~4,329 commented lines total (mostly documentation)
- Actual commented-out code blocks are minimal
- Excluded generated files and documentation comments
- Ready for manual review in Cleanup 9
- Cleanup 8: Complete
- Expanded basic checklist into comprehensive implementation guide
- Added detailed sections: Color (80/20 rule), Spacing (8px grid), Interactions, Visual Elements
- Added component-specific checks: Buttons, Cards, Navigation, Forms, Pages
- Included specific Tailwind classes and values for each check
- Added 'keep vs remove' guidance for hover effects and visual elements
- Added final validation section for overall assessment
- Provides actionable, step-by-step guidance for applying Surgical Minimalism
- Action 11.5.1.2 complete
- Created comprehensive design direction document
- Defined 6 core principles: 80/20 color rule, increased whitespace, subtle interactions, gradients used sparingly, 8px grid system, text color hierarchy
- Documented design tokens and color usage guidelines
- Added implementation checklist for applying principles
- Included good vs avoid examples with code snippets
- Documented migration path and references to audit documents
- Aligns with all completed aesthetic improvement actions
- Serves as foundation for future design work
- Action 11.5.1.1 complete
- Created verification document documenting all remaining gradients
- Verified 12 remaining gradients are appropriate:
- 6 in hero/featured sections (DiscoverView, ProfileView, SocialView, LiveView)
- 1 functional overlay for text readability
- 5 decorative elements (icon containers, visualizations)
- Confirmed no gradients on card backgrounds
- All gradients used sparingly and appropriately, aligning with Surgical Minimalism
- Action 11.4.2.2 complete
- Created comprehensive contrast test report
- Tested all text color combinations (white, dim, opacity variants)
- Tested on all 5 background colors (void, ink, graphite, slate, steel)
- All combinations exceed 4.5:1 ratio requirement
- Primary text: 15.9:1 to 20.6:1 (excellent)
- Secondary text: 6.1:1 to 7.8:1 (good)
- Text with opacity: 11.8:1 to 16.2:1 (excellent)
- No violations found - all text meets WCAG AA
- Action 11.1.1.3 complete
- Audited all files with view mode toggle (6 files total)
- Found list view is actively used and is default in 3 contexts:
- SearchPageView: List is default for search results
- FileManagerView: List is default for file browsing
- CloudFileBrowser: List is default for cloud files
- Grid view is default in track browsing contexts (LibraryPage, LibraryManager, ProfileView)
- Recommendation: Keep list view - serves different purposes than grid view
- Created comprehensive audit report: apps/web/docs/LIST_VIEW_USAGE_AUDIT.md
- Includes context-specific analysis and recommendations
- Scanned 166 files with button elements
- Identified 30+ high-priority custom button implementations
- Documented locations, line numbers, and recommended Button variants
- Created comprehensive audit report: apps/web/docs/CUSTOM_BUTTONS_AUDIT.md
- High priority: Live stream, Dashboard, Social, Admin, Studio, File Manager, Modals
- Includes migration strategy and next steps
- Created comprehensive TAILWIND_COLORS_AUDIT.md documenting all Tailwind default colors
- Found 1,492 instances across 235 files
- Most common: text-gray-* (992), bg-gray-* (146), border-gray-* (107)
- Documented color distribution, top 20 classes, and mapping guide
- Identified top 20 files requiring migration
- Created migration priority guide (High/Medium/Low)
- Documented special cases (test files, component libraries)
- Ready for Action 9.1.1.3 (migration to Kodo colors)
