update style

index.html

@@ -811,6 +811,10 @@ https://chatgpt.com/c/67efa5ae-ab80-8005-a7d4-de3ced6ccec4
              
                 toolsContainer.appendChild(toolCard);
                 });
+                // אנימציה של הופעה חלקה
+                requestAnimationFrame(() => {
+                    toolCard.classList.add('visible');
+                });
                 
                 // הוספת סגנון CSS לכפתור הקראה פעיל
                 if (!document.getElementById('speakButtonStyle')) {

style.css

@@ -1,7 +1,15 @@
+html {
+    scroll-behavior: smooth;
+}
+
 body {
 	padding: 2rem;
 	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
 }
+button:hover, a.button:hover {
+    transform: scale(1.02);
+    transition: transform 0.2s ease-in-out;
+}
 
 h1 {
 	font-size: 16px;
@@ -31,6 +39,43 @@ p {
   overflow-y: auto;
   padding-bottom: 80px; /* כדי לא להיתקע מאחורי הפוטר */
 }
+.tool-card {
+    opacity: 0;
+    transform: translateY(20px);
+    transition: all 0.5s ease;
+}
+.tool-card.visible {
+    opacity: 1;
+    transform: translateY(0);
+}
+.accessibility-mode {
+    font-size: 18px;
+    line-height: 1.8;
+    background-color: #000 !important;
+    color: #fff !important;
+}
+
+.accessibility-mode .tool-card {
+    background-color: #111 !important;
+    color: #fff !important;
+    border-color: #555 !important;
+}
+
+.accessibility-mode a,
+.accessibility-mode button {
+    font-size: 18px !important;
+    color: #fff !important;
+    background-color: #333 !important;
+}
+
+.accessibility-mode input,
+.accessibility-mode textarea {
+    font-size: 16px;
+    background-color: #222;
+    color: white;
+    border-color: #666;
+}
+
  /* Chat animations and effects */
 @keyframes pulse {
 	0% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.7); }