feat: enhance CSS and components for Telegram Mini App performance

- Updated CSS to utilize viewport variables for safe area insets and stable height, improving layout consistency across devices.
- Introduced haptic feedback triggers in various components to enhance user interaction, mimicking native Telegram behavior.
- Added functionality to detect Android performance class, minimizing animations on low-performance devices for better user experience.
- Refactored components to incorporate new CSS classes for content safety and improved responsiveness.

webapp-next/src/lib/telegram-haptic.ts

@@ -0,0 +1,19 @@
+/**
+ * Triggers Telegram Mini App haptic feedback when available.
+ * Use on primary actions and key interactions to mimic native Telegram behavior.
+ */
+
+import { hapticFeedbackImpactOccurred } from "@telegram-apps/sdk-react";
+
+/**
+ * Triggers light impact haptic feedback. No-op when not in Telegram or unsupported.
+ */
+export function triggerHapticLight(): void {
+  try {
+    if (hapticFeedbackImpactOccurred.isAvailable()) {
+      hapticFeedbackImpactOccurred("light");
+    }
+  } catch {
+    // SDK not available; ignore.
+  }
+}