diff --git a/components/mdeditor/index.tsx b/components/mdeditor/index.tsx
index 196708c..4e97f96 100644
--- a/components/mdeditor/index.tsx
+++ b/components/mdeditor/index.tsx
@@ -4,7 +4,7 @@ import { TextEditor } from "./TextEditor";
 import { TTCMD } from "../ttcmd";
 
 export const MDEditor: React.FC = () => {
-  const [text, setText] = useState("");
+  const [text, setText] = useState("??<<2d6,$0.distribution>>");
   const body = useDeferredValue(text);
   return (
     <div className="flex gap-8">
diff --git a/lib/dice.ts b/lib/dice.ts
index fa2ad2e..6603019 100644
--- a/lib/dice.ts
+++ b/lib/dice.ts
@@ -1,3 +1,5 @@
+import { sum } from "./utils/sum";
+
 export class Dice {
   private count!: number;
   private sides!: number;
@@ -13,11 +15,23 @@ export class Dice {
   }
 
   public roll() {
-    let total = 0;
+    let results = [];
     for (let i = 0; i < this.count; i++) {
-      total += this.rollSingle();
+      results.push(this.rollSingle());
     }
-    return total;
+    return {
+      total: sum(...results),
+      max: Math.max(...results),
+      min: Math.min(...results),
+      results,
+    };
+  }
+
+  public rollMax() {
+    return this.roll().max;
+  }
+  public rollMin() {
+    return this.roll().min;
   }
 
   private rollSingle() {
@@ -25,13 +39,13 @@ export class Dice {
   }
 
   public rollAvg() {
-    return this.roll() / this.count;
+    return this.roll().total / this.count;
   }
 
   public rollTimes(times: number) {
     let total = 0;
     for (let i = 0; i < times; i++) {
-      total += this.roll();
+      total += this.roll().total;
     }
     return total;
   }
diff --git a/lib/tcmd/Resolver.tsx b/lib/tcmd/Resolver.tsx
index 013aae4..bcbc3fa 100644
--- a/lib/tcmd/Resolver.tsx
+++ b/lib/tcmd/Resolver.tsx
@@ -1,12 +1,12 @@
 import { PublicationAtom } from "@/recoil/atoms/publication";
-import { useState, useEffect, useCallback, useRef } from "react";
+import { useState, useEffect, useCallback, useRef, ReactNode } from "react";
 import { useRecoilValue } from "recoil";
 import { TTCQueryResolver } from "../ttcQuery/TTCResolvers";
 
 export function Resolver({ resolver }: { resolver: string }) {
   const parser = useRecoilValue(PublicationAtom);
   const [res] = useState(new TTCQueryResolver(parser));
-  const [content, setContent] = useState("");
+  const [content, setContent] = useState<ReactNode>("");
   useEffect(() => {
     setContent(res.resolve(resolver));
   }, [resolver, res]);
@@ -24,7 +24,7 @@ export function OnDemandResolver({
 }) {
   const parser = useRecoilValue(PublicationAtom);
   const res = useRef(new TTCQueryResolver(parser));
-  const [content, setContent] = useState("");
+  const [content, setContent] = useState<ReactNode>("");
   const generateContent = useCallback(() => {
     let content = template;
     const stackIdxs = Array.from(new Set(template.match(/\$\d/g)));
diff --git a/lib/tcmd/TokenIdentifiers.tsx b/lib/tcmd/TokenIdentifiers.tsx
index 62fc0c4..2d7b3e2 100644
--- a/lib/tcmd/TokenIdentifiers.tsx
+++ b/lib/tcmd/TokenIdentifiers.tsx
@@ -549,7 +549,7 @@ export const buildOnlyDefaultElements = () => {
   // paragraph
   registerIdentifier(
     "p",
-    /(?<=\n\n|^)([\s\S]*?)(?=\n\n)/g,
+    /(?<=\n\n)([\s\S]*?)(?=\n\n)/g,
     (s) => {
       return {
         content: s.replace("\n", " "),
diff --git a/lib/ttcQuery/DiceChart.tsx b/lib/ttcQuery/DiceChart.tsx
new file mode 100644
index 0000000..6ea04c7
--- /dev/null
+++ b/lib/ttcQuery/DiceChart.tsx
@@ -0,0 +1,48 @@
+import { FC } from "react";
+
+export const DiceChart: FC<{ dice: Record<string, number> }> = ({ dice }) => {
+  const data = Object.entries(dice).sort((a, b) => Number(a[0]) - Number(b[0]));
+
+  const max = Math.max(...data.map((d) => d[1]));
+  const _min = Math.min(...data.map((d) => d[1]));
+
+  const uniqueValues = Array.from(new Set(data.map((d) => d[1])));
+
+  return (
+    <div className="p-8 bg-black/30 rounded-md max-w-[35rem]">
+      <div className="relative flex px-2 gap-1 justify-around items-end h-48 border-b border-l">
+        <div className="absolute inset-0 flex flex-col-reverse">
+          {uniqueValues.map((_, i) => (
+            <div
+              key={"dicechartline" + i}
+              className="relative w-full border-t border-mixed-300/50 flex-grow"
+            >
+              {/* <div className="absolute right-full text-xs flex items-center -translate-y-1/2">
+                <span>
+                  {Math.round(max / uniqueValues.length) * (i + 1)} {}
+                </span>
+                <div className="border-b w-1 ml-1"></div>
+              </div> */}
+            </div>
+          ))}
+        </div>
+        {data.map((d) => (
+          <div
+            key={"dice" + d[0]}
+            title={d[0] + ": " + d[1]}
+            className="flex-grow px-[1px] border hover:border-mixed-300/50 border-transparent h-full flex transition-colors rounded-md @container"
+          >
+            <div
+              className="bg-purple-800 relative rounded-t-sm w-full mt-auto"
+              style={{ height: (d[1] / max) * 100 + "%" }}
+            >
+              <span className="absolute top-full left-1/2 -translate-x-1/2 text-xs @[.75rem]:inline hidden">
+                {d[0]}
+              </span>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};
diff --git a/lib/ttcQuery/TTCResolvers.ts b/lib/ttcQuery/TTCResolvers.ts
index 1b89a9e..2751b08 100644
--- a/lib/ttcQuery/TTCResolvers.ts
+++ b/lib/ttcQuery/TTCResolvers.ts
@@ -1,4 +1,7 @@
+/* eslint-disable react/display-name */
 import { Dice } from "../dice";
+import { sum } from "../utils/sum";
+import { DiceChart } from "./DiceChart";
 import { TTCQueryParser } from "./TTCQueryParser";
 
 export class TTCQueryResolver {
@@ -68,13 +71,25 @@ export class TTCQueryResolver {
     if (n && n.startsWith("$")) num = this.getFromStack(n);
     switch (method) {
       case "roll":
-        return () => d.roll();
+        return () => d.roll().total;
       case "rollAvg":
         return () => d.rollAvg();
       case "rollTimes":
         return () => d.rollTimes(num);
       case "rollTimesAvg":
         return () => d.rollTimesAvg(num);
+      case "rollLowest":
+        return () => d.rollMin();
+      case "rollHighest":
+        return () => d.rollMax();
+      case "rollDropHighest":
+        return () => sum(...d.roll().results.toSorted().toSpliced(-1, 1));
+      case "rollDropLowest":
+        return () => sum(...d.roll().results.toSorted().toSpliced(0, 1));
+      case "distribution":
+        return () => DiceChart({ dice: d.getRollDistribution() });
+      case "distribution.normalized":
+        return () => DiceChart({ dice: d.getNormalizedRollDistribution() });
       default:
         return "No valid method provided for dice";
     }
diff --git a/lib/utils/sum.ts b/lib/utils/sum.ts
new file mode 100644
index 0000000..8f5bb09
--- /dev/null
+++ b/lib/utils/sum.ts
@@ -0,0 +1,3 @@
+export const sum = (...args: number[]) => {
+  return args.reduce((a, b) => a + b, 0);
+};
diff --git a/package-lock.json b/package-lock.json
index dfe0bfe..956c0d6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
         "@codemirror/lang-markdown": "^6.2.5",
         "@heroicons/react": "^2.1.1",
         "@prisma/client": "^5.18.0",
+        "@tailwindcss/container-queries": "^0.1.1",
         "@types/bcryptjs": "^2.4.6",
         "@uiw/codemirror-theme-duotone": "^4.23.0",
         "@uiw/react-codemirror": "^4.23.0",
@@ -51,7 +52,6 @@
     },
     "node_modules/@alloc/quick-lru": {
       "version": "5.2.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=10"
@@ -1984,9 +1984,10 @@
       "dev": true
     },
     "node_modules/@babel/runtime": {
-      "version": "7.24.0",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.0.tgz",
-      "integrity": "sha512-Chk32uHMg6TnQdvw2e9IlqPpFX/6NLuK0Ys2PqLb7/gL5uFn9mXvK715FGLlOLQrcO4qIkNHkvPGktzzXexsFw==",
+      "version": "7.25.0",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.0.tgz",
+      "integrity": "sha512-7dRy4DwXwtzBrPbZflqxnvfxLF8kdZXPkhymtDeFoFqE6ldzjQFgYTtYIFARcLEYDrqfBfYcZt1WqFxRoyC9Rw==",
+      "license": "MIT",
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
       },
@@ -2298,7 +2299,6 @@
     },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "string-width": "^5.1.2",
@@ -2315,7 +2315,6 @@
     "node_modules/@isaacs/cliui/node_modules/string-width-cjs": {
       "name": "string-width",
       "version": "4.2.3",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "emoji-regex": "^8.0.0",
@@ -2328,12 +2327,10 @@
     },
     "node_modules/@isaacs/cliui/node_modules/string-width-cjs/node_modules/emoji-regex": {
       "version": "8.0.0",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/@isaacs/cliui/node_modules/string-width-cjs/node_modules/strip-ansi": {
       "version": "6.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^5.0.1"
@@ -2344,7 +2341,6 @@
     },
     "node_modules/@isaacs/cliui/node_modules/strip-ansi": {
       "version": "7.1.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^6.0.1"
@@ -2359,7 +2355,6 @@
     "node_modules/@isaacs/cliui/node_modules/strip-ansi-cjs": {
       "name": "strip-ansi",
       "version": "6.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^5.0.1"
@@ -2370,7 +2365,6 @@
     },
     "node_modules/@isaacs/cliui/node_modules/strip-ansi/node_modules/ansi-regex": {
       "version": "6.0.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=12"
@@ -2382,7 +2376,6 @@
     "node_modules/@isaacs/cliui/node_modules/wrap-ansi-cjs": {
       "name": "wrap-ansi",
       "version": "7.0.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-styles": "^4.0.0",
@@ -2398,7 +2391,6 @@
     },
     "node_modules/@isaacs/cliui/node_modules/wrap-ansi-cjs/node_modules/string-width": {
       "version": "4.2.3",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "emoji-regex": "^8.0.0",
@@ -2411,12 +2403,10 @@
     },
     "node_modules/@isaacs/cliui/node_modules/wrap-ansi-cjs/node_modules/string-width/node_modules/emoji-regex": {
       "version": "8.0.0",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/@isaacs/cliui/node_modules/wrap-ansi-cjs/node_modules/strip-ansi": {
       "version": "6.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^5.0.1"
@@ -2706,7 +2696,6 @@
     },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@nodelib/fs.stat": "2.0.5",
@@ -2718,7 +2707,6 @@
     },
     "node_modules/@nodelib/fs.stat": {
       "version": "2.0.5",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 8"
@@ -2726,7 +2714,6 @@
     },
     "node_modules/@nodelib/fs.walk": {
       "version": "1.2.8",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@nodelib/fs.scandir": "2.1.5",
@@ -2747,7 +2734,6 @@
     },
     "node_modules/@pkgjs/parseargs": {
       "version": "0.11.0",
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "engines": {
@@ -3100,6 +3086,15 @@
         "tslib": "^2.4.0"
       }
     },
+    "node_modules/@tailwindcss/container-queries": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/container-queries/-/container-queries-0.1.1.tgz",
+      "integrity": "sha512-p18dswChx6WnTSaJCSGx6lTmrGzNNvm2FtXmiO6AuA1V4U5REyoqwmT6kgAsIMdjo07QdAfYXHJ4hnMtfHzWgA==",
+      "license": "MIT",
+      "peerDependencies": {
+        "tailwindcss": ">=3.2.0"
+      }
+    },
     "node_modules/@trysound/sax": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz",
@@ -3174,7 +3169,9 @@
       }
     },
     "node_modules/@types/prop-types": {
-      "version": "15.7.11",
+      "version": "15.7.12",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.12.tgz",
+      "integrity": "sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==",
       "devOptional": true,
       "license": "MIT"
     },
@@ -4147,7 +4144,6 @@
     },
     "node_modules/ansi-regex": {
       "version": "5.0.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -4155,7 +4151,6 @@
     },
     "node_modules/ansi-styles": {
       "version": "4.3.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "color-convert": "^2.0.1"
@@ -4169,12 +4164,10 @@
     },
     "node_modules/any-promise": {
       "version": "1.3.0",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/anymatch": {
       "version": "3.1.3",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "normalize-path": "^3.0.0",
@@ -4186,7 +4179,6 @@
     },
     "node_modules/arg": {
       "version": "5.0.2",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/argparse": {
@@ -4470,7 +4462,6 @@
     },
     "node_modules/balanced-match": {
       "version": "1.0.2",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/bcryptjs": {
@@ -4490,7 +4481,6 @@
     },
     "node_modules/binary-extensions": {
       "version": "2.2.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -4515,7 +4505,6 @@
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
       "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "fill-range": "^7.1.1"
@@ -4610,7 +4599,6 @@
     },
     "node_modules/camelcase-css": {
       "version": "2.0.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 6"
@@ -4651,7 +4639,6 @@
     },
     "node_modules/chokidar": {
       "version": "3.6.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "anymatch": "~3.1.2",
@@ -4674,7 +4661,6 @@
     },
     "node_modules/chokidar/node_modules/glob-parent": {
       "version": "5.1.2",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "is-glob": "^4.0.1"
@@ -4699,7 +4685,6 @@
     },
     "node_modules/color-convert": {
       "version": "2.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "color-name": "~1.1.4"
@@ -4710,7 +4695,6 @@
     },
     "node_modules/color-name": {
       "version": "1.1.4",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/combined-stream": {
@@ -4725,7 +4709,6 @@
     },
     "node_modules/commander": {
       "version": "4.1.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 6"
@@ -4798,7 +4781,6 @@
     },
     "node_modules/cross-spawn": {
       "version": "7.0.3",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "path-key": "^3.1.0",
@@ -4852,7 +4834,6 @@
     },
     "node_modules/cssesc": {
       "version": "3.0.0",
-      "dev": true,
       "license": "MIT",
       "bin": {
         "cssesc": "bin/cssesc"
@@ -5007,7 +4988,6 @@
     },
     "node_modules/didyoumean": {
       "version": "1.2.2",
-      "dev": true,
       "license": "Apache-2.0"
     },
     "node_modules/dir-glob": {
@@ -5023,7 +5003,6 @@
     },
     "node_modules/dlv": {
       "version": "1.1.3",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/doctrine": {
@@ -5108,7 +5087,6 @@
     },
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/electron-to-chromium": {
@@ -5117,7 +5095,6 @@
     },
     "node_modules/emoji-regex": {
       "version": "9.2.2",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/emojis-list": {
@@ -5726,7 +5703,6 @@
     },
     "node_modules/fast-glob": {
       "version": "3.3.2",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@nodelib/fs.stat": "^2.0.2",
@@ -5741,7 +5717,6 @@
     },
     "node_modules/fast-glob/node_modules/glob-parent": {
       "version": "5.1.2",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "is-glob": "^4.0.1"
@@ -5761,7 +5736,6 @@
     },
     "node_modules/fastq": {
       "version": "1.17.1",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "reusify": "^1.0.4"
@@ -5782,7 +5756,6 @@
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
       "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "to-regex-range": "^5.0.1"
@@ -5834,7 +5807,6 @@
     },
     "node_modules/foreground-child": {
       "version": "3.1.1",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "cross-spawn": "^7.0.0",
@@ -5880,7 +5852,6 @@
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
@@ -5893,7 +5864,6 @@
     },
     "node_modules/function-bind": {
       "version": "1.1.2",
-      "dev": true,
       "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -5980,7 +5950,6 @@
     },
     "node_modules/glob": {
       "version": "10.3.10",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "foreground-child": "^3.1.0",
@@ -6001,7 +5970,6 @@
     },
     "node_modules/glob-parent": {
       "version": "6.0.2",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "is-glob": "^4.0.3"
@@ -6019,7 +5987,6 @@
     },
     "node_modules/glob/node_modules/minimatch": {
       "version": "9.0.3",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "brace-expansion": "^2.0.1"
@@ -6033,7 +6000,6 @@
     },
     "node_modules/glob/node_modules/minimatch/node_modules/brace-expansion": {
       "version": "2.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "balanced-match": "^1.0.0"
@@ -6175,7 +6141,6 @@
     },
     "node_modules/hasown": {
       "version": "2.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "function-bind": "^1.1.2"
@@ -6332,7 +6297,6 @@
     },
     "node_modules/is-binary-path": {
       "version": "2.1.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "binary-extensions": "^2.0.0"
@@ -6369,7 +6333,6 @@
     },
     "node_modules/is-core-module": {
       "version": "2.13.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "hasown": "^2.0.0"
@@ -6394,7 +6357,6 @@
     },
     "node_modules/is-extglob": {
       "version": "2.1.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -6413,7 +6375,6 @@
     },
     "node_modules/is-fullwidth-code-point": {
       "version": "3.0.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -6435,7 +6396,6 @@
     },
     "node_modules/is-glob": {
       "version": "4.0.3",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "is-extglob": "^2.1.1"
@@ -6467,7 +6427,6 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
       "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.12.0"
@@ -6616,7 +6575,6 @@
     },
     "node_modules/isexe": {
       "version": "2.0.0",
-      "dev": true,
       "license": "ISC"
     },
     "node_modules/isomorphic-dompurify": {
@@ -6645,7 +6603,6 @@
     },
     "node_modules/jackspeak": {
       "version": "2.3.6",
-      "dev": true,
       "license": "BlueOak-1.0.0",
       "dependencies": {
         "@isaacs/cliui": "^8.0.2"
@@ -6693,7 +6650,6 @@
     },
     "node_modules/jiti": {
       "version": "1.21.0",
-      "dev": true,
       "license": "MIT",
       "bin": {
         "jiti": "bin/jiti.js"
@@ -6876,7 +6832,6 @@
     },
     "node_modules/lilconfig": {
       "version": "2.1.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=10"
@@ -6884,7 +6839,6 @@
     },
     "node_modules/lines-and-columns": {
       "version": "1.2.4",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/loader-runner": {
@@ -6993,7 +6947,6 @@
     },
     "node_modules/merge2": {
       "version": "1.4.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 8"
@@ -7001,7 +6954,6 @@
     },
     "node_modules/micromatch": {
       "version": "4.0.5",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "braces": "^3.0.2",
@@ -7049,7 +7001,6 @@
     },
     "node_modules/minipass": {
       "version": "7.0.4",
-      "dev": true,
       "license": "ISC",
       "engines": {
         "node": ">=16 || 14 >=14.17"
@@ -7061,7 +7012,6 @@
     },
     "node_modules/mz": {
       "version": "2.7.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "any-promise": "^1.0.0",
@@ -7216,7 +7166,6 @@
     },
     "node_modules/normalize-path": {
       "version": "3.0.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -7257,7 +7206,6 @@
     },
     "node_modules/object-assign": {
       "version": "4.1.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -7265,7 +7213,6 @@
     },
     "node_modules/object-hash": {
       "version": "3.0.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 6"
@@ -7482,7 +7429,6 @@
     },
     "node_modules/path-key": {
       "version": "3.1.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -7490,12 +7436,10 @@
     },
     "node_modules/path-parse": {
       "version": "1.0.7",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/path-scurry": {
       "version": "1.10.1",
-      "dev": true,
       "license": "BlueOak-1.0.0",
       "dependencies": {
         "lru-cache": "^9.1.1 || ^10.0.0",
@@ -7510,7 +7454,6 @@
     },
     "node_modules/path-scurry/node_modules/lru-cache": {
       "version": "10.2.0",
-      "dev": true,
       "license": "ISC",
       "engines": {
         "node": "14 || >=16.14"
@@ -7530,7 +7473,6 @@
     },
     "node_modules/picomatch": {
       "version": "2.3.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8.6"
@@ -7541,7 +7483,6 @@
     },
     "node_modules/pify": {
       "version": "2.3.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -7549,7 +7490,6 @@
     },
     "node_modules/pirates": {
       "version": "4.0.6",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 6"
@@ -7565,7 +7505,6 @@
     },
     "node_modules/postcss": {
       "version": "8.4.35",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -7592,7 +7531,6 @@
     },
     "node_modules/postcss-import": {
       "version": "15.1.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "postcss-value-parser": "^4.0.0",
@@ -7608,7 +7546,6 @@
     },
     "node_modules/postcss-js": {
       "version": "4.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "camelcase-css": "^2.0.1"
@@ -7626,7 +7563,6 @@
     },
     "node_modules/postcss-load-config": {
       "version": "4.0.2",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -7660,7 +7596,6 @@
     },
     "node_modules/postcss-load-config/node_modules/lilconfig": {
       "version": "3.1.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=14"
@@ -7671,7 +7606,6 @@
     },
     "node_modules/postcss-nested": {
       "version": "6.0.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "postcss-selector-parser": "^6.0.11"
@@ -7689,7 +7623,6 @@
     },
     "node_modules/postcss-selector-parser": {
       "version": "6.0.15",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "cssesc": "^3.0.0",
@@ -7701,7 +7634,6 @@
     },
     "node_modules/postcss-value-parser": {
       "version": "4.2.0",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/preact": {
@@ -7784,7 +7716,6 @@
     },
     "node_modules/queue-microtask": {
       "version": "1.2.3",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -7839,7 +7770,6 @@
     },
     "node_modules/read-cache": {
       "version": "1.0.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "pify": "^2.3.0"
@@ -7847,7 +7777,6 @@
     },
     "node_modules/readdirp": {
       "version": "3.6.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "picomatch": "^2.2.1"
@@ -7987,7 +7916,6 @@
     },
     "node_modules/resolve": {
       "version": "1.22.8",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "is-core-module": "^2.13.0",
@@ -8019,7 +7947,6 @@
     },
     "node_modules/reusify": {
       "version": "1.0.4",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "iojs": ">=1.0.0",
@@ -8065,7 +7992,6 @@
     },
     "node_modules/run-parallel": {
       "version": "1.2.0",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -8228,7 +8154,6 @@
     },
     "node_modules/shebang-command": {
       "version": "2.0.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "shebang-regex": "^3.0.0"
@@ -8239,7 +8164,6 @@
     },
     "node_modules/shebang-regex": {
       "version": "3.0.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -8264,7 +8188,6 @@
     },
     "node_modules/signal-exit": {
       "version": "4.1.0",
-      "dev": true,
       "license": "ISC",
       "engines": {
         "node": ">=14"
@@ -8327,7 +8250,6 @@
     },
     "node_modules/string-width": {
       "version": "5.1.2",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "eastasianwidth": "^0.2.0",
@@ -8343,7 +8265,6 @@
     },
     "node_modules/string-width/node_modules/strip-ansi": {
       "version": "7.1.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^6.0.1"
@@ -8357,7 +8278,6 @@
     },
     "node_modules/string-width/node_modules/strip-ansi/node_modules/ansi-regex": {
       "version": "6.0.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=12"
@@ -8486,7 +8406,6 @@
     },
     "node_modules/sucrase": {
       "version": "3.35.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/gen-mapping": "^0.3.2",
@@ -8518,7 +8437,6 @@
     },
     "node_modules/supports-preserve-symlinks-flag": {
       "version": "1.0.0",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">= 0.4"
@@ -8573,7 +8491,6 @@
     },
     "node_modules/tailwindcss": {
       "version": "3.4.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@alloc/quick-lru": "^5.2.0",
@@ -8682,7 +8599,6 @@
     },
     "node_modules/thenify": {
       "version": "3.3.1",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "any-promise": "^1.0.0"
@@ -8690,7 +8606,6 @@
     },
     "node_modules/thenify-all": {
       "version": "1.6.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "thenify": ">= 3.1.0 < 4"
@@ -8712,7 +8627,6 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
       "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "is-number": "^7.0.0"
@@ -8757,7 +8671,6 @@
     },
     "node_modules/ts-interface-checker": {
       "version": "0.1.13",
-      "dev": true,
       "license": "Apache-2.0"
     },
     "node_modules/tsconfig-paths": {
@@ -9173,7 +9086,6 @@
     },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/w3c-keyname": {
@@ -9325,7 +9237,6 @@
     },
     "node_modules/which": {
       "version": "2.0.2",
-      "dev": true,
       "license": "ISC",
       "dependencies": {
         "isexe": "^2.0.0"
@@ -9411,7 +9322,6 @@
     },
     "node_modules/wrap-ansi": {
       "version": "8.1.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-styles": "^6.1.0",
@@ -9427,7 +9337,6 @@
     },
     "node_modules/wrap-ansi/node_modules/ansi-styles": {
       "version": "6.2.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=12"
@@ -9438,7 +9347,6 @@
     },
     "node_modules/wrap-ansi/node_modules/strip-ansi": {
       "version": "7.1.0",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^6.0.1"
@@ -9452,7 +9360,6 @@
     },
     "node_modules/wrap-ansi/node_modules/strip-ansi/node_modules/ansi-regex": {
       "version": "6.0.1",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=12"
@@ -9505,7 +9412,6 @@
     },
     "node_modules/yaml": {
       "version": "2.3.4",
-      "dev": true,
       "license": "ISC",
       "engines": {
         "node": ">= 14"
diff --git a/package.json b/package.json
index f529396..ef6b027 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "@codemirror/lang-markdown": "^6.2.5",
     "@heroicons/react": "^2.1.1",
     "@prisma/client": "^5.18.0",
+    "@tailwindcss/container-queries": "^0.1.1",
     "@types/bcryptjs": "^2.4.6",
     "@uiw/codemirror-theme-duotone": "^4.23.0",
     "@uiw/react-codemirror": "^4.23.0",
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 7e3cb26..60f4a80 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -51,6 +51,6 @@ const config: Config = {
       },
     },
   },
-  plugins: [],
+  plugins: [require("@tailwindcss/container-queries")],
 };
 export default config;