diff --git a/package-lock.json b/package-lock.json
index 3c4cb04..16a6363 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,11 +15,13 @@
                 "@typescript-eslint/eslint-plugin": "^5.45.0",
                 "@typescript-eslint/parser": "^5.45.0",
                 "better-sqlite3": "^8.3.0",
+                "carta-md": "^3.4.0",
                 "dotenv": "^16.3.1",
                 "eslint": "^8.28.0",
                 "eslint-config-prettier": "^8.5.0",
                 "eslint-plugin-svelte": "^2.31.0",
                 "fontkit": "^2.0.2",
+                "isomorphic-dompurify": "^2.0.0",
                 "prettier": "^2.8.0",
                 "prettier-plugin-svelte": "^2.8.1",
                 "svelte": "^4.0.0",
@@ -640,6 +642,11 @@
                 }
             }
         },
+        "node_modules/@speed-highlight/core": {
+            "version": "1.2.2",
+            "resolved": "https://registry.npmjs.org/@speed-highlight/core/-/core-1.2.2.tgz",
+            "integrity": "sha512-Yb3ewAUq7QwLbU+vF28dxkOmBJG5bHUVWZWQBnUt2GIhVWdiShKcE6kBMsCRXvD8AuK7gy0rR4qNckqZnCzEFw=="
+        },
         "node_modules/@sveltejs/adapter-node": {
             "version": "1.2.4",
             "resolved": "https://registry.npmjs.org/@sveltejs/adapter-node/-/adapter-node-1.2.4.tgz",
@@ -764,6 +771,14 @@
             "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.5.1.tgz",
             "integrity": "sha512-COUnqfB2+ckwXXSFInsFdOAWQzCCx+a5hq2ruyj+Vjund94RJQd4LG2u9hnvJrTgunKAaax7ancBYlDrNYxA0g=="
         },
+        "node_modules/@types/dompurify": {
+            "version": "3.0.5",
+            "resolved": "https://registry.npmjs.org/@types/dompurify/-/dompurify-3.0.5.tgz",
+            "integrity": "sha512-1Wg0g3BtQF7sSb27fJQAKck1HECM6zV1EB66j8JH9i3LCjYabJa0FSdiSgsD5K/RbrsR0SiraKacLB+T8ZVYAg==",
+            "dependencies": {
+                "@types/trusted-types": "*"
+            }
+        },
         "node_modules/@types/estree": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.1.tgz",
@@ -794,6 +809,11 @@
             "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.0.tgz",
             "integrity": "sha512-G8hZ6XJiHnuhQKR7ZmysCeJWE08o8T0AXtk5darsCaTVsYZhhgUrq53jizaR2FvsoeCwJhlmwTjkXBY5Pn/ZHw=="
         },
+        "node_modules/@types/trusted-types": {
+            "version": "2.0.7",
+            "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
+            "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw=="
+        },
         "node_modules/@typescript-eslint/eslint-plugin": {
             "version": "5.60.0",
             "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.60.0.tgz",
@@ -993,6 +1013,17 @@
                 "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
             }
         },
+        "node_modules/agent-base": {
+            "version": "7.1.0",
+            "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
+            "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
+            "dependencies": {
+                "debug": "^4.3.4"
+            },
+            "engines": {
+                "node": ">= 14"
+            }
+        },
         "node_modules/ajv": {
             "version": "6.12.6",
             "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
@@ -1063,6 +1094,11 @@
                 "node": ">=8"
             }
         },
+        "node_modules/asynckit": {
+            "version": "0.4.0",
+            "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+            "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
+        },
         "node_modules/axobject-query": {
             "version": "3.2.1",
             "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-3.2.1.tgz",
@@ -1220,6 +1256,18 @@
                 "node": ">=6"
             }
         },
+        "node_modules/carta-md": {
+            "version": "3.4.0",
+            "resolved": "https://registry.npmjs.org/carta-md/-/carta-md-3.4.0.tgz",
+            "integrity": "sha512-rZN26kdPRfQvk7fjzeRZP3OC4IWGd5eUB0YsPJBgsaoiKjHo2ERNI1DsJMQS3Rpiy4rCSSsnmXEiq5Y5lt/rtw==",
+            "dependencies": {
+                "@speed-highlight/core": "1.2.2",
+                "marked": "^9.1.5"
+            },
+            "peerDependencies": {
+                "svelte": "^3.54.0 || ^4.0.0"
+            }
+        },
         "node_modules/chalk": {
             "version": "4.1.2",
             "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
@@ -1321,6 +1369,17 @@
             "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
             "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
         },
+        "node_modules/combined-stream": {
+            "version": "1.0.8",
+            "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+            "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+            "dependencies": {
+                "delayed-stream": "~1.0.0"
+            },
+            "engines": {
+                "node": ">= 0.8"
+            }
+        },
         "node_modules/commondir": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
@@ -1375,6 +1434,29 @@
                 "node": ">=4"
             }
         },
