1body { 2 display: flex; 3 flex-direction: column; 4 flex-wrap: wrap; 5} 6textarea { 7 font-family: monospace; 8} 9header { 10 font-size: 130%; 11 font-weight: bold; 12} 13.hidden, .initially-hidden { 14 position: absolute !important; 15 opacity: 0 !important; 16 pointer-events: none !important; 17 display: none !important; 18} 19fieldset.options { 20 font-size: 75%; 21} 22fieldset > legend { 23 padding: 0 0.5em; 24} 25span.labeled-input { 26 padding: 0.25em; 27 margin: 0.25em 0.5em; 28 border-radius: 0.25em; 29 white-space: nowrap; 30 background: #0002; 31} 32.center { text-align: center; } 33.error { 34 color: red; 35 background-color: yellow; 36} 37.strong { font-weight: 700 } 38.warning { color: firebrick; } 39.green { color: darkgreen; } 40.faded { opacity: 0.5; } 41.group-start { color: blue; } 42.group-end { color: blue; } 43.input-wrapper { 44 white-space: nowrap; 45 display: flex; 46 align-items: center; 47} 48#test-output { 49 border: 1px inset; 50 border-radius: 0.25em; 51 padding: 0.25em; 52 /*max-height: 30em;*/ 53 overflow: auto; 54 white-space: break-spaces; 55 display: flex; flex-direction: column; 56 font-family: monospace; 57} 58#test-output.reverse { 59 flex-direction: column-reverse; 60} 61label[for] { cursor: pointer } 62