*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #f5f5f5;--bg-secondary: #ffffff;--bg-header: #2d3748;--bg-panel: #f7fafc;--bg-input: #1a202c;--text-primary: #2d3748;--text-secondary: #4a5568;--text-header: #ffffff;--border-color: #e2e8f0;--accent-color: #4299e1;--accent-hover: #3182ce;--btn-secondary: #718096;--btn-secondary-hover: #4a5568;--console-bg: #fafbfc;--console-border: #e1e4e8;--console-text: #24292e;--console-text-secondary: #6a737d;--console-index-bg: #f1f3f5;--console-row-hover: #f6f8fa;--console-row-alt: #ffffff}.dark{--bg-primary: #1a202c;--bg-secondary: #2d3748;--bg-header: #171923;--bg-panel: #1a202c;--bg-input: #0d1117;--text-primary: #e2e8f0;--text-secondary: #a0aec0;--text-header: #e2e8f0;--border-color: #4a5568;--accent-color: #63b3ed;--accent-hover: #4299e1;--btn-secondary: #4a5568;--btn-secondary-hover: #718096;--console-bg: #0d1117;--console-border: #30363d;--console-text: #c9d1d9;--console-text-secondary: #8b949e;--console-index-bg: #161b22;--console-row-hover: #161b22;--console-row-alt: #0d1117}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);height:100vh;overflow:hidden;margin:0}#root{display:flex;flex-direction:column;height:100vh;overflow:hidden}.header{background:var(--bg-header);color:var(--text-header);padding:10px 20px;display:flex;align-items:center;flex-shrink:0;box-shadow:0 2px 4px #0000001a;z-index:1000}.header h1{font-size:1.5rem;font-weight:600}.header .header-left{display:flex;align-items:center;gap:10px;margin-left:20px}.header .controls{display:flex;align-items:center;gap:15px;margin-left:auto}.engine-select{padding:6px 12px;border:1px solid var(--border-color);border-radius:4px;background:var(--bg-input);color:var(--text-header);font-size:14px}.btn{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .2s}.btn-primary{background:var(--accent-color);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{background:var(--btn-secondary);cursor:not-allowed}.btn-secondary{background:var(--btn-secondary);color:#fff;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.btn-secondary:hover{background:var(--btn-secondary-hover)}.btn-secondary:disabled{background:var(--text-secondary);cursor:not-allowed}.btn-icon{background:transparent;padding:6px 10px;font-size:18px;line-height:1}.btn-icon:hover{background:#ffffff1a}.btn .spinner{width:14px;height:14px;margin-right:6px;border-width:2px}.auto-transform-label{display:flex;align-items:center;gap:6px;font-size:14px;cursor:pointer;-webkit-user-select:none;user-select:none}.auto-transform-label input[type=checkbox]{width:16px;height:16px;cursor:pointer}.main-container{display:flex;flex:1;min-height:0;overflow:hidden}.left-panel-wrapper,.right-panel-wrapper{display:flex;flex-direction:column;height:100%;min-height:0;min-width:200px;overflow:hidden}.left-panel{flex:1;display:flex;flex-direction:column;background:var(--bg-secondary);border-right:1px solid var(--border-color);min-height:0;overflow:hidden}.right-panel,.unified-panel{flex:1;display:flex;flex-direction:column;background:var(--bg-secondary);min-height:0;overflow:hidden}.splitter{width:6px;background:var(--border-color);cursor:col-resize;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background-color .15s ease}.splitter:hover,.splitter.dragging{background:var(--accent-color)}.splitter-handle{width:2px;height:40px;background:var(--text-secondary);border-radius:1px;opacity:.5;transition:opacity .15s ease}.splitter:hover .splitter-handle,.splitter.dragging .splitter-handle{opacity:0}.panel-header{background:var(--bg-panel);padding:8px 16px;border-bottom:1px solid var(--border-color);font-weight:600;color:var(--text-primary);font-size:14px}.editor-container{flex:1;position:relative;min-height:0;overflow:hidden}.editor-tabs{display:flex;background:var(--bg-panel);border-bottom:1px solid var(--border-color);flex-shrink:0}.editor-tab{padding:8px 16px;cursor:pointer;border-right:1px solid var(--border-color);font-size:14px;font-weight:500;color:var(--text-secondary);transition:background-color .2s}.editor-tab.active{background:var(--bg-secondary);color:var(--accent-color);border-bottom:2px solid var(--accent-color)}.editor-tab:hover:not(.active){background:var(--bg-primary)}.result-tabs{display:flex;background:var(--bg-panel);border-bottom:1px solid var(--border-color);flex-shrink:0}.result-tab{padding:8px 16px;cursor:pointer;border-right:1px solid var(--border-color);font-size:14px;font-weight:500;color:var(--text-secondary);transition:background-color .2s}.result-tab.active{background:var(--bg-secondary);color:var(--accent-color);border-bottom:2px solid var(--accent-color)}.result-tab:hover:not(.active){background:var(--bg-primary)}.result-tab.loading:after{content:"";display:inline-block;width:12px;height:12px;margin-left:8px;border:2px solid var(--border-color);border-top:2px solid var(--accent-color);border-radius:50%;animation:spin 1s linear infinite;vertical-align:middle}.status-bar{background:var(--bg-header);color:var(--text-header);padding:6px 16px;font-size:12px;display:flex;justify-content:space-between;flex-shrink:0;align-items:center}.status-left,.status-right{display:flex;gap:20px}.error-message{color:#e53e3e;background:#fed7d7;padding:12px 16px;border-left:4px solid #e53e3e;margin:16px;border-radius:0 4px 4px 0;font-family:monospace;font-size:14px;white-space:pre-wrap}.success-message{color:#38a169;background:#c6f6d5;padding:8px 16px;margin:16px;border-radius:4px;font-size:14px}.save-message{color:#68d391;font-size:14px;font-weight:500;opacity:1;transition:opacity .3s ease-out}.save-message.fade-out{opacity:0}.spinner{width:20px;height:20px;border:2px solid var(--border-color);border-top:2px solid var(--accent-color);border-radius:50%;animation:spin 1s linear infinite;margin-right:10px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.console-container{background-color:var(--console-bg);color:var(--console-text);overflow-y:auto;border:1px solid var(--console-border);border-radius:4px;margin:8px}.console-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--console-text-secondary);font-style:italic;padding:20px;text-align:center}.console-messages{font-family:SF Mono,Consolas,Monaco,Menlo,Courier New,monospace;font-size:12px;line-height:1.5;padding:0}.console-message{display:flex;align-items:flex-start;gap:0;padding:6px 12px;border-bottom:1px solid var(--console-border);transition:background-color .1s ease}.console-message:nth-child(2n){background-color:var(--console-row-alt)}.console-message:hover{background-color:var(--console-row-hover)}.console-message:last-child{border-bottom:none}.console-message-type{color:var(--console-text-secondary);flex-shrink:0;min-width:70px;padding-right:12px;font-size:11px;font-weight:600;-webkit-user-select:none;user-select:none;text-align:left;border-right:1px solid var(--console-border);margin-right:12px;padding-top:1px}.console-message-info .console-message-type{color:#3b82f6}.console-message-warning .console-message-type{color:#f59e0b}.console-message-warning{background-color:#f59e0b14}.console-message-warning:nth-child(2n){background-color:#f59e0b1f}.console-message-text{flex:1;white-space:pre-wrap;word-break:break-word;color:var(--console-text)}.unified-tabs{display:flex;background:var(--bg-panel);border-bottom:1px solid var(--border-color);overflow-x:auto;-webkit-overflow-scrolling:touch;flex-shrink:0}.unified-tab{padding:8px 12px;cursor:pointer;border-right:1px solid var(--border-color);font-size:13px;font-weight:500;color:var(--text-secondary);transition:background-color .2s;white-space:nowrap;flex-shrink:0}.unified-tab.active{background:var(--bg-secondary);color:var(--accent-color);border-bottom:2px solid var(--accent-color)}.unified-tab:hover:not(.active){background:var(--bg-primary)}@media(max-width:1024px){.header{flex-wrap:wrap;gap:10px;padding:8px 12px}.header .header-left{margin-left:10px;gap:8px}.header .controls{flex-wrap:wrap;gap:8px}.header .controls button,.header .header-left button,.header .header-left a{padding:6px 12px;font-size:13px}.header .controls select{padding:6px 8px;font-size:13px}}