+        "node_modules/cssstyle": {
+            "version": "3.0.0",
+            "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-3.0.0.tgz",
+            "integrity": "sha512-N4u2ABATi3Qplzf0hWbVCdjenim8F3ojEXpBDF5hBpjzW182MjNGLqfmQ0SkSPeQ+V86ZXgeH8aXj6kayd4jgg==",
+            "dependencies": {
+                "rrweb-cssom": "^0.6.0"
+            },
+            "engines": {
+                "node": ">=14"
+            }
+        },
+        "node_modules/data-urls": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-5.0.0.tgz",
+            "integrity": "sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==",
+            "dependencies": {
+                "whatwg-mimetype": "^4.0.0",
+                "whatwg-url": "^14.0.0"
+            },
+            "engines": {
+                "node": ">=18"
+            }
+        },
         "node_modules/debug": {
             "version": "4.3.4",
             "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
@@ -1391,6 +1473,11 @@
                 }
             }
         },
+        "node_modules/decimal.js": {
+            "version": "10.4.3",
+            "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.4.3.tgz",
+            "integrity": "sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA=="
+        },
         "node_modules/decompress-response": {
             "version": "6.0.0",
             "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-6.0.0.tgz",
@@ -1426,6 +1513,14 @@
                 "node": ">=0.10.0"
             }
         },
+        "node_modules/delayed-stream": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+            "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+            "engines": {
+                "node": ">=0.4.0"
+            }
+        },
         "node_modules/dequal": {
             "version": "2.0.3",
             "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
@@ -1482,6 +1577,11 @@
                 "node": ">=6.0.0"
             }
         },
+        "node_modules/dompurify": {
+            "version": "3.0.6",
+            "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.0.6.tgz",
+            "integrity": "sha512-ilkD8YEnnGh1zJ240uJsW7AzE+2qpbOUYjacomn3AvJ6J4JhKGSZ2nh4wUIXPZrEPppaCLx5jFe8T89Rk8tQ7w=="
+        },
         "node_modules/dotenv": {
             "version": "16.3.1",
             "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.3.1.tgz",
@@ -1501,6 +1601,17 @@
                 "once": "^1.4.0"
             }
         },
+        "node_modules/entities": {
+            "version": "4.5.0",
+            "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+            "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+            "engines": {
+                "node": ">=0.12"
+            },
+            "funding": {
+                "url": "https://github.com/fb55/entities?sponsor=1"
+            }
+        },
         "node_modules/es6-promise": {
             "version": "3.3.1",
             "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.3.1.tgz",
@@ -1909,6 +2020,19 @@
                 "unicode-trie": "^2.0.0"
             }
         },
+        "node_modules/form-data": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+            "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+            "dependencies": {
+                "asynckit": "^0.4.0",
+                "combined-stream": "^1.0.8",
+                "mime-types": "^2.1.12"
+            },
+            "engines": {
+                "node": ">= 6"
+            }
+        },
         "node_modules/fs-constants": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
@@ -2057,6 +2181,52 @@
                 "node": ">=8"
             }
         },
+        "node_modules/html-encoding-sniffer": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
+            "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
+            "dependencies": {
+                "whatwg-encoding": "^3.1.1"
+            },
+            "engines": {
+                "node": ">=18"
+            }
+        },
+        "node_modules/http-proxy-agent": {
+            "version": "7.0.0",
+            "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.0.tgz",
+            "integrity": "sha512-+ZT+iBxVUQ1asugqnD6oWoRiS25AkjNfG085dKJGtGxkdwLQrMKU5wJr2bOOFAXzKcTuqq+7fZlTMgG3SRfIYQ==",
+            "dependencies": {
+                "agent-base": "^7.1.0",
+                "debug": "^4.3.4"
+            },
+            "engines": {
+                "node": ">= 14"
+            }
+        },
+        "node_modules/https-proxy-agent": {
+            "version": "7.0.2",
+            "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.2.tgz",
+            "integrity": "sha512-NmLNjm6ucYwtcUmL7JQC1ZQ57LmHP4lT15FQ8D61nak1rO6DH+fz5qNK2Ap5UN4ZapYICE3/0KodcLYSPsPbaA==",
+            "dependencies": {
+                "agent-base": "^7.0.2",
+                "debug": "4"
+            },
+            "engines": {
+                "node": ">= 14"
+            }
+        },
+        "node_modules/iconv-lite": {
+            "version": "0.6.3",
+            "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+            "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+            "dependencies": {
+                "safer-buffer": ">= 2.1.2 < 3.0.0"
+            },
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
         "node_modules/ieee754": {
             "version": "1.2.1",
             "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
@@ -2202,6 +2372,11 @@
                 "node": ">=8"
             }
         },
+        "node_modules/is-potential-custom-element-name": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
+            "integrity": "sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ=="
+        },
         "node_modules/is-reference": {
             "version": "1.2.1",
             "resolved": "https://registry.npmjs.org/is-reference/-/is-reference-1.2.1.tgz",
@@ -2215,6 +2390,19 @@
             "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
             "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
         },
+        "node_modules/isomorphic-dompurify": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/isomorphic-dompurify/-/isomorphic-dompurify-2.0.0.tgz",
+            "integrity": "sha512-BJvrSQzg7jleSaySaWyhzGqH9/QxYc3sflm5fvjcXWAQcHQvQPQdCN0ORyqvMqnQDbwFuZXvqh2IcuVa3dG/DA==",
+            "dependencies": {
+                "@types/dompurify": "^3.0.3",
+                "dompurify": "^3.0.6",
+                "jsdom": "^23.0.0"
+            },
+            "engines": {
+                "node": ">=18"
+            }
+        },
         "node_modules/js-yaml": {
             "version": "4.1.0",
             "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
@@ -2226,6 +2414,45 @@
                 "js-yaml": "bin/js-yaml.js"
             }
         },
