misode.github.io/assets/index.0cf0bfe3.css

:root{--background-1:#1b1b1b;--background-2:#252525;--background-3:#2f2f2f;--background-4:#3d3d3d;--background-5:#464646;--text-1:#ffffff;--text-2:#dcdcdc;--text-3:#c3c3c3;--accent-primary:#50baf9;--accent-success:#3eb84f;--nav:#91908f;--nav-hover:#b4b3b0;--nav-faded:#4d4c4c;--nav-faded-hover:#6e6e6e;--selection:#6786dd99;--errors-background:#62190f;--errors-text:#ffffffcc}:root[data-theme=light]{--background-1:#fafafa;--background-2:#e2e2e2;--background-3:#d4d3d3;--background-4:#cccccc;--background-5:#d6d6d6;--text-1:#000000;--text-2:#505050;--text-3:#6a6a6a;--accent-primary:#088cdb;--accent-success:#1a7f37;--nav:#343a40;--nav-hover:#565d64;--nav-faded:#9fa2a7;--nav-faded-hover:#bcbfc3;--selection:#6786dd99;--errors-background:#f66653;--errors-text:#000000cc}@media (prefers-color-scheme:light){:root[data-theme=system]{--background-1:#fafafa;--background-2:#e2e2e2;--background-3:#d4d3d3;--background-4:#cccccc;--background-5:#d6d6d6;--text-1:#000000;--text-2:#505050;--text-3:#6a6a6a;--accent-primary:#088cdb;--accent-success:#1a7f37;--nav:#343a40;--nav-hover:#565d64;--nav-faded:#9fa2a7;--nav-faded-hover:#bcbfc3;--selection:#6786dd99;--errors-background:#f66653;--errors-text:#000000cc}}*{box-sizing:border-box;margin:0;padding:0}::selection{background-color:var(--selection)}a svg{pointer-events:none}body{font-size:18px;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden;background-color:var(--background-1)}header{display:flex;justify-content:space-between;align-items:center;padding:10px;width:100%;height:56px;z-index:5;position:fixed;box-shadow:0 0 9px -3px #000;background-color:var(--background-2)}body[data-panel=home] header,body[data-panel=settings] header{position:fixed}.title{display:flex;align-items:center}.title h2{color:var(--nav)}.home-link{margin:0 8px 0 0}.home-link svg{display:block;width:32px;height:32px;padding:2px}.home-link svg rect:nth-child(2n){transition:transform .2s}.home-link:hover rect:nth-child(2){transform:translateX(-8px)}.home-link:hover rect:nth-child(4){transform:translateX(-11px)}.home-link:hover rect:nth-child(6){transform:translateX(-6px)}nav ul{display:flex;align-items:center}nav li{display:flex;align-items:center;cursor:pointer;margin:0 16px;fill:var(--nav);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.home-link:hover svg{fill:var(--nav-hover)}nav li.dimmed svg{fill:var(--nav-faded)}nav li.dimmed:hover svg{fill:var(--nav-faded-hover)}nav li svg,nav li>*{width:24px;height:24px}.title .btn-menu{margin:0 8px}.title .btn-menu>.btn svg{width:24px;height:24px}header .btn-menu>.btn{background:0 0!important;padding:0;box-shadow:none;fill:var(--nav)}header .btn-menu>.btn:hover{fill:var(--nav-hover)}main{padding-top:68px;color:var(--text-1);fill:var(--text-1);transition:padding .3s}.controls{display:flex;justify-content:flex-end;position:fixed;top:12px;right:16px;z-index:1;pointer-events:none}main>.controls{position:sticky;margin-right:16px;right:16px;top:68px}.controls>*{pointer-events:all}.controls>:not(:last-child){margin-right:8px}.tree{margin-top:-36px;overflow-x:auto;padding:4px 16px 50vh}.error+.tree{margin-top:0}.popup-source{position:fixed;display:flex;flex-direction:column;width:40vw;left:100%;bottom:0;z-index:1;transition:transform .3s;border-radius:6px 0 0 0}.popup-source.shown{transform:translateX(-100%)}.source{width:100%;height:40vh;max-height:50vh;padding:12px;border:none;font-family:Consolas,monospace;font-size:14px;white-space:pre;overflow-wrap:normal;overflow-x:auto;tab-size:4;-moz-tab-size:4;-o-tab-size:4;-webkit-tab-size:4;outline:0;resize:none;position:static;background-color:var(--background-2);border-top-left-radius:6px;color:var(--text-1);box-shadow:0 0 7px -3px #000}.popup-preview{position:fixed;display:flex;flex-direction:column;height:calc(100% - 56px);width:40vw;left:100%;bottom:0;z-index:1;background-color:var(--background-2);box-shadow:0 0 7px -3px #000;transition:transform .3s}main.has-preview{padding-right:40vw}.popup-preview.shown{transform:translateX(-100%)}.popup-preview canvas{width:100%;background-color:var(--nav-faded);display:block;cursor:crosshair;image-rendering:-moz-crisp-edges;image-rendering:-webkit-crisp-edges;image-rendering:crisp-edges;image-rendering:pixelated;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.btn{display:flex;align-items:center;border:none;height:32px;border-radius:6px;padding:7px 11px;cursor:pointer;outline:0;font-size:1rem;white-space:nowrap;background-color:var(--background-4);box-shadow:0 1px 7px -2px #000;color:var(--text-2);fill:var(--text-2);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.btn.active{color:var(--accent-primary);fill:var(--accent-primary)}.btn:not(.btn-input):hover{background-color:var(--background-5)}.btn.no-pointer{pointer-events:none}.btn svg:not(:last-child){margin-right:5px}.btn-menu:not(.no-relative){position:relative}.btn-menu>.btn{height:100%}.btn-menu .btn-group{display:flex;flex-direction:column;position:absolute;right:0;top:100%;margin-top:8px}.btn-group{border-radius:6px;box-shadow:0 0 7px -2px #000}.btn-group .btn{box-shadow:none}.btn-group .btn:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group .btn:not(:first-child),.btn-menu .result-list .btn:first-child{border-top-right-radius:0;border-top-left-radius:0}.btn-input{cursor:initial;padding-right:7px}.btn-input input{background:var(--background-1);color:var(--text-1);font-size:17px;border:none;padding:0 3px;margin-left:5px;width:100px}.btn-input.large-input{padding:5px;padding-left:11px}.btn-input.large-input input{width:100%;height:100%}.btn-menu .result-list{display:block;width:380px;height:unset;overflow-y:auto;overflow-x:hidden;max-height:240px;border-bottom-left-radius:6px;border-bottom-right-radius:6px}.popup-actions{display:flex;position:fixed;bottom:8px;left:100%;z-index:5;padding:0 8px;border-top-left-radius:24px;border-bottom-left-radius:24px;background-color:var(--background-4);box-shadow:0 0 7px -3px #000;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;transform:translateX(var(--offset));transition:padding .1s,transform .3s}.popup-actions:hover{background-color:var(--background-5)}.popup-action{padding:12px;fill:var(--text-2);cursor:pointer}.popup-action:not(.shown){pointer-events:none;order:1;visibility:hidden}.popup-action>svg{display:block;width:24px;height:24px}.popup-action.action-preview{fill:var(--accent-primary)}.popup-action.action-copy.active{fill:var(--accent-success)}.error{padding:5px 14px;margin:12px 16px;color:var(--text-1);background-color:var(--errors-background);border-radius:3px}.error>*{margin:10px 0}.error .error-dismiss{float:right;cursor:pointer;margin-left:10px}.error-dismiss svg{display:block;width:24px;height:24px}.error a{color:var(--text-1)}.home{padding:16px}.generator-picker{display:flex}.home.center{flex-direction:column;align-items:center;color:var(--nav)}.home.center p{padding-bottom:20px;text-align:center;font-size:20px}.home{max-width:960px;margin:0 auto}.tool-card{display:flex;padding:10px;margin-bottom:8px;color:var(--text-2);background-color:var(--background-2);box-shadow:1px 1px 7px -3px #000;border-radius:6px;text-decoration:none}.tool-card:hover{background-color:var(--background-3)}.tool-card svg{width:32px;height:32px;flex-shrink:0;margin-right:8px}.tool-card h3{font-weight:unset}.tool-card p{color:var(--text-3)}hr{margin:12px 0;border:none}.settings{padding:20px}.settings p{color:var(--nav);padding:8px;border-bottom:2px solid var(--background-4)}.field-list{width:100%;border-collapse:collapse;list-style-type:none}.field-list li{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px solid var(--background-4)}.field-prop{display:inline-flex;align-items:center;max-width:100%;margin:4px}.field-prop>input,.field-prop>label{height:34px;color:var(--text-1);margin-right:-1px;border:1px solid;border-color:var(--nav-faded-hover)}.field-prop label{padding:0 9px;line-height:1.94rem;background-color:var(--node-background-label);white-space:nowrap;border-top-left-radius:3px;border-bottom-left-radius:3px}.field-prop input{width:100%;line-height:1.6rem;background-color:var(--node-background-input);color:var(--text-1);padding-left:9px;font-size:18px;border-top-right-radius:3px;border-bottom-right-radius:3px}.field-prop svg{padding:4px;margin:0 4px;height:28px;width:28px;fill:var(--nav);cursor:pointer}.field-prop .hidden svg{fill:#be4b2e}.field-prop .dimmed svg{fill:var(--nav-faded)}.very-large{font-size:80px;font-weight:100}[data-ea-publisher]{margin:0 16px 8px}.ea-content{margin:0!important;background:var(--background-2)!important}.ea-content span{color:var(--text-2)!important}.ea-content strong{color:var(--accent-primary)!important}.ea-callout{margin:.25rem 0!important;padding:0!important}.ea-callout a{color:var(--text-3)!important}@keyframes spinner{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes fadein{from{opacity:0}to{opacity:1}}@media screen and (max-width:1300px){main.has-preview .tree{margin-top:8px}}@media screen and (max-width:800px){main .tree{margin-top:4px!important}}@media screen and (max-width:580px){.title h2{font-size:18px}body nav li{margin:0 8px}main.has-preview{padding-right:0}main .controls{top:64px}.tree{padding-left:8px;padding-right:8px}.popup-source{width:100vw}.source{border-radius:0}.popup-preview{width:100vw;height:unset;bottom:0;background-color:transparent;box-shadow:none}.popup-preview canvas{margin-top:8px}.btn-menu .result-list,.btn.btn.large-input{width:calc(100vw - 10px)}.generator-picker{justify-content:center}.field-list li{flex-direction:column}.field-prop{width:100%}.field-prop input{width:100%}}:root{--node-border:#4e4e4e;--node-background-label:#1b1b1b;--node-background-input:#272727;--node-text:#dadada;--node-text-dimmed:#b4b4b4;--node-selected:#ad9715;--node-selected-border:#8d7a0d;--node-add:#487c13;--node-add-border:#3b6e0c;--node-remove:#9b341b;--node-remove-border:#7e1d05;--node-indent-border:#454749;--node-popup-background:#0a0a0ae6;--node-popup-text:#dadada;--node-popup-text-dimmed:#b4b4b4;--category-predicate:#306163;--category-predicate-border:#224849;--category-predicate-background:#1d3333;--category-function:#838383;--category-function-border:#6b6b6b;--category-function-background:#414141;--category-pool:#386330;--category-pool-border:#2e4922;--category-pool-background:#21331d}:root[data-theme=light]{--node-border:#bcbfc3;--node-background-label:#e4e4e4;--node-background-input:#ffffff;--node-text:#000000;--node-text-dimmed:#2c2c2c;--node-selected:#f0e65e;--node-selected-border:#b9a327;--node-add:#9bd464;--node-add-border:#498d09;--node-remove:#e76f51;--node-remove-border:#be4b2e;--node-indent-border:#b9b9b9;--node-popup-background:#1f2020e6;--node-popup-text:#dadada;--node-popup-text-dimmed:#b4b4b4;--category-predicate:#65b5b8;--category-predicate-border:#187e81;--category-predicate-background:#95c5c7;--category-function:#979fa7;--category-function-border:#788086;--category-function-background:#dce0e4;--category-pool:#76b865;--category-pool-border:#398118;--category-pool-background:#b1d6a6}@media (prefers-color-scheme:light){:root[data-theme=system]{--node-border:#bcbfc3;--node-background-label:#e4e4e4;--node-background-input:#ffffff;--node-text:#000000;--node-text-dimmed:#2c2c2c;--node-selected:#f0e65e;--node-selected-border:#b9a327;--node-add:#9bd464;--node-add-border:#498d09;--node-remove:#e76f51;--node-remove-border:#be4b2e;--node-indent-border:#b9b9b9;--node-popup-background:#1f2020e6;--node-popup-text:#dadada;--node-popup-text-dimmed:#b4b4b4;--category-predicate:#65b5b8;--category-predicate-border:#187e81;--category-predicate-background:#95c5c7;--category-function:#979fa7;--category-function-border:#788086;--category-function-background:#dce0e4;--category-pool:#76b865;--category-pool-border:#398118;--category-pool-background:#b1d6a6}}.node-header{display:inline-flex;position:relative;align-items:center;width:100%}.node-header>*{height:34px;border:1px solid;color:var(--node-text);border-color:var(--node-border)}.node-header>label{align-self:flex-start;padding:0 9px;line-height:1.94rem;white-space:nowrap;user-select:none;background-color:var(--node-background-label)}.node-header>input{font-size:18px;padding-left:9px;background-color:var(--node-background-input)}.node-header>input[type=color]{padding:0 2px}.node-header>textarea{min-width:236.33px;min-height:34px;font-size:18px;padding-left:9px;padding-top:5px;background-color:var(--node-background-input)}.node-header>datalist,.node-header>select{font-size:18px;padding-left:6px;background-color:var(--node-background-input)}.node-header button{font-size:18px;padding:0 9px;line-height:1.94rem;white-space:nowrap;user-select:none;cursor:pointer;background-color:var(--node-background-input)}.object-node>.node-header>.collapse{cursor:pointer}.node-error+.fixed-list~input,.node-error~input:last-child,.node-error~input[list]:nth-last-child(2),.node-error~select:last-child{border-color:var(--node-remove)!important}.node-header>:focus{position:relative}.node-header>.node-icon{order:1}.node-header>.node-icon+*,.node-header>:first-child{border-top-left-radius:3px;border-bottom-left-radius:3px}.node-header>:last-child,.node-header>input[list]:nth-last-child(2){border-top-right-radius:3px;border-bottom-right-radius:3px}.node-header>*{margin-right:-1px}.list-node>.node-header>:first-child,.map-node>.node-header>:first-child,.object-node:not(.no-body)>.node-header>:first-child{border-top-left-radius:8px;border-bottom-left-radius:0}button.selected{background-color:var(--node-selected);border-color:var(--node-selected-border)}.collapse svg{fill:var(--node-text)}.collapse.closed,button.add{background-color:var(--node-add);border-color:var(--node-add-border)}.collapse.open,button.remove{background-color:var(--node-remove);border-color:var(--node-remove-border)}.node-header>button svg{display:inline-block;position:relative;top:2px;fill:var(--node-text)}.node-header>button.add:last-child,.node-header>button.collapse:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.node-move{display:flex;flex-direction:column;width:34px}button.move{height:50%;border:none;display:flex}button.move+button.move{border-top:1px solid var(--node-border)}button.move:disabled{cursor:unset;fill:var(--node-border)}.node-icon{border:none;position:relative;display:inline-block}.node-icon .icon-popup{visibility:hidden;width:240px;background-color:var(--node-popup-background);color:var(--node-popup-text);text-align:center;border-radius:6px;padding:8px 4px;position:absolute;z-index:2;top:125%;left:50%;margin-left:-120px}.node-icon .icon-popup::after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-3px;border-width:5px;border-style:solid;border-color:transparent transparent var(--node-popup-background) transparent}.node-icon svg:hover+.icon-popup,.node-icon.show .icon-popup{visibility:visible}.node-icon svg{height:34px;width:34px;min-width:34px;margin-left:6px;cursor:pointer}.node-icon.node-help svg{fill:var(--node-border)}.node-icon.node-error svg{fill:var(--node-remove)}.node-menu{position:absolute;left:0;top:100%;width:min-content;margin-top:4px;margin-left:4px;z-index:1;color:var(--node-popup-text);font-size:16px;border-radius:3px;background-color:var(--node-popup-background)}.node-menu::after{content:"";position:absolute;bottom:100%;left:0;margin-left:6px;border-width:5px;border-style:solid;border-color:transparent transparent var(--node-popup-background) transparent}.menu-item{padding:4px;display:flex;align-items:center;white-space:normal}.menu-item>*{margin-right:4px}.menu-item .btn{padding:8px}span.menu-item{padding:4px 8px}.menu-item-context{color:var(--node-popup-text-dimmed)}.node-message{color:var(--node-text-dimmed);margin:6px 0}.node{margin-bottom:4px}.node-body>.node:first-child{margin-top:4px}.node:last-child{margin-bottom:0}.node-body{border-left:3px solid var(--node-indent-border)}.node-body{display:flex;flex-direction:column;padding-left:18px}.node-entry>.object-node>.node-body{padding-left:0}.node-entry>.object-node>.node-body>.node>.node-body{border-left:none}.node-entry>.object-node>.node-body>.node>.node-header>.node-icon+*,.node-entry>.object-node>.node-body>.node>.node-header>:first-child{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.node-entry{display:flex;flex-direction:column;margin-top:4px}.node-entry>.list-node[data-category],.node-entry>.map-node[data-category],.node-entry>.object-node[data-category]{width:100%;min-width:max-content;padding:5px;padding-left:0;margin-top:8px;border:2px solid var(--node-border);border-radius:3px}.node-entry:first-child>.list-node[data-category],.node-entry:first-child>.map-node[data-category],.node-entry:first-child>.object-node[data-category]{margin-top:4px}.node-entry>.object-node[data-category]>.node-header>.node-icon+*,.node-entry>.object-node[data-category]>.node-header>:first-child{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}.node-entry>.list-node[data-category]>.node-body,.node-entry>.map-node[data-category]>.node-body,.node-entry>.object-node[data-category]>.node-body{border:none}.range-node select{width:25px}.fixed-list{display:none}.fixed-list~input,.number-node input,.range-node input{width:100px}[data-category=predicate]>.node-body>.node>.node-header>label,[data-category=predicate]>.node-header>label{background-color:var(--category-predicate)}[data-category=predicate]>.node-body,[data-category=predicate]>.node-body>.node>.node-header>:not(.selected),[data-category=predicate]>.node-header>:not(.selected),[data-category=predicate]>.node-header>label{border-color:var(--category-predicate-border)}.node-entry>.node.list-node[data-category=predicate],.node-entry>.node.map-node[data-category=predicate],.node-entry>.node.object-node[data-category=predicate]{background-color:var(--category-predicate-background);border-color:var(--category-predicate-border)}[data-category=function]>.node-body>.node>.node-header>label,[data-category=function]>.node-header>label{background-color:var(--category-function)}[data-category=function]>.node-body,[data-category=function]>.node-body>.node>.node-header>:not(.selected),[data-category=function]>.node-header>:not(.selected),[data-category=function]>.node-header>label{border-color:var(--category-function-border)}.node-entry>.node.list-node[data-category=function],.node-entry>.node.map-node[data-category=function],.node-entry>.node.object-node[data-category=function]{background-color:var(--category-function-background);border-color:var(--category-function-border)}[data-category=pool]>.node-body>.node>.node-header>label,[data-category=pool]>.node-header>label{background-color:var(--category-pool)}[data-category=pool]>.node-body,[data-category=pool]>.node-body>.node>.node-header>:not(.selected),[data-category=pool]>.node-header>:not(.selected),[data-category=pool]>.node-header>label{border-color:var(--category-pool-border)}.node-entry>.node.list-node[data-category=pool],.node-entry>.node.map-node[data-category=pool],.node-entry>.node.object-node[data-category=pool]{background-color:var(--category-pool-background);border-color:var(--category-pool-border)}