:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub Dark
  Description: Dark theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-dark
  Current colors taken from GitHub's CSS
*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#79c0ff}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-comment,.hljs-code,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#0f0f0f;overflow:hidden}.heading{text-align:center;padding:2rem 0;background:linear-gradient(135deg,#667eea,#764ba2,#667eea);color:#fff;margin-bottom:0;box-shadow:0 8px 32px #0000004d;position:relative;overflow:hidden}.heading:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.1) 50%,transparent 70%);animation:shine 3s infinite linear}@keyframes shine{0%{transform:translate(-100%)}to{transform:translate(100%)}}.heading h1{font-size:3rem;font-weight:800;margin:0;text-shadow:0 4px 8px rgba(0,0,0,.4);letter-spacing:-1px;position:relative;background:linear-gradient(45deg,#fff,#e0e7ff,#fff);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 4s ease-in-out infinite}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}main{height:calc(100vh - 120px);width:100%;padding:2rem;display:flex;gap:2rem;background:#0f0f0f;overflow:hidden}main .left,main .right{height:100%;flex:1;border-radius:1rem;box-shadow:0 8px 32px #0006;transition:all .3s ease;border:1px solid rgba(255,255,255,.1);overflow:hidden}main .left:hover,main .right:hover{transform:translateY(-2px);box-shadow:0 12px 40px #0009}main .left{background:linear-gradient(145deg,#1a1a1a,#0d0d0d);position:relative;display:flex;flex-direction:column;overflow:hidden}.left .code{height:100%;width:100%;border-radius:1rem;background:#0a0a0a;overflow:hidden;flex:1;position:relative}.cm-editor{height:100%!important;background:#0a0a0a!important;overflow:hidden!important}.cm-scroller{font-family:Fira Code,Cascadia Code,Monaco,Consolas,monospace!important;font-size:14px!important;line-height:1.6!important;overflow:auto!important;height:100%!important;background:#0a0a0a!important;padding-right:8px!important}.cm-content{padding:1rem 1rem 3rem!important;caret-color:#fff!important;min-height:100%!important}.cm-line{padding:0!important;margin:0!important}.cm-gutters{background:#111!important;border-right:1px solid #333!important;color:#666!important;height:100%!important}.cm-activeLine{background:#667eea1a!important}.cm-activeLineGutter,.cm-selectionMatch{background:#667eea33!important}.cm-cursor{border-left-color:#fff!important}.cm-scroller::-webkit-scrollbar{width:14px!important;height:14px!important;display:block!important;visibility:visible!important}.cm-scroller::-webkit-scrollbar-track{background:#1a1a1a!important;border-radius:0 1rem 1rem 0!important;border-left:1px solid #333!important}.cm-scroller::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2)!important;border-radius:8px!important;border:3px solid #1a1a1a!important;min-height:40px!important}.cm-scroller::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#764ba2,#667eea)!important;border:2px solid #1a1a1a!important}.cm-scroller::-webkit-scrollbar-corner{background:#1a1a1a!important;border-radius:0 1rem 0 0!important}.cm-scroller{scrollbar-width:thin!important;scrollbar-color:#667eea #1a1a1a!important}@supports (scrollbar-color: red blue){.cm-scroller{scrollbar-width:thin!important;scrollbar-color:#667eea #1a1a1a!important}}.cm-contentContainer{min-height:calc(100% + 100px)!important}.review-btn{--border-color: linear-gradient(-45deg, #ffae00, #7e03aa, #00fffb);--border-width: .125em;--curve-size: .5em;--blur: 30px;--bg: #080312;--color: #afffff;color:var(--color);cursor:pointer;position:absolute;bottom:1.5rem;right:1.5rem;isolation:isolate;display:inline-grid;place-content:center;padding:.8em 2em;font-size:16px;border:0;text-transform:uppercase;box-shadow:10px 10px 20px #0009;clip-path:polygon(0% var(--curve-size),var(--curve-size) 0,100% 0,100% calc(100% - var(--curve-size)),calc(100% - var(--curve-size)) 100%,0 100%);transition:color .25s;font-weight:600;letter-spacing:.5px;z-index:10;min-width:160px;min-height:50px}.review-btn:after,.review-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0}.review-btn:before{background:var(--border-color);background-size:300% 300%;animation:move-bg7234 5s ease infinite;z-index:-2}@keyframes move-bg7234{0%{background-position:31% 0%}50%{background-position:70% 100%}to{background-position:31% 0%}}.review-btn:after{background:var(--bg);z-index:-1;clip-path:polygon(var(--border-width) calc(var(--curve-size) + var(--border-width) * .5),calc(var(--curve-size) + var(--border-width) * .5) var(--border-width),calc(100% - var(--border-width)) var(--border-width),calc(100% - var(--border-width)) calc(100% - calc(var(--curve-size) + var(--border-width) * .5)),calc(100% - calc(var(--curve-size) + var(--border-width) * .5)) calc(100% - var(--border-width)),var(--border-width) calc(100% - var(--border-width)));transition:clip-path .5s}.review-btn:where(:hover,:focus):after{clip-path:polygon(calc(100% - var(--border-width)) calc(100% - calc(var(--curve-size) + var(--border-width) * .5)),calc(100% - var(--border-width)) var(--border-width),calc(100% - var(--border-width)) var(--border-width),calc(100% - var(--border-width)) calc(100% - calc(var(--curve-size) + var(--border-width) * .5)),calc(100% - calc(var(--curve-size) + var(--border-width) * .5)) calc(100% - var(--border-width)),calc(100% - calc(var(--curve-size) + var(--border-width) * .5)) calc(100% - var(--border-width)));transition:.2s}.review-btn:where(:hover,:focus){color:#fff}.review-btn.loading{cursor:not-allowed;opacity:.9}.review-btn.loading:before{animation-duration:2s}.loader{position:relative;display:flex;gap:.3em;align-items:center;justify-content:center}.loader:before{content:"";position:absolute;left:0;top:0;width:100%;height:2em;filter:blur(45px);background-color:#e299ff;background-image:radial-gradient(at 52% 57%,hsla(11,83%,72%,1) 0px,transparent 50%),radial-gradient(at 37% 57%,hsla(175,78%,66%,1) 0px,transparent 50%)}.loader__circle{--size__loader: .6em;width:var(--size__loader);height:var(--size__loader);border-radius:50%;animation:loader__circle__jumping 2s infinite;background-color:#b499ff}.loader__circle:nth-child(2n){animation-delay:.3s;background-color:#e499ff}.loader__circle:nth-child(3n){animation-delay:.6s;background-color:#99c8ff}.loader__circle:nth-child(4n){animation-delay:.9s;background-color:#99ffd6}.loader__circle:nth-child(5n){animation-delay:1.2s;background-color:#ff99a9}@keyframes loader__circle__jumping{0%,to{transform:translateY(0)}25%{transform:translateY(-15px) scale(.5)}50%{transform:translateY(0)}75%{transform:translateY(5px) scale(.9)}}main .right{background:linear-gradient(145deg,#1e1e1e,#151515);padding:2rem;font-size:1rem;overflow:auto;color:#e0e0e0;position:relative}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#667eea;gap:2rem}.loading-state .loader{transform:scale(1.5)}.loading-state p{font-size:1.2rem;font-weight:500;color:#b499ff}.placeholder{height:100%;display:flex;flex-direction:column;justify-content:center}.placeholder h3{color:#667eea;font-size:1.8rem;margin-bottom:1.5rem;text-align:center}.placeholder p{color:#b0b0b0;margin-bottom:1.5rem;line-height:1.6;text-align:center}.placeholder ul{color:#b0b0b0;line-height:1.8;max-width:500px;margin:0 auto}.placeholder li{margin-bottom:.5rem;position:relative;padding-left:1.5rem}.placeholder li:before{content:"▸";color:#667eea;position:absolute;left:0}.markdown-content{line-height:1.7}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4{color:#667eea;margin:1.5rem 0 1rem}.markdown-content h1{font-size:1.8rem;border-bottom:2px solid #667eea;padding-bottom:.5rem}.markdown-content h2{font-size:1.5rem}.markdown-content h3{font-size:1.3rem}.markdown-content p{margin-bottom:1rem;color:#e0e0e0}.markdown-content ul,.markdown-content ol{margin:1rem 0;padding-left:2rem}.markdown-content li{margin-bottom:.5rem;color:#e0e0e0}.markdown-content code{background:#667eea1a;padding:.2rem .4rem;border-radius:.3rem;color:#667eea;font-family:Fira Code,monospace;font-size:.9em}.markdown-content pre{background:#1a1a1a;padding:1rem;border-radius:.5rem;overflow:auto;margin:1rem 0;border:1px solid #333}.markdown-content blockquote{border-left:4px solid #667eea;padding-left:1rem;margin:1rem 0;color:#b0b0b0;font-style:italic}.right::-webkit-scrollbar{width:12px}.right::-webkit-scrollbar-track{background:#252525;border-radius:4px}.right::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:6px;border:3px solid #252525}.right::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#764ba2,#667eea)}.right{scrollbar-width:thin;scrollbar-color:#667eea #252525}@media (max-width: 1024px){main{flex-direction:column;height:auto;min-height:calc(100vh - 120px)}main .left,main .right{flex:none;height:50vh;min-height:300px}.heading h1{font-size:2.2rem}}@media (max-width: 768px){main{padding:1rem;gap:1rem;height:calc(100vh - 100px)}.heading{padding:1.5rem 0}.heading h1{font-size:1.8rem}.review-btn{padding:.6em 1.5em;font-size:14px;bottom:1rem;right:1rem;min-width:140px;min-height:45px}.cm-scroller{font-size:13px!important}.loading-state .loader{transform:scale(1.2)}}.cm-editor .cm-content{min-height:150%!important}