+        "node_modules/jsdom": {
+            "version": "23.0.1",
+            "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-23.0.1.tgz",
+            "integrity": "sha512-2i27vgvlUsGEBO9+/kJQRbtqtm+191b5zAZrU/UezVmnC2dlDAFLgDYJvAEi94T4kjsRKkezEtLQTgsNEsW2lQ==",
+            "dependencies": {
+                "cssstyle": "^3.0.0",
+                "data-urls": "^5.0.0",
+                "decimal.js": "^10.4.3",
+                "form-data": "^4.0.0",
+                "html-encoding-sniffer": "^4.0.0",
+                "http-proxy-agent": "^7.0.0",
+                "https-proxy-agent": "^7.0.2",
+                "is-potential-custom-element-name": "^1.0.1",
+                "nwsapi": "^2.2.7",
+                "parse5": "^7.1.2",
+                "rrweb-cssom": "^0.6.0",
+                "saxes": "^6.0.0",
+                "symbol-tree": "^3.2.4",
+                "tough-cookie": "^4.1.3",
+                "w3c-xmlserializer": "^5.0.0",
+                "webidl-conversions": "^7.0.0",
+                "whatwg-encoding": "^3.1.1",
+                "whatwg-mimetype": "^4.0.0",
+                "whatwg-url": "^14.0.0",
+                "ws": "^8.14.2",
+                "xml-name-validator": "^5.0.0"
+            },
+            "engines": {
+                "node": ">=18"
+            },
+            "peerDependencies": {
+                "canvas": "^2.11.2"
+            },
+            "peerDependenciesMeta": {
+                "canvas": {
+                    "optional": true
+                }
+            }
+        },
         "node_modules/json-schema-traverse": {
             "version": "0.4.1",
             "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
@@ -2315,6 +2542,17 @@
                 "node": ">=12"
             }
         },
+        "node_modules/marked": {
+            "version": "9.1.6",
+            "resolved": "https://registry.npmjs.org/marked/-/marked-9.1.6.tgz",
+            "integrity": "sha512-jcByLnIFkd5gSXZmjNvS1TlmRhCXZjIzHYlaGkPlLIekG55JDR2Z4va9tZwCiP+/RDERiNhMOFu01xd6O5ct1Q==",
+            "bin": {
+                "marked": "bin/marked.js"
+            },
+            "engines": {
+                "node": ">= 16"
+            }
+        },
         "node_modules/mdn-data": {
             "version": "2.0.30",
             "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz",
@@ -2351,6 +2589,25 @@
                 "node": ">=10.0.0"
             }
         },
+        "node_modules/mime-db": {
+            "version": "1.52.0",
+            "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+            "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
+        "node_modules/mime-types": {
+            "version": "2.1.35",
+            "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+            "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+            "dependencies": {
+                "mime-db": "1.52.0"
+            },
+            "engines": {
+                "node": ">= 0.6"
+            }
+        },
         "node_modules/mimic-response": {
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-3.1.0.tgz",
@@ -2477,6 +2734,11 @@
                 "node": ">=0.10.0"
             }
         },
+        "node_modules/nwsapi": {
+            "version": "2.2.7",
+            "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.7.tgz",
+            "integrity": "sha512-ub5E4+FBPKwAZx0UwIQOjYWGHTEq5sPqHQNRN8Z9e4A7u3Tj1weLJsL59yH9vmvqEtBHaOmT6cYQKIZOxp35FQ=="
+        },
         "node_modules/once": {
             "version": "1.4.0",
             "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
@@ -2545,6 +2807,17 @@
                 "node": ">=6"
             }
         },
+        "node_modules/parse5": {
+            "version": "7.1.2",
+            "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
+            "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
+            "dependencies": {
+                "entities": "^4.4.0"
+            },
+            "funding": {
+                "url": "https://github.com/inikulin/parse5?sponsor=1"
+            }
+        },
         "node_modules/path-exists": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -2783,6 +3056,11 @@
                 "svelte": "^3.2.0 || ^4.0.0-next.0"
             }
         },
+        "node_modules/psl": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz",
+            "integrity": "sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag=="
+        },
         "node_modules/pump": {
             "version": "3.0.0",
             "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
@@ -2793,13 +3071,18 @@
             }
         },
         "node_modules/punycode": {
-            "version": "2.3.0",
-            "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.0.tgz",
-            "integrity": "sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==",
+            "version": "2.3.1",
+            "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
+            "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
             "engines": {
                 "node": ">=6"
             }
         },
+        "node_modules/querystringify": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
+            "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ=="
+        },
         "node_modules/queue-microtask": {
             "version": "1.2.3",
             "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
@@ -2865,6 +3148,11 @@
                 "node": ">=8.10.0"
             }
         },
+        "node_modules/requires-port": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+            "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ=="
+        },
         "node_modules/resolve": {
             "version": "1.22.2",
             "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.2.tgz",
@@ -2951,6 +3239,11 @@
                 "fsevents": "~2.3.2"
             }
         },
+        "node_modules/rrweb-cssom": {
+            "version": "0.6.0",
+            "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.6.0.tgz",
+            "integrity": "sha512-APM0Gt1KoXBz0iIkkdB/kfvGOwC4UuJFeG/c+yV7wSc7q96cG/kJ0HiYCnzivD9SB53cLV1MlHFNfOuPaadYSw=="
+        },
         "node_modules/run-parallel": {
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@@ -3003,6 +3296,11 @@
                 }
             ]
         },
