:root{--vscode-bg: #1e1e1e;--vscode-sidebar-bg: #252526;--vscode-activity-bar-bg: #333333;--vscode-panel-bg: #1e1e1e;--vscode-status-bar-bg: #007acc;--vscode-border: #3c3c3c;--vscode-text: #cccccc;--vscode-text-muted: #858585;--vscode-tab-active-bg: #1e1e1e;--vscode-tab-inactive-bg: #2d2d2d;--vscode-tab-hover-bg: #2a2d2e;--vscode-tab-active-text: #ffffff;--vscode-tab-inactive-text: #969696;--vscode-editor-bg: #1e1e1e;--vscode-line-highlight: #2a2d2e;--vscode-selection: #264f78;--vscode-button-bg: #0e639c;--vscode-button-hover: #1177bb;--vscode-accent: #007acc;--vscode-dropdown-bg: #252526}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;font-size:13px;color:var(--vscode-text);background-color:var(--vscode-bg);line-height:1.5}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#424242;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#4f4f4f}::-webkit-scrollbar-corner{background:transparent}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.h-full{height:100%}.w-full{width:100%}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;user-select:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .2s ease-in-out}.activity-bar{width:48px;background-color:var(--vscode-activity-bar-bg);display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--vscode-border);flex-shrink:0}.activity-bar-top{display:flex;flex-direction:column;padding:8px 0;gap:4px}.activity-bar-bottom{display:flex;flex-direction:column;padding:8px 0;gap:4px;border-top:1px solid var(--vscode-border)}.activity-bar-item{position:relative;display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:none;border:none;color:var(--vscode-text-muted);cursor:pointer;transition:all .2s}.activity-bar-item:hover,.activity-bar-item.active{color:var(--vscode-text)}.active-indicator{position:absolute;left:0;top:8px;bottom:8px;width:2px;background-color:var(--vscode-text);border-radius:0 2px 2px 0}.sidebar{background-color:var(--vscode-sidebar-bg);border-right:1px solid var(--vscode-border);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0;min-width:150px;max-width:500px}.sidebar-section{flex:1;overflow:auto;position:relative}.sidebar-header{padding:10px 20px;font-size:11px;font-weight:600;color:var(--vscode-text-muted);letter-spacing:.5px;display:flex;align-items:center;justify-content:space-between}.sidebar-actions{display:flex;gap:4px}.sidebar-action-btn{background:none;border:none;color:var(--vscode-text-muted);cursor:pointer;padding:2px;border-radius:3px;display:flex;align-items:center;justify-content:center}.sidebar-action-btn:hover{background-color:#ffffff1a;color:var(--vscode-text)}.sidebar-resize-handle{position:fixed;top:0;bottom:0;width:4px;cursor:ew-resize;z-index:100;background:transparent;transition:background-color .2s}.sidebar-resize-handle:hover,.sidebar-resize-handle:active{background-color:var(--vscode-accent)}.file-tree{padding:0 0 8px;outline:none}.tree-node{display:flex;align-items:center;padding:4px 12px 4px 8px;cursor:pointer;gap:4px;font-size:13px;color:var(--vscode-text);-webkit-user-select:none;user-select:none;position:relative;border-radius:0;outline:none}.tree-node:hover{background-color:#ffffff0d}.tree-node.active{background-color:var(--vscode-selection)}.tree-node.focused{outline:1px solid var(--vscode-accent);outline-offset:-1px}.tree-node:focus{outline:1px solid var(--vscode-accent);outline-offset:-1px}.tree-node.creating{background-color:#ffffff1a}.tree-node.dragging{opacity:.5}.tree-node.drop-before,.tree-node.drop-after,.tree-node.drop-inside{position:relative}.drop-indicator{position:absolute;left:0;right:0;height:2px;background-color:var(--vscode-accent);pointer-events:none;z-index:10}.drop-indicator-before{top:-1px}.drop-indicator-after{bottom:-1px}.drop-indicator-inside{top:25%;bottom:25%;height:auto;background-color:#3b82f633;border:1px solid var(--vscode-accent)}.tree-chevron{display:flex;align-items:center;color:var(--vscode-text-muted);flex-shrink:0}.tree-folder-icon{color:#dcb67a;flex-shrink:0}.tree-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-icon{flex-shrink:0}.file-icon.html{color:#e44d26}.file-icon.css{color:#264de4}.file-icon.js,.file-icon.jsx,.file-icon.cjs,.file-icon.mjs{color:#f7df1e}.file-icon.ts,.file-icon.tsx,.file-icon.mts{color:#3178c6}.file-icon.json{color:#f7df1e}.file-icon.scss,.file-icon.sass{color:#c69}.file-icon.less{color:#1d365d}.file-icon.yaml,.file-icon.yml{color:#cb171e}.file-icon.toml{color:#9c4121}.file-icon.vue{color:#4fc08d}.file-icon.py,.file-icon.pyc,.file-icon.pyd{color:#3776ab}.file-icon.rs{color:#dea584}.file-icon.go{color:#00add8}.file-icon.png,.file-icon.jpg,.file-icon.jpeg,.file-icon.gif,.file-icon.svg,.file-icon.webp,.file-icon.ico{color:#b7b73b}.file-icon.mp3,.file-icon.wav,.file-icon.ogg,.file-icon.flac{color:#a855f7}.file-icon.mp4,.file-icon.avi,.file-icon.mov,.file-icon.webm{color:#f43f5e}.file-icon.zip,.file-icon.tar,.file-icon.gz,.file-icon.rar{color:#f59e0b}.file-icon.env{color:#faf743}.file-icon.gitignore,.file-icon.gitattributes{color:#f14e32}.file-icon.txt,.file-icon.md,.file-icon.markdown{color:#6b7280}.rename-input,.create-input{flex:1;background-color:var(--vscode-bg);border:1px solid var(--vscode-accent);color:var(--vscode-text);padding:2px 4px;font-size:13px;outline:none;border-radius:2px;margin-left:4px}.context-menu{background-color:var(--vscode-dropdown-bg);border:1px solid var(--vscode-border);border-radius:4px;padding:4px 0;min-width:160px;box-shadow:0 4px 12px #0006;z-index:1000;animation:contextMenuFade .1s ease-out}@keyframes contextMenuFade{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu button{display:flex;align-items:center;gap:8px;width:100%;padding:6px 12px;background:none;border:none;color:var(--vscode-text);font-size:13px;cursor:pointer;text-align:left;transition:background-color .1s}.context-menu button:hover{background-color:var(--vscode-selection)}.context-menu button.danger{color:#f48771}.context-menu button.danger:hover{background-color:#f4877133}.context-menu-divider{height:1px;background-color:var(--vscode-border);margin:4px 0}.outline-content{padding:8px 20px}.outline-item{display:flex;align-items:center;padding:4px 0;font-size:13px;color:var(--vscode-text);cursor:pointer}.outline-item:hover{color:var(--vscode-tab-active-text)}.outline-item.indented{padding-left:16px}.outline-tag{color:#569cd6}.search-content{padding:12px 20px;display:flex;flex-direction:column;gap:8px}.search-input{background-color:var(--vscode-bg);border:1px solid var(--vscode-border);color:var(--vscode-text);padding:6px 10px;font-size:13px;border-radius:2px;outline:none}.search-input:focus{border-color:var(--vscode-accent)}.git-content{padding:20px}.git-message{color:var(--vscode-text-muted);font-size:13px;text-align:center;padding:20px}.extensions-content{padding:12px 20px}.extensions-list{margin-top:12px}.extension-item{display:flex;align-items:center;gap:12px;padding:8px;cursor:pointer;border-radius:4px}.extension-item:hover{background-color:#ffffff0d}.extension-icon{font-size:24px}.extension-info{flex:1}.extension-name{font-size:13px;color:var(--vscode-text)}.extension-desc{font-size:11px;color:var(--vscode-text-muted)}.folder-item,.file-item{-webkit-user-select:none;user-select:none}.folder-header{display:flex;align-items:center;padding:4px 12px 4px 8px;cursor:pointer;gap:4px;font-size:13px;color:var(--vscode-text)}.folder-header:hover{background-color:#ffffff0d}.folder-icon{color:#dcb67a}.folder-children{padding-left:8px}.file-item{display:flex;align-items:center;padding:4px 12px 4px 8px;cursor:pointer;gap:4px;font-size:13px;color:var(--vscode-text)}.file-item:hover{background-color:#ffffff0d}.file-item.active{background-color:var(--vscode-selection)}.file-indent{width:16px}.editor-wrapper{display:flex;flex-direction:column;height:100%;background-color:var(--vscode-editor-bg)}.editor-header{display:flex;align-items:center;justify-content:space-between;padding:0 12px;height:35px;background-color:var(--vscode-tab-active-bg);border-bottom:1px solid var(--vscode-border)}.editor-header-text{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--vscode-text-muted)}.editor-actions{display:flex;gap:4px}.editor-action-btn{background:none;border:none;color:var(--vscode-text);cursor:pointer;padding:4px 6px;border-radius:3px;font-size:12px;transition:all .2s;display:flex;align-items:center;justify-content:center}.editor-action-btn:hover{background-color:#ffffff1a;color:#fff}.editor-content{flex:1;overflow:hidden}.editor-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--vscode-text-muted);gap:12px}.loading-spinner{width:32px;height:32px;border:3px solid var(--vscode-border);border-top-color:var(--vscode-accent);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.preview-wrapper{display:flex;flex-direction:column;height:100%;background-color:#fff}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:0 12px;height:35px;background-color:var(--vscode-tab-active-bg);border-bottom:1px solid var(--vscode-border)}.preview-header-text{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--vscode-text-muted)}.preview-actions{display:flex;gap:4px}.preview-action-btn{background:none;border:none;color:var(--vscode-text);cursor:pointer;padding:4px 6px;border-radius:3px;font-size:12px;transition:all .2s;display:flex;align-items:center;justify-content:center}.preview-action-btn:hover{background-color:#ffffff1a;color:#fff}.preview-content{flex:1;overflow:hidden;background-color:#fff}.preview-iframe{width:100%;height:100%;border:none;background-color:#fff}.status-bar{height:22px;background-color:var(--vscode-status-bar-bg);display:flex;align-items:center;justify-content:space-between;padding:0 8px;font-size:12px;color:#fff;flex-shrink:0}.status-bar-left,.status-bar-right{display:flex;align-items:center;gap:4px}.status-item{display:flex;align-items:center;gap:4px;padding:2px 8px;cursor:pointer;border-radius:2px;transition:background-color .2s}.status-item:hover{background-color:#ffffff1a}.status-item.errors{color:#f48771}.status-item.warnings{color:#cca700}.app{display:flex;flex-direction:column;height:100vh;width:100vw;background-color:var(--vscode-bg);overflow:hidden}.content-area{display:flex;flex:1;min-width:0;overflow:hidden;--sidebar-width: 250px}.main-content{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.tab-bar{display:flex;background-color:var(--vscode-tab-inactive-bg);border-bottom:1px solid var(--vscode-border);height:35px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--vscode-border) transparent}.tab-bar::-webkit-scrollbar{height:4px}.tab-bar::-webkit-scrollbar-track{background:transparent}.tab-bar::-webkit-scrollbar-thumb{background-color:var(--vscode-border);border-radius:2px}.tab{display:flex;align-items:center;gap:6px;padding:0 12px;height:35px;background-color:var(--vscode-tab-inactive-bg);color:var(--vscode-tab-inactive-text);font-size:13px;cursor:pointer;border-right:1px solid var(--vscode-border);white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color .2s}.tab:hover{background-color:var(--vscode-tab-hover-bg)}.tab.active{background-color:var(--vscode-tab-active-bg);color:var(--vscode-tab-active-text);border-bottom:1px solid var(--vscode-accent)}.tab-icon{font-size:14px}.tab-dirty{font-style:italic}.tab-dirty-indicator{color:var(--vscode-accent);font-size:10px;margin-left:2px}.tab-close{display:flex;align-items:center;justify-content:center;width:16px;height:16px;background:none;border:none;color:var(--vscode-text-muted);cursor:pointer;font-size:14px;border-radius:3px;padding:0;margin-left:4px;opacity:0;transition:opacity .2s}.tab:hover .tab-close{opacity:1}.tab-close:hover{background-color:#ffffff1a;color:var(--vscode-text)}.tab.active .tab-close{opacity:1}.no-editor{flex:1;display:flex;align-items:center;justify-content:center;color:var(--vscode-text-muted);font-size:14px}.editor-container{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.editor-panel,.preview-panel{min-height:100px;display:flex;flex-direction:column}.splitter{height:8px;background-color:var(--vscode-bg);cursor:row-resize;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background-color .2s}.splitter:hover{background-color:var(--vscode-accent)}.splitter-handle{width:40px;height:2px;background-color:var(--vscode-border);border-radius:1px}.splitter:hover .splitter-handle{background-color:#fff}@media(max-width:768px){.sidebar{display:none}}