.draggable {
  cursor: move !important;
  /* fallback if grab cursor is unsupported */
  cursor: grab !important;
  cursor: -webkit-grab !important; }

.drag-target {
  background-color: #e9f1f4; }

.drop-zone {
  height: clamp(0.1rem, 2vh, 0.5rem);
  transition: height 0.2s linear;
  cursor: default;
  width: calc(100% - 0.5rem);
  margin-left: 0.5rem; }

.expanded-drop-zone {
  height: clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem); }

.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24; }

.button, .menu-button, .spawn-button, .bin, .navigation-button, .new-proof-button, .symbol-button, .rule-button, .example-button {
  display: flex;
  justify-content: center;
  align-items: center;
  outline: 0;
  cursor: pointer;
  font-size: calc(clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem) - 0.5rem);
  vertical-align: middle;
  border: 1px solid;
  border-radius: 6px;
  color: #24292e;
  background-color: transparent;
  transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);
  text-decoration: none;
  border-color: #1b1f2326;
  box-shadow: rgba(27, 31, 35, 0.04) 0px 1px 0px 0px, rgba(255, 255, 255, 0.25) 0px 1px 0px 0px inset;
  user-select: none; }

.disabled, .button:disabled, .menu-button:disabled, .spawn-button:disabled, .bin:disabled, .navigation-button:disabled, .new-proof-button:disabled, .symbol-button:disabled, .rule-button:disabled, .example-button:disabled {
  color: #cccccc;
  background-color: #f5f5f5;
  border-color: #e0e0e0;
  cursor: not-allowed;
  pointer-events: none;
  opacity: 0.6;
  box-shadow: none; }

.menu-button:hover, .spawn-button:hover, .navigation-button:hover, .new-proof-button:hover {
  background-color: #e9f1f4; }

.symbol-button:hover, .rule-button:hover, .example-button:hover {
  background-color: #f3f7fa; }

.menu-button:active, .navigation-button:active {
  transform: scale(0.9); }

.tooltip-right, .tooltip-bottom {
  position: absolute;
  border: 1px solid;
  border-radius: 2px;
  width: fit-content;
  padding: 0.5vh 0.5vw;
  white-space: pre;
  background-color: #ffffff;
  color: #000;
  font-size: calc(clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem) - 0.5rem); }

.tooltip-right:empty, .tooltip-bottom:empty {
  display: none; }

.tooltip-right {
  position-area: right;
  position-anchor: --tooltip; }

.tooltip-bottom {
  position-area: bottom;
  position-anchor: --tooltip; }

.tooltip-container {
  anchor-scope: --tooltip; }

.tooltip-anchor {
  anchor-name: --tooltip; }

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #ffffff;
  border-bottom: 1px solid #e0e0e0;
  font-size: clamp(1.5rem, calc(2.5vw + 1rem), 2.25rem);
  padding: 1vh;
  height: calc(clamp(1.5rem, calc(2.5vw + 1rem), 2.25rem) + 2vh); }

.logo-header {
  display: flex;
  flex-direction: row;
  gap: 0.5vw;
  height: 100%;
  font-size: clamp(1.5rem, calc(2.5vw + 1rem), 2.25rem); }

@media only screen and (max-width: 1200px) {
  .logo-header > h1 {
    width: 0;
    overflow: hidden; } }
.logo-header > h1 {
  font-size: clamp(1.5rem, calc(2.5vw + 1rem), 2.25rem);
  display: flex;
  flex-direction: row;
  justify-content: center; }

.logo-header > img {
  height: clamp(1.5rem, calc(2.5vw + 1rem), 2.25rem); }

.menu-button {
  border: none; }

.proof-actions-header {
  display: flex;
  flex-direction: row;
  height: 100%;
  gap: 1vw;
  font-size: calc(clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem) - 0.5rem); }

.spawn-button {
  width: 3rem; }

.bin {
  width: max(6vw, 3rem);
  cursor: help; }

.navigation-button {
  width: 3rem;
  border: none;
  border-radius: 0; }

.navigation-container {
  display: inline-flex;
  height: 100%;
  border: 1px solid #d1d5db;
  overflow: hidden;
  margin-left: 1vw;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); }

.navigation-container:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px; }

.navigation-container:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px; }

.proof-container-border {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: calc(100dvh - calc(clamp(1.5rem, calc(2.5vw + 1rem), 2.25rem) + 2vh));
  overflow: auto;
  -ms-overflow-style: none;
  scrollbar-width: none; }

.proof-container {
  margin-top: 1vh;
  margin-bottom: 1vh;
  padding: 1vh;
  background-color: #ffffff;
  border-radius: 0.5vw;
  display: flex;
  flex-direction: row;
  width: 95%;
  height: fit-content;
  overflow-y: auto;
  -ms-overflow-style: none;
  scrollbar-width: none; }

.line-no-container {
  color: #4c4f69;
  display: flex;
  flex-direction: column;
  width: 5%; }

.line-no {
  color: #4c4f69;
  padding: 0;
  margin: 0;
  font-size: clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem);
  font-family: "Fira Sans", monospace; }

.formulae-container {
  box-sizing: border-box;
  width: 70%; }

