.draggable {
    display: block;
    height: auto;
    position: fixed;
    /*   width: 270px; */
    cursor: move;
    border: 1px solid red;
    z-index:1;
  }
  
  #options {
    background: lightgrey;
    position: relative;
    padding: 10px;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
  }
  
  body {
    background: darkgrey;
    overflow: hidden;
    width: "100%";
    height: "100%";
    margin:0;
  }
  
  :root {
    --bottom:0px;
    --right:0px;
  }
  
  #outputHolder {
    border: 2px solid black;
    position: fixed;
    z-index: 2;
    top: var(--top, unset);
    bottom: var(--bottom, unset);
    left: var(--left, unset);
    right: var(--right, unset);
    margin: 10px; /*   max-width: 50%;
    max-height: 50%; */
    max-height: calc(min(100%, 200px));
    max-width: calc(min(100%, 500px));
    width: calc(100% - 20px);
    height: calc(100% - 20px);
  }
  #outputHolder textarea {
    resize: none;
    padding: 10px;
    width: calc(100% - 24px);
    height: calc(100% - 44px);
  }
  #outputHolder div {
    display: flex;
    height: 20px;
    flex-wrap: nowrap;
  }
  #outputHolder div button {
    flex-grow: 6;
  }
  
  #updown,#leftright {
    flex-grow: 0 !important
  }