*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0d0d0d;--bg2: #141414;--bg3: #1c1c1c;--bg4: #242424;--border: #2a2a2a;--border2: #383838;--text: #e2e2e2;--text2: #888;--text3: #444;--js: #f7df1e;--ts: #3178c6;--green: #4ade80;--red: #f87171;--orange: #fb923c;--blue: #60a5fa;--teal: #2dd4bf;--ui: "Outfit", system-ui, sans-serif;--mono: "JetBrains Mono", Consolas, monospace;--editor-bg: #000}[data-theme=light]{--bg: #f9f9f9;--bg2: #ffffff;--bg3: #eeeeee;--bg4: #d8cfb4;--border: #dddddd;--border2: #bbbbbb;--text: #586e75;--text2: #839496;--text3: #bbbbbb;--js: #f7df1e;--ts: #268bd2;--green: #4ade80;--red: #dc322f;--orange: #cb4b16;--blue: #268bd2;--teal: #2aa198;--editor-bg: #f9f9f9}html,body{height:100%;overflow:hidden;background:var(--bg);color:var(--text)}#root{height:100%;display:flex;flex-direction:column}#topbar{height:48px;background:var(--bg2);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 16px;gap:12px;flex-shrink:0}#logo{font-family:var(--ui);font-weight:700;font-size:15px;display:flex;align-items:center;gap:4px;margin-right:4px}.ljs{color:var(--js)}.lts{color:var(--ts)}.lsep{color:var(--text3);font-weight:300}.logo-sub{color:var(--text2);font-weight:300;font-size:13px;font-family:var(--ui)}#lang-pill{display:flex;background:var(--bg3);border:1px solid var(--border);border-radius:20px;padding:3px;gap:2px}.pill-btn{padding:4px 16px;border-radius:16px;border:none;cursor:pointer;font-family:var(--ui);font-size:12px;font-weight:600;background:transparent;color:var(--text2);transition:all .18s}.pill-btn:hover{color:var(--text);background:var(--bg2)}.pill-js{background:var(--js)!important;color:#000!important}.pill-ts{background:var(--ts)!important;color:#fff!important}#run-btn{display:flex;align-items:center;gap:8px;padding:7px 22px;border-radius:20px;border:none;cursor:pointer;font-family:var(--ui);font-size:13px;font-weight:700;transition:all .18s}#run-btn.m-js{background:var(--js);color:#000}#run-btn.m-ts{background:var(--ts);color:#fff}#run-btn:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 4px 18px #0000002e}#run-btn:disabled{opacity:.45;cursor:default;transform:none;filter:none}#theme-toggle-wrap{margin-left:auto;display:flex;align-items:center}#theme-toggle{padding:0;border:none;background:transparent;cursor:pointer;display:flex;align-items:center}.toggle-track{position:relative;width:44px;height:24px;border-radius:12px;background:var(--bg4);border:1px solid var(--border2);display:flex;align-items:center;transition:background .25s,border-color .25s}#theme-toggle:hover .toggle-track{border-color:var(--text3)}[data-theme=light] .toggle-track{background:var(--bg);border-color:var(--border)}.toggle-thumb{position:absolute;left:3px;width:18px;height:18px;border-radius:50%;background:var(--bg2);border:1px solid var(--border2);display:flex;align-items:center;justify-content:center;color:var(--text2);transition:transform .25s cubic-bezier(.34,1.4,.64,1),background .25s,color .25s;box-shadow:0 1px 3px #0000004d}[data-theme=light] .toggle-thumb{transform:translate(20px);background:#fff;border-color:var(--border);color:var(--text2);box-shadow:0 1px 4px #00000026}.kbd{font-size:10px;font-family:var(--mono);opacity:.5;background:#0000002e;padding:2px 5px;border-radius:3px;display:inline-flex;align-items:center;gap:2px}#clear-btn{padding:3px 8px;border-radius:4px;border:1px solid transparent;background:transparent;color:var(--text3);cursor:pointer;font-family:var(--ui);font-size:11px;transition:all .15s;display:flex;align-items:center;gap:4px}#clear-btn:hover{background:var(--bg3);color:var(--text2);border-color:var(--border)}#layout-pill{display:flex;background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:2px;gap:1px}.layout-btn{display:flex;align-items:center;justify-content:center;padding:4px 7px;border-radius:4px;border:none;background:transparent;color:var(--text3);cursor:pointer;transition:all .15s}.layout-btn:hover{color:var(--text2);background:var(--bg3)}.layout-btn.layout-active{background:var(--bg3);color:var(--text);border:1px solid var(--border2)}#layout{display:flex;flex:1;overflow:hidden}#layout.layout-tb{flex-direction:column}#layout.layout-tb #resizer{width:auto;height:3px;cursor:row-resize}#layout.layout-tb #out-side{width:auto!important;flex-shrink:0}#ed-side{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}#file-tab{height:34px;background:var(--bg2);border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;padding:0 12px;flex-shrink:0}.ftab{display:flex;align-items:center;gap:7px;padding:0 14px;height:30px;font-size:12px;font-family:var(--ui);color:var(--text);background:var(--bg);border:1px solid var(--border);border-bottom:1px solid var(--bg);border-radius:6px 6px 0 0;position:relative;top:1px}.fdot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.fdot-js{background:var(--js)}.fdot-ts{background:var(--ts)}.prettify-btn{margin-left:auto;display:flex;align-items:center;gap:5px;padding:3px 9px;border-radius:5px;border:1px solid transparent;background:transparent;color:var(--text2);font-family:var(--ui);font-size:11px;cursor:pointer;transition:color .15s,background .15s;flex-shrink:0}.prettify-btn:hover:not(:disabled){background:var(--bg2);color:var(--text)}.prettify-btn:disabled{opacity:.5;cursor:default}#cm-wrapper{flex:1;overflow:hidden;position:relative}#cm-wrapper .cm-editor{height:100%;font-size:13px}#cm-wrapper .cm-scroller{font-family:var(--mono)!important;line-height:1.65!important;overflow:auto}#cm-wrapper .cm-editor{background:var(--editor-bg)!important}#cm-wrapper .cm-gutters{background:var(--editor-bg)!important;border-right:1px solid var(--border)!important;min-width:52px}#cm-wrapper .cm-scroller::-webkit-scrollbar{width:3px;height:0}#cm-wrapper .cm-scroller::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}#cm-wrapper .cm-scroller::-webkit-scrollbar-track{background:transparent}#cm-wrapper .cm-lineNumbers .cm-gutterElement{padding:0 10px 0 6px}#cm-wrapper .cm-foldGutter .cm-gutterElement{display:flex;align-items:center;justify-content:center}#cm-wrapper .cm-fold-marker{display:flex;align-items:center;justify-content:center;opacity:.45;cursor:pointer;line-height:1}#cm-wrapper .cm-fold-marker:hover{opacity:1}#cm-wrapper .cm-cursor{border-left-width:2px!important}[data-theme=light] #cm-wrapper .cm-selectionBackground,[data-theme=light] #cm-wrapper .cm-content ::selection{background:#ddd!important}#statusbar{height:22px;background:var(--bg2);border-top:1px solid var(--border);display:flex;align-items:center;padding:0 12px;gap:16px;font-size:11px;font-family:var(--ui);flex-shrink:0}.si{color:var(--text3)}.si.s-js{color:var(--js);font-weight:600}.si.s-ts{color:var(--ts);font-weight:600}.si.s-ok{color:var(--green)}.si.s-err{color:var(--red)}.si.s-warn{color:var(--orange)}#sb-r{margin-left:auto;display:flex;gap:16px}#sb-st{display:flex;align-items:center;gap:5px}#resizer{width:3px;background:var(--border);cursor:col-resize;flex-shrink:0;transition:background .15s}#resizer:hover,#resizer.active{background:var(--js)}#out-side{display:flex;flex-direction:column;flex-shrink:0;background:var(--bg2);width:400px;min-width:300px}#out-header{height:34px;background:var(--bg2);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 14px;gap:6px;flex-shrink:0}#out-label{font-family:var(--ui);font-size:11px;font-weight:600;color:var(--text2);text-transform:uppercase;letter-spacing:.8px}.otabs{display:flex;gap:2px;margin-left:auto}.otab{padding:3px 10px;border-radius:4px;font-family:var(--ui);font-size:11px;color:var(--text3);cursor:pointer;transition:all .15s;border:1px solid transparent;-webkit-user-select:none;user-select:none}.otab.on{background:var(--bg3);color:var(--text);border-color:var(--border2)}.otab:not(.on):hover{color:var(--text2);background:var(--bg3)}.pbadge{font-size:10px;background:var(--bg4);border-radius:8px;padding:0 6px;margin-left:3px;font-family:var(--ui)}.out-panel{flex:1;overflow-y:auto;display:none}.out-panel.show{display:flex;flex-direction:column}.out-panel::-webkit-scrollbar{width:3px;height:0}.out-panel::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}#panel-console{padding:10px 14px;gap:0;font-family:var(--mono);font-size:12.5px;line-height:1.7}#panel-problems{padding:7px}#panel-compiled{padding:12px 16px;font-family:var(--mono);font-size:11.5px;color:var(--text2);white-space:pre}.cl{display:flex;gap:9px;align-items:flex-start;padding:1.5px 0}.cl-icon{flex-shrink:0;opacity:.45;padding-top:3px;-webkit-user-select:none;user-select:none;display:flex}.cl-text{flex:1;white-space:pre-wrap;word-break:break-all}.cl.t-log .cl-text{color:var(--text)}.cl.t-info .cl-text{color:var(--blue)}.cl.t-warn .cl-text{color:var(--orange)}.cl.t-error .cl-text{color:var(--red)}.cl.t-sys .cl-text{color:var(--text3);font-style:italic}.cl-div{height:1px;background:var(--border);margin:5px 0;flex-shrink:0}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--text3);font-family:var(--ui);flex:1}.empty-icon{opacity:.18;display:flex}.empty-msg{font-size:13px}.empty-sub{font-size:11px;opacity:.6;display:flex;align-items:center;gap:3px}.prob{display:flex;gap:8px;padding:7px 10px;border-radius:6px;margin-bottom:3px;font-size:11.5px;cursor:default;transition:background .12s}.prob:hover{background:var(--bg3)}.prob.pe{border-left:2px solid var(--red);background:color-mix(in srgb,var(--red) 8%,transparent)}.prob.pw{border-left:2px solid var(--orange);background:color-mix(in srgb,var(--orange) 8%,transparent)}.prob-msg{color:var(--text);font-family:var(--ui);line-height:1.45}.prob-loc{color:var(--text3);font-size:10px;font-family:var(--mono);margin-top:2px}#no-probs{padding:18px;text-align:center;color:var(--text3);font-family:var(--ui);font-size:12px;display:flex;align-items:center;justify-content:center;gap:6px}#stdin-row{border-top:1px solid var(--border);padding:8px 12px;flex-shrink:0;background:var(--bg2)}#stdin-lbl{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:var(--text3);font-family:var(--ui);display:block;margin-bottom:4px}#stdin{width:100%;background:var(--bg3);border:1px solid var(--border);border-radius:4px;color:var(--text);font-family:var(--mono);font-size:12px;padding:5px 8px;resize:vertical;outline:none;min-height:42px;max-height:80px}#stdin:focus{border-color:var(--border2)}.spin{animation:sp .65s linear infinite;flex-shrink:0}@keyframes sp{to{transform:rotate(360deg)}}