+        "node_modules/safer-buffer": {
+            "version": "2.1.2",
+            "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+            "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
+        },
         "node_modules/sander": {
             "version": "0.5.1",
             "resolved": "https://registry.npmjs.org/sander/-/sander-0.5.1.tgz",
@@ -3044,6 +3342,17 @@
                 "rimraf": "bin.js"
             }
         },
+        "node_modules/saxes": {
+            "version": "6.0.0",
+            "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
+            "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
+            "dependencies": {
+                "xmlchars": "^2.2.0"
+            },
+            "engines": {
+                "node": ">=v12.22.7"
+            }
+        },
         "node_modules/semver": {
             "version": "7.5.2",
             "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.2.tgz",
@@ -3449,6 +3758,11 @@
                 "node": ">=12"
             }
         },
+        "node_modules/symbol-tree": {
+            "version": "3.2.4",
+            "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
+            "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw=="
+        },
         "node_modules/tar-fs": {
             "version": "2.1.1",
             "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.1.tgz",
@@ -3504,6 +3818,31 @@
                 "node": ">=6"
             }
         },
+        "node_modules/tough-cookie": {
+            "version": "4.1.3",
+            "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.3.tgz",
+            "integrity": "sha512-aX/y5pVRkfRnfmuX+OdbSdXvPe6ieKX/G2s7e98f4poJHnqH3281gDPm/metm6E/WRamfx7WC4HUqkWHfQHprw==",
+            "dependencies": {
+                "psl": "^1.1.33",
+                "punycode": "^2.1.1",
+                "universalify": "^0.2.0",
+                "url-parse": "^1.5.3"
+            },
+            "engines": {
+                "node": ">=6"
+            }
+        },
+        "node_modules/tr46": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.0.0.tgz",
+            "integrity": "sha512-tk2G5R2KRwBd+ZN0zaEXpmzdKyOYksXwywulIX95MBODjSzMIuQnQ3m8JxgbhnL1LeVo7lqQKsYa1O3Htl7K5g==",
+            "dependencies": {
+                "punycode": "^2.3.1"
+            },
+            "engines": {
+                "node": ">=18"
+            }
+        },
         "node_modules/tslib": {
             "version": "2.5.3",
             "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.3.tgz",
@@ -3602,6 +3941,14 @@
                 "tiny-inflate": "^1.0.0"
             }
         },
+        "node_modules/universalify": {
+            "version": "0.2.0",
+            "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz",
+            "integrity": "sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==",
+            "engines": {
+                "node": ">= 4.0.0"
+            }
+        },
         "node_modules/uri-js": {
             "version": "4.4.1",
             "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
@@ -3610,6 +3957,15 @@
                 "punycode": "^2.1.0"
             }
         },
+        "node_modules/url-parse": {
+            "version": "1.5.10",
+            "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
+            "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
+            "dependencies": {
+                "querystringify": "^2.1.1",
+                "requires-port": "^1.0.0"
+            }
+        },
         "node_modules/util-deprecate": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -3675,6 +4031,56 @@
                 }
             }
         },
+        "node_modules/w3c-xmlserializer": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
+            "integrity": "sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==",
+            "dependencies": {
+                "xml-name-validator": "^5.0.0"
+            },
+            "engines": {
+                "node": ">=18"
+            }
+        },
+        "node_modules/webidl-conversions": {
+            "version": "7.0.0",
+            "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
+            "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
+            "engines": {
+                "node": ">=12"
+            }
+        },
+        "node_modules/whatwg-encoding": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
+            "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
+            "dependencies": {
+                "iconv-lite": "0.6.3"
+            },
+            "engines": {
+                "node": ">=18"
+            }
+        },
+        "node_modules/whatwg-mimetype": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
+            "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
+            "engines": {
+                "node": ">=18"
+            }
+        },
+        "node_modules/whatwg-url": {
+            "version": "14.0.0",
+            "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.0.0.tgz",
+            "integrity": "sha512-1lfMEm2IEr7RIV+f4lUNPOqfFL+pO+Xw3fJSqmjX9AbXcXcYOkCe1P6+9VBZB6n94af16NfZf+sSk0JCBZC9aw==",
+            "dependencies": {
+                "tr46": "^5.0.0",
+                "webidl-conversions": "^7.0.0"
+            },
+            "engines": {
+                "node": ">=18"
+            }
+        },
         "node_modules/which": {
             "version": "2.0.2",
             "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
@@ -3702,6 +4108,39 @@
             "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
             "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="
         },
