.flex{display:flex;&.row{flex-direction:row}&.column{flex-direction:column}&.gap,&.gap-1{gap:1rem}&.gap-2,&.gap-xs{gap:2rem}&.gap-4,&.gap-s{gap:4rem}&.gap-8,&.gap-m{gap:8rem}&.gap-12,&.gap-l{gap:12rem}&.gap-16,&.gap-xl{gap:16rem}&.align-items-center{align-items:center}&.align-items-start{align-items:start}&.align-items-end{align-items:end}&.align-items-baseline{align-items:baseline}&.align-content-center{align-content:center}&.align-content-start{align-content:start}&.align-content-end{align-content:end}&.align-content-baseline{align-content:baseline}&.align-content-stretch{align-content:stretch}&.align-self-center{align-self:center}&.align-self-start{align-self:start}&.align-self-end{align-self:end}&.align-self-baseline{align-self:baseline}&.align-self-stretch{align-self:stretch}&.justify-self-center{justify-self:center}&.justify-self-start{justify-self:start}&.justify-self-end{justify-self:end}&.justify-self-baseline{justify-self:baseline}&.justify-self-stretch{justify-self:stretch}&.justify-center{justify-content:center}&.justify-start{justify-content:start}&.justify-end{justify-content:end}&.justify-between{justify-content:space-between}&.justify-stretch{justify-content:stretch}&.justify-around{justify-content:space-around}&.justify-evenly{justify-content:space-evenly}&.wrap{flex-wrap:wrap}&.nowrap{flex-wrap:nowrap}&.wrap-reverse{flex-wrap:wrap-reverse}}:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:after,*:before{padding:0;margin:0;box-sizing:border-box}:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;--topbar-height: min(2.5rem, 50px);--sidebar-width: 200px;--bg-colour: rgb(250, 250, 250);--outline-colour: rgba(0, 0, 0, .2)}.padded{padding:1rem}.inside-list-style{list-style-position:inside}.toaster{position:absolute;display:block;background:transparent;right:0;bottom:0;margin:auto;width:300px;max-width:300px;padding:.25rem}.toaster-container{display:flex;width:100%;flex-direction:column;gap:.5rem;height:fit-content}.toast{display:flex;flex-direction:column;padding:.5rem;border-radius:.25rem;box-shadow:-2px -2px 10px #bbb;z-index:1;&.ok{background:#71ce71}&.error{background:#d86060}&.info{background:#a4fff7}&.warning{background:#ffc24f}}.toast-header{display:flex;justify-content:space-between}#app-layout{--topbar-height: min(2.5rem, 50px);--sidebar-width: 200px;display:grid;place-content:center;overflow-x:hidden;height:100vh;min-height:600px;grid-template-rows:[topbar-start] var(--topbar-height) [topbar-end view-start] 1fr [view-end];grid-template-columns:min-content 1fr;grid-template-areas:"topbar topbar" "sidebar content"}#app-topbar{background-color:#fff;grid-area:topbar}#app-sidebar{background-color:var(--bg-colour);grid-area:sidebar;z-index:1;top:var(--topbar-height);.sidebar-container{width:0px;left:-200px;position:absolute;&.show{left:0;width:var(--sidebar-width);position:relative}}}#app-content{width:100vw;background-color:var(--bg-colour);grid-area:content;box-shadow:0 0 5px 2px var(--outline-colour);z-index:1}@media screen and (max-width: 800px){#app-sidebar{position:absolute;height:calc(100% - var(--topbar-height))}}.tab-bar{height:100%;display:flex;align-items:end}.tab{display:flex;gap:6px;align-items:center;background:#fff;padding:2px .5rem 8px;border-radius:2px 2px 0 0;border:solid var(--outline-colour);border-width:1px 0px 0px 1px;&:last-of-type{border-width:1px 1px 0px 1px}&:has(.tab-label.active){background-color:var(--bg-colour)}.tab-label{color:#8f8f8f;text-decoration:none;&.active{color:#67a4ff}}&:has(.tab-label.active){z-index:2}.tab-close{font-size:x-small;opacity:20%;margin-left:.25rem;&:hover{opacity:100%;cursor:pointer}}}.modal-container{position:fixed;background:#f0f8ff;left:0;top:20vw;right:0;bottom:0;margin:0 auto auto;width:clamp(300px,90vw,min(90vw,400px));height:fit-content;overflow:auto;z-index:1001;padding:.25rem}.modal-header{display:flex;width:100%;padding:4px;align-items:center;justify-content:space-between}.modal-body{max-height:fit-content}.modal-footer{display:flex;width:100%;justify-content:flex-end;gap:.5rem}.modal-backdrop{position:absolute;inset:0;opacity:.3;background:#000;z-index:1000}@media screen and (max-width: 500px){.modal-container{top:0;width:100%;height:100%}}.element-form{display:flex;flex-direction:row;flex-wrap:wrap;column-gap:1.25rem;padding:8px}.md-preview{padding:8px;background-color:#fff;outline:rgb(118,118,118) solid 1px;border-radius:2px}.form-group{margin-bottom:8px;label.form-label:has(+input:not([type=radio]).form-control,+select.form-control,+textarea.form-control){display:block}input[type=checkbox].form-control+label.form-label{margin-left:4px}fieldset.form-group{select.form-control{width:100%}padding:4px}select.form-control{min-width:clamp(60px,10vw,100%)}input[type=radio]+label.form-label{margin-left:4px}ul:has(li .form-control+.form-label){list-style-type:none}}.no-resize{resize:none}.form-editor{display:flex;flex-direction:column;gap:8px;padding:.75rem;.form-options{display:flex;flex-direction:column;gap:8px;padding:4px;.form-options-row{display:flex;flex-direction:row;gap:8px;fieldset{padding:4px}}}.form-editor-table{border-collapse:collapse;border-spacing:0;width:100%;td,th{border:1px solid #dddddd;text-align:left;padding:8px}}}.options-table{.options-table-item{display:flex;flex-direction:row;gap:.5rem}}
