<script lang="ts">
let content = "私は細胞ですが、肉はエヌですか?";
</script>

<textarea name="content" id="content" bind:value={content}></textarea>

<div id="main" class="main">
  {@html content}
</div>

<style>
  @font-face { font-family: k8x12S; src: url(../../lib/assets/k8x12S.ttf); }
  @font-face { font-family: muzai-pixel; src: url(../../lib/assets/MZPXorig.ttf); }

  #main {
    font-family: k8x12S, muzai-pixel;
    font-size: 48px;
    display: block;
    color: #c9d1d9;
    background-color: #0d1117;
    width: fit-content;
    max-width: 600px;
    padding: 10px;
  }

  :global(html, body) {
    background-color: #0d1117;
    color: #c9d1d9;
  }
</style>