+        "node_modules/ws": {
+            "version": "8.16.0",
+            "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz",
+            "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==",
+            "engines": {
+                "node": ">=10.0.0"
+            },
+            "peerDependencies": {
+                "bufferutil": "^4.0.1",
+                "utf-8-validate": ">=5.0.2"
+            },
+            "peerDependenciesMeta": {
+                "bufferutil": {
+                    "optional": true
+                },
+                "utf-8-validate": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/xml-name-validator": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
+            "integrity": "sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==",
+            "engines": {
+                "node": ">=18"
+            }
+        },
+        "node_modules/xmlchars": {
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
+            "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw=="
+        },
         "node_modules/yallist": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
diff --git a/package.json b/package.json
index 6fce103..b7640ae 100644
--- a/package.json
+++ b/package.json
@@ -22,11 +22,13 @@
         "@typescript-eslint/eslint-plugin": "^5.45.0",
         "@typescript-eslint/parser": "^5.45.0",
         "better-sqlite3": "^8.3.0",
+        "carta-md": "^3.4.0",
         "dotenv": "^16.3.1",
         "eslint": "^8.28.0",
         "eslint-config-prettier": "^8.5.0",
         "eslint-plugin-svelte": "^2.31.0",
         "fontkit": "^2.0.2",
+        "isomorphic-dompurify": "^2.0.0",
         "prettier": "^2.8.0",
         "prettier-plugin-svelte": "^2.8.1",
         "svelte": "^4.0.0",
diff --git a/public/assets b/public/assets
new file mode 120000
index 0000000..f224365
--- /dev/null
+++ b/public/assets
@@ -0,0 +1 @@
+../static/assets
\ No newline at end of file
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 3aea8e6..d120206 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,34 +1,49 @@
 <svelte:head>
-    <style>
-        body,
-        html {
-            margin: 0;
-            padding: 0;
-        }
+	<style>
+		body,
+		html {
+			margin: 0;
+			padding: 0;
+			background: url(/assets/tile.png) repeat fixed;
+		}
 
-        @font-face {
-            font-family: 'Material Icons';
-            font-style: normal;
-            font-weight: 400;
-            src: url('/fonts/MaterialIcons-Regular-subset.woff2') format('woff2');
-        }
+		* {
+			box-sizing: border-box;
+		}
 
-        .material-icons {
-            font-family: 'Material Icons';
-            font-weight: normal;
-            font-style: normal;
-            font-size: 24px;
-            line-height: 1;
-            letter-spacing: normal;
-            text-transform: none;
-            display: inline-block;
-            white-space: nowrap;
-            word-wrap: normal;
-            direction: ltr;
-            -moz-font-feature-settings: 'liga';
-            -moz-osx-font-smoothing: grayscale;
-        }
-    </style>
+		@font-face {
+			font-family: 'Material Icons';
+			font-style: normal;
+			font-weight: 400;
+			src: url('/fonts/MaterialIcons-Regular-subset.woff2') format('woff2');
+		}
+
+		.material-icons {
+			font-family: 'Material Icons';
+			font-weight: normal;
+			font-style: normal;
+			font-size: 24px;
+			line-height: 1;
+			letter-spacing: normal;
+			text-transform: none;
+			display: inline-block;
+			white-space: nowrap;
+			word-wrap: normal;
+			direction: ltr;
+			-moz-font-feature-settings: 'liga';
+			-moz-osx-font-smoothing: grayscale;
+		}
+
+		.panel {
+			text-align: center;
+			background-color: rgba(0, 0, 0, 0.8);
+			overflow: auto;
+			border: 4px double;
+			border-radius: 10px;
+			justify-self: center;
+			color: white;
+		}
+	</style>
 </svelte:head>
 
 <slot />
diff --git a/src/routes/streams/+layout.svelte b/src/routes/streams/+layout.svelte
index a0ca181..8d2fa52 100644
--- a/src/routes/streams/+layout.svelte
+++ b/src/routes/streams/+layout.svelte
@@ -1,27 +1,31 @@
 <script>
-    import Sidebar from './Sidebar.svelte';
-    export let data;
+	import Sidebar from './Sidebar.svelte';
+	export let data;
 </script>
 
 <div id="mainContainer">
-    <div id="sidebar"><Sidebar streams={data.streams} /></div>
-    <div id="content"><slot /></div>
+	<div id="sidebar" class="panel"><Sidebar streams={data.streams} /></div>
+	<div id="content"><slot /></div>
 </div>
 
 <style>
-    #mainContainer {
-        display: grid;
-        grid-template-columns: 25% 75%;
-        height: 100vh;
-    }
-    #sidebar {
-        grid-column: 1;
-        height: 100%;
-        overflow: auto;
-        overflow-wrap: break-word;
-    }
+	#mainContainer {
+		display: grid;
+		grid-template-columns: 25% 75%;
+		height: 100vh;
+	}
+	#sidebar {
+		grid-column: 1;
+		height: calc(100vh - 1em);
+		overflow: auto;
+		overflow-wrap: break-word;
+		margin: 0.5em;
+		scrollbar-gutter: stable;
+	}
 
-    #content {
-        grid-column: 2;
-    }
+	#content {
+		grid-column: 2;
+		margin: 0.5em;
+		margin-left: 0em;
+	}
 </style>
diff --git a/src/routes/streams/Sidebar.svelte b/src/routes/streams/Sidebar.svelte
index 77a4fc3..9c08763 100644
--- a/src/routes/streams/Sidebar.svelte
+++ b/src/routes/streams/Sidebar.svelte
@@ -1,107 +1,114 @@
 <script>
-    import { goto } from '$app/navigation';
-    import TagSelect from './TagSelect.svelte';
+	import { goto } from '$app/navigation';
+	import TagSelect from './TagSelect.svelte';
 
-    export let streams;
-    let filteredTags = [];
-    let listOpen;
+	export let streams;
+	let filteredTags = [];
+	let listOpen;
 
-    $: displayedStreams = streamsToDisplay(filteredTags);
-    $: remainingTags = getRemainingTags(displayedStreams);
+	$: displayedStreams = streamsToDisplay(filteredTags);
+	$: remainingTags = getRemainingTags(displayedStreams);
 