.formula-container {
  display: flex;
  align-items: center;
  width: calc(100% - 0.5rem);
  margin-left: 0.5rem; }

.formula-container:hover > .formula-input {
  background-color: #e9f1f4;
  transition: 0.1s linear; }

.formula-input {
  border: none;
  color: black;
  width: 100%;
  padding-left: 0.3vw;
  margin: 0;
  font-size: clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem);
  font-family: "Fira Sans", monospace; }

.subproof {
  position: relative;
  width: calc(100% - 0.5rem);
  border-left: 0.2rem solid #c1c9cc;
  margin-left: 0.5rem; }

.subproof > .subproof:not(:has(.subproof:hover, .formula-container:hover, .rule-container:hover, .drop-zone:not(.last-assumption):hover)):hover {
  background-color: #e9f1f4;
  transition: 0.1s linear; }

.last-assumption {
  border-bottom: 0.2rem solid #c1c9cc;
  margin-left: 0 !important;
  margin-bottom: 5px; }

.empty-last-assumption {
  margin-bottom: 5px; }

.rule-input.has-error {
  color: red; }

.rules-container {
  width: 25%; }

.empty-rule {
  padding: 0;
  margin: 0;
  font-family: "Fira Sans", monospace;
  font-size: clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem);
  height: fit-content; }

.rule-container {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0;
  margin: 0;
  position: relative;
  background-color: transparent;
  cursor: pointer; }

.rule-container:hover > .rule-input {
  background-color: #e9f1f4;
  transition: 0.1s linear; }

.rule-input {
  color: black;
  border: none;
  width: 100%;
  padding: 0;
  margin: 0;
  font-family: "Fira Sans", monospace;
  font-size: clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem); }

.sidebar {
  background-color: #f3f7fa;
  border-right: 1px solid #e0e0e0;
  z-index: 110;
  height: calc(100dvh - calc(clamp(1.5rem, calc(2.5vw + 1rem), 2.25rem) + 2vh));
  overflow-x: auto;
  scrollbar-width: none;
  transition: width 0.3s ease-in-out; }

.sidebar-content {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: 20vw;
  padding: 2vh 0 2vh 0;
  gap: 2vh;
  font-family: inherit;
  font-size: clamp(1rem, calc(1vw + 0.75rem), 1.125rem);
  border-right: 1px solid #e0e0e0; }

.sidebar-closed {
  width: 0;
  transition: width 0.3s ease-in-out; }

@media only screen and (max-width: 1200px) {
  .sidebar {
    position: absolute; }

  .sidebar-open {
    width: 70vw; }

  .sidebar-content {
    width: 70vw; } }
.sidebar-element {
  background-color: #ffffff;
  color: black;
  border: 1px solid #dadce0;
  border-radius: 8px;
  margin: 0px 16px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03); }

details > summary {
  list-style: none;
  cursor: pointer;
  user-select: none; }

details > summary::-webkit-details-marker {
  display: none; }

details[open] > summary > .summary-arrow {
  transform: rotate(180deg); }

details > summary > .summary-arrow {
  transition: 0.3s; }

::details-content {
  transition: height 0.3s ease, content-visibility 0.3s ease allow-discrete;
  height: 0;
  overflow: clip; }

[open]::details-content {
  height: auto; }

@supports (interpolate-size: allow-keywords) {
  :root {
    interpolate-size: allow-keywords; } }
.sidebar-header {
  font-family: inherit;
  font-size: clamp(1rem, calc(1vw + 0.75rem), 1.125rem);
  font-weight: 500;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5vh 0.5vw; }

.icon-text {
  gap: 1rem;
  display: flex;
  justify-content: center; }

.row-sidebar-content, .column-sidebar-content {
  width: 100%;
  padding: 0.5vh 0.5vw;
  gap: 0.5vh;
  display: flex;
  justify-content: center; }

.row-sidebar-content {
  flex-direction: row;
  flex-wrap: wrap;
  font-size: smaller; }

.column-sidebar-content {
  flex-direction: column;
  font-size: smaller; }

.new-proof-button {
  padding: 0.5vh 0.5vw; }

.symbol-button {
  padding: 0.5vh 0.5vw;
  width: 2em; }

.rule-button {
  font-family: "Fira Sans", monospace;
  padding: 0.5vh 0.5vw;
  width: 100%;
  letter-spacing: 0.1em; }

.tooltip-container:has(.rule-button) {
  width: 4rem; }

.example-button {
  padding: 0.5vh 0.5vw;
  width: 100%;
  justify-content: left; }

.app-container {
  display: flex;
  flex: 1;
  flex-direction: column;
  background-color: #e9f1f4;
  font-size: clamp(1.125rem, calc(2vw + 0.75rem), 1.5rem); }

.content-container {
  display: inline-flex;
  width: 100%;
  height: 100%; }

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0; }

body {
  font-family: "Fira Sans", system-ui, -apple-system, sans-serif;
  overflow: clip; }

button,
input {
  background-color: transparent; }

input:focus {
  outline: none; }

ul {
  list-style-position: inside; }

/*# sourceMappingURL=style.css.map */
