:root{--vscode-bg: #1e1e1e;--vscode-editor-bg: #1e1e1e;--vscode-header-bg: #252526;--vscode-border: #333333;--vscode-text: #d4d4d4;--vscode-active-tab: #0e639c;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.5;font-weight:400;color:var(--vscode-text);background-color:var(--vscode-bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;display:flex;min-width:320px;min-height:100vh}#app{width:100%;height:100vh;max-height:100vh;padding:0;display:flex;flex-direction:column;overflow:hidden}.header-bar{display:flex;justify-content:space-between;align-items:center;background-color:var(--vscode-header-bg);padding:0 12px;height:40px;border-bottom:1px solid var(--vscode-border)}.logo{font-weight:600;font-size:16px;color:var(--vscode-text)}.actions{display:flex;gap:8px;align-items:center}.project-name-container{display:flex;align-items:center;gap:8px}.project-name-input{background-color:#3c3c3c;color:var(--vscode-text);border:1px solid var(--vscode-border);border-radius:3px;padding:5px 8px;font-size:12px;width:150px;height:28px;outline:none}.project-name-input:focus{border-color:var(--vscode-active-tab)}.btn{background-color:var(--vscode-active-tab);color:#fff;border:none;border-radius:3px;padding:6px 12px;font-size:12px;cursor:pointer;transition:background-color .2s}.btn:hover{background-color:#17b}#run-btn{background-color:#4d8b4d}#run-btn:hover{background-color:#5da15d}#clear-btn{background-color:#8b4d4d;margin-right:0;position:relative;z-index:5;min-width:50px}#clear-btn:hover{background-color:#a15d5d}.main-container{display:flex;flex:1;overflow:hidden;min-height:0;gap:4px}.chat-container{width:350px;min-width:200px;border-right:1px solid var(--vscode-border);display:flex;flex-direction:column;background-color:var(--vscode-editor-bg);overflow:hidden;border:1px solid var(--vscode-border);border-radius:4px;margin:4px 0 4px 4px}.chat-header{background-color:var(--vscode-header-bg);color:var(--vscode-text);padding:8px 12px;font-size:14px;font-weight:500;border-bottom:1px solid var(--vscode-border);display:flex;align-items:center}.info-icon{display:inline-flex;align-items:center;justify-content:center;margin-left:8px;font-size:14px;color:#89d4ff;cursor:help;position:relative}.info-icon:hover{color:#b3e5ff}.info-icon .tooltip{visibility:hidden;position:absolute;width:200px;background-color:#292929;color:#e0e0e0;text-align:center;border-radius:6px;padding:8px;font-size:12px;top:50%;left:100%;transform:translateY(-50%);margin-left:8px;z-index:10;box-shadow:0 3px 8px #0000004d;opacity:0;transition:opacity .2s,visibility .2s}.info-icon .tooltip:after{content:"";position:absolute;top:50%;right:100%;margin-top:-5px;border-width:5px;border-style:solid;border-color:transparent #292929 transparent transparent}.info-icon:hover .tooltip{visibility:visible;opacity:1}.chat-messages{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:10px}.message{padding:8px 12px;border-radius:8px;max-width:85%;word-break:break-word}.message-user{align-self:flex-end;background-color:var(--vscode-active-tab);color:#fff}.message-other{align-self:flex-start;background-color:#3c3c3c;color:var(--vscode-text)}.chat-input-container{display:flex;padding:10px;border-top:1px solid var(--vscode-border);gap:8px;background-color:var(--vscode-editor-bg)}.chat-input{flex:1;background-color:#3c3c3c;color:var(--vscode-text);border:1px solid var(--vscode-border);border-radius:6px;padding:8px 12px;font-size:12px;outline:none}.chat-input:focus{border-color:var(--vscode-active-tab)}.chat-send-btn{padding:6px 10px;border-radius:6px}.editor-container{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:4px;flex:1;padding:4px;overflow:hidden;min-height:0}.editor-panel,.result-panel{border:1px solid var(--vscode-border);border-radius:4px;overflow:hidden;display:flex;flex-direction:column;min-height:0}.editor-header{background-color:var(--vscode-header-bg);color:var(--vscode-text);padding:8px 12px;font-size:14px;font-weight:500;border-bottom:1px solid var(--vscode-border)}.editor{height:100%;overflow:auto;background-color:var(--vscode-editor-bg);padding:0;font-family:Consolas,Courier New,monospace;font-size:14px;line-height:1.5;flex:1;min-height:0}.result-frame{width:100%;height:100%;border:none;background-color:#fff}.cm-editor{height:100%!important;overflow:auto!important}.cm-editor .cm-scroller{font-family:Consolas,Courier New,monospace!important;overflow:auto!important}.cm-editor .cm-content{padding:4px 0!important;min-height:100%!important}.cm-editor .cm-gutters{height:auto!important}@media (max-width: 768px){.editor-container{grid-template-columns:1fr;grid-template-rows:repeat(4,1fr)}}.cm-minimap{position:absolute;right:0;top:0;bottom:0;width:40px;z-index:99;background-color:var(--vscode-editor-bg);border-left:1px solid var(--vscode-border);overflow:hidden}.cm-minimap-overlay{background-color:#5555554d;border:1px solid rgba(128,128,128,.4);position:absolute}.editor-panel{position:relative}.editor-panel .cm-content{padding-right:40px}.editor-panel .cm-gutters{padding-right:0}.message pre{margin:5px 0;white-space:pre-wrap;background-color:#2d2d2d;border-radius:3px;padding:8px;font-family:Consolas,Courier New,monospace;font-size:12px;overflow-x:auto}.message code{font-family:Consolas,Courier New,monospace;font-size:12px}.message pre code.html{color:#e9a26c}.message pre code.css{color:#9cdcfe}.message pre code.javascript,.message pre code.js{color:#ce9178}.cm-editor .emmet-abbreviation{background-color:#569cd626;border-bottom:1px dashed #569cd6;padding-bottom:1px}.cm-editor .emmet-preview{position:absolute;background-color:#252526;border:1px solid #3c3c3c;border-radius:4px;padding:6px 8px;margin-top:4px;max-width:350px;max-height:200px;overflow:auto;color:#d4d4d4;font-family:Consolas,monospace;font-size:12px;z-index:50;box-shadow:0 3px 8px #0000004d;white-space:pre-wrap}