narrat 1.3.2 → 2.0.0-rc3

package/lib/index.esm.js

@@ -1,4 +1,4 @@
-// Version: 1.3.2 - June 26, 2022 18:33:37
+// Version: 2.0.0-rc3 - June 28, 2022 22:38:40
 import 'es6-promise/auto';
 import { ref, reactive, readonly, defineComponent, openBlock, createElementBlock, normalizeStyle, createElementVNode, createCommentVNode, Fragment, renderList, normalizeClass, createBlock, Transition, withCtx, renderSlot, createTextVNode, computed, resolveComponent, withDirectives, vModelText, toDisplayString, TransitionGroup, createVNode, createApp } from 'vue';
 import { defineStore, mapState, createPinia } from 'pinia';
@@ -30,7 +30,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = "/*! @import */\n\n/*! modern-normalize v1.0.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\n:root {\n  -moz-tab-size: 4;\n  -o-tab-size: 4;\n     tab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n  margin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n  font-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n  height: 0; /* 1 */\n  color: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n  font-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n  font-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n  text-indent: 0; /* 1 */\n  border-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'],\n[type='reset'] {\n  -webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n  padding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n  display: list-item;\n}\n\n/**\n * Manually forked from SUIT CSS Base: https://github.com/suitcss/base\n * A thin layer on top of normalize.css that provides a starting point more\n * suitable for web applications.\n */\n\n/**\n * Removes the default spacing and border for appropriate elements.\n */\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\n\nbutton {\n  background-color: transparent;\n  background-image: none;\n}\n\n/**\n * Work around a Firefox/IE bug where the transparent `button` background\n * results in a loss of the default `button` focus styles.\n */\n\nbutton:focus {\n  outline: 1px dotted;\n  outline: 5px auto -webkit-focus-ring-color;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nol,\nul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/**\n * Tailwind custom reset styles\n */\n\n/**\n * 1. Use the user's configured `sans` font-family (with Tailwind's default\n *    sans-serif font stack as a fallback) as a sane default.\n * 2. Use Tailwind's default \"normal\" line-height so the user isn't forced\n *    to override it to ensure consistency even when using the default theme.\n */\n\nhtml {\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 1 */\n  line-height: 1.5; /* 2 */\n}\n\n/**\n * Inherit font-family and line-height from `html` so users can set them as\n * a class directly on the `html` element.\n */\n\nbody {\n  font-family: inherit;\n  line-height: inherit;\n}\n\n/**\n * 1. Prevent padding and border from affecting element width.\n *\n *    We used to set this in the html element and inherit from\n *    the parent element for everything else. This caused issues\n *    in shadow-dom-enhanced elements like <details> where the content\n *    is wrapped by a div with box-sizing set to `content-box`.\n *\n *    https://github.com/mozdevs/cssremedy/issues/4\n *\n *\n * 2. Allow adding a border to an element by just adding a border-width.\n *\n *    By default, the way the browser specifies that an element should have no\n *    border is by setting it's border-style to `none` in the user-agent\n *    stylesheet.\n *\n *    In order to easily add borders to elements by just setting the `border-width`\n *    property, we change the default border-style for all elements to `solid`, and\n *    use border-width to hide them instead. This way our `border` utilities only\n *    need to set the `border-width` property instead of the entire `border`\n *    shorthand, making our border utilities much more straightforward to compose.\n *\n *    https://github.com/tailwindcss/tailwindcss/pull/116\n */\n\n*,\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: #e5e7eb; /* 2 */\n}\n\n/*\n * Ensure horizontal rules are visible by default\n */\n\nhr {\n  border-top-width: 1px;\n}\n\n/**\n * Undo the `border-style: none` reset that Normalize applies to images so that\n * our `border-{width}` utilities have the expected effect.\n *\n * The Normalize reset is unnecessary for us since we default the border-width\n * to 0 on all elements.\n *\n * https://github.com/tailwindcss/tailwindcss/issues/362\n */\n\nimg {\n  border-style: solid;\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput::-moz-placeholder, textarea::-moz-placeholder {\n  color: #9ca3af;\n}\n\ninput:-ms-input-placeholder, textarea:-ms-input-placeholder {\n  color: #9ca3af;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  color: #9ca3af;\n}\n\nbutton {\n  cursor: pointer;\n}\n\ntable {\n  border-collapse: collapse;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/**\n * Reset links to optimize for opt-in styling instead of\n * opt-out.\n */\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/**\n * Reset form element properties that are easy to forget to\n * style explicitly so you don't inadvertently introduce\n * styles that deviate from your design system. These styles\n * supplement a partial reset that is already applied by\n * normalize.css.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  padding: 0;\n  line-height: inherit;\n  color: inherit;\n}\n\n/**\n * Use the configured 'mono' font family for elements that\n * are expected to be rendered with a monospace font, falling\n * back to the system monospace stack if there is no configured\n * 'mono' font family.\n */\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n/**\n * Make replaced elements `display: block` by default as that's\n * the behavior you want almost all of the time. Inspired by\n * CSS Remedy, with `svg` added as well.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block;\n  vertical-align: middle;\n}\n\n/**\n * Constrain images and videos to the parent width and preserve\n * their instrinsic aspect ratio.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n.container {\n  width: 100%;\n}\n\n@media (min-width: 640px) {\n  .container {\n    max-width: 640px;\n  }\n}\n\n@media (min-width: 768px) {\n  .container {\n    max-width: 768px;\n  }\n}\n\n@media (min-width: 1024px) {\n  .container {\n    max-width: 1024px;\n  }\n}\n\n@media (min-width: 1280px) {\n  .container {\n    max-width: 1280px;\n  }\n}\n\n@media (min-width: 1536px) {\n  .container {\n    max-width: 1536px;\n  }\n}\n\n.bg-gray-800 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(31, 41, 55, var(--tw-bg-opacity));\n}\n\n.border {\n  border-width: 1px;\n}\n\n.flex {\n  display: flex;\n}\n\n.table {\n  display: table;\n}\n\n.grid {\n  display: grid;\n}\n\n.hidden {\n  display: none;\n}\n\n.flex-row {\n  flex-direction: row;\n}\n\n.flex-col {\n  flex-direction: column;\n}\n\n.flex-grow {\n  flex-grow: 1;\n}\n\n.flex-shrink {\n  flex-shrink: 1;\n}\n\n.list-disc {\n  list-style-type: disc;\n}\n\n.absolute {\n  position: absolute;\n}\n\n.resize {\n  resize: both;\n}\n\n* {\n  --tw-shadow: 0 0 #0000;\n}\n\n* {\n  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgba(59, 130, 246, 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n}\n\n.table-auto {\n  table-layout: auto;\n}\n\n.line-through {\n  text-decoration: line-through;\n}\n\n.w-full {\n  width: 100%;\n}\n\n.gap-4 {\n  gap: 1rem;\n}\n\n.grid-cols-3 {\n  grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n\n.transform {\n  --tw-translate-x: 0;\n  --tw-translate-y: 0;\n  --tw-rotate: 0;\n  --tw-skew-x: 0;\n  --tw-skew-y: 0;\n  --tw-scale-x: 1;\n  --tw-scale-y: 1;\n  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.transition {\n  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n@-webkit-keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@-webkit-keyframes ping {\n  75%, 100% {\n    transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@keyframes ping {\n  75%, 100% {\n    transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@keyframes pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@-webkit-keyframes bounce {\n  0%, 100% {\n    transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\n@keyframes bounce {\n  0%, 100% {\n    transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\n:root {\n  --bg-color: #131720;\n  --text-color: #d9e1f2;\n  --primary: hsl(255, 30%, 55%);\n  --focus: hsl(210, 90%, 50%);\n  --secondary: #42b983;\n  --border-color: hsla(0, 0%, 100%, 0.2);\n  --light-1: hsl(210, 30%, 40%);\n  --light-2: hsl(255, 30%, 50%);\n  --light-background: linear-gradient(to right, var(--light-1), var(--light-2));\n  --shadow-1: hsla(236, 50%, 50%, 0.3);\n  --shadow-2: hsla(236, 50%, 50%, 0.4);\n  --hud-background: rgba(0, 0, 0, 0.4);\n  --hud-text-color: var(--text-color);\n  --notifications-bg: darkslateblue;\n  --skills-text-background: rgba(0, 0, 0, 0.5);\n  --skills-text-color: var(--text-color);\n  --skills-level-background: rgba(0, 0, 0, 0.5);\n  --skills-level-color: orange;\n  --skills-xp-bar-height: 40px;\n  --skill-check-name-color: orange;\n  --skill-check-difficulty: orange;\n  --skill-check-success: green;\n  --skill-check-failed: red;\n  --skill-check-color: orange;\n  --dialog-choice-color: orange;\n  --dialog-choice-hover-color: var(--text-color);\n  --inventory-text-background: rgba(0, 0, 0, 0.5);\n  --inventory-text-color: var(--text-color);\n  --inventory-amount-background: rgba(0, 0, 0, 0.5);\n  --inventory-amount-color: orange;\n  --quest-title-color: yellow;\n  --completed-quest-title-color: grey;\n  --objective-in-progress-color: white;\n  --objective-completed-color: grey;\n}\n\n.list-item {\n  display: inline-block;\n  margin-right: 10px;\n}\n\n.list-enter-active,\n.list-leave-active {\n  transition: all 0.3s ease;\n}\n\n/* .list-move {\n  transition: transform 0.3s ease;\n} */\n\n.list-enter-from,\n.list-leave-to {\n  opacity: 0;\n  transform: translateX(300px);\n}\n\n.notification-item {\n  display: inline-block;\n  margin-right: 10px;\n}\n\n.notification-enter-active,\n.notification-leave-active {\n  transition: all 0.3s ease;\n}\n\n/* .notification-move {\n  transition: transform 0.3s ease;\n} */\n\n.notification-enter-from,\n.notification-leave-to {\n  opacity: 0;\n  transform: translateY(-300px);\n}\n\n.fade-enter-active,\n.fade-leave-active {\n  transition: opacity 0.3s ease;\n}\n\n.fade-enter-from,\n.fade-leave-to {\n  opacity: 0;\n}\n\n.fade-in-enter-active {\n  transition: opacity 0.1s ease;\n}\n\n.fade-in-enter-from {\n  opacity: 0;\n}\n\nbody {\n  padding: 0;\n  margin: 0;\n  font-family: Arial, sans-serif;\n  background-color: black;\n}\n\n.select {\n  background: var(--light-background);\n  padding: 10px;\n}\n\n.option {\n  background-color: var(--light-2);\n  padding: 5px;\n  color: var(--text-color);\n}\n\n.button {\n  background: var(--light-background);\n  color: var(--text-color);\n  box-shadow: 0.4rem 0.4rem 2.4rem 0.2rem var(--shadow-1);\n  border-radius: 100px;\n  padding: 10px;\n  font-weight: 800;\n  font-size: 16px;\n  margin: 10px;\n  transition: 0.2s;\n}\n\n.button:focus,\n.button:hover {\n  transform: translateY(-0.2rem);\n  box-shadow: 0 0 2.4rem 0.2rem var(--shadow-2);\n}\n\n.disabled {\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  pointer-events: none;\n}\n\n.button.disabled {\n  box-shadow: unset;\n  color: grey;\n  background: var(--border-color);\n}\n\n.input {\n  background: var(--light-background);\n  color: var(--text-color);\n  box-shadow: 0.4rem 0.4rem 2.4rem 0.2rem var(--shadow-1);\n  border-radius: 100px;\n  padding: 10px;\n  font-weight: 800;\n  font-size: 16px;\n  margin: 10px;\n  transition: 0.2s;\n}\n\n.input:focus,\n.input:hover {\n  transform: translateY(-0.2rem);\n  box-shadow: 0 0 2.4rem 0.2rem var(--shadow-2);\n}\n\na {\n  color: pink;\n  text-decoration: underline;\n}\n\nth,\ntd {\n  padding: 4px;\n  border: 1px solid var(--text-color);\n  text-align: center;\n}\n\n#game-holder {\n  width: 100vw;\n  height: 100vh;\n  padding: 0;\n  margin: 0;\n  top: 0;\n  left: 0;\n  background-color: black;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: -webkit-fill-available;\n}\n\n.title {\n  font-size: 30px;\n  font-weight: 700;\n  text-align: center;\n}\n\n.container {\n  padding: 20px;\n}\n\nh1,\nh2,\nh3,\nh4 {\n  font-weight: 700;\n}\n\nh1 {\n  font-size: 30px;\n}\n\nh2 {\n  font-size: 26px;\n}\n\nh3 {\n  font-size: 24px;\n}\n\nhr.solid {\n  border: 1px solid var(--text-color);\n  margin-top: 30px;\n  margin-bottom: 30px;\n}\n\n.card-1 {\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);\n  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n\n.card-1:hover {\n  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);\n}\n\n.card-2 {\n  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);\n}\n\n.card-3 {\n  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);\n}\n\n.card-4 {\n  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);\n}\n\n.card-5 {\n  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);\n}\n\n.dialog-choice {\n  transition: 0.2s;\n}\n\n.dialog-choice:hover {\n  transform: scale(1.05, 1.05);\n  transform-origin: center;\n}\n\n/* Somewhat arcane CSS to force the hover color to override the child style.\nOtherwise hovering choices doesn't change the color of skill check prompts. */\n\n.dialog-choice:not(:hover) > .skill-check-name,\n.passive-skill-check > .skill-check-name {\n  color: var(--skill-check-name-color);\n}\n\n.dialog-choice:not(:hover) > .skill-check-difficulty,\n.passive-skill-check > .skill-check-difficulty {\n  color: var(--skill-check-difficulty);\n}\n\n.skill-check-difficulty {\n  font-weight: 700;\n}\n\n.dialog-choice:not(:hover) > .skill-check-success,\n.passive-skill-check > .skill-check-success {\n  color: var(--skill-check-success);\n}\n\n.dialog-choice:not(:hover) > .skill-check-failed,\n.passive-skill-check > .skill-check-failed {\n  color: var(--skill-check-failed);\n}\n\n.dialog-choice:not(:hover) > .skill-check,\n.passive-skill-check.skill-check {\n  color: var(--skill-check-color);\n}\n\n.narrat-canvas {\n  position: absolute;\n  height: 100%;\n  top: 0;\n  left: 0;\n}\n\n/* Looks ugly */\n\n/* @keyframes strike-anim {\n  0% {\n    width: 0;\n  }\n  100% {\n    width: 100%;\n  }\n}\n.strike-anim {\n  position: relative;\n}\n.strike-anim::after {\n  content: ' ';\n  position: absolute;\n  top: 50%;\n  left: 0;\n  width: 100%;\n  height: 1px;\n  background: var(--text-color);\n  animation-name: strike-anim;\n  animation-duration: 0.5s;\n  animation-timing-function: linear;\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n} */\n\n#touchTrigger {\n  pointer-events: none;\n}\n\n@media (min-width: 640px) {\n}\n\n@media (min-width: 768px) {\n}\n\n@media (min-width: 1024px) {\n}\n\n@media (min-width: 1280px) {\n}\n\n@media (min-width: 1536px) {\n}\n";
+var css_248z = "/*! @import */\n\n/*! modern-normalize v1.0.0 | MIT License | https://github.com/sindresorhus/modern-normalize */\n\n/*\nDocument\n========\n*/\n\n/**\nUse a better box model (opinionated).\n*/\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n/**\nUse a more readable tab size (opinionated).\n*/\n\n:root {\n  -moz-tab-size: 4;\n  -o-tab-size: 4;\n     tab-size: 4;\n}\n\n/**\n1. Correct the line height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n*/\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/*\nSections\n========\n*/\n\n/**\nRemove the margin in all browsers.\n*/\n\nbody {\n  margin: 0;\n}\n\n/**\nImprove consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n*/\n\nbody {\n  font-family:\n\t\tsystem-ui,\n\t\t-apple-system, /* Firefox supports this but not yet `system-ui` */\n\t\t'Segoe UI',\n\t\tRoboto,\n\t\tHelvetica,\n\t\tArial,\n\t\tsans-serif,\n\t\t'Apple Color Emoji',\n\t\t'Segoe UI Emoji';\n}\n\n/*\nGrouping content\n================\n*/\n\n/**\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n*/\n\nhr {\n  height: 0; /* 1 */\n  color: inherit; /* 2 */\n}\n\n/*\nText-level semantics\n====================\n*/\n\n/**\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr[title] {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n}\n\n/**\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)\n2. Correct the odd 'em' font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n  font-family:\n\t\tui-monospace,\n\t\tSFMono-Regular,\n\t\tConsolas,\n\t\t'Liberation Mono',\n\t\tMenlo,\n\t\tmonospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n  font-size: 80%;\n}\n\n/**\nPrevent 'sub' and 'sup' elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/*\nTabular data\n============\n*/\n\n/**\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n*/\n\ntable {\n  text-indent: 0; /* 1 */\n  border-color: inherit; /* 2 */\n}\n\n/*\nForms\n=====\n*/\n\n/**\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\nRemove the inheritance of text transform in Edge and Firefox.\n1. Remove the inheritance of text transform in Firefox.\n*/\n\nbutton,\nselect { /* 1 */\n  text-transform: none;\n}\n\n/**\nCorrect the inability to style clickable types in iOS and Safari.\n*/\n\nbutton,\n[type='button'],\n[type='reset'] {\n  -webkit-appearance: button;\n}\n\n/**\nRemove the inner border and padding in Firefox.\n*/\n\n/**\nRestore the focus styles unset by the previous rule.\n*/\n\n/**\nRemove the additional ':invalid' styles in Firefox.\nSee: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737\n*/\n\n/**\nRemove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.\n*/\n\nlegend {\n  padding: 0;\n}\n\n/**\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n/**\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n/**\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to 'inherit' in Safari.\n*/\n\n/*\nInteractive\n===========\n*/\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n  display: list-item;\n}\n\n/**\n * Manually forked from SUIT CSS Base: https://github.com/suitcss/base\n * A thin layer on top of normalize.css that provides a starting point more\n * suitable for web applications.\n */\n\n/**\n * Removes the default spacing and border for appropriate elements.\n */\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\n\nbutton {\n  background-color: transparent;\n  background-image: none;\n}\n\n/**\n * Work around a Firefox/IE bug where the transparent `button` background\n * results in a loss of the default `button` focus styles.\n */\n\nbutton:focus {\n  outline: 1px dotted;\n  outline: 5px auto -webkit-focus-ring-color;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nol,\nul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/**\n * Tailwind custom reset styles\n */\n\n/**\n * 1. Use the user's configured `sans` font-family (with Tailwind's default\n *    sans-serif font stack as a fallback) as a sane default.\n * 2. Use Tailwind's default \"normal\" line-height so the user isn't forced\n *    to override it to ensure consistency even when using the default theme.\n */\n\nhtml {\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 1 */\n  line-height: 1.5; /* 2 */\n}\n\n/**\n * Inherit font-family and line-height from `html` so users can set them as\n * a class directly on the `html` element.\n */\n\nbody {\n  font-family: inherit;\n  line-height: inherit;\n}\n\n/**\n * 1. Prevent padding and border from affecting element width.\n *\n *    We used to set this in the html element and inherit from\n *    the parent element for everything else. This caused issues\n *    in shadow-dom-enhanced elements like <details> where the content\n *    is wrapped by a div with box-sizing set to `content-box`.\n *\n *    https://github.com/mozdevs/cssremedy/issues/4\n *\n *\n * 2. Allow adding a border to an element by just adding a border-width.\n *\n *    By default, the way the browser specifies that an element should have no\n *    border is by setting it's border-style to `none` in the user-agent\n *    stylesheet.\n *\n *    In order to easily add borders to elements by just setting the `border-width`\n *    property, we change the default border-style for all elements to `solid`, and\n *    use border-width to hide them instead. This way our `border` utilities only\n *    need to set the `border-width` property instead of the entire `border`\n *    shorthand, making our border utilities much more straightforward to compose.\n *\n *    https://github.com/tailwindcss/tailwindcss/pull/116\n */\n\n*,\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: #e5e7eb; /* 2 */\n}\n\n/*\n * Ensure horizontal rules are visible by default\n */\n\nhr {\n  border-top-width: 1px;\n}\n\n/**\n * Undo the `border-style: none` reset that Normalize applies to images so that\n * our `border-{width}` utilities have the expected effect.\n *\n * The Normalize reset is unnecessary for us since we default the border-width\n * to 0 on all elements.\n *\n * https://github.com/tailwindcss/tailwindcss/issues/362\n */\n\nimg {\n  border-style: solid;\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput::-moz-placeholder, textarea::-moz-placeholder {\n  color: #9ca3af;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  color: #9ca3af;\n}\n\nbutton {\n  cursor: pointer;\n}\n\ntable {\n  border-collapse: collapse;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/**\n * Reset links to optimize for opt-in styling instead of\n * opt-out.\n */\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/**\n * Reset form element properties that are easy to forget to\n * style explicitly so you don't inadvertently introduce\n * styles that deviate from your design system. These styles\n * supplement a partial reset that is already applied by\n * normalize.css.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  padding: 0;\n  line-height: inherit;\n  color: inherit;\n}\n\n/**\n * Use the configured 'mono' font family for elements that\n * are expected to be rendered with a monospace font, falling\n * back to the system monospace stack if there is no configured\n * 'mono' font family.\n */\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\n\n/**\n * Make replaced elements `display: block` by default as that's\n * the behavior you want almost all of the time. Inspired by\n * CSS Remedy, with `svg` added as well.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block;\n  vertical-align: middle;\n}\n\n/**\n * Constrain images and videos to the parent width and preserve\n * their instrinsic aspect ratio.\n *\n * https://github.com/mozdevs/cssremedy/issues/14\n */\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n.container {\n  width: 100%;\n}\n\n@media (min-width: 640px) {\n  .container {\n    max-width: 640px;\n  }\n}\n\n@media (min-width: 768px) {\n  .container {\n    max-width: 768px;\n  }\n}\n\n@media (min-width: 1024px) {\n  .container {\n    max-width: 1024px;\n  }\n}\n\n@media (min-width: 1280px) {\n  .container {\n    max-width: 1280px;\n  }\n}\n\n@media (min-width: 1536px) {\n  .container {\n    max-width: 1536px;\n  }\n}\n\n.bg-gray-800 {\n  --tw-bg-opacity: 1;\n  background-color: rgba(31, 41, 55, var(--tw-bg-opacity));\n}\n\n.border {\n  border-width: 1px;\n}\n\n.flex {\n  display: flex;\n}\n\n.table {\n  display: table;\n}\n\n.grid {\n  display: grid;\n}\n\n.hidden {\n  display: none;\n}\n\n.flex-row {\n  flex-direction: row;\n}\n\n.flex-col {\n  flex-direction: column;\n}\n\n.flex-grow {\n  flex-grow: 1;\n}\n\n.flex-shrink {\n  flex-shrink: 1;\n}\n\n.list-disc {\n  list-style-type: disc;\n}\n\n.absolute {\n  position: absolute;\n}\n\n.resize {\n  resize: both;\n}\n\n* {\n  --tw-shadow: 0 0 #0000;\n}\n\n* {\n  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgba(59, 130, 246, 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n}\n\n.table-auto {\n  table-layout: auto;\n}\n\n.line-through {\n  text-decoration: line-through;\n}\n\n.w-full {\n  width: 100%;\n}\n\n.gap-4 {\n  gap: 1rem;\n}\n\n.grid-cols-3 {\n  grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n\n.transform {\n  --tw-translate-x: 0;\n  --tw-translate-y: 0;\n  --tw-rotate: 0;\n  --tw-skew-x: 0;\n  --tw-skew-y: 0;\n  --tw-scale-x: 1;\n  --tw-scale-y: 1;\n  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n.transition {\n  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n@-webkit-keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@-webkit-keyframes ping {\n  75%, 100% {\n    transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@keyframes ping {\n  75%, 100% {\n    transform: scale(2);\n    opacity: 0;\n  }\n}\n\n@-webkit-keyframes pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@keyframes pulse {\n  50% {\n    opacity: .5;\n  }\n}\n\n@-webkit-keyframes bounce {\n  0%, 100% {\n    transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\n@keyframes bounce {\n  0%, 100% {\n    transform: translateY(-25%);\n    -webkit-animation-timing-function: cubic-bezier(0.8,0,1,1);\n            animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n\n  50% {\n    transform: none;\n    -webkit-animation-timing-function: cubic-bezier(0,0,0.2,1);\n            animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n\n@font-face {\n  font-family: 'OpenDyslexic';\n\n  src: url('fonts/OpenDyslexic.ttf.woff') format('woff'),\n    url('fonts/OpenDyslexic.ttf.svg#OpenDyslexic') format('svg'),\n    url('fonts/OpenDyslexic.ttf.eot'),\n    url('fonts/OpenDyslexic.ttf.eot?#iefix') format('embedded-opentype');\n\n  font-weight: normal;\n\n  font-style: normal;\n}\n\n:root {\n  --font-family: 'OpenDyslexic';\n  --bg-color: #131720;\n  --text-color: #d9e1f2;\n  --primary: hsl(255, 30%, 55%);\n  --focus: hsl(210, 90%, 50%);\n  --secondary: #42b983;\n  --border-color: hsla(0, 0%, 100%, 0.2);\n  --light-1: hsl(210, 30%, 40%);\n  --light-2: hsl(255, 30%, 50%);\n  --light-background: linear-gradient(to right, var(--light-1), var(--light-2));\n  --shadow-1: hsla(236, 50%, 50%, 0.3);\n  --shadow-2: hsla(236, 50%, 50%, 0.4);\n  --hud-background: rgba(0, 0, 0, 0.4);\n  --hud-text-color: var(--text-color);\n  --notifications-bg: darkslateblue;\n  --skills-text-background: rgba(0, 0, 0, 0.5);\n  --skills-text-color: var(--text-color);\n  --skills-level-background: rgba(0, 0, 0, 0.5);\n  --skills-level-color: orange;\n  --skills-xp-bar-height: 40px;\n  --skill-check-name-color: orange;\n  --skill-check-difficulty: orange;\n  --skill-check-success: green;\n  --skill-check-failed: red;\n  --skill-check-color: orange;\n  --dialog-choice-color: orange;\n  --dialog-choice-hover-color: var(--text-color);\n  --inventory-text-background: rgba(0, 0, 0, 0.5);\n  --inventory-text-color: var(--text-color);\n  --inventory-amount-background: rgba(0, 0, 0, 0.5);\n  --inventory-amount-color: orange;\n  --quest-title-color: yellow;\n  --completed-quest-title-color: grey;\n  --objective-in-progress-color: white;\n  --objective-completed-color: grey;\n}\n\nbody {\n  font-family: var(--font-family);\n}\n\n* {\n  font-family: var(--font-family);\n  text-shadow: 1px 1px #000a;\n}\n\n.list-item {\n  display: inline-block;\n  margin-right: 10px;\n}\n\n.list-enter-active,\n.list-leave-active {\n  transition: all 0.3s ease;\n}\n\n#app {\n  background-image: url('img/h01.gif');\n  background-size: cover;\n}\n\n/* .list-move {\n  transition: transform 0.3s ease;\n} */\n\n.list-enter-from,\n.list-leave-to {\n  opacity: 0;\n  transform: translateX(300px);\n}\n\n.notification-item {\n  display: inline-block;\n  margin-right: 10px;\n}\n\n.notification-enter-active,\n.notification-leave-active {\n  transition: all 0.3s ease;\n}\n\n/* .notification-move {\n  transition: transform 0.3s ease;\n} */\n\n.notification-enter-from,\n.notification-leave-to {\n  opacity: 0;\n  transform: translateY(-300px);\n}\n\n.fade-enter-active,\n.fade-leave-active {\n  transition: opacity 0.3s ease;\n}\n\n.fade-enter-from,\n.fade-leave-to {\n  opacity: 0;\n}\n\n.fade-in-enter-active {\n  transition: opacity 0.1s ease;\n}\n\n.fade-in-enter-from {\n  opacity: 0;\n}\n\nbody {\n  padding: 0;\n  margin: 0;\n  font-family: Arial, sans-serif;\n  background-color: black;\n}\n\n.select {\n  background: var(--light-background);\n  padding: 10px;\n}\n\n.option {\n  background-color: var(--light-2);\n  padding: 5px;\n  color: var(--text-color);\n}\n\n.button {\n  background: var(--light-background);\n  color: var(--text-color);\n  box-shadow: 0.4rem 0.5rem 2.4rem 0.2rem var(--shadow-1), inset -2px -4px #0006,\n    inset 2px 2px #fff7;\n  border-radius: 10px;\n  padding: 10px;\n  font-weight: 800;\n  font-size: 16px;\n  margin: 10px;\n  transition: 0.2s;\n  box-shadow: inset -2px -4px #0006, inset 2px 2px #fff7;\n}\n\n.button.large {\n  border-radius: 20px;\n}\n\n.menu-button {\n  border-radius: 5px;\n}\n\n.button.main-menu-button {\n  border-radius: 20px;\n}\n\n.button:focus,\n.button:hover {\n  transform: translateY(-0.2rem);\n  box-shadow: 0 0 1rem 0.2rem var(--shadow-2), inset -2px -4px #0006,\n    inset 2px 2px #fff7;\n}\n\n.disabled {\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n  pointer-events: none;\n}\n\n.button.disabled {\n  box-shadow: unset;\n  color: grey;\n  background: var(--border-color);\n}\n\n.input {\n  background: var(--light-background);\n  color: var(--text-color);\n  box-shadow: 0.4rem 0.4rem 2.4rem 0.2rem var(--shadow-1);\n  border-radius: 100px;\n  padding: 10px;\n  font-weight: 800;\n  font-size: 16px;\n  margin: 10px;\n  transition: 0.2s;\n}\n\n.input:focus,\n.input:hover {\n  transform: translateY(-0.2rem);\n  box-shadow: 0 0 2.4rem 0.2rem var(--shadow-2);\n}\n\na {\n  color: pink;\n  text-decoration: underline;\n}\n\nth,\ntd {\n  padding: 4px;\n  border: 1px solid var(--text-color);\n  text-align: center;\n}\n\n#game-holder {\n  width: 100vw;\n  height: 100vh;\n  padding: 0;\n  margin: 0;\n  top: 0;\n  left: 0;\n  background-color: black;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: -webkit-fill-available;\n}\n\n.title {\n  font-size: 30px;\n  font-weight: 700;\n  text-align: center;\n}\n\n.container {\n  padding: 20px;\n}\n\nh1,\nh2,\nh3,\nh4 {\n  font-weight: 700;\n}\n\nh1 {\n  font-size: 30px;\n}\n\nh2 {\n  font-size: 26px;\n}\n\nh3 {\n  font-size: 24px;\n}\n\nhr.solid {\n  border: 1px solid var(--text-color);\n  margin-top: 30px;\n  margin-bottom: 30px;\n}\n\n.card-1 {\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);\n  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n\n.card-1:hover {\n  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);\n}\n\n.card-2 {\n  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);\n}\n\n.card-3 {\n  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);\n}\n\n.card-4 {\n  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);\n}\n\n.card-5 {\n  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);\n}\n\n.dialog-choice {\n  transition: 0.2s;\n}\n\n.dialog-choice:hover {\n  transform: scale(1.05, 1.05);\n  transform-origin: center;\n}\n\n/* Somewhat arcane CSS to force the hover color to override the child style.\nOtherwise hovering choices doesn't change the color of skill check prompts. */\n\n.dialog-choice:not(:hover) > .skill-check-name,\n.passive-skill-check > .skill-check-name {\n  color: var(--skill-check-name-color);\n}\n\n.dialog-choice:not(:hover) > .skill-check-difficulty,\n.passive-skill-check > .skill-check-difficulty {\n  color: var(--skill-check-difficulty);\n}\n\n.skill-check-difficulty {\n  font-weight: 700;\n}\n\n.dialog-choice:not(:hover) > .skill-check-success,\n.passive-skill-check > .skill-check-success {\n  color: var(--skill-check-success);\n}\n\n.dialog-choice:not(:hover) > .skill-check-failed,\n.passive-skill-check > .skill-check-failed {\n  color: var(--skill-check-failed);\n}\n\n.dialog-choice:not(:hover) > .skill-check,\n.passive-skill-check.skill-check {\n  color: var(--skill-check-color);\n}\n\n.narrat-canvas {\n  position: absolute;\n  height: 100%;\n  top: 0;\n  left: 0;\n}\n\n/* Looks ugly */\n\n/* @keyframes strike-anim {\n  0% {\n    width: 0;\n  }\n  100% {\n    width: 100%;\n  }\n}\n.strike-anim {\n  position: relative;\n}\n.strike-anim::after {\n  content: ' ';\n  position: absolute;\n  top: 50%;\n  left: 0;\n  width: 100%;\n  height: 1px;\n  background: var(--text-color);\n  animation-name: strike-anim;\n  animation-duration: 0.5s;\n  animation-timing-function: linear;\n  animation-iteration-count: 1;\n  animation-fill-mode: forwards;\n} */\n\n#touchTrigger {\n  pointer-events: none;\n}\n\n@media (min-width: 640px) {\n}\n\n@media (min-width: 768px) {\n}\n\n@media (min-width: 1024px) {\n}\n\n@media (min-width: 1280px) {\n}\n\n@media (min-width: 1536px) {\n}\n";
 styleInject(css_248z);
 
 const f=ref([]),v=ref(null),m=ref(null),g=ref(null),h=reactive({current:""}),y=[],b=ref(!1),k=readonly(f),w=readonly(v),M=readonly(m),q=readonly(g),x=readonly(h),$=(e=w.value)=>{h.current=e;const t=k.value.findIndex((t=>t.name===e)),n=k.value.map((e=>e.name));for(let a=0;a<n.length;a++){if(a>0&&a<n.length-1){const e=n[a]+"Minus",r=n[a]+"Plus";h[e]=t<=a,h[r]=t>=a;}h[n[a]]=n[a]===e;}},V=(e=M.value)=>{h.orientation=e,h.isLandscape="landscape"===e,h.isPortrait="portrait"===e;},O=(e=q.value||"light")=>{h.theme=e,h.isDark="dark"===e,h.isLight="light"===e;};function j(e,t){if("undefined"==typeof window||!window.matchMedia)return !1;if("undefined"!=typeof window&&!window.matchMedia)return console.error("Vue3 Mq: No MatchMedia support detected in this browser. Responsive breakpoints not available."),!1;{b.value=!0;const n=window.matchMedia(e),a=({matches:e})=>{e&&t();};y.push({mql:n,cb:a});n.addEventListener&&"function"==typeof n.addEventListener?n.addEventListener("change",a):n.addListener(a),a(n);}}var L=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",bootstrap5:{xs:0,sm:576,md:768,lg:992,xl:1200,xxl:1400},bootstrap4:{xs:0,sm:576,md:768,lg:992,xl:1200},bootstrap3:{xs:0,sm:768,md:992,lg:1200},vuetify:{xs:0,sm:600,md:960,lg:1264,xl:1904},tailwind:{xs:0,sm:640,md:768,lg:1024,xl:1280,xxl:1536},devices:{phone:0,tablet:768,laptop:1370,desktop:1906}});const T=e=>{if(!e||"object"!=typeof e)return !1;const t=[];for(let n in e){const a=parseFloat(e[n]);n&&"string"==typeof n?/^[^a-z]/i.test(n)||/[^a-zA-Z0-9_]/.test(n)?console.warn(`Vue3 Mq: "${n}" is an invalid breakpoint key. Breakpoint keys must start with a letter and contain only alphanumeric characters and underscores. Skipping.`):!a&&0!==a||isNaN(a)||a<0?console.warn(`Vue3 Mq: "${n}: ${e[n]}" is not a valid breakpoint. Breakpoints should be a number of zero or above. Skipping.`):t.push({name:n,min:a}):console.warn(`Vue3 Mq: Invalid or missing breakpoint key (${JSON.stringify(n)}). Skipping.`);}t.some((e=>0===e.min))||console.warn("Vue3 Mq: You have not declared a breakpoint with a minimum value of 0. There may be screen sizes to which Vue3Mq does not respond.");return new Set(t.map((e=>e.min))).size<t.length&&console.warn("Vue3 Mq: Your breakpoint configuration contains duplicate values. Behaviour may be unpredictable."),0!==t.length&&t.sort(((e,t)=>e.min-t.min))};function R({breakpoints:e,preset:t}){const n=(e=>{if("string"==typeof e&&L[e])return L[e];{const t=Object.keys(L);return console.error(`Vue3 Mq: "${e}" is not a valid preset. Available options are: ${t.join(", ")}`),!1}})(t),a=T(e);if(!1===n&&!a)throw new TypeError("Vue3 Mq: You must provide a valid preset, or valid breakpoint settings.");var r;r=a||T(n),f.value=r,function(){for(;y.length>0;){const e=y.shift();if(e&&"object"==typeof e){const{mql:t,cb:n}=e;t.addEventListener&&"function"==typeof t.addEventListener?t.removeEventListener("change",n):t.removeListener(n);}}}(),(()=>{const e=Object.keys(h);for(let t of e)delete h[t];$(),V(),O();})();const o=k.value.reduce(((e,t,n,a)=>{const r=`(min-width: ${t.min}px)`,o=n<a.length-1?`(max-width: ${a[n+1].min-1}px)`:null,i=r+(o?" and "+o:"");return Object.assign(e,{[t.name]:i})}),{});for(const i in o){j(o[i],(()=>{$(i);}));}["portrait","landscape"].forEach((e=>{j(`(orientation: ${e})`,(()=>{V(e);}));})),["light","dark"].forEach((e=>{j(`(prefers-color-scheme: ${e})`,(()=>{O(e);}));}));}var N={install:(e,{preset:t="bootstrap5",breakpoints:n,defaultBreakpoint:a,defaultOrientation:r="landscape",defaultTheme:o}={})=>{try{const l=!1===["landscape","portrait"].includes(s=r)?(console.error(`Vue3 Mq: "${s}" is not a valid default orientation. Reverting to unset value.`),null):s,u=((e=null)=>!1===["dark","light"].includes(e)&&null!==e?(console.error(`Vue3 Mq: "${e}" is not a valid default theme. Reverting to unset value.`),null):e)(o);i=a,v.value=i,(e=>{m.value=e;})(l),(e=>{g.value=e;})(u),e.provide("mq",x),e.provide("updateBreakpoints",R),R({breakpoints:n,preset:t});}catch(l){console.error(l);}var i,s;}};
