1 files changed, 90 insertions, 0 deletions
diff --git a/html/kgame/style.css b/html/kgame/style.css
new file mode 100644
index 0000000..dfb0f33
--- /dev/null
+++ b/html/kgame/style.css
@@ -0,0 +1,90 @@
+body {
+    font-family: sans-serif;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin: 1em;
+    background-color: #f4f4f4;
+}
+
+h1 {
+    margin-bottom: 0.5em;
+}
+
+p, ul {
+     max-width: 600px;
+     text-align: left;
+     margin-bottom: 0.5em;
+ }
+
+li {
+    margin-bottom: 0.3em;
+}
+
+code {
+    font-family: monospace;
+    background-color: #e0e0e0;
+    padding: 0.1em 0.3em;
+    border-radius: 3px;
+}
+
+canvas {
+    border: 1px solid #333;
+    margin-top: 1em;
+    background-color: #fff;
+    /* Prevent blurry rendering */
+    image-rendering: -moz-crisp-edges;
+    image-rendering: -webkit-crisp-edges;
+    image-rendering: pixelated;
+    image-rendering: crisp-edges;
+}
+
+.input-area {
+    margin-top: 1em;
+    display: flex;
+    align-items: center;
+}
+
+#kInput {
+    padding: 8px;
+    font-size: 1em;
+    font-family: monospace;
+    margin-right: 5px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+}
+
+#runButton {
+    padding: 8px 15px;
+    font-size: 1em;
+    cursor: pointer;
+    background-color: #4CAF50;
+    color: white;
+    border: none;
+    border-radius: 4px;
+}
+
+#runButton:hover {
+    background-color: #45a049;
+}
+
+#output {
+    margin-top: 1em;
+    padding: 10px;
+    background-color: #e0e0e0;
+    border: 1px solid #ccc;
+    min-height: 3em;
+    width: 500px; /* Adjust as needed */
+    white-space: pre-wrap; /* Wrap long lines */
+    word-wrap: break-word; /* Break long words */
+    font-family: monospace;
+    color: #d00; /* Default to error color */
+}
+
+#output.success {
+    color: #080; /* Green for success */
+}
+
+#output.info {
+    color: #333; /* Default black/gray for info */
+}
\ No newline at end of file