Update README.md

README.md

@@ -1,20 +1,51 @@
----
-license: unknown
----
+<style>
+  .message-box {
+    padding: 1rem 1.5rem;
+    border-radius: 8px;
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    font-size: 1.1rem;
+    max-width: 600px;
+    margin: 1rem auto;
+    text-align: center;
+    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
+    transition: background-color 0.3s ease, color 0.3s ease;
+  }
 
-<!-- Modern HTML embed inside Markdown -->
+  /* Light mode (default) */
+  .message-box {
+    background-color: #f0f0f0;
+    color: #222;
+  }
 
-<div style="
-  background-color: #1e1e1e;
-  color: #eee;
-  padding: 1rem 1.5rem;
-  border-radius: 8px;
-  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-  font-size: 1.1rem;
-  max-width: 600px;
-  margin: 1rem auto;
-  box-shadow: 0 4px 12px rgba(0,0,0,0.6);
-  text-align: center;
-">
+  .message-box strong {
+    color: #0077cc;
+  }
+
+  .message-box code {
+    background-color: #ddd;
+    padding: 0.15rem 0.4rem;
+    border-radius: 4px;
+    font-family: monospace;
+    color: #d6336c;
+  }
+
+  /* Dark mode */
+  @media (prefers-color-scheme: dark) {
+    .message-box {
+      background-color: #1e1e1e;
+      color: #eee;
+      box-shadow: 0 4px 12px rgba(0,0,0,0.7);
+    }
+    .message-box strong {
+      color: #66aaff;
+    }
+    .message-box code {
+      background-color: #333;
+      color: #ff7fa1;
+    }
+  }
+</style>
+
+<div class="message-box">
   Open a discussion in the <strong>Community</strong> tab to request a <code>GGUF</code> model.
 </div>