@@ -104,9 +104,11 @@ const defaultConfig = {
         },
     },
     quests: {},
+    audioTriggers: {},
 };
 
 function parserError(ctx, line, text) {
+    console.error(`Parser error: ${ctx.fileName}:${ctx.currentLine}`, text);
     const errorText = `[Parser Error] in <span class="error-filename">${ctx.fileName}:${line + 1}</span> - <b>${text}</b>`;
     error(errorText);
 }
@@ -3445,6 +3447,7 @@ const useAudio = defineStore('audio', {
 
 const audio = {};
 howler.Howler.volume(0.5);
+let audioTriggers = {};
 async function loadAudioAssets(config) {
     logger.log(`Loading audio`);
     const loadingPromises = [];
@@ -3473,8 +3476,16 @@ async function loadAudioAssets(config) {
         }
         loadingPromises.push(loadAudio(key, config.audio[key]));
     }
+    if (config.audioTriggers) {
+        audioTriggers = config.audioTriggers;
+    }
     return Promise.all(loadingPromises);
 }
+function audioEvent(event) {
+    if (audioTriggers[event]) {
+        playAudio(audioTriggers[event]);
+    }
+}
 async function loadAudio(key, config) {
     return new Promise((resolve, reject) => {
         logger.log(`Loading audio ${config.src}`);
@@ -3565,228 +3576,6 @@ function randomId() {
     return `${Date.now() - Math.floor(Math.random() * 99999999)}`;
 }
 
-// Generate a pinia store named notifications with a state using the type NotificationsState, and save type NotificationsSave, with actions:
-// addNotification(text: string): Adds a new notification to the state, and deletes it after a timeout
-// deleteNotification(id: string): Deletes a notification from the state
-const useNotifications = defineStore('notifications', {
-    state: () => ({ notifications: {} }),
-    actions: {
-        async addNotification(text) {
-            const id = `${Date.now()}-${Math.random() * 10000}`;
-            this.notifications[id] = {
-                text,
-            };
-            if (getConfig().notifications.alsoPrintInDialogue) {
-                writeText(`[NOTIFICATION] ${text}`);
-            }
-            await timeout(getConfig().notifications.timeOnScreen * 1000);
-            this.deleteNotification(id);
-        },
-        deleteNotification(id) {
-            delete this.notifications[id];
-        },
-    },
-});
-
-// create a pinia store named inventory with a state containing items and actions to add and delete items
-// create a pinia store named inventory with a state of type ItemState and actions to add and delete items. Adding items should increase the amount of any existing item that matches the id.
-const useInventory = defineStore('inventory', {
-    state: () => ({
-        items: {},
-        interactionTags: {},
-    }),
-    actions: {
-        generateSaveData() {
-            return {
-                items: this.items,
-                interactionTags: this.interactionTags,
-            };
-        },
-        loadSaveData(save) {
-            this.items = { ...this.items, ...save.items };
-            this.interactionTags = { ...save.interactionTags };
-        },
-        setupItems(items) {
-            Object.keys(items).forEach((key) => {
-                this.items[key] = {
-                    amount: 0,
-                    id: key,
-                };
-            });
-        },
-        getExistingItem(id) {
-            return this.items[id];
-        },
-        getItemAmount(id) {
-            return this.getExistingItem(id)?.amount || 0;
-        },
-        add(item) {
-            const existingItem = this.getExistingItem(item.id);
-            if (existingItem) {
-                existingItem.amount += item.amount;
-            }
-            else {
-                this.items[item.id] = { ...item };
-            }
-            useNotifications().addNotification(`Received item: ${getItemConfig(item.id).name} x ${item.amount}`);
-        },
-        enableInteraction(tag) {
-            if (!tag) {
-                tag = 'default';
-            }
-            this.interactionTags[tag] = {
-                blockedInteraction: false,
-            };
-        },
-        disableInteraction(tag) {
-            if (!tag) {
-                tag = 'default';
-            }
-            this.interactionTags[tag] = {
-                blockedInteraction: true,
-            };
-        },
-        onScriptStart() {
-            const tags = getConfig().interactionTags;
-            Object.keys(tags).forEach((tag) => {
-                const conf = tags[tag];
-                if (conf.onlyInteractOutsideOfScripts) {
-                    this.disableInteraction(tag);
-                }
-            });
-        },
-        onScriptEnd() {
-            const tags = getConfig().interactionTags;
-            Object.keys(tags).forEach((tag) => {
-                const conf = tags[tag];
-                if (conf.onlyInteractOutsideOfScripts) {
-                    this.enableInteraction(tag);
-                }
-            });
-        },
-        isInteractionTagBlocked(tag) {
-            if (!tag) {
-                tag = 'default';
-            }
-            if (this.interactionTags[tag]) {
-                return this.interactionTags[tag].blockedInteraction;
-            }
-            return false;
-        },
-        remove(item) {
-            const existingItem = this.getExistingItem(item.id);
-            if (existingItem) {
-                existingItem.amount -= item.amount;
-                useNotifications().addNotification(`Lost item: ${getItemConfig(item.id).name} x ${item.amount}`);
-                if (existingItem.amount <= 0) {
-                    this.deleteItem(item.id);
-                }
-            }
-        },
-        deleteItem(id) {
-            const existingItem = this.getExistingItem(id);
-            if (existingItem) {
-                this.items[id].amount = 0;
-            }
-        },
-    },
-});
-
-const everyObject = (object, predicate) => {
-    for (const key in object) {
-        if (!predicate(object[key])) {
-            return false;
-        }
-    }
-    return true;
-};
-const filterObject = (object, predicate) => {
-    const result = {};
-    for (const key in object) {
-        if (predicate(object[key])) {
-            result[key] = object[key];
-        }
-    }
-    return result;
-};
-
-const useQuests = defineStore('quests', {
-    state: () => ({
-        quests: {},
-    }),
-    actions: {
-        getQuest(questId) {
-            const quest = this.quests[questId];
-            if (quest) {
-                return quest;
-            }
-            error(`Quest ${questId} doesn't exist!`);
-        },
-        getObjective(quest, objectiveId) {
-            const questObjective = this.getQuest(quest).objectives[objectiveId];
-            if (questObjective) {
-                return questObjective;
-            }
-            error(`Objective ${objectiveId} doesn't exist in quest ${quest}!`);
-        },
-        setupQuests(quests) {
-            // iterate through quests to generate quest states to add to this.quests object
-            for (const key of Object.keys(quests)) {
-                const data = quests[key];
-                this.quests[key] = {
-                    id: key,
-                    state: 'hidden',
-                    objectives: {},
-                };
-                // iterate through data.objectives to populate the objectives array of this.quests[key]
-                for (const objectiveKey of Object.keys(data.objectives)) {
-                    const objective = data.objectives[objectiveKey];
-                    this.quests[key].objectives[objectiveKey] = {
-                        id: objectiveKey,
-                        state: objective.hidden ? 'hidden' : 'unlocked',
-                    };
-                }
-            }
-        },
-        startQuest(questId) {
-            this.getQuest(questId).state = 'unlocked';
-            useNotifications().addNotification(`Started quest: ${getQuestConfig(questId).title}`);
-        },
-        startObjective(questId, objectiveId) {
-            this.getObjective(questId, objectiveId).state = 'unlocked';
-            useNotifications().addNotification(`New quest objective: ${getObjectiveConfig(questId, objectiveId).description}`);
-        },
-        completeObjective(questId, objectiveId) {
-            this.getObjective(questId, objectiveId).state = 'completed';
-            useNotifications().addNotification(`Objective completed!`);
-        },
-        completeQuest(questId, ending) {
-            this.getQuest(questId).state = 'completed';
-            if (ending) {
-                this.getQuest(questId).ending = ending;
-            }
-            useNotifications().addNotification(`Quest completed: ${getQuestConfig(questId).title}`);
-        },
-        isQuestCompleted(questId) {
-            const quest = this.getQuest(questId);
-            return everyObject(quest.objectives, (objective) => objective.state === 'completed');
-        },
-        removeQuest(id) {
-            delete this.quests[id];
-        },
-        generateSaveData() {
-            return {
-                quests: {
-                    ...this.quests,
-                },
-            };
-        },
-        loadSaveData(data) {
-            this.quests = data.quests;
-        },
-    },
-});
-
 var isMergeableObject = function isMergeableObject(value) {
 	return isNonNullObject(value)
 		&& !isSpecial(value)
@@ -3919,6 +3708,29 @@ var deepmerge_1 = deepmerge;
 
 var cjs = deepmerge_1;
 
+// Generate a pinia store named notifications with a state using the type NotificationsState, and save type NotificationsSave, with actions:
+// addNotification(text: string): Adds a new notification to the state, and deletes it after a timeout
+// deleteNotification(id: string): Deletes a notification from the state
+const useNotifications = defineStore('notifications', {
+    state: () => ({ notifications: {} }),
+    actions: {
+        async addNotification(text) {
+            const id = `${Date.now()}-${Math.random() * 10000}`;
+            this.notifications[id] = {
+                text,
+            };
+            if (getConfig().notifications.alsoPrintInDialogue) {
+                writeText(`[NOTIFICATION] ${text}`);
+            }
+            await timeout(getConfig().notifications.timeOnScreen * 1000);
+            this.deleteNotification(id);
+        },
+        deleteNotification(id) {
+            delete this.notifications[id];
+        },
+    },
+});
+
 // Create a pinia store named skills with a state using the type Skills, with actions:
 // setupSkillCheck(skillCheck: SkillCheckState, id: string)
 // passSkillCheck(skillCheckId: string)
@@ -3937,13 +3749,19 @@ const useSkills = defineStore('skills', {
         setupSkillCheck(skillCheck, id) {
             this.skillChecks[id] = skillCheck;
         },
-        passSkillCheck(skillCheckId) {
-            this.skillChecks[skillCheckId].passed = true;
-            this.skillChecks[skillCheckId].available = false;
+        passSkillCheck(skillCheckId, hide) {
+            this.skillChecks[skillCheckId].happened = true;
+            this.skillChecks[skillCheckId].succeeded = true;
+            if (hide) {
+                this.skillChecks[skillCheckId].hidden = true;
+            }
         },
-        failSkillCheck(skillCheckId) {
-            this.skillChecks[skillCheckId].passed = false;
-            this.skillChecks[skillCheckId].available = false;
+        failSkillCheck(skillCheckId, hide) {
+            this.skillChecks[skillCheckId].happened = true;
+            this.skillChecks[skillCheckId].succeeded = false;
+            if (hide) {
+                this.skillChecks[skillCheckId].hidden = true;
+            }
         },
         generateSaveData() {
             return {
@@ -3951,6 +3769,20 @@ const useSkills = defineStore('skills', {
                 skills: this.skills,
             };
         },
+        getSkillCheck(id) {
+            if (!this.skillChecks[id]) {
+                this.setupSkillCheck(this.createSkillCheckState(), id);
+            }
+            return this.skillChecks[id];
+        },
+        createSkillCheckState() {
+            const skillCheck = {
+                happened: false,
+                succeeded: false,
+                hidden: false,
+            };
+            return skillCheck;
+        },
         loadSaveData(data) {
             this.skillChecks = cjs(this.skillChecks, data.skillChecks);
             this.skills = cjs(this.skills, data.skills);
@@ -4009,8 +3841,266 @@ function getFile(url) {
     });
 }
 
-// Create a pinia store named screens with a state using the type ScreenState, with actions:
-// setScreen(screen: string): Sets the current screen to the given screen
+// Create a pinia store named hud with a state using the type HudState, and save type HudSave, with actions:
+// setupHudStats(stats: { [key: string]: HudStatConfig }): Iterates the stats argument to add new stats to the state
+// setStat(stat: string, value: number): Sets the value of a stat
+// addStat(stat: string, value: number): Adds a value to a stat
+// generateSaveData(): Function that generates a HudSave object from the data in the state
+// loadSaveData(data: HudSave): Function that loads the data into the state
+const useHud = defineStore('hud', {
+    state: () => ({
+        hudStats: {},
+    }),
+    actions: {
+        setupHudStats(stats) {
+            for (const stat in stats) {
+                this.hudStats[stat] = {
+                    value: stats[stat].startingValue,
+                };
+            }
+        },
+        setStat(stat, value) {
+            this.hudStats[stat].value = value;
+        },
+        addStat(stat, value) {
+            this.hudStats[stat].value += value;
+        },
+        getStat(stat) {
+            return this.hudStats[stat];
+        },
+        getStatValue(stat) {
+            return this.hudStats[stat].value;
+        },
+        generateSaveData() {
+            return {
+                hudStats: this.hudStats,
+            };
+        },
+        loadSaveData(data) {
+            this.hudStats = cjs(this.hudStats, data.hudStats);
+        },
+    },
+});
+
+// create a pinia store named inventory with a state containing items and actions to add and delete items
+// create a pinia store named inventory with a state of type ItemState and actions to add and delete items. Adding items should increase the amount of any existing item that matches the id.
+const useInventory = defineStore('inventory', {
+    state: () => ({
+        items: {},
+        interactionTags: {},
+    }),
+    actions: {
+        generateSaveData() {
+            return {
+                items: this.items,
+                interactionTags: this.interactionTags,
+            };
+        },
+        loadSaveData(save) {
+            this.items = { ...this.items, ...save.items };
+            this.interactionTags = { ...save.interactionTags };
+        },
+        setupItems(items) {
+            Object.keys(items).forEach((key) => {
+                this.items[key] = {
+                    amount: 0,
+                    id: key,
+                };
+            });
+        },
+        hasItem(itemId, amount) {
+            if (!amount) {
+                amount = 1;
+            }
+            return this.items[itemId]?.amount >= amount;
+        },
+        getExistingItem(id) {
+            return this.items[id];
+        },
+        getItemAmount(id) {
+            return this.getExistingItem(id)?.amount || 0;
+        },
+        add(item) {
+            const existingItem = this.getExistingItem(item.id);
+            if (existingItem) {
+                existingItem.amount += item.amount;
+            }
+            else {
+                this.items[item.id] = { ...item };
+            }
+            useNotifications().addNotification(`Received item: ${getItemConfig(item.id).name} x ${item.amount}`);
+        },
+        enableInteraction(tag) {
+            if (!tag) {
+                tag = 'default';
+            }
+            this.interactionTags[tag] = {
+                blockedInteraction: false,
+            };
+        },
+        disableInteraction(tag) {
+            if (!tag) {
+                tag = 'default';
+            }
+            this.interactionTags[tag] = {
+                blockedInteraction: true,
+            };
+        },
+        onScriptStart() {
+            const tags = getConfig().interactionTags;
+            Object.keys(tags).forEach((tag) => {
+                const conf = tags[tag];
+                if (conf.onlyInteractOutsideOfScripts) {
+                    this.disableInteraction(tag);
+                }
+            });
+        },
+        onScriptEnd() {
+            const tags = getConfig().interactionTags;
+            Object.keys(tags).forEach((tag) => {
+                const conf = tags[tag];
+                if (conf.onlyInteractOutsideOfScripts) {
+                    this.enableInteraction(tag);
+                }
+            });
+        },
+        isInteractionTagBlocked(tag) {
+            if (!tag) {
+                tag = 'default';
+            }
+            if (this.interactionTags[tag]) {
+                return this.interactionTags[tag].blockedInteraction;
+            }
+            return false;
+        },
+        remove(item) {
+            const existingItem = this.getExistingItem(item.id);
+            if (existingItem) {
+                existingItem.amount -= item.amount;
+                useNotifications().addNotification(`Lost item: ${getItemConfig(item.id).name} x ${item.amount}`);
+                if (existingItem.amount <= 0) {
+                    this.deleteItem(item.id);
+                }
+            }
+        },
+        deleteItem(id) {
+            const existingItem = this.getExistingItem(id);
+            if (existingItem) {
+                this.items[id].amount = 0;
+            }
+        },
+    },
+});
+
+const everyObject = (object, predicate) => {
+    for (const key in object) {
+        if (!predicate(object[key])) {
+            return false;
+        }
+    }
+    return true;
+};
+const filterObject = (object, predicate) => {
+    const result = {};
+    for (const key in object) {
+        if (predicate(object[key])) {
+            result[key] = object[key];
+        }
+    }
+    return result;
+};
+
+const useQuests = defineStore('quests', {
+    state: () => ({
+        quests: {},
+    }),
+    actions: {
+        getQuest(questId) {
+            const quest = this.quests[questId];
+            if (quest) {
+                return quest;
+            }
+            error(`Quest ${questId} doesn't exist!`);
+        },
+        getObjective(quest, objectiveId) {
+            const questObjective = this.getQuest(quest).objectives[objectiveId];
+            if (questObjective) {
+                return questObjective;
+            }
+            error(`Objective ${objectiveId} doesn't exist in quest ${quest}!`);
+        },
+        setupQuests(quests) {
+            // iterate through quests to generate quest states to add to this.quests object
+            for (const key of Object.keys(quests)) {
+                const data = quests[key];
+                this.quests[key] = {
+                    id: key,
+                    state: 'hidden',
+                    objectives: {},
+                };
+                // iterate through data.objectives to populate the objectives array of this.quests[key]
+                for (const objectiveKey of Object.keys(data.objectives)) {
+                    const objective = data.objectives[objectiveKey];
+                    this.quests[key].objectives[objectiveKey] = {
+                        id: objectiveKey,
+                        state: objective.hidden ? 'hidden' : 'unlocked',
+                    };
+                }
+            }
+        },
+        startQuest(questId) {
+            this.getQuest(questId).state = 'unlocked';
+            useNotifications().addNotification(`Started quest: ${getQuestConfig(questId).title}`);
+        },
+        startObjective(questId, objectiveId) {
+            this.getObjective(questId, objectiveId).state = 'unlocked';
+            useNotifications().addNotification(`New quest objective: ${getObjectiveConfig(questId, objectiveId).description}`);
+        },
+        completeObjective(questId, objectiveId) {
+            this.getObjective(questId, objectiveId).state = 'completed';
+            useNotifications().addNotification(`Objective completed!`);
+        },
+        completeQuest(questId, ending) {
+            this.getQuest(questId).state = 'completed';
+            if (ending) {
+                this.getQuest(questId).ending = ending;
+            }
+            useNotifications().addNotification(`Quest completed: ${getQuestConfig(questId).title}`);
+        },
+        isQuestCompleted(questId) {
+            const quest = this.getQuest(questId);
+            return everyObject(quest.objectives, (objective) => objective.state === 'completed');
+        },
+        isObjectiveCompleted(questId, objectiveId) {
+            const objective = this.getObjective(questId, objectiveId);
+            return objective.state === 'completed';
+        },
+        isQuestStarted(questId) {
+            const quest = this.getQuest(questId);
+            return quest.state === 'unlocked';
+        },
+        isObjectiveStarted(questId, objectiveId) {
+            const objective = this.getObjective(questId, objectiveId);
+            return objective.state === 'unlocked';
+        },
+        removeQuest(id) {
+            delete this.quests[id];
+        },
+        generateSaveData() {
+            return {
+                quests: {
+                    ...this.quests,
+                },
+            };
+        },
+        loadSaveData(data) {
+            this.quests = data.quests;
+        },
+    },
+});
+
+// Create a pinia store named screens with a state using the type ScreenState, with actions:
+// setScreen(screen: string): Sets the current screen to the given screen
 // setButtons(buttons: { [key: string]: ButtonConfig }): Adds buttons to the buttons state by using the values in the buttons config object
 // changeButton(button: string, newValue: boolean): Changes the value of a button in the buttons state
 // generateSaveData(): Function that generates a ScreenState object from the data in the state
@@ -4063,6 +4153,25 @@ function findDataHelper(sourceObj, path) {
     key = keys[i];
     return [obj, key];
 }
+function findDataHelperWithoutAutoCreate(sourceObj, path) {
+    const keys = path.split('.');
+    let obj = sourceObj;
+    const end = keys.length - 1;
+    let key = keys[0];
+    let i = 0;
+    for (i = 0; i < end; i++) {
+        key = keys[i];
+        if (!obj[key]) {
+            obj[key] = {};
+        }
+        obj = obj[key];
+    }
+    key = keys[i];
+    if (typeof obj[key] === 'undefined') {
+        obj[key] = null;
+    }
+    return [obj, key];
+}
 function setDataHelper(sourceObj, path, value) {
     const [obj, key] = findDataHelper(sourceObj, path);
     obj[key] = value;
@@ -4077,44 +4186,78 @@ function getModifiableDataPinia() {
     const skills = useSkills();
     const screens = useScreens();
     const inventory = useInventory();
-    return {
+    const scope = useVM().currentScope;
+    const state = {
         data: vm.data,
         skills: skills.skills,
         buttons: screens.buttons,
         items: inventory.items,
         quests: useQuests().quests,
+        stats: useHud().hudStats,
+        scope,
     };
+    const proxy = new Proxy(state, {
+        get: (target, prop, receiver) => {
+            const scope = useVM().currentScope;
+            if (typeof scope[prop] !== 'undefined') {
+                return scope[prop];
+            }
+            return Reflect.get(target, prop, receiver);
+        },
+        set: (target, prop, value, receiver) => {
+            const scope = useVM().currentScope;
+            if (typeof scope[prop] !== 'undefined') {
+                scope[prop] = value;
+                return scope[prop];
+            }
+            return Reflect.set(target, prop, value, receiver);
+        },
+    });
+    return proxy;
 }
 
+const loggerManager = new LogManager();
+loggerManager.setupDebugger(false);
+const logger$1 = loggerManager.logger;
 function parseScript(errorHandler, code, fileName) {
     const ctx = {
         fileName,
+        currentLine: 0,
         error: (line, text) => errorHandler(ctx, line, text),
         processCommandsFunction: processCommands,
         indentSize: 0, // Will be overriden soon
     };
     ctx.indentSize = detectIndentation(ctx, code);
     const lines = findLines(ctx, code);
-    logger.log(lines);
+    ctx.currentLine = 0;
+    logger$1.log(lines);
     const script = {};
     for (const line of lines) {
         if (line.code.search(':') === -1) {
             ctx.error(line.line, `First indentation level should only be used to specify labels`);
         }
-        const labelName = line.code.replace(':', '');
+        const labelString = line.code.replace(':', '');
+        const labelWords = labelString.split(/ +/g);
+        const labelName = labelWords[0];
+        const labelArgs = labelWords.slice(1);
         if (!line.branch) {
             ctx.error(line.line, `This line should have a branch but doesn't`);
         }
-        script[labelName] = processCommands(ctx, line.branch, undefined);
+        script[labelName] = {
+            branch: processCommands(ctx, line.branch, undefined),
+            args: labelArgs,
+        };
     }
     return script;
 }
 function processCommands(ctx, lines, parentLine) {
+    const startLine = ctx.currentLine;
     const branchContext = {
         processCommandsFunction: processCommands,
         parserContext: ctx,
         lines,
         currentLine: 0,
+        line: lines[0],
     };
     const branch = [];
     if (!lines) {
@@ -4127,29 +4270,58 @@ function processCommands(ctx, lines, parentLine) {
     }
     while (branchContext.currentLine < lines.length) {
         const line = lines[branchContext.currentLine];
-        const operator = line.operator;
-        const args = line.args;
-        const command = {
-            code: line.code,
-            operator,
-            args,
-            line: line.line,
-            fileName: ctx.fileName,
-        };
         branchContext.line = line;
-        branchContext.command = command;
-        const commandPlugin = vm.commands[operator];
+        const parsed = parseExpression(ctx, line, line.expression);
+        const commandPlugin = vm.commands[parsed.command.operator];
         let parseFunction = commandPlugin?.parser;
         if (!parseFunction) {
             // default to text function
             parseFunction = vm.commands.text.parser;
         }
-        parseFunction(branchContext);
-        branch.push(command);
+        logger$1.log(vm.commands.text);
+        const { newLine } = parseFunction(branchContext, parsed);
+        branchContext.currentLine = newLine;
+        ctx.currentLine = startLine + newLine;
+        branch.push(parsed);
     }
     return branch;
 }
-function parseValue(value) {
+function parseExpression(ctx, line, expression) {
+    logger$1.log(expression);
+    if (typeof expression[0] !== 'string') {
+        ctx.error(line.line, `Expression operator should be a string`);
+    }
+    const parsed = {
+        code: line.code,
+        fileName: ctx.fileName,
+        line: line.line,
+        command: {
+            commandType: expression[0],
+            operator: expression[0],
+            args: expression.slice(1).map((arg) => parseArgument(ctx, line, arg)),
+            options: {},
+        },
+    };
+    const firstElement = expression[0];
+    const command = vm.commands[firstElement];
+    if (!command) {
+        const otherKeywords = ['else', 'success', 'failure'];
+        if (!isParsedTokenString(firstElement) &&
+            !otherKeywords.includes(firstElement)) {
+            ctx.error(line.line, `Unknown command ${firstElement}`);
+        }
+    }
+    return parsed;
+}
+function parseArgument(ctx, line, argument) {
+    if (Array.isArray(argument)) {
+        return parseExpression(ctx, line, argument);
+    }
+    else {
+        return argument;
+    }
+}
+function parseTokenToPrimitive(value) {
     if (value === 'true') {
         return true;
     }
@@ -4159,26 +4331,18 @@ function parseValue(value) {
     else if (!isNaN(Number(value))) {
         return Number(value);
     }
-    else if (value.charAt(0) === '"') {
-        return value.substr(1, value.length - 2);
-    }
-    else {
-        return value;
-    }
+    return value;
 }
-function parseCodeLine(codeToProcess) {
+function parseCodeLine(ctx, codeToProcess) {
     if (codeToProcess.charAt(codeToProcess.length - 1) === ':') {
         codeToProcess = codeToProcess.substr(0, codeToProcess.length - 1);
     }
-    let code = codeToProcess;
-    let ifWords = [];
-    const ifIndex = codeToProcess.search(/\$if/g);
-    // If we find a code block, everything after is code and won't be looked it
-    // TODO: Generalise for other code operators
-    if (ifIndex !== -1) {
-        code = codeToProcess.substr(0, ifIndex);
-        ifWords = ['if', codeToProcess.substr(ifIndex + 3)];
-    }
+    const tokens = parseCodeLineIntoTokens(codeToProcess);
+    const [expression] = tokensToExpression(ctx, tokens);
+    return expression;
+}
+function parseCodeLineIntoTokens(code) {
+    // Finds strings and processes the code around them to get all tokens
     const regex = /(["'])(?:\\\1|.)*?\1/g;
     const matches = [];
     let match;
@@ -4186,26 +4350,92 @@ function parseCodeLine(codeToProcess) {
         matches.push(match);
     }
     let currentIndex = 0;
-    let words = [];
+    let tokens = [];
     for (const match of matches) {
+        // For each string match, process the code before it to add all tokens
         const index = match.index;
         if (index > currentIndex) {
             const inBetween = code.substr(currentIndex, index - currentIndex);
-            const newWords = inBetween.split(' ').filter((word) => word);
-            words = [...words, ...newWords];
+            const newTokens = splitIntoTokens(inBetween);
+            tokens = [...tokens, ...newTokens];
         }
         // Remove backticks for escaped quotes
         const finalMatch = match[0].replace(/\\/g, '');
-        words.push(finalMatch);
+        tokens.push(`$$"${finalMatch.substring(1, finalMatch.length - 1)}`);
         currentIndex = index + match[0].length;
     }
-    const newWords = code
-        .substr(currentIndex)
-        .split(' ')
-        .filter((code) => code);
-    words = [...words, ...newWords, ...ifWords];
-    words.forEach((word, index) => (words[index] = parseValue(word)));
-    return words;
+    // Process the last tokens from after the last string
+    tokens = [...tokens, ...splitIntoTokens(code.substr(currentIndex))];
+    // Adding a closing parenthesis at the end of the line so users don't have to
+    tokens.push(')');
+    return tokens;
+}
+// Splits a chunk of code (without strings) into tokens
+function splitIntoTokens(code) {
+    code = code.replace(/: *$/g, '');
+    let result = code.split(' ').filter((el) => el);
+    result = result.reduce((total, curr) => [...total, ...curr.split(/(\(|\))/g)].filter((el) => el && el), []);
+    return result.map((token) => parseTokenToPrimitive(token));
+}
+function tokensToExpression(ctx, tokens) {
+    logger$1.log('===============');
+    let expression = [];
+    let cursor = 0;
+    // Find sub expressions inside this expression
+    let parenthesisIndex = findExpressionStart(tokens) + cursor;
+    let parenthesisEndIndex = findExpressionEnd(tokens) + cursor;
+    logger$1.log(`Parsing expression: ${tokens}`);
+    logger$1.log(`Parenthesis start index: ${parenthesisIndex} - end: ${parenthesisEndIndex}`);
+    while (parenthesisIndex !== -1 && parenthesisEndIndex > parenthesisIndex) {
+        // Add everything before the sub expression
+        expression = [...expression, ...tokens.slice(cursor, parenthesisIndex)];
+        const subExpressionString = tokens.slice(parenthesisIndex + 1);
+        logger$1.log(`Found a sub expression. Before: ${expression} - After: ${subExpressionString}`);
+        cursor = parenthesisIndex;
+        // Process the sub expression
+        const [subExpression, subExpressionLength] = tokensToExpression(ctx, subExpressionString);
+        const subExpressionEndIndex = cursor + subExpressionLength;
+        expression.push(subExpression);
+        cursor = subExpressionEndIndex + 1;
+        const restOfString = tokens.slice(cursor);
+        logger$1.log(`Sub expression came back: ${subExpression} - rest of string: ${restOfString}`);
+        // Find the next sub expression, if any
+        parenthesisIndex = findExpressionStart(restOfString);
+        if (parenthesisIndex !== -1) {
+            parenthesisIndex += cursor;
+        }
+        parenthesisEndIndex = findExpressionEnd(restOfString);
+        if (parenthesisEndIndex !== -1) {
+            parenthesisEndIndex += cursor;
+        }
+    }
+    if (parenthesisEndIndex !== -1) {
+        logger$1.log(`Found parenthesis end before new opening parenthesis, close this expression`);
+    }
+    // Find the end of the current expression
+    const endIndex = findExpressionEnd(tokens.slice(cursor)) + cursor;
+    if (endIndex === -1) {
+        ctx.error(ctx.currentLine, `Expression is not closed (missing ")" closing parenthesis)`);
+        return [expression, endIndex];
+    }
+    const restOfString = tokens.slice(cursor, endIndex);
+    logger$1.log(`End of expression: ${endIndex} - ${restOfString}`);
+    logger$1.log('===================');
+    // Add the remaining tokens to the expression
+    expression = [...expression, ...restOfString];
+    validateExpression(ctx, expression);
+    return [expression, endIndex + 1];
+}
+function validateExpression(ctx, expression) {
+    if (expression.length < 1) {
+        ctx.error(ctx.currentLine, `Expression is empty`);
+    }
+}
+function findExpressionStart(tokens) {
+    return tokens.findIndex((token) => token === '(');
+}
+function findExpressionEnd(tokens) {
+    return tokens.findIndex((token) => token === ')');
 }
 function findLines(ctx, data) {
     const code = data.split(/\r?\n|$/).map((line) => {
@@ -4228,11 +4458,12 @@ function findBranches(ctx, code, startLine, indentLevel) {
         }
         let lineText = code[currentLine];
         if (lineText.search(/^\s*$/) !== -1) {
+            // Ignore empty lines
             currentLine++;
         }
         else {
             const lineIndent = getIndentLevel(ctx, lineText);
-            lineText = lineText.substr(lineIndent * ctx.indentSize);
+            lineText = lineText.substring(lineIndent * ctx.indentSize);
             validateIndent(ctx, lineIndent, currentLine);
             if (lineIndent < indentLevel) {
                 stillInBranch = false;
@@ -4246,16 +4477,16 @@ function findBranches(ctx, code, startLine, indentLevel) {
                 currentLine = branchLines.endLine;
             }
             else {
-                const words = parseCodeLine(lineText);
+                const expression = parseCodeLine(ctx, lineText);
                 const line = {
                     code: lineText,
                     indentation: lineIndent,
                     line: currentLine,
-                    operator: words[0],
-                    args: words.slice(1),
+                    expression,
                 };
                 lines.push(line);
                 currentLine++;
+                ctx.currentLine = currentLine;
             }
         }
     }
@@ -4278,7 +4509,7 @@ function detectIndentation(ctx, script) {
     if (result.length < 2) {
         ctx.error(0, `Can't detect indentation level. Make sure you indent with at least 2 spaces and consistently`);
     }
-    logger.log(result);
+    logger$1.log(result);
     return result[1].length;
 }
 
@@ -4301,6 +4532,7 @@ const useVM = defineStore('vm', {
         lastLabel: 'main',
         script: {},
         labelStack: ['main'],
+        currentScope: {},
     }),
     actions: {
         generateSaveData() {
@@ -4313,6 +4545,26 @@ const useVM = defineStore('vm', {
             this.lastLabel = data.lastLabel;
             this.data = data.data;
         },
+        resetScope() {
+            this.currentScope = {};
+        },
+        setReturnValue(value) {
+            this.currentStack.returnValue = value;
+        },
+        removeFromScope(vars) {
+            for (const varName of vars) {
+                delete this.currentScope[varName];
+            }
+        },
+        addScopedVariable(key, value) {
+            this.currentScope[key] = value;
+            if (this.currentStack) {
+                this.currentStack.scope[key] = value;
+            }
+        },
+        extendScope(scope) {
+            Object.assign(this.currentScope, scope);
+        },
         async loadScripts(scriptPaths) {
             const filePromises = [];
             for (const path of scriptPaths) {
@@ -4333,13 +4585,20 @@ const useVM = defineStore('vm', {
             this.setScript(scripts);
         },
         start() {
-            this.stack = [
-                {
-                    currentIndex: 0,
-                    branch: this.script.main,
-                    label: 'main',
+            this.setStack({
+                currentIndex: 0,
+                branchData: {
+                    branch: this.script.main.branch,
+                },
+                label: 'main',
+            });
+            this.setStack({
+                currentIndex: 0,
+                branchData: {
+                    branch: this.script.main.branch,
                 },
-            ];
+                label: 'main',
+            });
         },
         setLastLabel(label) {
             this.lastLabel = label;
@@ -4347,9 +4606,11 @@ const useVM = defineStore('vm', {
         reset() {
             this.stack = [];
             this.data = {};
-            this.stack.push({
+            this.setStack({
                 currentIndex: 0,
-                branch: this.script.main,
+                branchData: {
+                    branch: this.script.main.branch,
+                },
                 label: 'main',
             });
         },
@@ -4360,9 +4621,30 @@ const useVM = defineStore('vm', {
             this.data = data;
         },
         setStack(stack) {
+            this.resetScope();
             this.stack = [];
+            const newStack = this.stackOptionsToStack(stack);
             this.lastLabel = stack.label;
-            this.stack.push(stack);
+            this.stack.push(newStack);
+        },
+        stackOptionsToStack(stack) {
+            const newStack = {
+                ...stack,
+                scope: {},
+                returnValue: null,
+            };
+            if (stack.scope) {
+                newStack.scope = stack.scope;
+            }
+            if (stack.args && stack.branchData.args) {
+                for (const [index, argName] of stack.branchData.args.entries()) {
+                    if (stack.args.length > index) {
+                        newStack.scope[argName] = stack.args[index];
+                    }
+                }
+            }
+            this.extendScope(newStack.scope || {});
+            return newStack;
         },
         setData(path, value) {
             const dataToModify = getModifiableDataPinia();
@@ -4372,10 +4654,11 @@ const useVM = defineStore('vm', {
             const dataToModify = getModifiableDataPinia();
             addDataHelper(dataToModify, path, value);
         },
-        addStack(newStack) {
-            if (!newStack.label) {
-                newStack.label = this.currentStack.label;
+        addStack(newStackOptions) {
+            if (!newStackOptions.label) {
+                newStackOptions.label = this.currentStack.label;
             }
+            const newStack = this.stackOptionsToStack(newStackOptions);
             this.stack.push(newStack);
             return this.runLine();
         },
@@ -4385,13 +4668,12 @@ const useVM = defineStore('vm', {
                 return;
             }
             if (this.currentStack.currentIndex <
-                this.currentStack.branch.length - 1) {
+                this.currentStack.branchData.branch.length - 1) {
                 this.currentStack.currentIndex++;
             }
             else {
-                this.previousStack();
+                return this.previousStack();
                 // This branch is finished, go back to previous stack
-                return this.nextLine();
             }
             if (this.stack.length === 0) {
                 this.finishGame();
@@ -4401,8 +4683,17 @@ const useVM = defineStore('vm', {
             }
             this.currentStack.currentIndex++;
         },
-        previousStack() {
+        async previousStack() {
+            const previousScope = this.currentStack.scope;
+            this.removeFromScope(Object.keys(previousScope));
+            const { returnValue, onComplete } = this.currentStack;
             this.stack.splice(this.stack.length - 1, 1);
+            if (onComplete) {
+                onComplete(returnValue);
+            }
+            else {
+                return this.nextLine();
+            }
         },
         finishGame() {
             useInventory().onScriptEnd();
@@ -4416,38 +4707,41 @@ const useVM = defineStore('vm', {
             }
         },
         async runLine() {
-            const cmd = this.currentLine;
+            const expression = this.currentLine;
             useInventory().onScriptStart();
-            await runCommand(cmd);
+            await runCommand(expression);
         },
-        async runLabelFunction(label, comeBackToSameLine) {
-            if (comeBackToSameLine) {
-                this.currentStack.currentIndex--;
-            }
-            const branch = this.script[label];
-            if (!branch) {
-                console.error(`Label ${branch} doesn't exist`);
-            }
-            const stack = {
-                currentIndex: 0,
-                branch: branch,
-                label,
-            };
-            await this.addStack(stack);
+        runLabelFunction(label, ...args) {
+            return new Promise((resolve, reject) => {
+                const branchData = this.script[label];
+                if (!branchData) {
+                    console.error(`Label ${label} doesn't exist`);
+                }
+                // TODO: Inject args
+                const stack = {
+                    currentIndex: 0,
+                    branchData: branchData,
+                    label,
+                    args,
+                    onComplete: (returnValue) => {
+                        resolve(returnValue);
+                    },
+                };
+                this.addStack(stack);
+            });
         },
-        runLabel(label) {
-            const branch = this.script[label];
-            if (!branch) {
-                console.error(`Label ${branch} doesn't exist`);
+        runLabel(label, ...args) {
+            const branchData = this.script[label];
+            if (!branchData) {
+                console.error(`Label ${branchData} doesn't exist`);
             }
             this.setLastLabel(label);
-            this.stack = [
-                {
-                    currentIndex: 0,
-                    branch,
-                    label,
-                },
-            ];
+            this.setStack({
+                currentIndex: 0,
+                branchData,
+                args,
+                label,
+            });
             this.runLine();
         },
     },
@@ -4458,7 +4752,7 @@ const useVM = defineStore('vm', {
         },
         currentLine() {
             const currentStack = this.currentStack;
-            return currentStack.branch[currentStack.currentIndex];
+            return currentStack.branchData.branch[currentStack.currentIndex];
         },
     },
 });
@@ -4468,16 +4762,20 @@ function processText(text) {
     const skillStore = useSkills();
     return text.replace(/%{[^}]*}/g, (match) => {
         const key = match.substr(2, match.length - 3);
-        const searchableState = {
-            data: vmStore.data,
-            skills: skillStore.skills,
-            items: useInventory().items,
-            quests: useQuests().quests,
-        };
+        const searchableState = getModifiableDataPinia();
         const [obj, newKey] = findDataHelper(searchableState, key);
         return obj[newKey];
     });
-}
+}
+const stringRegex = /\$\$"/;
+const isParsedTokenString = (arg) => {
+    if (typeof arg === 'string') {
+        if (arg.search(stringRegex) === 0) {
+            return true;
+        }
+    }
+    return false;
+};
 
 // Create a pinia store named dialog with a state using the type DialogState, with actions addDialog and clearDialog
 const useDialogStore = defineStore('dialog', {
@@ -4515,57 +4813,6 @@ const useDialogStore = defineStore('dialog', {
     },
 });
 
-// Create a pinia store named hud with a state using the type HudState, and save type HudSave, with actions:
-// setupHudStats(stats: { [key: string]: HudStatConfig }): Iterates the stats argument to add new stats to the state
-// setStat(stat: string, value: number): Sets the value of a stat
-// addStat(stat: string, value: number): Adds a value to a stat
-// generateSaveData(): Function that generates a HudSave object from the data in the state
-// loadSaveData(data: HudSave): Function that loads the data into the state
-const useHud = defineStore('hud', {
-    state: () => ({
-        hudStats: {},
-    }),
-    actions: {
-        setupHudStats(stats) {
-            for (const stat in stats) {
-                this.hudStats[stat] = {
-                    value: stats[stat].startingValue,
-                };
-            }
-        },
-        setStat(stat, value) {
-            this.hudStats[stat].value = value;
-        },
-        addStat(stat, value) {
-            this.hudStats[stat].value += value;
-        },
-        generateSaveData() {
-            return {
-                hudStats: this.hudStats,
-            };
-        },
-        loadSaveData(data) {
-            this.hudStats = cjs(this.hudStats, data.hudStats);
-        },
-    },
-});
-
-function createSkillCheckState() {
-    const skillCheck = {
-        passed: false,
-        available: true,
-    };
-    return skillCheck;
-}
-function getSkillCheckState(skillCheckId) {
-    const skillStore = useSkills();
-    let skillCheck = skillStore.skillChecks[skillCheckId];
-    if (!skillCheck) {
-        skillCheck = createSkillCheckState();
-        skillStore.setupSkillCheck(skillCheck, skillCheckId);
-    }
-    return skillCheck;
-}
 function getSkillCheckDifficultyScore(value, level) {
     return value - level * getConfig().skillChecks.skillMultiplier;
 }
@@ -4593,16 +4840,16 @@ function getSkillCheckDifficultyText(value, level) {
 }
 function getSkillCheckText({ skill, skillCheckId, value, }) {
     const skillStore = useSkills();
-    const skillCheckState = getSkillCheckState(skillCheckId);
+    const skillCheckState = skillStore.getSkillCheck(skillCheckId);
     const skillConfig = getSkillConfig(skill);
     const level = skillStore.skills[skill].level;
     const difficultyText = getSkillCheckDifficultyText(value, level);
     let allowed = true;
     let text = `<span class='skill-check'>[<span class='skill-check-name'>${skillConfig.name}</span> - `;
-    if (skillCheckState.available) {
+    if (!skillCheckState.happened) {
         text += ` <span class='skill-check-difficulty'>${difficultyText}</span>]</span>`;
     }
-    else if (skillCheckState.passed) {
+    else if (skillCheckState.succeeded) {
         text = '';
     }
     else {
@@ -4646,41 +4893,44 @@ function resolveSkillCheck(params) {
         success = false;
     }
     logger.log(`[SKILL CHECK ${skill.name}]: ${success ? '✅' : '❌'}`, `(${params.id}) - ${roll}/${params.value}`);
+    success
+        ? audioEvent('onSkillCheckSuccess')
+        : audioEvent('onSkillCheckFailure');
     return success;
 }
 
-function processSkillCheck(skillcheck) {
-    return runSkillCheck({
-        skill: skillcheck.skill,
-        value: skillcheck.value,
-        id: skillcheck.id,
-        success: skillcheck.success.text,
-        failure: skillcheck.failure.text,
-    });
-}
 function runSkillCheck(params) {
-    const success = resolveSkillCheck(params);
     const skillStore = useSkills();
+    const result = skillStore.getSkillCheck(params.id);
+    if (result && result.happened) {
+        return result;
+    }
+    const success = resolveSkillCheck(params);
     writeText(getPassiveSkillCheckText(success, params));
     if (success) {
-        skillStore.passSkillCheck(params.id);
-        return true;
+        skillStore.passSkillCheck(params.id, params.hideAfterRoll);
     }
-    skillStore.failSkillCheck(params.id);
-    return false;
+    else {
+        skillStore.failSkillCheck(params.id, params.hideAfterRoll);
+    }
+    return skillStore.getSkillCheck(params.id);
 }
 function runConditionCommand(command) {
     const options = command.options;
-    const result = runCondition(options.condition);
+    const staticOptions = command.staticOptions;
+    const result = !!options.condition;
     logger.log(result);
     if (result) {
-        return options.success;
+        return staticOptions.success;
     }
-    if (!result && options.failure) {
-        return options.failure;
+    if (!result && staticOptions.failure) {
+        return staticOptions.failure;
     }
     return undefined;
 }
+function isExpression(arg) {
+    return typeof arg === 'object';
+}
 function writeText(text) {
     const dialog = {
         speaker: 'game',
@@ -4690,48 +4940,6 @@ function writeText(text) {
     const dialogStore = useDialogStore();
     dialogStore.addDialog(dialog);
 }
-function runCondition(condition) {
-    return conditionFunction(condition);
-}
-function conditionFunction(condition) {
-    const skillStore = useSkills();
-    const vm = useVM();
-    const inventory = useInventory();
-    const context = {
-        data: vm.data,
-        skills: skillStore.skills,
-        skillChecks: skillStore.skillChecks,
-        stats: useHud().hudStats,
-        items: inventory.items,
-        quests: useQuests().quests,
-        itemAmount: (id) => {
-            return useInventory().getItemAmount(id);
-        },
-        roll: (checkId, skill, value) => {
-            const skillCheckState = getSkillCheckState(checkId);
-            if (skillCheckState) {
-                if (skillCheckState.passed) {
-                    return true;
-                }
-                if (!skillCheckState.available) {
-                    return false;
-                }
-            }
-            return runSkillCheck({
-                skill,
-                value,
-                id: checkId,
-            });
-        },
-    };
-    return evalInContext(`(${condition})`, context);
-}
-function evalInContext(script, context) {
-    // # Return the results of the in-line anonymous function we .call with the passed context
-    return function () {
-        return eval(script);
-    }.call(context);
-}
 async function textCommand(dialog) {
     const dialogStore = useDialogStore();
     dialogStore.addDialog(dialog);
@@ -4765,73 +4973,112 @@ class VM {
     }
 }
 const vm = new VM();
-async function runCommand(cmd, choices) {
+async function runCommand(expression, choices) {
     const vmStore = useVM();
     try {
-        const commandPlugin = vm.commands[cmd.commandType];
-        if (commandPlugin) {
-            commandPlugin.runner(cmd, choices);
-        }
+        const result = await runExpression(expression, choices);
+        return result;
     }
     catch (err) {
-        logger.log(`Error at: `, vmStore.currentStack.label);
         console.error(err);
-        error(`Narrat script runtime error at  <span class="error-filename">${cmd.fileName}:${cmd.line + 1}</span>
+        console.error(expression);
+        error(`Narrat script runtime error at  <span class="error-filename">${expression.fileName}:${expression.line + 1}</span>
       <b>${err}</b>
-      Script: ${cmd.code}
+      Script: ${expression.code}
       Label: ${vmStore.currentStack.label}`);
     }
 }
-async function playerAnswered(choiceIndex) {
-    const vmStore = useVM();
-    const cmd = vmStore.currentLine;
-    const dialogStore = useDialogStore();
-    switch (cmd.commandType) {
-        case 'choice':
-            const options = cmd.options;
-            const choice = options.choices[choiceIndex];
-            let playerText = choice.choice;
-            let newBranch;
-            const skillcheck = choice.skillCheck;
-            if (skillcheck) {
-                const skillCheckState = getSkillCheckState(choice.skillCheck.id);
-                if (skillCheckState.passed) {
-                    newBranch = skillcheck.success.branch;
-                    playerText = skillcheck.success.text;
+async function generateCommand(expr, choices) {
+    const command = expr.command;
+    const commandPlugin = vm.commands[command.commandType];
+    if (commandPlugin) {
+        const generatedCommand = {
+            args: [],
+            options: {},
+            operator: command.operator,
+            staticOptions: command.staticOptions,
+            code: expr.code,
+            commandType: command.commandType,
+            fileName: expr.fileName,
+            line: expr.line,
+        };
+        // Evaluate arguments
+        const argTypes = commandPlugin.argTypes;
+        generatedCommand.options = {};
+        for (const [i, arg] of command.args.entries()) {
+            let finalArg;
+            if (isExpression(arg)) {
+                // Arg is an expression, run it
+                finalArg = await runExpression(arg, choices);
+            }
+            else if (typeof arg === 'string') {
+                if (arg.search(stringRegex) === 0) {
+                    // This is an actual string
+                    finalArg = arg.substring(3);
+                }
+                else if (arg.search(/\$/) === 0) {
+                    // This is potentially a variable token
+                    const modifiable = getModifiableDataPinia();
+                    const result = findDataHelperWithoutAutoCreate(modifiable, arg.substring(1));
+                    if (result) {
+                        const [target, key] = result;
+                        finalArg = target[key];
+                    }
+                    else {
+                        finalArg = arg;
+                    }
                 }
                 else {
-                    const result = processSkillCheck(skillcheck);
-                    const winner = result ? skillcheck.success : skillcheck.failure;
-                    newBranch = winner.branch;
-                    playerText = undefined;
+                    finalArg = arg;
                 }
             }
             else {
-                newBranch = choice.branch;
-            }
-            if (playerText) {
-                // If the choice involves printing a player dialog, show it
-                const dialog = {
-                    speaker: 'player',
-                    text: playerText,
-                    interactive: false,
-                };
-                dialogStore.addDialog(dialog);
+                finalArg = arg;
             }
-            if (newBranch) {
-                const newStack = {
-                    currentIndex: 0,
-                    branch: newBranch,
-                };
-                const vmStore = useVM();
-                return vmStore.addStack(newStack);
+            generatedCommand.args.push(finalArg);
+            if (Array.isArray(argTypes) && argTypes.length > i) {
+                const argType = argTypes[i];
+                if (finalArg !== null) {
+                    generatedCommand.options[argType.name] = finalArg;
+                }
             }
-            else {
-                vmStore.nextLine();
+        }
+        return generatedCommand;
+    }
+    else {
+        throw new Error(`${command.commandType} is not a valid command`);
+    }
+}
+async function runExpression(expr, choices) {
+    const command = await generateCommand(expr, choices);
+    const commandPlugin = vm.commands[command.commandType];
+    if (commandPlugin) {
+        const result = await commandPlugin.runner(command, choices);
+        return result;
+    }
+    else {
+        throw new Error(`${command.commandType} is not a valid command`);
+    }
+}
+async function playerAnswered(choiceIndex) {
+    audioEvent('onPlayerAnswered');
+    const vmStore = useVM();
+    // For some super weird reason, vmStore.currentCommand has a broken type?
+    const command = vmStore.lastChoiceCommand;
+    vmStore.lastChoiceCommand = undefined;
+    const currentLine = vmStore.currentLine;
+    try {
+        if (command) {
+            const commandPlugin = vm.commands[command.commandType];
+            if (commandPlugin && commandPlugin.onPlayerAnswered) {
+                return await commandPlugin.onPlayerAnswered(command, choiceIndex);
             }
-            break;
-        default:
-            vmStore.nextLine();
+        }
+        return await vmStore.nextLine();
+    }
+    catch (err) {
+        console.error(err);
+        error(`Error after player answer at ${currentLine.fileName}:${currentLine.line + 1} (${currentLine.code}<br /> - Error: ${err}`);
     }
 }
 
@@ -5287,7 +5534,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   ], 4))
 }
 
-var css_248z$1 = ".dialog-title {\n  font-size: 20px;\n  font-weight: bold;\n}\n\n.dialog-text {\n  font-size: 16px;\n}\n\n.dialog-box {\n  /* border-radius: 10px; */\n  /* border: 1px solid #a8a8a8; */\n  color: var(--text-color);\n  /* background-color: #2e2e2e; */\n  padding: 10px;\n  padding-left: 2em;\n  margin-bottom: 10px;\n}\n\n.dialog-choice {\n  color: var(--dialog-choice-color);\n}\n\n.dialog-choice:hover {\n  color: var(--dialog-choice-hover-color);\n  cursor: pointer;\n}\n\n.buttons-container {\n  width: 100%;\n  padding: 10px;\n  display: flex;\n  justify-content: space-evenly;\n  align-items: stretch;\n  box-sizing: border-box;\n}\n\n.interact-button {\n  cursor: pointer;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  height: 50px;\n  color: var(--text-color);\n  border: 1px solid black;\n  font-weight: bold;\n  font-size: 24px;\n  text-align: center;\n  flex-grow: 2;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n}\n\n.interact-button:not(:last-child) {\n  margin-right: 10px;\n}\n";
+var css_248z$1 = ".dialog-title {\n  font-size: 20px;\n  font-weight: bold;\n}\n\n.dialog-text {\n  font-size: 16px;\n}\n\n.dialog-box {\n  /* border-radius: 10px; */\n  /* border: 1px solid #a8a8a8; */\n  color: var(--text-color);\n  /* background-color: #2e2e2e; */\n  padding: 10px;\n  padding-left: 2em;\n  margin-bottom: 10px;\n}\n\n.dialog-choice {\n  color: var(--dialog-choice-color);\n}\n\n.dialog-choice:hover {\n  color: var(--dialog-choice-hover-color);\n  cursor: pointer;\n}\n\n.buttons-container {\n  width: 100%;\n  padding: 10px;\n  display: flex;\n  justify-content: space-evenly;\n  align-items: stretch;\n  box-sizing: border-box;\n}\n\n.interact-button {\n  cursor: pointer;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n  height: 50px;\n  color: var(--text-color);\n  border: 1px solid black;\n  font-weight: bold;\n  font-size: 24px;\n  text-align: center;\n  flex-grow: 2;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n}\n\n.interact-button:not(:last-child) {\n  margin-right: 10px;\n}\n";
 styleInject(css_248z$1);
 
 script.render = render;
@@ -6738,13 +6985,13 @@ const KeyType = {
   PATTERN: '$val'
 };
 
-const isExpression = (query) =>
+const isExpression$1 = (query) =>
   !!(query[LogicalOperator.AND] || query[LogicalOperator.OR]);
 
 const isPath = (query) => !!query[KeyType.PATH];
 
 const isLeaf = (query) =>
-  !isArray(query) && isObject(query) && !isExpression(query);
+  !isArray(query) && isObject(query) && !isExpression$1(query);
 
 const convertToExplicit = (query) => ({
   [LogicalOperator.AND]: Object.keys(query).map((key) => ({
@@ -6760,7 +7007,7 @@ function parse(query, options, { auto = true } = {}) {
 
     const isQueryPath = isPath(query);
 
-    if (!isQueryPath && keys.length > 1 && !isExpression(query)) {
+    if (!isQueryPath && keys.length > 1 && !isExpression$1(query)) {
       return next(convertToExplicit(query))
     }
 
@@ -6803,7 +7050,7 @@ function parse(query, options, { auto = true } = {}) {
     return node
   };
 
-  if (!isExpression(query)) {
+  if (!isExpression$1(query)) {
     query = convertToExplicit(query);
   }
 
@@ -7312,7 +7559,7 @@ var script$3 = defineComponent({
                                 items: inventoryStore.items,
                                 skills: skillsStore.skills,
                                 skillChecks: skillsStore.skillChecks,
-                            }
+                            },
                         },
                         onChange: (updatedContent) => {
                             vmStore.overrideData(updatedContent.json.data);
@@ -7390,28 +7637,30 @@ var script$3 = defineComponent({
             const scripts = Object.values(this.script);
             const count = scripts.reduce((count, script) => {
                 logger.log(count);
-                return count + this.countWordsInScriptBranch(script);
+                return count + this.countWordsInScriptBranch(script.branch);
             }, 0);
             alert(`You have ${count} words`);
         },
         countWordsInScriptLine(scriptLine) {
-            if (scriptLine.commandType === 'talk') {
-                return this.countWordsInString(scriptLine.args[2]);
+            if (scriptLine.command.commandType === 'talk') {
+                if (typeof scriptLine.command.args[2] === 'string') {
+                    return this.countWordsInString(scriptLine.command.args[2]);
+                }
             }
-            if (scriptLine.commandType === 'text') {
-                return this.countWordsInString(scriptLine.options.text);
+            if (scriptLine.command.commandType === 'text') {
+                return this.countWordsInString(scriptLine.code);
             }
-            if (scriptLine.commandType === 'choice') {
-                const opt = scriptLine.options;
+            if (scriptLine.command.commandType === 'choice') {
+                const opt = scriptLine.command.staticOptions;
                 let count = this.countWordsInScriptLine(opt.prompt);
-                count += opt.choices.reduce((count, choice) => count + this.countWordsInString(choice.choice), 0);
+                count += opt.choices.reduce((count, choice) => count + this.countWordsInString(choice.prompt.code), 0);
                 const choices = opt.choices;
                 return choices.reduce((count, choice) => {
                     return count + this.countWordsInScriptBranch(choice.branch);
                 }, count);
             }
-            if (scriptLine.commandType === 'if') {
-                const opt = scriptLine.options;
+            if (scriptLine.command.commandType === 'if') {
+                const opt = scriptLine.command.staticOptions;
                 const branches = [opt.success, opt.failure];
                 return branches.reduce((count, choice) => {
                     if (choice) {
@@ -7628,8 +7877,8 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
                   (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.skillChecks, (check, key) => {
                     return (openBlock(), createElementBlock("tr", { key: key }, [
                       createElementVNode("td", null, toDisplayString(key), 1),
-                      createElementVNode("td", null, toDisplayString(!check.available ? '✅' : '❌'), 1),
-                      createElementVNode("td", null, toDisplayString(check.available ? 'NA' : check.passed ? '✅' : '❌'), 1)
+                      createElementVNode("td", null, toDisplayString(check.happened ? '✅' : '❌'), 1),
+                      createElementVNode("td", null, toDisplayString(!check.happened ? 'NA' : check.succeeded ? '✅' : '❌'), 1)
                     ]))
                   }), 128))
                 ])
@@ -8666,9 +8915,6 @@ var script$d = defineComponent({
             }
             return undefined;
         },
-        command() {
-            return this.currentLine;
-        },
         picture() {
             if (this.lastDialog) {
                 return getCharacterPictureUrl(this.lastDialog.speaker, this.lastDialog.pose);
@@ -8809,10 +9055,12 @@ var script$d = defineComponent({
             return localStorage.getItem(SAVE_FILE);
         },
         async startGame() {
+            audioEvent('onPressStart');
             const main = useMain();
             await main.startGame();
         },
         async loadGame() {
+            audioEvent('onPressStart');
             useMain().loadGame(this.getSaveFile());
         },
         isDialogActive(i) {
@@ -8860,13 +9108,14 @@ const _hoisted_1$c = ["width", "height"];
 const _hoisted_2$a = /*#__PURE__*/createElementVNode("div", { class: "anchor" }, null, -1);
 const _hoisted_3$7 = {
   key: 2,
-  class: "flex flex-col",
+  id: "game-menu",
   style: {"height":"100%","padding":"20px"}
 };
-const _hoisted_4$6 = { id: "game-title-container" };
-const _hoisted_5$6 = { id: "game-title-text" };
-const _hoisted_6$6 = { class: "flex flex-col" };
-const _hoisted_7$5 = { key: 3 };
+const _hoisted_4$6 = { id: "game-header" };
+const _hoisted_5$6 = { id: "game-title-container" };
+const _hoisted_6$6 = { id: "game-title-text" };
+const _hoisted_7$5 = { class: "flex flex-col" };
+const _hoisted_8$4 = { key: 3 };
 
 function render$d(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_Hud = resolveComponent("Hud");
@@ -8975,23 +9224,25 @@ function render$d(_ctx, _cache, $props, $setup, $data, $options) {
       : (_ctx.gameLoaded)
         ? (openBlock(), createElementBlock("div", _hoisted_3$7, [
             createElementVNode("div", _hoisted_4$6, [
-              createElementVNode("h1", _hoisted_5$6, toDisplayString(_ctx.gameTitle), 1)
-            ]),
-            createElementVNode("div", _hoisted_6$6, [
-              createElementVNode("button", {
-                class: "button menu-button start-button override",
-                onClick: _cache[0] || (_cache[0] = (...args) => (_ctx.startGame && _ctx.startGame(...args)))
-              }, " Start Game "),
-              (_ctx.hasSave)
-                ? (openBlock(), createElementBlock("button", {
-                    key: 0,
-                    class: "button menu-button continue-button override",
-                    onClick: _cache[1] || (_cache[1] = (...args) => (_ctx.loadGame && _ctx.loadGame(...args)))
-                  }, " Continue Game "))
-                : createCommentVNode("", true)
+              createElementVNode("div", _hoisted_5$6, [
+                createElementVNode("h1", _hoisted_6$6, toDisplayString(_ctx.gameTitle), 1)
+              ]),
+              createElementVNode("div", _hoisted_7$5, [
+                createElementVNode("button", {
+                  class: "button menu-button main-menu-button larg start-button override",
+                  onClick: _cache[0] || (_cache[0] = (...args) => (_ctx.startGame && _ctx.startGame(...args)))
+                }, " Start Game "),
+                (_ctx.hasSave)
+                  ? (openBlock(), createElementBlock("button", {
+                      key: 0,
+                      class: "button menu-button main-menu-button large continue-button override",
+                      onClick: _cache[1] || (_cache[1] = (...args) => (_ctx.loadGame && _ctx.loadGame(...args)))
+                    }, " Continue Game "))
+                  : createCommentVNode("", true)
+              ])
             ])
           ]))
-        : (openBlock(), createElementBlock("div", _hoisted_7$5, [
+        : (openBlock(), createElementBlock("div", _hoisted_8$4, [
             createVNode(_component_LoadingBar, {
               percentage: _ctx.loadingPercentage,
               step: _ctx.loadingStep
@@ -9004,7 +9255,7 @@ function render$d(_ctx, _cache, $props, $setup, $data, $options) {
   ], 4))
 }
 
-var css_248z$e = "#app {\n  background-color: var(--bg-color);\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  color: var(--text-color);\n  box-sizing: border-box;\n  overflow: hidden;\n  transform-origin: center center;\n}\n\n.game {\n  background-color: var(--bg-color);\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  overflow: hidden;\n}\n\n.interact-button {\n  height: 50px;\n  border: 1px solid black;\n  font-weight: bold;\n  font-size: 20px;\n  text-align: center;\n  flex-grow: 2;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n}\n\n.interact-button:not(:last-child) {\n  margin-right: 10px;\n}\n\n.dialog-container {\n  flex-shrink: 2;\n  /* padding: 20px; */\n  min-height: 100%;\n  width: 100%;\n  background-color: (var(--bg-color));\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end;\n  align-items: center;\n  overflow-x: hidden;\n}\n\n.dialog {\n  overflow-y: auto;\n  overflow-x: hidden;\n  position: relative;\n  -ms-overflow-style: none; /* IE and Edge */\n  scrollbar-width: none; /* Firefox */\n}\n\n.dialog::-webkit-scrollbar {\n  display: none; /* webkit */\n}\n\n.dialog * {\n  overflow-anchor: none;\n}\n\n.background {\n  margin: 0;\n}\n\n#background-canvas {\n  height: 100%;\n}\n\n.anchor {\n  overflow-anchor: auto;\n  height: 1px;\n}\n\n.menu-toggle {\n  position: fixed;\n  bottom: 0px;\n  right: 15%;\n  z-index: 2;\n}\n\n#game-title-container {\n  margin-bottom: 50px;\n}\n\n#game-title-text {\n  text-align: center;\n  font-size: 50px;\n}\n\n.menu-button {\n  font-size: 25px;\n}\n";
+var css_248z$e = "#app {\n  background-color: var(--bg-color);\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  color: var(--text-color);\n  box-sizing: border-box;\n  overflow: hidden;\n  transform-origin: center center;\n}\n\n.game {\n  background-color: var(--bg-color);\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  overflow: hidden;\n}\n\n.interact-button {\n  height: 50px;\n  border: 1px solid black;\n  font-weight: bold;\n  font-size: 20px;\n  text-align: center;\n  flex-grow: 2;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n}\n\n.interact-button:not(:last-child) {\n  margin-right: 10px;\n}\n\n.dialog-container {\n  flex-shrink: 2;\n  /* padding: 20px; */\n  min-height: 100%;\n  width: 100%;\n  background-color: (var(--bg-color));\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end;\n  align-items: center;\n  overflow-x: hidden;\n}\n\n.dialog {\n  overflow-y: auto;\n  overflow-x: hidden;\n  position: relative;\n  -ms-overflow-style: none; /* IE and Edge */\n  scrollbar-width: none; /* Firefox */\n}\n\n.dialog::-webkit-scrollbar {\n  display: none; /* webkit */\n}\n\n.dialog * {\n  overflow-anchor: none;\n}\n\n.background {\n  margin: 0;\n}\n\n#background-canvas {\n  height: 100%;\n}\n\n.anchor {\n  overflow-anchor: auto;\n  height: 1px;\n}\n\n.menu-toggle {\n  position: fixed;\n  bottom: 0px;\n  right: 15%;\n  z-index: 2;\n}\n\n#game-title-container {\n  margin-bottom: 50px;\n}\n\n#game-title-text {\n  text-align: center;\n  font-size: 50px;\n}\n\n.menu-button {\n  font-size: 25px;\n}\n\n#game-header {\n  position: relative;\n  top: 100px;\n}\n";
 styleInject(css_248z$e);
 
 script$d.render = render$d;
@@ -9090,7 +9341,7 @@ function mouseclick(e) {
                     // clicked button
                     const scriptToRun = button.action;
                     const newStack = {
-                        branch: vmStore.script[scriptToRun],
+                        branchData: vmStore.script[scriptToRun],
                         currentIndex: 0,
                         label: scriptToRun,
                     };
@@ -9102,264 +9353,203 @@ function mouseclick(e) {
     }
 }
 
+function commandRuntimeError(cmd, errorText) {
+    console.error(`Runtime error =========================`);
+    console.error('Args: ', cmd.args);
+    console.error('Options: ', cmd.options);
+    error(`Runtime error at ${cmd.fileName}:${cmd.line} (${cmd.commandType}) ${cmd.code}. - 
+  <br />
+  Error: ${errorText}`);
+    console.error('============================');
+}
+
 class CommandPlugin {
     keyword;
     runner;
+    argTypes;
     parser;
-    constructor(keyword, runner, parser) {
+    onPlayerAnswered;
+    constructor(keyword, argTypes, runner, parser) {
         this.keyword = keyword;
         this.runner = runner;
-        this.parser = parser;
+        this.argTypes = argTypes;
+        if (!parser) {
+            this.parser = generateParser(this.keyword, this.argTypes);
+        }
+        else {
+            this.parser = parser;
+        }
     }
 }
-function generateParser(keyword) {
-    return (ctx) => {
-        ctx.command.commandType = keyword;
-        ctx.currentLine++;
-    };
-}
-
-const add = async (cmd) => {
-    const addKey = cmd.args[0];
-    const addValue = cmd.args[1];
-    const vm = useVM();
-    vm.addInstruction(addKey, addValue);
-    return vm.nextLine();
-};
-const addPlugin = new CommandPlugin('add', add, generateParser('add'));
-
-const addLevelRunner = async (cmd) => {
-    const [skillKey, levelToAdd] = cmd.args;
-    if (!skillKey || !levelToAdd) {
-        error(`add_level command needs a skill id and a value as parameters`);
-    }
-    useSkills().incrementSkill(skillKey, levelToAdd);
-    return useVM().nextLine();
-};
-const addLevelParser = (ctx) => {
-    ctx.command.commandType = 'add_level';
-    ctx.currentLine++;
-};
-const addLevelPlugin = new CommandPlugin('add_level', addLevelRunner, addLevelParser);
-
-const addStatRunner = async (cmd) => {
-    const statKey = cmd.args[0];
-    const amountToAdd = cmd.args[1];
-    if (!statKey || !amountToAdd) {
-        error(`add_stat command needs a stat id and a value as parameters`);
-    }
-    const hud = useHud();
-    hud.addStat(statKey, amountToAdd);
-    return useVM().nextLine();
-};
-const addStatParser = (ctx) => {
-    ctx.command.commandType = 'add_stat';
-    ctx.currentLine++;
-};
-const addStatPlugin = new CommandPlugin('add_stat', addStatRunner, addStatParser);
-
-const addXp = async (cmd) => {
-    const xpKey = cmd.args[0];
-    const xpToAdd = cmd.args[1];
-    if (!xpKey || !xpToAdd) {
-        error(`add_xp command needs a skill id and a value as parameters`);
-    }
-    useSkills().addXp(xpKey, xpToAdd);
-    return useVM().nextLine();
-};
-const addXpPlugin = new CommandPlugin('add_xp', addXp, generateParser('add_xp'));
-
-const choice = async (cmd) => {
-    await runChoice(cmd);
-};
-async function runChoice(cmd) {
-    const options = cmd.options;
-    const prompt = options.prompt;
-    const choices = options.choices
-        .filter((choice) => {
-        // Delete the choice if it fails a condition
-        if (choice.condition) {
-            return runCondition(choice.condition);
+function generateParser(keyword, argTypes) {
+    let expectedArgCount = [];
+    if (argTypes !== 'any') {
+        expectedArgCount = [argTypes.length];
+        const optionalArgs = argTypes.reduce((total, argType) => (argType.optional ? total + 1 : total), 0);
+        if (optionalArgs > 1) {
+            throw new Error(`Only one optional argument is allowed for commands but ${keyword} has multiple ones`);
+        }
+        if (optionalArgs === 1) {
+            expectedArgCount.push(argTypes.length - 1);
         }
-        if (choice.skillCheck) {
-            if (!getSkillCheckState(choice.skillCheck.id).available &&
-                choice.skillCheck.hideAfterRoll) {
-                return false;
+    }
+    return (ctx, parsed) => {
+        const returnValue = {
+            newLine: ctx.currentLine + 1
+        };
+        const args = parsed.command.args;
+        if (argTypes !== 'any') {
+            if (!expectedArgCount.includes(args.length)) {
+                console.log("Error details");
+                console.log(parsed.command);
+                console.log(args);
+                ctx.parserContext.error(ctx.line.line, `Command ${keyword}: Expected ${expectedArgCount.join(' or ')} arguments but got ${args.length}`);
+                return returnValue;
             }
         }
-        return true;
-    })
-        .map((choice) => {
-        let text = choice.choice;
-        let choiceAllowed = true;
-        if (choice.skillCheck) {
-            const check = choice.skillCheck;
-            const { difficultyText, allowed } = getSkillCheckText({
-                skill: check.skill,
-                skillCheckId: check.id,
-                value: check.value,
+        parsed.command.commandType = keyword;
+        // todo: check types of args
+        if (argTypes !== 'any') {
+            parsed.command.args.forEach((arg, index) => {
+                const argType = argTypes[index];
+                if (!isExpression(arg)) {
+                    // Only run this if the arg isn't an expression, as expressions aren't currently typed
+                    // eslint-disable-next-line valid-typeof
+                    const isValid = argType.type === 'any' || typeof arg === argType.type;
+                    if (!isValid) {
+                        ctx.parserContext.error(ctx.line.line, `Command ${keyword}: Argument #${index + 1} (${argType.name}) should be a ${argType.type}, but got type ${typeof arg}: ${JSON.stringify(arg)}`);
+                    }
+                }
             });
-            text = `${difficultyText} ${text}`;
-            choiceAllowed = allowed;
         }
-        const result = {
-            choice: text,
-            originalIndex: choice.index,
-            allowed: choiceAllowed,
+        return {
+            newLine: ctx.currentLine + 1,
         };
-        return result;
-    });
-    runCommand(prompt, choices);
-}
-const choiceParser = (ctx) => {
-    const { line, command } = ctx;
-    if (!line.branch || line.branch.length < 2) {
-        ctx.parserContext.error(line.line, `Choice menu needs to have at least one option`);
-    }
-    const prompt = line.branch[0];
-    const choices = line.branch.slice(1);
-    const prompts = choices.map((choice, index) => {
-        if (!choice.branch) {
-            ctx.parserContext.error(choice.line, `Choice option doesn't have any branch to go to (${choice.code})`);
-        }
-        return parseChoiceOption(ctx, choice, index);
-    });
-    command.options = {
-        prompt: ctx.processCommandsFunction(ctx.parserContext, [prompt], line)[0],
-        choices: prompts,
     };
-    command.commandType = 'choice';
-    ctx.currentLine++;
-};
-function parseChoiceOption(ctx, choice, index) {
-    let choiceText = choice.operator;
-    let condition;
-    let skillCheck;
-    if (choice.operator === 'roll') {
-        if (choice.args.length < 4) {
-            ctx.parserContext.error(choice.line, `Skillchecks need 4 arguments!`);
-        }
-        choiceText = choice.args[3];
-        const hideAfterRoll = choice.args.length >= 5;
-        const successBranch = choice.branch[0];
-        const failureBranch = choice.branch[1];
-        const success = {
-            text: successBranch.args[0],
-            branch: ctx.processCommandsFunction(ctx.parserContext, successBranch.branch, choice),
-        };
-        let failedBranch;
-        if (failureBranch.branch) {
-            failedBranch = ctx.processCommandsFunction(ctx.parserContext, failureBranch.branch, choice);
-        }
-        const failure = {
-            text: failureBranch.args[0],
-            branch: failedBranch,
-        };
-        skillCheck = {
-            id: choice.args[0],
-            skill: choice.args[1],
-            value: choice.args[2],
-            hideAfterRoll,
-            success,
-            failure,
-        };
+}
+
+const addLevelPlugin = new CommandPlugin('add_level', [
+    {
+        name: 'skillKey',
+        type: 'string',
+    },
+    {
+        name: 'amount',
+        type: 'number',
+    },
+], async (cmd) => {
+    const { skillKey, amount } = cmd.options;
+    if (!skillKey || !amount) {
+        commandRuntimeError(cmd, `add_level command needs a skill id and a value as parameters`);
     }
-    if (choice.args[0] === 'if') {
-        condition = choice.args[1];
+    useSkills().incrementSkill(skillKey, amount);
+    return useVM().nextLine();
+});
+const addXpPlugin = new CommandPlugin('add_xp', [
+    { name: 'xpKey', type: 'string' },
+    { name: 'xpToAdd', type: 'number' },
+], async (cmd) => {
+    const { xpKey, xpToAdd } = cmd.options;
+    if (!xpKey || !xpToAdd) {
+        commandRuntimeError(cmd, `add_xp command needs a skill id and a value as parameters`);
     }
-    return {
-        choice: choiceText,
-        condition,
-        skillCheck,
-        branch: ctx.processCommandsFunction(ctx.parserContext, choice.branch, choice),
-        index,
-    };
-}
-const choicePlugin = new CommandPlugin('choice', choice, choiceParser);
-
-const clearDialog = async (cmd) => {
-    useDialogStore().clearDialog();
+    useSkills().addXp(xpKey, xpToAdd);
     return useVM().nextLine();
-};
-const clearDialogPlugin = new CommandPlugin('clear_dialog', clearDialog, generateParser('clear_dialog'));
+});
+const rollPlugin = new CommandPlugin('roll', [
+    { name: 'id', type: 'string' },
+    { name: 'skill', type: 'string' },
+    { name: 'value', type: 'number' },
+    { name: 'hideAfterRoll', type: 'boolean', optional: true },
+], async (cmd) => {
+    const { id, skill, value, hideAfterRoll } = cmd.options;
+    const skillCheck = {
+        id,
+        skill,
+        value,
+        hideAfterRoll,
+    };
+    const result = runSkillCheck(skillCheck);
+    return result;
+});
 
-const ifFunction = async (cmd) => {
-    const newBranch = runConditionCommand(cmd);
-    const vmStore = useVM();
-    if (newBranch) {
-        const newStack = {
-            branch: newBranch,
-            currentIndex: 0,
-        };
-        return vmStore.addStack(newStack);
+const addStatPlugin = new CommandPlugin('add_stat', [
+    { name: 'statKey', type: 'string' },
+    { name: 'amountToAdd', type: 'number' },
+], async (cmd) => {
+    const { statKey, amountToAdd } = cmd.options;
+    if (!statKey || !amountToAdd) {
+        commandRuntimeError(cmd, `add_stat command needs a stat id and a value as parameters`);
+    }
+    const hud = useHud();
+    hud.addStat(statKey, amountToAdd);
+    return useVM().nextLine();
+});
+const setStatPlugin = new CommandPlugin('set_stat', [
+    { name: 'statKey', type: 'string' },
+    { name: 'value', type: 'number' },
+], async (cmd) => {
+    const { statKey, value } = cmd.options;
+    if (!statKey || !value) {
+        commandRuntimeError(cmd, `set_stat command needs a stat id and a value as parameters`);
     }
-    return vmStore.nextLine();
-};
-const ifParser = (ctx) => {
-    const { command, lines, currentLine, line } = ctx;
-    command.commandType = 'if';
-    let failure;
-    const nextLine = getLine(lines, currentLine + 1);
-    if (nextLine && nextLine.operator === 'else') {
-        failure = ctx.processCommandsFunction(ctx.parserContext, nextLine.branch, line);
-        ctx.currentLine++;
+    const hud = useHud();
+    hud.setStat(statKey, value);
+    return useVM().nextLine();
+});
+const getStatPlugin = new CommandPlugin('get_stat_value', [{ name: 'statKey', type: 'string' }], async (cmd) => {
+    const { statKey } = cmd.options;
+    if (!statKey) {
+        commandRuntimeError(cmd, `get_stat_value command needs a stat id as parameter`);
     }
-    command.options = {
-        condition: command.args[0],
-        success: ctx.processCommandsFunction(ctx.parserContext, line.branch, line),
-        failure,
-    };
-    ctx.currentLine++;
-};
-const ifCommand = new CommandPlugin('if', ifFunction, ifParser);
+    const hud = useHud();
+    return hud.getStatValue(statKey);
+});
 
-const jump = async (cmd, choices) => {
-    const branch = cmd.args[0];
+const jumpCommand = new CommandPlugin('jump', 'any', async (cmd) => {
+    if (cmd.args.length < 1 || typeof cmd.args[0] !== 'string') {
+        commandRuntimeError(cmd, `requires a label argument`);
+    }
+    const label = cmd.args[0];
     const vm = useVM();
     const newStack = {
-        branch: vm.script[branch],
-        label: branch,
+        branchData: vm.script[label],
+        label: label,
+        args: cmd.args.splice(1),
         currentIndex: 0,
     };
     vm.setStack(newStack);
     await useMain().saveGame();
     await vm.runLine();
-};
-const jumpCommand = new CommandPlugin('jump', jump, generateParser('jump'));
-
-const notify = async (cmd) => {
-    const text = cmd.args[0];
-    useNotifications().addNotification(text);
-    return useVM().nextLine();
-};
-const notifyPlugin = new CommandPlugin('notify', notify, generateParser('notify'));
-
-const pause = async (cmd) => {
-    const pauseOptions = cmd.options;
-    if (pauseOptions.mode === 'music') {
-        const audioStore = useAudio();
-        pauseAudio(audioStore.currentMusic);
-    }
-    else if (pauseOptions.mode === 'sound' && pauseOptions.audio) {
-        pauseAudio(pauseOptions.audio);
-    }
-    else {
-        error(`pause first option needs to either be in music mode, or if stopping a sound needs to have the sound name supplied as second argument.`);
+});
+// Write a CommandPlugin for running a label using the runLabelFunction of the useVM store
+const runLabelPlugin = new CommandPlugin('run_label', 'any', async (cmd) => {
+    if (cmd.args.length < 1 || typeof cmd.args[0] !== 'string') {
+        commandRuntimeError(cmd, `run_label command needs a label to argument run`);
     }
+    const label = cmd.args[0];
+    const res = await useVM().runLabelFunction(label, ...cmd.args.slice(1));
+    return res;
+});
+const defineVariablePlugin = new CommandPlugin('var', [
+    { name: 'name', type: 'string' },
+    { name: 'value', type: 'any' },
+], async (cmd) => {
+    const { name, value } = cmd.options;
+    useVM().addScopedVariable(name, value);
     return useVM().nextLine();
-};
-const pauseParser = (ctx) => {
-    const { command } = ctx;
-    command.commandType = 'pause';
-    command.options = {
-        mode: command.args[0],
-        audio: command.args[1],
-    };
-    ctx.currentLine++;
-};
-const pauseCommand = new CommandPlugin('pause', pause, pauseParser);
+});
+const returnPlugin = new CommandPlugin('return', [{ name: 'value', type: 'any' }], async (cmd) => {
+    const { value } = cmd.options;
+    useVM().setReturnValue(value);
+    return useVM().nextLine();
+});
 
-const play = async (cmd) => {
+const playCommandArgs = [
+    { name: 'mode', type: 'string' },
+    { name: 'audio', type: 'string', optional: true },
+];
+const playCommand = new CommandPlugin('play', playCommandArgs, async (cmd) => {
     const playOptions = cmd.options;
     if (playOptions.mode === 'music') {
         changeMusic(playOptions.audio);
@@ -9368,69 +9558,22 @@ const play = async (cmd) => {
         playAudio(playOptions.audio);
     }
     useVM().nextLine();
-};
-const playParser = (ctx) => {
-    const { command } = ctx;
-    command.commandType = 'play';
-    command.options = {
-        mode: command.args[0],
-        audio: command.args[1],
-    };
-    ctx.currentLine++;
-};
-const playCommand = new CommandPlugin('play', play, playParser);
-
-const set = async (cmd, choices) => {
-    const key = cmd.args[0];
-    const value = cmd.args[1];
-    const vm = useVM();
-    vm.setData(key, value);
-    return vm.nextLine();
-};
-const setCommand = new CommandPlugin('set', set, generateParser('set'));
-
-const setButton = async (cmd) => {
-    const screens = useScreens();
-    screens.changeButton(cmd.args[0], cmd.args[1]);
-    return useVM().nextLine();
-};
-const setButtonParser = (ctx) => {
-    const { command, line } = ctx;
-    command.commandType = 'set_button';
-    if (command.args.length !== 2) {
-        ctx.parserContext.error(line.line, `set_button command should have 2 arguments`);
+});
+const pauseCommand = new CommandPlugin('pause', playCommandArgs, async (cmd) => {
+    const pauseOptions = cmd.options;
+    if (pauseOptions.mode === 'music') {
+        const audioStore = useAudio();
+        pauseAudio(audioStore.currentMusic);
     }
-    ctx.currentLine++;
-};
-const setButtonCommand = new CommandPlugin('set_button', setButton, setButtonParser);
-
-const setScreen = async (cmd) => {
-    const screens = useScreens();
-    screens.setScreen(cmd.options.screen);
-    return useVM().nextLine();
-};
-const setScreenParser = (ctx) => {
-    const { command } = ctx;
-    command.commandType = 'set_screen';
-    command.options = {
-        screen: command.args[0],
-    };
-    ctx.currentLine++;
-};
-const setScreenCommand = new CommandPlugin('set_screen', setScreen, setScreenParser);
-
-const setStat = async (cmd) => {
-    const setStatKey = cmd.args[0];
-    const setAmount = cmd.args[1];
-    if (!setStatKey || !setAmount) {
-        error(`set_stat command needs a stat id and a value as parameters`);
+    else if (pauseOptions.mode === 'sound' && pauseOptions.audio) {
+        pauseAudio(pauseOptions.audio);
+    }
+    else {
+        commandRuntimeError(cmd, `pause first option needs to either be in music mode, or if stopping a sound needs to have the sound name supplied as second argument.`);
     }
-    useHud().setStat(setStatKey, setAmount);
     return useVM().nextLine();
-};
-const setStatCommand = new CommandPlugin('set_stat', setStat, generateParser('set_stat'));
-
-const stop = async (cmd) => {
+});
+const stopCommand = new CommandPlugin('stop', playCommandArgs, async (cmd) => {
     const stopOptions = cmd.options;
     if (stopOptions.mode === 'music') {
         const audioStore = useAudio();
@@ -9440,186 +9583,665 @@ const stop = async (cmd) => {
         stopAudio(stopOptions.audio);
     }
     else {
-        error(`stop option needs to either be in music mode, or if stopping a sound needs to have the sound name supplied as second argument.`);
+        commandRuntimeError(cmd, `stop option needs to either be in music mode, or if stopping a sound needs to have the sound name supplied as second argument.`);
     }
     return useVM().nextLine();
-};
-const stopParser = (ctx) => {
-    const { command } = ctx;
-    command.commandType = 'stop';
-    command.options = {
-        mode: command.args[0],
-        audio: command.args[1],
-    };
-    ctx.currentLine++;
-};
-const stopCommand = new CommandPlugin('stop', stop, stopParser);
+});
+
+const setCommand = new CommandPlugin('set', [
+    { name: 'key', type: 'string' },
+    { name: 'value', type: 'any' },
+], async (cmd) => {
+    const state = getModifiableDataPinia();
+    setDataHelper(state, cmd.options.key, cmd.options.value);
+    return useVM().nextLine();
+});
+const addPlugin = new CommandPlugin('add', [
+    { name: 'key', type: 'string' },
+    { name: 'value', type: 'any' },
+], async (cmd) => {
+    const state = getModifiableDataPinia();
+    addDataHelper(state, cmd.options.key, cmd.options.value);
+    return useVM().nextLine();
+});
+
+const setScreenCommand = new CommandPlugin('set_screen', [{ name: 'screen', type: 'string' }], (cmd) => {
+    const screens = useScreens();
+    screens.setScreen(cmd.options.screen);
+    return useVM().nextLine();
+});
+const setButtonCommand = new CommandPlugin('set_button', [
+    { name: 'buttonId', type: 'string' },
+    { name: 'enabled', type: 'boolean' },
+], async (cmd) => {
+    const { buttonId, enabled } = cmd.options;
+    const screens = useScreens();
+    screens.changeButton(buttonId, enabled);
+    return useVM().nextLine();
+});
 
-const talk = async (cmd, choices) => {
+const talkCommand = new CommandPlugin('talk', [
+    {
+        name: 'speaker',
+        type: 'string',
+    },
+    {
+        name: 'pose',
+        type: 'string',
+    },
+    {
+        name: 'text',
+        type: 'string',
+    },
+], async (cmd, choices) => {
     await textCommand({
-        speaker: cmd.args[0],
-        pose: cmd.args[1],
-        text: `"${cmd.args[2]}"`,
+        speaker: cmd.options.speaker,
+        pose: cmd.options.pose,
+        text: `"${cmd.options.text}"`,
         choices,
         interactive: true,
     });
+});
+const textParser = () => {
+    const parser = generateParser('text', []);
+    return (ctx, parsed) => {
+        const result = parser(ctx, parsed);
+        parsed.command.staticOptions = {
+            text: parsed.code,
+        };
+        return result;
+    };
 };
-const talkParser = (ctx) => {
-    const { command, line } = ctx;
-    command.commandType = 'talk';
-    if (command.args.length < 3) {
-        ctx.parserContext.error(line.line, `Talk command needs 3 arguments!`);
-    }
-    ctx.currentLine++;
-};
-const talkCommand = new CommandPlugin('talk', talk, talkParser);
-
-const text = async (cmd, choices) => {
+const textCommandPlugin = new CommandPlugin('text', [], async (cmd, choices) => {
     await textCommand({
         speaker: 'game',
-        text: cmd.options.text,
+        text: cmd.staticOptions.text,
         choices,
         interactive: true,
     });
-};
-const textParser = (ctx) => {
-    const { command, line } = ctx;
-    command.commandType = 'text';
-    command.options = {
-        text: line.operator,
-    };
-    ctx.currentLine++;
-};
-const textCommandPlugin = new CommandPlugin('text', text, textParser);
-
-const wait = async (cmd) => {
-    await timeout(cmd.options.duration);
-    return useVM().nextLine();
-};
-const waitParser = (ctx) => {
-    const { command } = ctx;
-    command.commandType = 'wait';
-    command.options = {
-        duration: parseInt(command.args[0], 10),
-    };
-    ctx.currentLine++;
-};
-const waitCommand = new CommandPlugin('wait', wait, waitParser);
+}, textParser());
+console.log(textCommandPlugin);
 
 // Write a CommandPlugin for adding items to the inventory store
-const addItemPlugin = new CommandPlugin('add_item', async (cmd) => {
-    const id = cmd.args[0];
-    const amount = cmd.args[1];
+const addItemPlugin = new CommandPlugin('add_item', [
+    { name: 'id', type: 'string' },
+    { name: 'amount', type: 'number' },
+], async (cmd) => {
+    const { id, amount } = cmd.options;
     const inventory = useInventory();
     inventory.add({
         id,
         amount,
     });
     return useVM().nextLine();
-}, generateParser('add_item'));
+});
 // Write a CommandPlugin for removeing items to the inventory store
-const removeItemPlugin = new CommandPlugin('remove_item', async (cmd) => {
-    const id = cmd.args[0];
-    const amount = cmd.args[1];
+const removeItemPlugin = new CommandPlugin('remove_item', [
+    { name: 'id', type: 'string' },
+    { name: 'amount', type: 'number' },
+], async (cmd) => {
+    const { id, amount } = cmd.options;
     const inventory = useInventory();
     inventory.remove({
         id,
         amount,
     });
     return useVM().nextLine();
-}, generateParser('remove_item'));
+});
+// Write a CommandPlugin for command named 'has_item?' taking options itemId and optional parameter 'amount', which returns true if the inventory has the item, using the inventory store hasItem function and passing itemId and amount
+const hasItemPlugin = new CommandPlugin('has_item?', [
+    { name: 'id', type: 'string' },
+    { name: 'amount', type: 'number', optional: true },
+], async (cmd) => {
+    const { id, amount } = cmd.options;
+    const inventory = useInventory();
+    return inventory.hasItem(id, amount);
+});
+// Write a CommandPlugin named 'item_amount?' taking option itemId and returning how many of itemId the player has using the inventory store getItemAmount function and passing itemId
+const itemAmountPlugin = new CommandPlugin('item_amount?', [{ name: 'id', type: 'string' }], async (cmd) => {
+    const { id } = cmd.options;
+    const inventory = useInventory();
+    return inventory.getItemAmount(id);
+});
 // Write a CommandPlugin for enabling an interactiongTag in the inventory store
-const enableInteractionPlugin = new CommandPlugin('enable_interaction', async (cmd) => {
-    const tag = cmd.args[0];
+const enableInteractionPlugin = new CommandPlugin('enable_interaction', [{ name: 'tag', type: 'string' }], async (cmd) => {
+    const tag = cmd.options.tag;
     const inventory = useInventory();
     inventory.enableInteraction(tag);
     return useVM().nextLine();
-}, generateParser('enable_interaction'));
+});
 // Write a CommandPlugin for disabling an interactiongTag in the inventory store
-const disableInteractionPlugin = new CommandPlugin('disable_interaction', async (cmd) => {
-    const tag = cmd.args[0];
+const disableInteractionPlugin = new CommandPlugin('disable_interaction', [{ name: 'tag', type: 'string' }], async (cmd) => {
+    const tag = cmd.options.tag;
     const inventory = useInventory();
     inventory.disableInteraction(tag);
     return useVM().nextLine();
-}, generateParser('disable_interaction'));
+});
 
 // Write a CommandPlugin for starting a quest with the useQuests quests store
-const startQuestPlugin = new CommandPlugin('start_quest', async (cmd) => {
-    const questId = cmd.args[0];
+const startQuestPlugin = new CommandPlugin('start_quest', [{ name: 'questId', type: 'string' }], async (cmd) => {
+    const questId = cmd.options.questId;
     const quests = useQuests();
     quests.startQuest(questId);
     return useVM().nextLine();
-}, generateParser('start_quest'));
+});
 // Write a CommandPlugin for starting a quest objective with the cmd having arguments questId and objectiveId, using the useQuests store's startObjective method
-const startObjectivePlugin = new CommandPlugin('start_objective', async (cmd) => {
-    const questId = cmd.args[0];
-    const objectiveId = cmd.args[1];
+const startObjectivePlugin = new CommandPlugin('start_objective', [
+    { name: 'questId', type: 'string' },
+    { name: 'objectiveId', type: 'string' },
+], async (cmd) => {
+    const { questId, objectiveId } = cmd.options;
     const quests = useQuests();
     quests.startObjective(questId, objectiveId);
     return useVM().nextLine();
-}, generateParser('start_objective'));
+});
 // Write a CommandPlugin for completing a quest objective with the cmd having arguments questId and objectiveId, using the useQuests store's completeObjective method
-const completeObjectivePlugin = new CommandPlugin('complete_objective', async (cmd) => {
-    const questId = cmd.args[0];
-    const objectiveId = cmd.args[1];
+const completeObjectivePlugin = new CommandPlugin('complete_objective', [
+    { name: 'questId', type: 'string' },
+    { name: 'objectiveId', type: 'string' },
+], async (cmd) => {
+    const { questId, objectiveId } = cmd.options;
     const quests = useQuests();
     quests.completeObjective(questId, objectiveId);
     return useVM().nextLine();
-}, generateParser('complete_objective'));
+});
 // Write a CommandPlugin for completing a quest with the cmd having arguments questId, using the useQuests store's completeQuest method
-const completeQuestPlugin = new CommandPlugin('complete_quest', async (cmd) => {
-    const questId = cmd.args[0];
-    let ending;
-    if (cmd.args.length > 1) {
-        ending = cmd.args[1];
-    }
+const completeQuestPlugin = new CommandPlugin('complete_quest', [
+    { name: 'questId', type: 'string' },
+    { name: 'ending', type: 'string', optional: true },
+], async (cmd) => {
+    const { questId, ending } = cmd.options;
     const quests = useQuests();
     quests.completeQuest(questId, ending);
     return useVM().nextLine();
-}, generateParser('complete_quest'));
+});
+// Write a CommandPlugin for a command named 'quest_completed?' that returns true if the quest with the given questId has status value completed, false otherwise, using the useQuests store's isQuestCompleted method
+const questCompletedPlugin = new CommandPlugin('quest_completed?', [{ name: 'questId', type: 'string' }], async (cmd) => {
+    const { questId } = cmd.options;
+    const quests = useQuests();
+    return quests.isQuestCompleted(questId);
+});
+// Write a CommandPlugin for a command named 'objective_completed?' that returns true if the quest with the given questId has the given objectiveId completed, false otherwise, using the useQuests store's isObjectiveCompleted method
+const objectiveCompletedPlugin = new CommandPlugin('objective_completed?', [
+    { name: 'questId', type: 'string' },
+    { name: 'objectiveId', type: 'string' },
+], async (cmd) => {
+    const { questId, objectiveId } = cmd.options;
+    const quests = useQuests();
+    return quests.isObjectiveCompleted(questId, objectiveId);
+});
+// Write a CommandPlugin for a command named 'quest_started?' that returns true if the quest with the given questId has status value started, false otherwise, using the useQuests store's isQuestStarted method
+const questStartedPlugin = new CommandPlugin('quest_started?', [{ name: 'questId', type: 'string' }], async (cmd) => {
+    const { questId } = cmd.options;
+    const quests = useQuests();
+    return quests.isQuestStarted(questId);
+});
+// Write a CommandPlugin for a command named 'objective_started?' that returns true if the quest with the given questId has the given objectiveId started, false otherwise, using the useQuests store's isObjectiveStarted method
+const objectiveStartedPlugin = new CommandPlugin('objective_started?', [
+    { name: 'questId', type: 'string' },
+    { name: 'objectiveId', type: 'string' },
+], async (cmd) => {
+    const { questId, objectiveId } = cmd.options;
+    const quests = useQuests();
+    return quests.isObjectiveStarted(questId, objectiveId);
+});
 
-// Write a CommandPlugin for running a label using the runLabelFunction of the useVM store
-const runLabelPlugin = new CommandPlugin('run_label', async (cmd) => {
-    const label = cmd.args[0];
-    if (!label) {
-        error(`run_label command needs a label to argument run`);
+const waitCommand = new CommandPlugin('wait', [{ name: 'duration', type: 'number' }], async (cmd) => {
+    await timeout(cmd.options.duration);
+    return useVM().nextLine();
+});
+
+const notifyPlugin = new CommandPlugin('notify', [{ name: 'text', type: 'string' }], async (cmd) => {
+    const { text } = cmd.options;
+    useNotifications().addNotification(text);
+    return useVM().nextLine();
+});
+
+const clearDialogPlugin = new CommandPlugin('clear_dialog', [], async (cmd) => {
+    useDialogStore().clearDialog();
+    return useVM().nextLine();
+});
+
+const ifCommand = new CommandPlugin('if', [{ name: 'condition', type: 'boolean' }], async (cmd) => {
+    const newBranch = runConditionCommand(cmd);
+    const vmStore = useVM();
+    if (newBranch) {
+        const newStack = {
+            branchData: {
+                branch: newBranch,
+            },
+            currentIndex: 0,
+        };
+        return vmStore.addStack(newStack);
+    }
+    return vmStore.nextLine();
+}, (ctx, parsed) => {
+    let newLine = ctx.currentLine;
+    const parser = generateParser('if', [
+        { name: 'condition', type: 'string' },
+    ]);
+    parser(ctx, parsed);
+    const { lines, currentLine, line } = ctx;
+    const command = parsed.command;
+    let failure;
+    const nextLine = getLine(lines, currentLine + 1);
+    if (nextLine && nextLine.code === 'else:') {
+        failure = ctx.processCommandsFunction(ctx.parserContext, nextLine.branch, line);
+        newLine++;
+    }
+    command.staticOptions = {
+        success: ctx.processCommandsFunction(ctx.parserContext, line.branch, line),
+        failure,
+    };
+    newLine++;
+    return {
+        newLine,
+    };
+});
+
+/* eslint-disable eqeqeq */
+// export const add: CommandRunner = async (cmd) => {
+//   const addKey = cmd.args[0];
+//   const addValue = cmd.args[1];
+//   const vm = useVM();
+//   vm.addInstruction(addKey, addValue as any);
+//   return vm.nextLine();
+// };
+const equalPlugin = new CommandPlugin('==', 'any', async (cmd) => {
+    if (cmd.args.length < 2) {
+        commandRuntimeError(cmd, `requires at least two arguments`);
+    }
+    let previousValue = cmd.args[0];
+    let allEqual = true;
+    for (const arg of cmd.args) {
+        if (arg != previousValue) {
+            allEqual = false;
+            break;
+        }
+        else {
+            previousValue = arg;
+        }
+    }
+    return allEqual;
+});
+const greaterThanPlugin = new CommandPlugin('>', [
+    { name: 'a', type: 'any' },
+    { name: 'b', type: 'any' },
+], async (cmd) => {
+    const { a, b } = cmd.options;
+    return a > b;
+});
+// Write a lesserThanPlugin, greaterOrEqualPlugin, lesserOrEqualPlugin, notEqualPlugin
+const lesserThanPlugin = new CommandPlugin('<', [
+    { name: 'a', type: 'any' },
+    { name: 'b', type: 'any' },
+], async (cmd) => {
+    const { a, b } = cmd.options;
+    return a < b;
+});
+const greaterOrEqualPlugin = new CommandPlugin('>=', [
+    { name: 'a', type: 'any' },
+    { name: 'b', type: 'any' },
+], async (cmd) => {
+    const { a, b } = cmd.options;
+    return a >= b;
+});
+const lesserOrEqualPlugin = new CommandPlugin('<=', [
+    { name: 'a', type: 'any' },
+    { name: 'b', type: 'any' },
+], async (cmd) => {
+    const { a, b } = cmd.options;
+    return a <= b;
+});
+const notEqualPlugin = new CommandPlugin('!=', [
+    { name: 'a', type: 'any' },
+    { name: 'b', type: 'any' },
+], async (cmd) => {
+    const { a, b } = cmd.options;
+    return a != b;
+});
+const notPlugin = new CommandPlugin('!', [{ name: 'a', type: 'any' }], async (cmd) => {
+    const { a } = cmd.options;
+    return !a;
+});
+// Create an andPlugin and an orPlugin
+const andPlugin = new CommandPlugin('&&', 'any', async (cmd) => {
+    const args = cmd.args;
+    if (cmd.args.length < 2) {
+        commandRuntimeError(cmd, 'requires at least two arguments');
+    }
+    return args.reduce((acc, curr) => acc && curr, true);
+});
+const orPlugin = new CommandPlugin('||', 'any', async (cmd) => {
+    if (cmd.args.length < 2) {
+        commandRuntimeError(cmd, 'requires at least two arguments');
+    }
+    return cmd.args.reduce((acc, curr) => acc || curr, false);
+});
+// Write a ternaryPlugin
+const ternaryPlugin = new CommandPlugin('?', [
+    { name: 'a', type: 'any' },
+    { name: 'b', type: 'any' },
+    { name: 'c', type: 'any' },
+], async (cmd) => {
+    const { a, b, c } = cmd.options;
+    return a ? b : c;
+});
+
+// export const add: CommandRunner = async (cmd) => {
+//   const addKey = cmd.args[0];
+//   const addValue = cmd.args[1];
+//   const vm = useVM();
+//   vm.addInstruction(addKey, addValue as any);
+//   return vm.nextLine();
+// };
+const additionPlugin = new CommandPlugin('+', 'any', async (cmd) => {
+    if (cmd.args.length < 2) {
+        commandRuntimeError(cmd, `requires at least two arguments`);
+    }
+    return cmd.args.reduce((acc, curr) => {
+        if (typeof curr === 'number') {
+            return acc + curr;
+        }
+        commandRuntimeError(cmd, `requires all arguments to be numbers`);
+        return acc;
+    }, 0);
+});
+const substractionPlugin = new CommandPlugin('-', 'any', async (cmd) => {
+    if (cmd.args.length < 2) {
+        commandRuntimeError(cmd, `requires at least two arguments`);
+    }
+    return cmd.args.reduce((acc, curr) => {
+        if (typeof curr === 'number') {
+            return acc - curr;
+        }
+        commandRuntimeError(cmd, `requires all arguments to be numbers`);
+        return acc;
+    }, 0);
+});
+// Write multiplicationPlugin and divisionPlugin
+const multiplicationPlugin = new CommandPlugin('*', 'any', async (cmd) => {
+    if (cmd.args.length < 2) {
+        commandRuntimeError(cmd, `requires at least two arguments`);
+    }
+    return cmd.args.reduce((acc, curr) => {
+        if (typeof curr === 'number') {
+            return acc * curr;
+        }
+        commandRuntimeError(cmd, `requires all arguments to be numbers`);
+        return acc;
+    }, 0);
+});
+const divisionPlugin = new CommandPlugin('/', 'any', async (cmd) => {
+    if (cmd.args.length < 2) {
+        commandRuntimeError(cmd, `requires at least two arguments`);
+    }
+    return cmd.args.reduce((acc, curr) => {
+        if (typeof curr === 'number') {
+            return acc / curr;
+        }
+        commandRuntimeError(cmd, `requires all arguments to be numbers`);
+        return acc;
+    }, 0);
+});
+
+const runChoice = async (cmd) => {
+    // Hack for us to be able to find that command again on playerAnswered
+    useVM().lastChoiceCommand = cmd;
+    const { prompt, choices } = cmd.staticOptions;
+    // For each possible choice, we run the choice prompt expression which will return us the info we need to generate the choice options
+    const choiceResults = [];
+    for (const [index, choice] of choices.entries()) {
+        const choiceResult = await runExpression(choice.prompt);
+        choiceResults.push(choiceResult);
+    }
+    // Lazy hack to store those results for after the player answers.
+    cmd.options.choiceResults = choiceResults;
+    // Convert the results into dialog options
+    const dialogChoices = choiceResults
+        .map((res, index) => {
+        let allowed = true;
+        if (res.skillCheck) {
+            allowed = res.skillCheck?.allowed ?? false;
+        }
+        const result = {
+            choice: res.text,
+            originalIndex: index,
+            allowed,
+        };
+        return result;
+    })
+        // Choices that have a null text are options that didn't pass conditions, or hidden skill checks
+        .filter((el) => el.choice);
+    runCommand(prompt, dialogChoices);
+};
+function parseChoiceOption(ctx, choice, index) {
+    const command = choice.expression;
+    if (!choice.branch) {
+        ctx.parserContext.error(choice.line, `Choice option doesn't have any branch to go to (${choice.code} - ${choice.line})`);
+    }
+    let skillBranches;
+    let mainBranch;
+    if (choice.expression[1] === 'roll') {
+        skillBranches = {
+            success: ctx.processCommandsFunction(ctx.parserContext, choice.branch[0].branch, choice),
+            failure: ctx.processCommandsFunction(ctx.parserContext, choice.branch[1].branch, choice),
+        };
+    }
+    else {
+        mainBranch = ctx.processCommandsFunction(ctx.parserContext, choice.branch, choice);
+    }
+    const choiceInfo = {
+        prompt: ctx.processCommandsFunction(ctx.parserContext, [choice], choice)[0],
+        branch: mainBranch,
+        skillBranches,
+    };
+    return choiceInfo;
+}
+const choiceParser = (ctx, parsed) => {
+    let newLine = ctx.currentLine;
+    const parser = generateParser('choice', []);
+    const { line } = ctx;
+    const command = parsed.command;
+    if (!line.branch || line.branch.length < 2) {
+        ctx.parserContext.error(line.line, `Choice menu needs to have at least one option`);
+    }
+    const prompt = line.branch[0];
+    if (!prompt) {
+        ctx.parserContext.error(ctx.line.line, `Choice prompt is missing `);
+    }
+    const choices = line.branch.slice(1);
+    const prompts = choices.map((choice, index) => {
+        if (!choice.branch) {
+            ctx.parserContext.error(choice.line, `Choice option doesn't have any branch to go to (${choice.code})`);
+        }
+        choice = getChoiceOptionLineFromChoicePrompt(ctx.parserContext, choice);
+        return parseChoiceOption(ctx, choice);
+    });
+    command.staticOptions = {
+        prompt: ctx.processCommandsFunction(ctx.parserContext, [prompt], line)[0],
+        choices: prompts,
+    };
+    newLine++;
+    return {
+        newLine,
+    };
+};
+const choicePlugin = new CommandPlugin('choice', [], runChoice, choiceParser);
+choicePlugin.onPlayerAnswered = async (command, choiceIndex) => {
+    // The player has answered, we now need to go to the right branch and perform any needed skill checks
+    const vmStore = useVM();
+    const { choices } = command.staticOptions;
+    const choice = choices[choiceIndex];
+    const choicePromptResult = command.options.choiceResults[choiceIndex];
+    let newBranch;
+    if (choicePromptResult.skillCheck) {
+        const result = runSkillCheck({
+            skill: choicePromptResult.skillCheck.skillId,
+            value: choicePromptResult.skillCheck.difficulty,
+            id: choicePromptResult.skillCheck.skillCheckId,
+            hideAfterRoll: choicePromptResult.skillCheck.hideAfterRoll,
+        });
+        if (result.succeeded) {
+            newBranch = choice.skillBranches.success;
+        }
+        else {
+            newBranch = choice.skillBranches.failure;
+        }
+    }
+    else {
+        newBranch = choice.branch;
+    }
+    if (newBranch) {
+        const newStack = {
+            currentIndex: 0,
+            branchData: {
+                branch: newBranch,
+            },
+        };
+        return vmStore.addStack(newStack);
+    }
+    else {
+        vmStore.nextLine();
+    }
+};
+// Turns a choice prompt (Which is normally just text + an optional condition) into a proper choice prompt command so it can be parsed properly
+function getChoiceOptionLineFromChoicePrompt(ctx, choice) {
+    const generatedCode = `choicePrompt ${choice.code}`;
+    const newLine = {
+        code: generatedCode,
+        indentation: choice.indentation,
+        line: choice.line,
+        branch: choice.branch,
+        expression: ['choicePrompt', ...choice.expression],
+    };
+    return newLine;
+}
+/** Custom "fake" instruction generated on choice prompts to process their optional conditions */
+const choicePromptCommandPlugin = new CommandPlugin('choicePrompt', 'any', 
+// Will return null if the choice prompt should not be used (failed condition or hidden skillcheck). Otherwise, returns the info needed to display the prompt + later run the skillcheck
+async (cmd) => {
+    const args = cmd.args;
+    if (args[0] === 'roll') {
+        const skillCheckId = args[1];
+        const skillId = args[2];
+        const difficulty = args[3];
+        const skillText = args[4];
+        const hideAfterRoll = args.length > 5 ? args[5] : false;
+        const state = useSkills().getSkillCheck(skillCheckId);
+        if (state.hidden) {
+            return {
+                text: null,
+            };
+        }
+        const skillCheckFailed = state.happened && !state.succeeded;
+        const { difficultyText, allowed } = getSkillCheckText({
+            skill: skillId,
+            skillCheckId: skillCheckId,
+            value: difficulty,
+        });
+        const text = `${difficultyText} ${skillText}`;
+        return {
+            text,
+            skillCheck: {
+                allowed: !skillCheckFailed,
+                skillId,
+                skillCheckId,
+                difficulty,
+                hideAfterRoll,
+            },
+        };
     }
-    await useVM().runLabelFunction(label);
-}, generateParser('run_label'));
+    else if (args.length > 1 && args[1] === 'if') {
+        const text = args[0];
+        let condition = true;
+        if (args.length > 2) {
+            condition = args[2];
+        }
+        if (condition) {
+            return {
+                text,
+            };
+        }
+        else {
+            return {
+                text: null,
+            };
+        }
+    }
+    else {
+        return {
+            text: args[0],
+        };
+    }
+});
 
 function registerBaseCommands(vm) {
-    vm.addCommand(addLevelPlugin);
-    vm.addCommand(addStatPlugin);
-    vm.addCommand(addXpPlugin);
-    vm.addCommand(addPlugin);
+    // Choices
     vm.addCommand(choicePlugin);
-    vm.addCommand(clearDialogPlugin);
+    vm.addCommand(choicePromptCommandPlugin);
     vm.addCommand(ifCommand);
-    vm.addCommand(jumpCommand);
+    // Stats
+    vm.addCommand(addStatPlugin);
+    vm.addCommand(setStatPlugin);
+    vm.addCommand(getStatPlugin);
+    vm.addCommand(clearDialogPlugin);
     vm.addCommand(notifyPlugin);
+    // Audio
     vm.addCommand(pauseCommand);
     vm.addCommand(playCommand);
+    vm.addCommand(stopCommand);
+    // Screens
     vm.addCommand(setButtonCommand);
     vm.addCommand(setScreenCommand);
-    vm.addCommand(setStatCommand);
+    vm.addCommand(waitCommand);
+    // Logic operations
+    vm.addCommand(equalPlugin);
+    vm.addCommand(greaterThanPlugin);
+    vm.addCommand(lesserThanPlugin);
+    vm.addCommand(greaterOrEqualPlugin);
+    vm.addCommand(lesserOrEqualPlugin);
+    vm.addCommand(notEqualPlugin);
+    vm.addCommand(notPlugin);
+    vm.addCommand(andPlugin);
+    vm.addCommand(orPlugin);
+    vm.addCommand(ternaryPlugin);
+    // Arithmetic operations
+    vm.addCommand(additionPlugin);
+    vm.addCommand(substractionPlugin);
+    vm.addCommand(multiplicationPlugin);
+    vm.addCommand(divisionPlugin);
+    // Setting variables
+    vm.addCommand(addPlugin);
     vm.addCommand(setCommand);
-    vm.addCommand(stopCommand);
-    vm.addCommand(talkCommand);
+    // Text display
     vm.addCommand(textCommandPlugin);
-    vm.addCommand(waitCommand);
-    // functions and labels
+    vm.addCommand(talkCommand);
+    // // functions and labels
     vm.addCommand(jumpCommand);
     vm.addCommand(runLabelPlugin);
-    // Quests
+    vm.addCommand(defineVariablePlugin);
+    vm.addCommand(returnPlugin);
+    // // Quests
     vm.addCommand(startQuestPlugin);
     vm.addCommand(startObjectivePlugin);
     vm.addCommand(completeObjectivePlugin);
     vm.addCommand(completeQuestPlugin);
-    // Inventory
+    vm.addCommand(questStartedPlugin);
+    vm.addCommand(objectiveStartedPlugin);
+    vm.addCommand(questCompletedPlugin);
+    vm.addCommand(objectiveCompletedPlugin);
+    // // Inventory
     vm.addCommand(addItemPlugin);
     vm.addCommand(removeItemPlugin);
     vm.addCommand(enableInteractionPlugin);
     vm.addCommand(disableInteractionPlugin);
+    vm.addCommand(hasItemPlugin);
+    vm.addCommand(itemAmountPlugin);
+    // Skills
+    vm.addCommand(addLevelPlugin);
+    vm.addCommand(addXpPlugin);
+    vm.addCommand(rollPlugin);
 }
 
 class NarratPlugin {
@@ -9662,7 +10284,7 @@ async function startApp(config, options) {
     });
     registerBaseCommands(vm);
     logManager.setupDebugger(options.debug);
-    console.log('%c Narrat game engine – 1.3.2 - June 26, 2022 18:33:37', 'background: #222; color: #bada55');
+    console.log('%c Narrat game engine – 2.0.0-rc3 - June 28, 2022 22:38:40', 'background: #222; color: #bada55');
     vm.callHook('onNarratSetup');
     app.mount('#game-holder');
     if (options.debug) {