phase 2

stitch-exports/screen-06-flashcard/DESIGN.md

@@ -0,0 +1,57 @@
+# Design System
+
+Auto-generated from Google Stitch export.
+
+## Colors
+
+- `bg-slate-900`
+- `text-slate-500`
+- `text-slate-400`
+- `bg-slate-800`
+- `text-blue-400`
+- `border-r-4`
+
+## Typography
+
+- `text-sm`
+- `font-medium`
+- `text-2xl`
+- `font-bold`
+- `text-xs`
+- `font-extrabold`
+- `text-xl`
+- `text-4xl`
+- `text-lg`
+
+## Spacing
+
+- `space-y-1`
+- `gap-3`
+- `p-2`
+- `gap-2`
+- `gap-1`
+- `p-5`
+- `gap-10`
+- `p-12`
+- `p-8`
+- `gap-6`
+- `space-y-8`
+- `p-6`
+- `space-y-4`
+- `gap-4`
+- `space-y-3`
+
+## Components
+
+- `<aside>`
+- `<nav>`
+- `<button>`
+- `<main>`
+- `<section>`
+- `<header>`
+
+## Notes
+
+- Generated by Google Stitch AI
+- Tailwind CSS utility classes used throughout
+- Review and customize colors/typography for brand alignment