Add comprehensive component library and demo application

Added extensive component library with feedback components (empty state, loading spinner, skeleton loader), enhanced form components (autocomplete, date picker, file upload, form field, time picker), navigation components (pagination), and overlay components (backdrop, drawer, modal, overlay container). Updated demo application with comprehensive showcase components and enhanced styling throughout the project. Excluded font files from repository to reduce size.

🤖 Generated with [Claude Code](https://claude.ai/code)

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

projects/demo-ui-essentials/src/styles.scss

@@ -1 +1,35 @@
 /* You can add global styles to this file, and also import other style files */
+
+// Set font paths before importing fontfaces
+$inter-font-path: "/fonts/inter/" !default;
+$comfortaa-font-path: "/fonts/comfortaa/" !default;
+
+// Import specific fonts we need for the demo
+@import '../../shared-ui/src/styles/fontfaces/inter';
+@import '../../shared-ui/src/styles/fontfaces/comfortaa';
+
+// Import project variables (which now has semantic tokens available)
+@import 'scss/_variables';
+
+html {
+  height: 100%;
+  font-size: 16px; // Base font size for rem calculations
+}
+
+body {
+  margin: 0;
+  padding: 0;
+  height: 100%;
+  background-color: $semantic-color-surface-primary;
+  color: $semantic-color-text-primary;
+  
+  // Apply base typography using semantic tokens
+  font-family: map-get($semantic-typography-body-medium, font-family);
+  font-size: map-get($semantic-typography-body-medium, font-size);
+  font-weight: map-get($semantic-typography-body-medium, font-weight);
+  line-height: map-get($semantic-typography-body-medium, line-height);
+  
+  // Improve text rendering
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}