@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Lexend:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap";:root{--back: #090a0b;--prim: #1a1d28;--seco: #313f4e;--tert: #4f617d;--text: #b3cbf9;--accent: #e628ff;--cover: #00000079;--text-dim: color-mix(var(--text), var(--back) 33%);--text-dark: color-mix(var(--text), var(--back) 66%);--back-lighter: color-mix(var(--back), var(--prim) 66%);--prim-lighter: color-mix(var(--prim), var(--seco) 66%);--seco-lighter: color-mix(var(--seco), var(--tert) 66%);--back-light: color-mix(var(--back), var(--prim) 33%);--prim-light: color-mix(var(--prim), var(--seco) 33%);--seco-light: color-mix(var(--seco), var(--tert) 33%);--back-lightish: color-mix(var(--back), var(--prim) 10%);--prim-lightish: color-mix(var(--prim), var(--seco) 10%);--seco-lightish: color-mix(var(--seco), var(--tert) 10%);--back-border: 1px solid var(--prim);--prim-border: 1px solid var(--seco);--seco-border: 1px solid var(--tert);--back-light-border: 1px solid var(--prim);--prim-light-border: 1px solid var(--seco);--seco-light-border: 1px solid var(--tert);--prim-playing: color-mix(var(--prim), var(--playing) 30%);--link: rgb(142, 111, 255);--link-visited: rgb(231, 137, 243);--text-size-large: 1.6em;--text-size-big: 1.3em;--text-size-bigish: 1.1em;--text-size-preview: 1.05em;--text-size-normal: 1em;--text-size-smallish: .8em;--text-size-small: .75em;--text-size-smaller: .65em;font-family:Noto Sans;font-size:var(--text-size-normal);color:var(--text)}h1{font-size:var(--text-size-large)}h2{font-size:var(--text-size-big)}h3{font-size:var(--text-size-bigish)}*,input::placeholder{font-family:inherit;font-size:inherit;color:inherit}input::placeholder{opacity:30%}body{background:var(--back);position:absolute;inset:0}*{margin:0;padding:0;background:none;border:none;outline:none}button{cursor:pointer}a{color:var(--link)}a:visited{color:var(--link-visited)}.icon{position:relative;display:flex;color:var(--text)}.icon>svg{position:absolute;inset:0}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--prim);border-radius:4px;border:1px solid transparent;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background:var(--seco);border:1px solid transparent;background-clip:padding-box}::-webkit-scrollbar-corner{background:var(--prim);border-radius:4px;border:2px solid transparent}#app>div{position:absolute;inset:0;display:flex;padding:10px;gap:10px;box-sizing:border-box;width:100vw;height:100vh}#app>div>div{flex:1;width:50%;display:flex;border:var(--back-border);background:var(--prim)}.monaco-editor,.monaco-diff-editor,.monaco-component{--vscode-editor-background: transparent !important;--vscode-editorGutter-background: transparent !important}.monaco-editor .view-overlays .current-line-exact{border-color:var(--prim-light)!important}#editor{flex-direction:column}#editor>header{display:flex;align-items:center;gap:5px;padding:5px;border-bottom:var(--back-border)}#editor>header>button{padding:5px}:root{--json-string: #ce9178;--json-number: #b5cea8;--json-boolean: #ce9178;--json-null: #ce9178}#viewer{display:flex;flex-direction:column;gap:10px;font-size:var(--text-size-preview);padding:10px}.json{font-family:monospace;white-space:pre;display:flex}.json.null{color:var(--json-null)}.json.string{color:var(--json-string)}.json.number{color:var(--json-number)}.json.boolean{color:var(--json-boolean);-webkit-user-select:none;user-select:none;cursor:pointer}.json.object{flex-direction:column;gap:5px}.json.object>main{display:flex;gap:5px;flex-direction:column;padding-left:40px}.json.object>main>div{display:flex;gap:5px}.json.object>main>div.object,.json.object>main>div.array{flex-direction:column}.json.array{flex-direction:column;gap:5px}.json.array>main{display:flex;gap:5px;flex-direction:column;padding-left:40px}.json.array>main>.json-entry>header>.index{color:var(--text-dim)}.json.array>main>div{display:flex;gap:5px}.json.array>main>div>.index,.json.array>main>div>.colon{color:var(--text-dim)}.json.array>main>div.object,.json.array>main>div.array{flex-direction:column}:is(:is(.json,.json-entry).object,:is(.json,.json-entry).array)>header{display:flex;align-items:center;gap:5px}:is(:is(.json,.json-entry).object,:is(.json,.json-entry).array)>header>button{display:flex}:is(:is(.json,.json-entry).object,:is(.json,.json-entry).array)>header>.length{color:var(--text-dim)}