-    function formatSecondsToHms(s) {
-        s = Number(s);
-        var h = Math.floor(s / 3600);
-        var m = Math.ceil((s % 3600) / 60);
+	function formatSecondsToHms(s) {
+		s = Number(s);
+		var h = Math.floor(s / 3600);
+		var m = Math.ceil((s % 3600) / 60);
 
-        var hDisplay = h > 0 ? h + (h == 1 ? ' hr' : ' hrs') + (m > 0 ? ', ' : '') : '';
-        var mDisplay = m > 0 ? m + (m == 1 ? ' min' : ' mins') : '';
-        return hDisplay + mDisplay;
-    }
+		var hDisplay = h > 0 ? h + (h == 1 ? ' hr' : ' hrs') + (m > 0 ? ', ' : '') : '';
+		var mDisplay = m > 0 ? m + (m == 1 ? ' min' : ' mins') : '';
+		return hDisplay + mDisplay;
+	}
 
-    function formatDate(unix_timestamp) {
-        const date = new Date(unix_timestamp);
-        const formattedDate = date.toISOString().split('T')[0];
-        return formattedDate;
-    }
+	function formatDate(unix_timestamp) {
+		const date = new Date(unix_timestamp);
+		const formattedDate = date.toISOString().split('T')[0];
+		return formattedDate;
+	}
 
-    function streamsToDisplay(filteredTags) {
-        const displayedStreams = streams.filter(
-            (stream) =>
-                !('tags' in stream) || filteredTags.every((tag) => stream['tags'].includes(tag))
-        );
+	function streamsToDisplay(filteredTags) {
+		const displayedStreams = streams.filter(
+			(stream) =>
+				!('tags' in stream) || filteredTags.every((tag) => stream['tags'].includes(tag))
+		);
 
-        // close tagselect dropdown if we can't select anything else
-        if (displayedStreams.length == 1) {
-            listOpen = !listOpen;
-        }
+		// close tagselect dropdown if we can't select anything else
+		if (displayedStreams.length == 1) {
+			listOpen = !listOpen;
+		}
 
-        return displayedStreams;
-    }
+		return displayedStreams;
+	}
 
-    function getRemainingTags(displayedStreams) {
-        let tagCounts = displayedStreams.reduce((tags, stream) => {
-            stream['tags'].forEach((tag) => (tag in tags ? (tags[tag] += 1) : (tags[tag] = 1)));
-            return tags;
-        }, {});
-        return Object.entries(tagCounts)
-            .filter((el) => el[1] != displayedStreams.length)
-            .map((el) => el[0]);
-    }
+	function getRemainingTags(displayedStreams) {
+		let tagCounts = displayedStreams.reduce((tags, stream) => {
+			stream['tags'].forEach((tag) => (tag in tags ? (tags[tag] += 1) : (tags[tag] = 1)));
+			return tags;
+		}, {});
+		return Object.entries(tagCounts)
+			.filter((el) => el[1] != displayedStreams.length)
+			.map((el) => el[0]);
+	}
 
-    function getDisplayedTagsInList(streamTags, remainingTags) {
-        return streamTags.filter((tag) => remainingTags.includes(tag));
-    }
+	function getDisplayedTagsInList(streamTags, remainingTags) {
+		return streamTags.filter((tag) => remainingTags.includes(tag));
+	}
 </script>
 
 <h1>streams</h1>
 
-<TagSelect bind:listOpen bind:checked={filteredTags} {remainingTags} />
+<div id="tagSelect">
+	<TagSelect bind:listOpen bind:checked={filteredTags} {remainingTags} />
+</div>
 
 <div>
