@layer patchwork, tool, user;
html,
body {
  overscroll-behavior: none;
  font-family: system-ui, sans-serif;
  background-color: black;
  color: white;
}

html {
  font-size: 16px;
  height: 100%;
  height: 100vh;
  height: 100dvh;

  @media all and (display-mode: standalone) {
    height: 100lvh;
  }
}

patchwork-view {
  display: block;
  height: 100%;
  width: 100%;
  contain: layout;
  opacity: 0;
}

patchwork-view.mounted {
  opacity: 1;
}

body > patchwork-view {
  height: 100vh;
  height: 100dvh;
  width: 100vw;
  width: 100dvw;

  @media all and (display-mode: standalone) {
    height: 100lvh;
    width: 100lvw;
  }
}
@font-face {
  font-family: FifteenTwenty;
  src: url("data:font/woff2;base64,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");
}

body {
  margin: 0;
}

.tenfold {
  display: flex;
  margin: 0;
  color: #fff;
  background: #000;
  overflow: hidden;
  height: 100%;
  width: 100%;
  font-family: FifteenTwenty;

  * {
    box-sizing: border-box;
  }

  canvas {
    display: block;
  }

  aside {
    position: relative;
    display: flex;
    flex-flow: column;
    flex: 1 1 100%;
    height: 100%;

    & > * {
      display: flex;
      flex-direction: column;
      flex: 1 1 auto;
      font-size: 18px;
    }

    #spark {
      display: none; /* turned off for now, while we do friends-of-the-lab */
      flex: 0 0 50px;
      width: 100%;
      height: 50px;
    }

    #message-field {
      display: none; /* turned off for now, while we do friends-of-the-lab */
      position: absolute;
      inset: 0;
      width: 100%;
      height: 1em;
      color: #f00;
      pointer-events: none;
    }

    #synth-editor {
      display: none; /* turned off for now, while we do friends-of-the-lab */
      width: 100%;
      height: 100%;
      outline: none;
    }
  }

  .tenfold-docs {
    padding: 16px 0;
    line-height: 1.5;

    h2 {
      margin: 0 0 8px;
      font-size: 24px;
    }

    p {
      margin: 4px 0;
      opacity: 0.7;
    }

    a {
      color: #fff;
    }
  }

  .tenfold-hint-bar {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-top: auto;
  }

  .tenfold-hint {
    font-size: 14px;
    opacity: 0.6;
  }

  .tenfold-hint-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #fff;
    opacity: 0.4;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;

    input[type="checkbox"] {
      appearance: none;
      width: 10px;
      height: 10px;
      border: 1.5px solid #fff;
      border-radius: 50%;
      margin: 0;
      cursor: pointer;

      &:checked {
        background: #fff;
      }
    }
  }

  .cm-editor {
    width: 100%;
    height: 100%;
    overflow: auto;
  }

  .cm-editor *,
  .cm-editor * * {
    caret-color: cyan !important;
  }

  .cm-lintRange-error {
    background: none !important;
    text-decoration: underline;
    text-decoration-style: wavy;
    text-decoration-thickness: 2px;
    text-decoration-skip-ink: none;
    text-decoration-color: #f00;
  }

  .cm-matchingBracket {
    background-color: #ffffff66 !important;
  }
}