:root{--sidebar-bg:#f4f4f4;--header-bg:#ccc;--component-button-hover-bg:gray;--general-font-size:12px;--header-font-size:14px;--ref-color:blue;--cur-color:orange}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.x-main{border:1px solid gray;width:100%}.x-header{background:var(--header-bg);border-bottom:1px solid gray;position:sticky;top:0;z-index:1000}.x-dialog{background-color:#333;border-radius:5px;color:#fff;font-size:var(--header-font-size);position:fixed;right:5px;top:5px;visibility:hidden;z-index:1000}.x-dialog.show{animation:fadein .5s,fadeout .5s 2.5s;padding:5px 10px;visibility:visible}@keyframes fadein{0%{opacity:0;right:50px}to{opacity:1;right:5px}}@keyframes fadeout{0%{opacity:1;right:5px}to{opacity:0;right:50px}}.x-description,.x-title{outline:none;padding:5px}.x-title{font-size:14px;font-weight:700}.x-description{font-size:11px;padding-bottom:10px}.x-body{display:grid;grid-template-columns:50px 1fr}.x-body.x-nosidebar{grid-template-columns:1fr}.x-content{overflow:auto;padding:5px}.x-main-footer{background:#f5f5f5;bottom:0;display:flex;gap:10px;justify-content:flex-end;padding:10px;position:sticky}.x-button{background:#c9c9c9;border:1px solid gray;border-radius:5px;cursor:pointer;font-size:var(--general-font-size);padding:5px 10px}.x-button:hover{background-color:#e6e5e5}.x-sidebar{background:var(--sidebar-bg);border:1px solid #ccc;height:-moz-fit-content;height:fit-content;margin:5px;position:sticky;top:30px;width:40px}.x-sidebar.x-empty{border:none}.x-componentBtn{cursor:pointer;padding:5px;text-align:center}.x-componentBtn:hover{background:var(--component-button-hover-bg)}.x-current-value{border-bottom:1px dashed #ccc;color:var(--cur-color)}.x-current-value,.x-ref-value{font-weight:700;padding:5px;text-align:center}.x-ref-value{color:var(--ref-color)}.x-component,.x-placeholder{background:#fff;border:1px solid gray;border-left-width:2px;border-radius:5px;margin-bottom:5px;padding:5px}.x-component:hover{border-left:2px solid blue}.x-placeholder{background:#f2f3fe;border:1px dotted #ccc}.x-component.x-component-header{background:#f5f5f5;border:none;border-radius:0;border-top:2px solid gray}.x-component.x-draggable{cursor:move}.x-component.x-dragged{opacity:.2}.x-component>div{padding:5px}div.x-required-icon{float:right;padding:0}.x-answer{font-size:var(--general-font-size)}.x-answer.x-view{background-color:#bdfff2;border-radius:5px}.x-answer-input,.x-help,.x-label{background:none;border:none;cursor:text;outline:none}.x-label{font-size:var(--general-font-size)}.x-label.x-component-header{font-size:var(--header-font-size);font-weight:700}.x-answer-input{border-bottom:1px dotted gray;font-size:var(--general-font-size);padding:5px 0 5px 2px;width:100%}input.x-answer-input[type=file]{border-bottom:none}textarea.x-answer-input{overflow:auto;resize:none}.x-answer-select{border:none;font-size:var(--general-font-size);outline:none;padding:5px 5px 5px 0}.x-correct-answer{background:#ccc;border:2px dotted gray;border-radius:5px;font-size:var(--general-font-size);padding:5px}.x-upload{border:2px dashed #f5f5f5;border-radius:10px;font-size:12px;padding:5px;text-align:center}.x-help{font-size:10px}.x-help.x-component-header{font-size:var(--general-font-size)}.x-preview:hover{background:#f5f5f5}.x-choice-row{display:flex}.x-choice-delete,.x-choice-text{background:none;border:none;outline:none}.x-choice-text{width:100%}.x-choice-point,.x-choice-text{cursor:text;font-size:var(--general-font-size);padding:5px}.x-choice-point{border:1px dotted gray;border-radius:5px;text-align:center;width:20px}.x-choice-delete{color:gray;cursor:pointer}.x-add-choice{color:#6363d1;cursor:pointer;font-size:11px;padding:5px}.x-footer{border-top:1px solid #f5f5f5;height:20px;padding:5px 0}.x-control{color:grey;display:flex;float:right;font-size:12px;gap:5px;padding:5px 0;position:relative}.x-control-item{cursor:pointer}.x-separator{border-left:1px solid gray;margin:0 5px}.x-point,.x-point-assessment{border:1px solid gray;border-radius:5px;cursor:text;display:inline-block;padding:2px;text-align:center;width:50px}.x-point{color:var(--ref-color)}.x-point-assessment{color:var(--cur-color)}.switch{--size:10px;--padding:1px;--circle:calc(var(--size) - var(--padding));--circle_color:#fff;--yes_color:#2196f3;--no_color:#ccc;--transition:0.4s;--width:calc(var(--size)*2);--height:calc(var(--size) + var(--padding));display:inline-block;height:var(--height);margin-top:2px;position:relative;width:var(--width)}.switch input{height:0;opacity:0;width:0}.switch span{background-color:var(--no_color);border-radius:var(--height);bottom:0;cursor:pointer;left:0;right:0;top:0}.switch span,.switch span:before{position:absolute;transition:var(--transition)}.switch span:before{background-color:var(--circle_color);border-radius:50%;bottom:var(--padding);content:"";height:var(--circle);left:var(--padding);width:var(--circle)}.switch input:checked+span{background-color:var(--yes_color)}.switch input:focus+span{box-shadow:0 0 1px var(--yes_color)}.switch input:checked+span:before{transform:translateX(var(--circle))}