-    <ul class="stream-list">
-        {#each streams as stream}
-            <li
-                hidden={!displayedStreams.includes(stream)}
-                class="stream-item"
-                id="stream-{stream['id']}"
-            >
-                <button
-                    class="stream-item-button"
-                    on:click={() => goto('/streams/' + stream['id'])}
-                >
-                    <span class="stream-item-title">{stream['title']}</span>
-                    <span class="stream-item-date">{formatDate(stream['stream_date'])}</span>
-                    <span class="stream-item-length"
-                        >{formatSecondsToHms(stream['length_seconds'])}</span
-                    >
-                    <span class="stream-item-data">title: {stream['title']}</span>
-                    <span class="stream-item-data"
-                        >{getDisplayedTagsInList(stream['tags'], remainingTags)}</span
-                    >
-                </button>
-            </li>
-        {/each}
-    </ul>
+	<ul class="stream-list">
+		{#each streams as stream}
+			<li
+				hidden={!displayedStreams.includes(stream)}
+				class="stream-item"
+				id="stream-{stream['id']}"
+			>
+				<button
+					class="stream-item-button"
+					on:click={() => goto('/streams/' + stream['id'])}
+				>
+					<span class="stream-item-title">{stream['title']}</span>
+					<span class="stream-item-date">{formatDate(stream['stream_date'])}</span>
+					<span class="stream-item-length"
+						>{formatSecondsToHms(stream['length_seconds'])}</span
+					>
+					<span class="stream-item-data">title: {stream['title']}</span>
+					<span class="stream-item-data"
+						>{getDisplayedTagsInList(stream['tags'], remainingTags)}</span
+					>
+				</button>
+			</li>
+		{/each}
+	</ul>
 </div>
 
 <style>
-    .stream-list {
-        list-style-type: none;
-        padding: 0;
-        margin: 0;
-        border: 1px solid black;
-    }
+	.stream-list {
+		list-style-type: none;
+		padding: 0;
+		margin: 0;
+		border: 1px solid black;
+	}
 
-    .stream-item {
-        width: 100%;
-        overflow-wrap: anywhere;
-        border-bottom: 1px solid black;
-    }
+	.stream-item {
+		width: 100%;
+		overflow-wrap: anywhere;
+		border-bottom: 1px solid black;
+	}
 
-    .stream-item-button {
-        border-radius: 0;
-        min-width: 100%;
-        border: none;
-    }
+	.stream-item-button {
+		border-radius: 0;
+		min-width: 100%;
+		border: none;
+	}
+
+	#tagSelect {
+		text-align: left;
+		color: black;
+	}
 </style>
diff --git a/src/routes/streams/[stream_id]/+page.svelte b/src/routes/streams/[stream_id]/+page.svelte
index 239bb45..ad1d099 100644
--- a/src/routes/streams/[stream_id]/+page.svelte
+++ b/src/routes/streams/[stream_id]/+page.svelte
@@ -1,40 +1,41 @@
 <script>
-    import StreamPage from './StreamPage.svelte';
-    import MetadataEditor from './MetadataEditor.svelte';
-    import Player from './Player.svelte';
-    import { page } from '$app/stores';
-    import { dev } from '$app/environment';
-    import { currentStream, updateCurrentStream } from '$lib/stores.js';
+	import StreamPage from './StreamPage.svelte';
+	import MetadataEditor from './MetadataEditor.svelte';
+	import Player from './Player.svelte';
+	import { page } from '$app/stores';
+	import { dev } from '$app/environment';
+	import { currentStream, updateCurrentStream } from '$lib/stores.js';
 
-    export let data;
-    $: updateCurrentStream(data.stream);
+	export let data;
+	$: updateCurrentStream(data.stream);
 </script>
 
 <div id="streamContainer">
-    <div id="streamPage">
-        {#if dev}
-            <MetadataEditor {...data} />
-        {/if}
-        <StreamPage />
-    </div>
-    <div id="player">
-        <Player display={true} src="/media/tracks/{$currentStream.filename}" />
-    </div>
+	<div id="streamPage" class="panel">
+		{#if dev}
+			<MetadataEditor {...data} />
+		{/if}
+		<StreamPage />
+	</div>
+	<div id="player">
+		<Player display={true} src="/media/tracks/{$currentStream.filename}" />
+	</div>
 </div>
 
 <style>
-    #streamContainer {
-        display: grid;
-        grid-template-rows: 85% 15%;
-        height: 100vh;
-    }
+	#streamContainer {
+		display: grid;
+		grid-template-rows: 85% 15%;
+		height: calc(100vh - 1em);
+	}
 
-    #streamPage {
-        grid-row: 1 / 2;
-        overflow: auto;
-    }
+	#streamPage {
+		grid-row: 1 / 2;
+		overflow: auto;
+		width: 100%;
+	}
 
-    #player {
-        grid-row: 2 / 3;
-    }
+	#player {
+		grid-row: 2 / 3;
+	}
 </style>
diff --git a/src/routes/streams/[stream_id]/MetadataEditor.svelte b/src/routes/streams/[stream_id]/MetadataEditor.svelte
index 16d6a0e..61406ab 100644
--- a/src/routes/streams/[stream_id]/MetadataEditor.svelte
+++ b/src/routes/streams/[stream_id]/MetadataEditor.svelte
@@ -1,73 +1,74 @@
 <script>
-    import { page } from '$app/stores';
-    import { tagList } from '$lib/stores.js';
+	import { page } from '$app/stores';
+	import { tagList } from '$lib/stores.js';
 
-    export let original;
-    let tagMap = new Map();
+	export let original;
+	let tagMap = new Map();
 
-    // Create a mapping of tags and their checked status
-    let reloadTags = (original) => {
-        tagList.forEach((tag) => {
-            tagMap.set(tag, original.tags.includes(tag));
-        });
-    };
+	// Create a mapping of tags and their checked status
+	let reloadTags = (original) => {
+		tagList.forEach((tag) => {
+			tagMap.set(tag, original.tags.includes(tag));
+		});
+	};
 
