@font-face{font-family:xode;src:url(./xode-DoNR1dnf.woff2)format("woff2"),url(./xode-D7G8nYUr.ttf)format("truetype"),url(./xode-DEqIVXDk.woff)format("woff");font-weight:400;font-style:normal;font-display:block}.icon{font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-weight:400;line-height:1;font-family:xode!important}:root{--background:#1b2027;--foreground:#f8f9fb;--bg:var(--background);--fg:var(--foreground);--c1:#0bf;--c2:#7c6cff;--ce:#f44747}@media (prefers-color-scheme:light){:root{--bg:var(--foreground);--fg:var(--background)}}:root{accent-color:var(--c1)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background-color:color-mix(in srgb, var(--bg), var(--fg) 15%)}::-webkit-scrollbar-corner{background:0 0}*,:after,:before{box-sizing:border-box;margin:0}html,body{height:100dvh}body{flex-direction:column;font:.9rem/1.3 Arial,sans-serif;display:flex}a{color:var(--c1);text-decoration:none}h1,h2,h3,h4{color:color-mix(in srgb, var(--fg), var(--bg) 30%);font-weight:400}p{margin-bottom:1em}button{white-space:nowrap;color:color-mix(in srgb, var(--fg), var(--bg) 20%);text-align:center;cursor:pointer;background:0 0;border:0;border-radius:.2em;padding:.5rem .8rem;font-size:.85rem;line-height:1em;transition:filter .2s,background .2s,color .2s}button:disabled{opacity:.5}button:not(:disabled):hover{filter:brightness(130%)}button.lg{font-size:1rem}details{interpolate-size:allow-keywords}details::details-content{transition:block-size .3s, content-visibility .3s allow-discrete;block-size:0;overflow:hidden}details[open]::details-content{block-size:auto}.note,small{color:color-mix(in srgb, var(--fg), var(--bg) 20%)}textarea{min-height:1.9lh}select,input,textarea{border:none}select,textarea,input[type=text],input[type=password]{color:var(--fg);background-color:color-mix(in srgb, var(--bg), var(--fg) 5%);font:inherit;border-radius:.2em;padding:.4em .6em;font-size:.9rem}:is(select,textarea,input[type=text],input[type=password]):focus{box-shadow:0 1px var(--c1);outline:none}:disabled{cursor:not-allowed}.ckbtn{-webkit-user-select:none;user-select:none;cursor:pointer;color:color-mix(in srgb, var(--fg), var(--bg) 20%);border-radius:.2em;padding:.5em .6em;line-height:1;transition:all .2s}.ckbtn:hover{color:var(--bg);background:var(--c1)}.ckbtn input[type=checkbox]{display:none!important}.ckbtn:not(:has(:checked)){opacity:.3}.accent{background-color:var(--c1);color:var(--background)}.accent-2{background-color:var(--c2);color:var(--foreground)}.danger{background-color:var(--ce);color:var(--foreground)}.gradient{background:linear-gradient(145deg, var(--c1), var(--c2));color:var(--background)}.hljs{background:0 0}blockquote{border-left:3px solid color-mix(in srgb, var(--bg), var(--fg) 10%);margin:.1rem 0;padding-left:1rem;font-size:.85rem}details{flex:1}details summary{cursor:pointer;color:color-mix(in srgb, var(--fg), var(--bg) 20%);align-items:center;gap:.5em;padding:.5rem 1rem;font-size:.9rem;transition:color .2s;display:flex}details summary:hover{color:var(--c1)}details summary::-webkit-details-marker{opacity:.3}details .details-body{padding:1rem}#logo{cursor:pointer}@media (width<=768px){#logo{width:2.5rem}}#top{background:var(--bg);color:#fff;align-items:center;gap:.5rem;padding:.5rem;display:flex}@media (width<=768px){#top{padding:.3rem .4rem;font-size:.78rem}}#top label>*{vertical-align:middle;align-items:center;display:inline-flex;font-size:inherit!important}#top button{font-size:inherit!important}#top button:hover{background:var(--c1);color:var(--background)}body:not(.consoleWarning) #top.is-detached{z-index:10;width:100%;transition:translate .3s;position:fixed;top:0;translate:0 -100%;box-shadow:0 .1rem 1rem #0008}body:not(.consoleWarning) #top.is-detached:before{content:"";height:1rem;position:absolute;top:100%;left:0;right:0}body:not(.consoleWarning) #top.is-detached:hover{translate:0}#app{flex:1;height:100%}#preview-wrapper{width:100%;height:100%;position:relative}#preview{background:#fff;border:0;width:100%;height:100%;display:block}#preview.is-mobile{aspect-ratio:9/16;zoom:.8;width:auto;max-width:100%;height:auto;max-height:100%;margin:auto;position:absolute;inset:0}.tabs{flex:1;justify-content:safe center;display:flex;overflow:auto hidden}:has([data-rea-model="project.panes.preview"]:not(:checked)) label:has([data-rea-model="project.panes.richEditor"]){display:none}#projects-list{grid-template-columns:repeat(auto-fill,minmax(min(13rem,100%),1fr));gap:1rem;padding:1rem 0;display:grid}#projects-list:empty:before{-webkit-user-select:none;user-select:none;content:"No saved Projects";opacity:.2;padding:.5em 0;font-size:.9em;font-style:italic}#projects-list .project{transition:all .3s;overflow:hidden}@starting-style{#projects-list .project{opacity:0;scale:.9}}#projects-list .project .thumbnail{cursor:pointer;margin-bottom:.4rem;transition:box-shadow .25s}#projects-list .project .thumbnail:hover{box-shadow:0 0 0 .2rem var(--c1)}#projects-list .project .thumbnail-iframe{aspect-ratio:16/9;zoom:.3;pointer-events:none;overscroll-behavior:none;background:#fff;border:0;width:100%;display:block;scale:1.001}#projects-list .project .bar{align-items:center;gap:.5rem;display:flex}#projects-list .project .bar br+*{margin-left:auto}#projects-list .project .project-actions{align-items:center;gap:.5rem;display:flex}#projects-list .project .project-actions>*{padding:.2em .4em}#projects-list .project.is-hidden{display:none}#modal-projects{max-width:1200px}#modal-projects>*{flex:1}#githubPublish{align-self:flex-end}::highlight(word-highlight){background-color:color-mix(in srgb, var(--c1), #0000 80%)}.editor{--gutter-width:1;background:var(--bg);width:100%;height:100%;scroll-padding-left:calc(var(--gutter-width) * 1ch + 3rem);display:flex;overflow:auto}.editor-area{width:100%;position:relative;container-type:size}.editor-selection-stat{text-align:right;color:color-mix(in srgb, var(--fg), var(--bg) 20%);pointer-events:none;font-size:.7em;position:absolute;bottom:.4rem;right:.5rem}.editor-textarea,.editor-highlight code,.editor-textarea,.editor-lines{background:0 0;font:13px/1.4 Fira Code,monospace}.editor-highlight code,.editor-textarea{white-space:pre;overflow-wrap:normal;overflow:hidden;padding:0 1rem 0 0!important}.editor-textarea{resize:none;field-sizing:content;color:#fff0;min-width:100%;min-height:100cqh;caret-color:var(--fg);border:0;display:block;position:relative;padding-bottom:50cqh!important}.editor-textarea:focus{outline:#0000}.editor-textarea::selection{background:color-mix(in srgb, var(--c1), #0000 70%)}.editor-textarea::placeholder{color:color-mix(in srgb, var(--fg), var(--bg) 80%);text-transform:uppercase;font-style:italic}.is-resizing{-webkit-user-select:none;user-select:none}.is-resizing #preview{pointer-events:none}.editor-highlight{-webkit-user-select:none;user-select:none;min-width:0;margin-bottom:0;position:absolute;top:0;left:0}.editor-lines{text-align:right;min-width:3.3em;height:max-content;min-height:100%;color:color-mix(in srgb, var(--bg), var(--fg) 30%);background:var(--bg);z-index:1;flex-shrink:0;margin-bottom:0;position:sticky;left:0}.editor-lines:before{content:attr(data-label);color:color-mix(in srgb, var(--bg), var(--fg) 30%);transform-origin:100% 0;width:min-content;height:0;text-transform:uppercase;font-size:.85em;position:absolute;top:.3em;left:.2em;translate:-100% 10%;rotate:-90deg}[data-view=html] .editor-lines:before{color:#f57454}[data-view=css] .editor-lines:before{color:#0bf}[data-view=js] .editor-lines:before{color:#ffe600}.editor-lines>span{counter-increment:lineNumber;padding:0 .8rem 0 .5rem;display:block;position:relative}.editor-lines>span:before{content:counter(lineNumber);z-index:2;pointer-events:none;position:relative}.editor-lines>span .swatch{background:linear-gradient(var(--swatch), var(--swatch)), repeating-conic-gradient(#ccc 0% 25%, #fff 0% 50%) 0 0 / 6px 6px;opacity:1;width:6px;height:100%;box-shadow:1px 0 0 0 color-mix(in srgb, var(--bg), var(--fg) 10%);transition:width .1s,opacity .2s;position:absolute;top:0;right:2px}@starting-style{.editor-lines>span .swatch{opacity:0}}.editor-lines>span .swatch:hover{z-index:1;width:calc(100% - 5px)}.console{background:color-mix(in srgb, var(--bg), #000 20%);color:#d4d4d4;flex-flow:column;place-content:flex-start;font:.75rem/1.2 Consolas,Courier New,monospace;display:flex;position:absolute;inset:0;overflow:auto}.console:empty:before{-webkit-user-select:none;user-select:none;content:"›_  Console";opacity:.2;padding:.5em .8em;font-size:1.2em;font-style:italic}.console .log{overflow-anchor:none;color:color-mix(in srgb, var(--bg), #fff 80%);border-bottom:1px solid color-mix(in srgb, var(--bg), var(--fg) 3%);white-space:pre-wrap;width:100%;min-height:2lh;font:inherit;border-left:2px solid #0000;flex:none;padding:.5em;position:relative}.console .log .log-line{content:attr(data-line);opacity:.5;font-size:.8em;position:absolute;top:0;right:.5rem}.console .log.info{border-left:1px solid var(--c1)}.console .log.error{border-left:1px solid var(--ce);color:color-mix(in srgb, var(--fg), var(--ce) 40%)}.console .log.warn{border-left:1px solid #dcdcaa}.console .log.clear{color:color-mix(in srgb, var(--fg), var(--bg) 70%);font-style:italic}.console .log.input:before{content:">";opacity:.5;-webkit-user-select:none;user-select:none;margin-right:.5em}.console .log.result:before{content:"←";opacity:.5;-webkit-user-select:none;user-select:none;margin-right:.5em}.console .input-line{flex:1;gap:.3ch;padding:.5em;display:flex}.console .console-prompt{color:#aaf;-webkit-user-select:none;user-select:none;font:inherit;margin-right:.5em}.console .console-input{color:#d4d4d4;font:inherit;field-sizing:content;min-height:100%;resize:none;background:0 0;border:none;outline:none;flex:1;min-height:3lh;padding:0}.console .console-input:focus{box-shadow:none}.console .console-input::placeholder{color:#6a6a6a}.console .log-object{color:#d4d4d4;padding-left:1rem;display:block}.console .log-object .key{color:#9cdcfe}.console .log-object .string{color:#ce9178}.console .log-object .number{color:#b5cea8}.console .log-object .boolean,.console .log-object .null{color:#569cd6}.console-clear{z-index:2;cursor:pointer;opacity:0;background-color:color-mix(in srgb, var(--bg), #0000 50%);font-size:.8rem;transition:opacity .2s;position:absolute;top:.3em;right:.3em}[data-view=console]:hover .console-clear{opacity:1}[data-view=richEditor]{background:var(--bg);max-width:100%;color:var(--fg);border-bottom:1px solid color-mix(in srgb, var(--bg), var(--fg) 10%);flex:none;justify-content:safe center;align-items:center;display:flex;overflow:auto hidden}.cmd-group{border-right:1px solid color-mix(in srgb, var(--bg), var(--fg) 10%);flex-wrap:nowrap;flex-shrink:0;align-items:center;padding:4px;display:inline-flex;position:relative}.cmd-group>*{cursor:pointer;border-radius:3px;padding:6px 5px;transition:background .2s;position:relative}.cmd-group>*:hover{background:var(--c1)}.splitview{--grow:100;flex:var(--grow) 0 0;background-color:color-mix(in srgb, var(--bg), #000 10%);display:flex;position:relative;overflow:hidden}.splitview.col{flex-direction:column}.splitview.col>.splitter{cursor:ns-resize}.splitview>.splitter{touch-action:none;cursor:ew-resize;background-color:color-mix(in srgb, var(--bg), var(--fg) 10%);flex:0 0 1px;transition:background-color .24s;position:relative}.splitview>.splitter:not(:has(+.splitview)){display:none}.splitview>.splitter:before{content:"";z-index:2;width:calc(100% + 6px);height:calc(100% + 6px);position:absolute;inset:0}.splitview>.splitter:hover{background-image:linear-gradient(45deg, var(--c2), var(--c1))}.splitview>.splitter:first-child{display:none}.splitview .splitview{display:none}.splitview .splitview[data-open=true]{display:flex}.splitview .splitview:has([data-open=true]:not([data-rea-open-inner])){display:flex}[data-open=false]+.splitter{display:none}.splitter:has(+[data-open=false]){display:none}[data-open=true]:has(~[data-open=true])+.splitter{display:initial}.splitview:has([data-open]):not(:has([data-open=true]))+.splitter{display:none}[data-open=false]{display:none}.modal-wrapper{visibility:hidden;opacity:0;-webkit-backdrop-filter:blur(.5px);backdrop-filter:blur(.5px);z-index:1000;background-color:#00000080;justify-content:center;align-items:center;transition:all .2s;display:flex;position:fixed;inset:0}.modal-wrapper:has(.is-open){visibility:visible;opacity:1}.modal{background-color:var(--bg);color:var(--fg);border-radius:0;flex-direction:column;width:calc(100% - 6rem);max-width:800px;height:calc(100% - 6rem);padding:1rem;display:flex;position:relative;box-shadow:0 .5rem 3rem -1rem #000d}.modal h2{color:color-mix(in srgb, var(--fg), var(--bg) 50%);align-items:center;gap:1rem;padding:1rem 0;font-weight:400;display:flex}.modal>*{padding:.5rem 1rem}.modal .modal-head{justify-content:space-between;align-items:center;padding:1rem 0;display:flex;position:relative}.modal .modal-head>:not(button){margin:0;padding:0}.modal .modal-head button[data-modal]{position:absolute;top:.5rem;right:.5rem}.modal label{align-items:center;gap:.5rem;margin-bottom:1rem;display:flex}.modal label span{flex:0 0 15ch;align-self:flex-start;padding:.4em 0}.modal label span+*{flex:1}.modal .modal-body{flex:0 auto;overflow:scroll}.modal .modal-foot{opacity:.5;margin-top:auto;padding:1rem 0 0;font-size:.8rem}.modal-close{z-index:1;position:absolute;top:.5rem;right:.5rem}#toasts{z-index:1000;pointer-events:none;flex-direction:column;gap:.5rem;width:100%;height:100%;padding:1rem;display:flex;position:fixed;top:0;left:0}.toast{--bg:var(--foreground);--fg:var(--background);pointer-events:auto;max-width:20rem;box-shadow:var(--shadow,0 .5rem 1rem -.5rem #0006);background:var(--bg);color:var(--fg);border-radius:.2rem;align-self:end;padding:.6rem 1rem;font-size:.9rem;transition:all .3s;position:relative;bottom:0}@starting-style{.toast{opacity:0;translate:0 3rem}}.toast.is-hiding{opacity:0;translate:0 3rem}.toast:first-child{margin-top:auto;margin-bottom:0}.toast.info{--bg:#6ed5f7}.toast.warning{--bg:#f7ec6e}.toast.error{--bg:#f7796e}.toast.success{--bg:#85f76e}.toast>button{all:unset;cursor:pointer;position:absolute;top:.3rem;right:.5rem}.toast>button:before{content:"✕"}.permanent :is(.toast>button){display:none}.toast a{color:currentColor;font-weight:600}.toast .toast-head{font-weight:600}.toast .toast-body{word-wrap:break-word}.chat{background:color-mix(in srgb, var(--bg), #000 0%);height:100%;color:var(--fg);flex-direction:column;display:flex;position:relative}.chat>*{z-index:1;position:relative}.chat:before,.chat:after{content:"";aspect-ratio:1;z-index:0;filter:blur(20px);opacity:.3;mix-blend-mode:screen;pointer-events:none;width:min(20rem,70%);margin:0 auto;position:absolute;bottom:-10%;left:0;right:0}.chat:before{background:radial-gradient(circle at 50% 50%, var(--c1) 0%, var(--c1) 10%, color-mix(in srgb, var(--c1), transparent 60%) 35%, transparent 70%);animation:14s ease-in-out infinite drift1}.chat:after{background:radial-gradient(circle at 50% 50%, var(--c2) 0%, var(--c2) 10%, color-mix(in srgb, var(--c2), transparent 60%) 35%, transparent 70%);animation:18s ease-in-out infinite drift2}.chat-output{flex-direction:column;flex:1;gap:.5rem;width:100%;max-width:46rem;margin:0 auto;padding:1rem;display:flex;overflow:auto}.chat-message{word-break:break-word;max-width:calc(100% - 2rem);padding:1rem;transition:scale .3s,opacity .3s,translate .3s;position:relative}@starting-style{.chat-message{opacity:0;translate:0 2rem;scale:.9}}.chat-message .thinking{background:linear-gradient(90deg,#5a5a60 0% 35%,#fff 50%,#5a5a60 65% 100%) 100% 0/200% 100%;-webkit-text-fill-color:transparent;color:#0000;-webkit-background-clip:text;background-clip:text;font-family:-apple-system,system-ui,sans-serif;font-weight:500;animation:1.8s linear infinite shimmer}:is(.chat-message.role-ai,.chat-message.role-system,.chat-message.role-user):after{--thick:1px;content:"";aspect-ratio:1;background-image:linear-gradient(45deg, var(--c2), var(--c1));width:1rem;clip-path:polygon(100% 0, 0 0, 0 100%, var(--thick) 100%, var(--thick) var(--thick), 100% var(--thick));pointer-events:none;position:absolute;top:0;left:0}.chat-message.role-ai,.chat-message.role-system{margin-right:2rem}.chat-message.role-user{max-width:30rem;color:color-mix(in srgb, var(--fg), var(--bg) 30%);background-color:#0003;border-radius:.5rem 0 .5rem .5rem;align-self:flex-end;margin-left:2rem;padding-bottom:0}.chat-message.role-user:after{background-image:linear-gradient(45deg, var(--fg), var(--bg));left:auto;right:0;rotate:90deg}.chat-message>*+*{margin-top:.5rem}.chat-message pre{background:color-mix(in srgb, var(--bg), #000 25%);resize:vertical;max-width:100%;height:20cqh;margin:1rem 0;padding:1rem;overflow:auto}.chat-message code{background:color-mix(in srgb, var(--bg), #000 25%);border:1px solid color-mix(in srgb, var(--fg), var(--bg) 80%);padding:0 .5em;font-size:.8rem;display:inline-block}.chat-message pre>code{background:0 0;border:none;margin:0}.chat-message-btns{justify-content:flex-end;align-items:center;gap:.5rem;margin:.5rem 0;display:flex}.chat-question{flex-direction:column;width:100%;max-width:46rem;margin:0 auto;padding:0 1rem;display:flex}.chat-question .chat-input{resize:none;field-sizing:content;background-color:color-mix(in srgb, var(--bg), #000 15%);z-index:1;width:100%;min-height:4lh;max-height:35cqh;font-size:1rem;display:block}.chat-question .chat-input::placeholder{text-align:right}.chat-actions{gap:.5rem;margin:.5rem 0;display:flex}.chat-actions .details-body{flex-flow:wrap;gap:.5rem;display:flex}.chat-actions .details-body label{flex-wrap:nowrap;align-items:center;gap:.5rem;display:flex}.chat-actions .details-body input,.chat-actions .details-body select{text-overflow:ellipsis;width:100%;max-width:30ch}.chat-actions .details-body select{max-width:22ch}.chat-actions .details-body .chat-apiKey{max-width:13ch}.chat-actions details[open] summary span{opacity:0}.chat-actions details[open] summary:before{content:"×  Close"}.chat-model-label{white-space:nowrap;text-overflow:ellipsis;flex:1;max-width:16ch;overflow:hidden}.chat-send{box-shadow:0 .1rem 1rem color-mix(in srgb, var(--c1), #0000 50%);position:absolute;right:1rem}.glow-input{background:0 0;border-radius:.5rem;width:100%;padding:2px;position:relative}.glow-input .glow-border{pointer-events:none;border-radius:inherit;background:conic-gradient(from var(--angle), #0000, #0000 30%, var(--c2) 50%, var(--c1) 60%, #0000 65%, #0000);-webkit-mask-composite:xor;padding:1px;animation:5s linear infinite spin;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.loader{background:var(--fg);filter:blur(2px);opacity:1;mix-blend-mode:screen;border-radius:50%;width:.3rem;height:.3rem;margin-bottom:.2rem;margin-right:.5rem;display:inline-block;position:relative}.loader:after,.loader:before{content:"";width:inherit;height:inherit;z-index:1;border-radius:50%;position:absolute}.loader:before{background:var(--c1);transform-origin:top;animation:2s linear infinite rotate;translate:.01rem}.loader:after{background:var(--c2);transform-origin:top;animation:1s linear -1s infinite rotate;translate:-.01rem}@keyframes rotate{to{rotate:1turn}}@keyframes shimmer{to{background-position:-100% 0}}@property --angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes spin{to{--angle:360deg}}@keyframes drift1{0%{transform:translate(-10%,-5%)scale(1)}22%{transform:translate(15%,10%)scale(1.15)}41%{transform:translate(5%,25%)scale(.95)}63%{transform:translate(-20%,15%)scale(1.1)}80%{transform:translate(-8%,-15%)scale(1)}to{transform:translate(-10%,-5%)scale(1)}}@keyframes drift2{0%{transform:translate(10%,15%)scale(1)}18%{transform:translate(-15%,-10%)scale(1.1)}37%{transform:translate(-5%,20%)scale(.9)}55%{transform:translate(20%,-5%)scale(1.2)}77%{transform:translate(8%,10%)scale(1)}to{transform:translate(10%,15%)scale(1)}}.ml-auto{margin-left:auto}.mr-auto{margin-right:auto}.col{flex-direction:column;display:flex}.row{flex-direction:row;display:flex}.row>br+*{margin-left:auto}.flex-1{flex:1}@media (width<=768px){.md-show{display:none!important}}@media (width>768px){.md-hide{display:none!important}}