.code-editor{position:relative}.code-editor .dropdown{cursor:pointer;position:relative}.code-editor .dropdown .list.fade-enter-active{transition:transform .2s ease,opacity .2s ease}.code-editor .dropdown .list.fade-leave-active{transition:transform .2s ease,opacity .2s ease}.code-editor .dropdown .list.fade-enter-from{opacity:0;transform:translateY(-10px)}.code-editor .dropdown .list.fade-leave-to{opacity:0;transform:translateY(-10px)}.code-editor .dropdown:focus{outline:0}.code-editor .dropdown:hover>.title{opacity:1}.code-editor .dropdown>.title{transition:opacity .2s ease;opacity:.5;display:flex;align-items:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}.code-editor .dropdown>.title>div{white-space:nowrap;font-size:12px;line-height:16px}.code-editor .dropdown>.title>svg{transition:.2s;margin-left:3px;margin-top:1px}.code-editor .dropdown>.list{box-sizing:border-box;position:absolute;padding:1px;border-radius:6px;overflow:hidden;top:24px;left:0;box-shadow:0 4px 12px rgba(0,0,0,.2)}.code-editor .dropdown>.list:before{content:"";position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background:currentColor;opacity:.2}.code-editor .disabled{cursor:default}.code-editor .disabled:hover>.title{opacity:.5!important}.code-editor .copy-code{transition:.2s opacity ease;position:relative;opacity:.5;width:16px;height:16px;cursor:pointer}.code-editor .copy-code:focus{outline:0}.code-editor .copy-code>svg{pointer-events:none}.code-editor .copy-code:hover{opacity:1}.code-editor .copy-code:hover>.tooltip{display:block}.code-editor .copy-code>.tooltip{font-family:sans-serif;display:none;position:absolute;bottom:-10px;left:-96px;font-size:12px;color:#fff;width:84px;height:30px;line-height:30px;background:rgba(0,0,0,.8);box-sizing:border-box;text-align:center;border-radius:4px}.code-editor>div{width:100%;height:100%}.code-editor .header{box-sizing:border-box;position:relative;z-index:1;height:34px}.code-editor .header>.dropdown{position:absolute;top:12px;left:18px}.code-editor .header>.copy-code{position:absolute;top:10px;right:12px}.code-editor .code-area{position:relative;z-index:0;text-align:left;overflow:hidden}.code-editor .code-area>textarea{font-family:Consolas,Monaco,monospace;line-height:1.5;position:absolute;z-index:1;top:0;left:0;overflow-y:hidden;box-sizing:border-box;caret-color:#7f7f7f;color:transparent;white-space:pre;word-wrap:normal;border:0;width:100%;height:100%;background:0 0;resize:none}.code-editor .code-area>textarea:hover{outline:0}.code-editor .code-area>textarea:focus-visible{outline:0}.code-editor .code-area>pre{box-sizing:border-box;position:relative;z-index:0;overflow:hidden;font-size:0;margin:0}.code-editor .code-area>pre>code{font-family:Consolas,Monaco,monospace;line-height:1.5;background:0 0;display:block;position:relative;overflow-x:visible!important;border-radius:0;box-sizing:border-box;margin:0}.code-editor .line-nums{min-width:36px;text-align:right;box-sizing:border-box;position:absolute;left:0;padding-right:8px;padding-left:8px;opacity:.3}.code-editor .line-nums>div{font-family:Consolas,Monaco,monospace;line-height:1.5}.code-editor .line-nums::after{content:"";position:absolute;width:100%;height:100%;top:0;left:0;border-right:1px solid currentColor;opacity:.5}.code-editor .list{-webkit-user-select:none;-moz-user-select:none;user-select:none;height:100%;font-family:sans-serif}.code-editor .list>.lang-list{border-radius:5px;box-sizing:border-box;overflow:auto;font-size:13px;padding:0;margin:0;list-style:none;text-align:left}.code-editor .list>.lang-list>li{font-size:13px;transition:background .16s ease,color .16s ease;box-sizing:border-box;padding:0 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:30px}.code-editor .list>.lang-list>li:first-child{padding-top:5px}.code-editor .list>.lang-list>li:last-child{padding-bottom:5px}.code-editor .list>.lang-list>li:hover{background:rgba(160,160,160,.4)}.code-editor .header.border::after{content:"";position:absolute;width:100%;height:1px;bottom:0;left:0;background:currentColor;opacity:.15}.code-editor.wrap .code-area>textarea{white-space:pre-wrap;word-wrap:break-word}.code-editor.wrap .code-area>pre>code{white-space:pre-wrap;word-wrap:break-word}.code-editor.hide-header.scroll .code-area{height:100%}.code-editor.scroll .code-area{height:calc(100% - 34px)}.code-editor.scroll .code-area>textarea{overflow:auto}.code-editor.scroll .code-area>pre{width:100%;height:100%;overflow:hidden}[theme=base16-materia] pre code.hljs{display:block;overflow-x:auto;padding:1em}[theme=base16-materia] code.hljs{padding:3px 5px}[theme=base16-materia] .hljs{color:#cdd3de;background:#263238}[theme=base16-materia] .hljs::-moz-selection{background-color:#37474f;color:#cdd3de}[theme=base16-materia] .hljs::selection{background-color:#37474f;color:#cdd3de}[theme=base16-materia] .hljs-comment{color:#707880}[theme=base16-materia] .hljs-tag{color:#c9ccd3}[theme=base16-materia] .hljs-operator{color:#cdd3de;opacity:.7}[theme=base16-materia] .hljs-punctuation{color:#cdd3de}[theme=base16-materia] .hljs-subst{color:#cdd3de}[theme=base16-materia] .hljs-bullet{color:#ec5f67}[theme=base16-materia] .hljs-deletion{color:#ec5f67}[theme=base16-materia] .hljs-name{color:#ec5f67}[theme=base16-materia] .hljs-selector-tag{color:#ec5f67}[theme=base16-materia] .hljs-template-variable{color:#ec5f67}[theme=base16-materia] .hljs-variable{color:#ec5f67}[theme=base16-materia] .hljs-attr{color:#ea9560}[theme=base16-materia] .hljs-link{color:#ea9560}[theme=base16-materia] .hljs-literal{color:#ea9560}[theme=base16-materia] .hljs-number{color:#ea9560}[theme=base16-materia] .hljs-symbol{color:#ea9560}[theme=base16-materia] .hljs-variable.constant_{color:#ea9560}[theme=base16-materia] .hljs-class .hljs-title{color:#fc0}[theme=base16-materia] .hljs-title{color:#fc0}[theme=base16-materia] .hljs-title.class_{color:#fc0}[theme=base16-materia] .hljs-strong{font-weight:700;color:#fc0}[theme=base16-materia] .hljs-addition{color:#8bd649}[theme=base16-materia] .hljs-code{color:#8bd649}[theme=base16-materia] .hljs-string{color:#8bd649}[theme=base16-materia] .hljs-title.class_.inherited__{color:#8bd649}[theme=base16-materia] .hljs-built_in{color:#80cbc4}[theme=base16-materia] .hljs-doctag{color:#80cbc4}[theme=base16-materia] .hljs-keyword.hljs-atrule{color:#80cbc4}[theme=base16-materia] .hljs-quote{color:#80cbc4}[theme=base16-materia] .hljs-regexp{color:#80cbc4}[theme=base16-materia] .hljs-attribute{color:#89ddff}[theme=base16-materia] .hljs-function .hljs-title{color:#89ddff}[theme=base16-materia] .hljs-section{color:#89ddff}[theme=base16-materia] .hljs-title.function_{color:#89ddff}[theme=base16-materia] .ruby .hljs-property{color:#89ddff}[theme=base16-materia] .diff .hljs-meta{color:#82aaff}[theme=base16-materia] .hljs-keyword{color:#82aaff}[theme=base16-materia] .hljs-template-tag{color:#82aaff}[theme=base16-materia] .hljs-type{color:#82aaff}[theme=base16-materia] .hljs-emphasis{color:#82aaff;font-style:italic}[theme=base16-materia] .hljs-meta{color:#ec5f67}[theme=base16-materia] .hljs-meta .hljs-keyword{color:#ec5f67;font-weight:700}[theme=base16-materia] .hljs-meta .hljs-string{color:#ec5f67}[theme=base16-materia] .hljs-meta-keyword{font-weight:700}