-    $: reloadTags(original);
+	$: reloadTags(original);
 </script>
 
 {#key $page.url.pathname}
-    <form method="POST">
-        <br />
-        <label>
-            <p>Title:</p>
-            <input type="text" name="title" bind:value={original.title} />
-        </label>
-        <br />
+	<form method="POST">
+		<br />
+		<label>
+			<p>Title:</p>
+			<input type="text" name="title" bind:value={original.title} />
+		</label>
+		<br />
 
-        <label>
-            <p>Description:</p>
-            <textarea
-                style="min-width:400px;min-height:100px"
-                name="description"
-                bind:value={original.description}
-            />
-        </label>
-        <br />
-        <label>
-            <p>Tags:</p>
-            <div class="checkboxContainer">
-                {#each tagList as tag}
-                    <label>
-                        <input type="checkbox" name="tags" value={tag} checked={tagMap.get(tag)} />
-                        {tag}
-                    </label>
-                {/each}
-            </div>
-        </label>
-        <br />
+		<label>
+			<p>Description:</p>
+			<textarea
+				style="min-width:400px;min-height:100px"
+				name="description"
+				bind:value={original.description}
+			/>
+		</label>
+		<br />
+		<label>
+			<p>Tags:</p>
+			<div class="checkboxContainer">
+				{#each tagList as tag}
+					<label>
+						<input type="checkbox" name="tags" value={tag} checked={tagMap.get(tag)} />
+						{tag}
+					</label>
+				{/each}
+			</div>
+		</label>
+		<br />
 
-        <button type="submit">Submit</button>
-    </form>
+		<button type="submit">Submit</button>
+	</form>
 {/key}
 
 <style>
-    form {
-        margin-left: 10px;
-    }
+	form {
+		margin-left: 10px;
+		text-align: left;
+	}
 
-    label {
-        display: flex;
-        align-items: center;
-    }
+	label {
+		display: flex;
+		align-items: center;
+	}
 
-    label > p {
-        margin-right: 5px;
-    }
+	label > p {
+		margin-right: 5px;
+	}
 
-    .checkboxContainer {
-        display: grid;
-        grid-template-columns: repeat(5, 1fr);
-        gap: 1px;
-        max-width: 50%;
-    }
+	.checkboxContainer {
+		display: grid;
+		grid-template-columns: repeat(5, 1fr);
+		gap: 1px;
+		max-width: 50%;
+	}
 </style>
diff --git a/src/routes/streams/[stream_id]/StreamPage.svelte b/src/routes/streams/[stream_id]/StreamPage.svelte
index 6d4401e..f381175 100644
--- a/src/routes/streams/[stream_id]/StreamPage.svelte
+++ b/src/routes/streams/[stream_id]/StreamPage.svelte
@@ -1,56 +1,74 @@
 <script>
-    import { currentStream, currentSongIndex } from '$lib/stores.js';
-    import {} from 'svelte';
-    import { jumpToTrack } from './Player.svelte';
+	import { currentStream, currentSongIndex } from '$lib/stores.js';
+	import { jumpToTrack } from './Player.svelte';
+	import { Carta } from 'carta-md';
+	import { sanitize } from 'isomorphic-dompurify';
 
-    function prettyPrintTime(s) {
-        return new Date(s * 1000).toISOString().slice(11, 19);
-    }
+	const carta = new Carta({
+		sanitizer: sanitize
+	});
+
+	function prettyPrintTime(s) {
+		return new Date(s * 1000).toISOString().slice(11, 19);
+	}
 </script>
 
 <div class="description-bubble">
-    {$currentStream.description === '' ? 'No description available.' : $currentStream.description}
+	{@html carta.renderSSR($currentStream.description || 'No description available.')}
 </div>
 
 <div>
-    <table>
-        <tr><th>Timestamp</th><th>Artist</th><th>Title</th></tr>
-        {#each $currentStream.tracks as track, i}
-            <tr on:click={() => jumpToTrack(track[0])} class:current={i == $currentSongIndex}>
-                <td>{prettyPrintTime(track[0])}</td>
-                <td>{track[1]}</td>
-                <td>{track[2]}</td>
-            </tr>
-        {/each}
-    </table>
+	<table>
+		<tr><th>Timestamp</th><th>Artist</th><th>Title</th></tr>
+		{#each $currentStream.tracks as track, i}
+			<tr on:click={() => jumpToTrack(track[0])} class:current={i == $currentSongIndex}>
+				<td>{prettyPrintTime(track[0])}</td>
+				<td>{track[1]}</td>
+				<td>{track[2]}</td>
+			</tr>
+		{/each}
+	</table>
 </div>
 
 <style>
-    .current {
-        background-color: gray;
-    }
-    .description-bubble {
-        position: relative;
-        background-color: #fff;
-        border: 1px solid #ccc;
-        padding: 10px;
-        margin: 10px;
-        border-radius: 5px;
-        max-width: 80%;
-        width: fit-content;
-        white-space: pre-line;
-        min-width: 50%;
-    }
+	td {
+		height: 1.3em;
+	}
+	.current {
+		background-color: gray;
+	}
+	.description-bubble {
+		position: relative;
+		background-color: #fff;
+		border: 1px solid #ccc;
+		color: black;
+		padding: 10px;
+		margin: 10px;
+		border-radius: 5px;
+		max-width: 80%;
+		width: fit-content;
+		min-width: 50%;
+		font-family: Verdana;
+		font-size: small;
+	}
 
-    .description-bubble::after {
-        content: '';
-        position: absolute;
-        border-style: solid;
-        border-width: 10px 0 10px 10px;
-        border-color: transparent transparent transparent #ccc;
-        top: 0;
-        right: -10px;
-        width: 0;
-        height: 0;
-    }
+	.description-bubble :global(:first-child) {
+		margin-top: 0px !important;
+	}
+
+	.description-bubble :global(:last-child) {
+		margin-bottom: 0px !important;
+	}
+
+	.description-bubble::after {
+		content: '';
+		position: absolute;
+		border-style: solid;
+		border-width: 10px 0 10px 10px;
+		border-color: transparent transparent transparent #ccc;
+		top: 0;
+		right: -10px;
+		width: 0;
+		height: 0;
+	}
 </style>
diff --git a/static/assets/tile.png b/static/assets/tile.png
new file mode 100644
index 0000000..ceacc69
Binary files /dev/null and b/static/assets/tile.png differ