.compare-container{display:flex;flex-direction:column;gap:1rem;height:100%;width:100%}.compare-inputs{display:grid;grid-template-columns:1fr 1fr;gap:0}@media(max-width:768px){.compare-inputs{grid-template-columns:1fr}}.input-panel{display:flex;flex-direction:column;gap:0}.input-panel:first-child{border-right:1px solid var(--border)}.input-panel .panel-header{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border)}.input-panel .panel-title{font-weight:600;display:flex;align-items:center;gap:.5rem}.input-panel .panel-title .file-name{font-weight:400;color:var(--text-secondary);font-size:.9em}.input-panel textarea{flex:1;min-height:200px;resize:vertical;font-family:monospace;font-size:13px;line-height:1.5;border:none;border-radius:0}.code-editor-wrapper{display:grid;grid-template-columns:1fr 1fr;flex:1;min-height:400px;overflow:hidden;border:1px solid var(--border);border-radius:4px}.code-editor-panel{display:flex;flex-direction:column;overflow:hidden}.code-editor-panel:first-child{border-right:1px solid var(--border)}.code-editor{flex:1;overflow:auto;font-family:monospace;font-size:13px;line-height:1.6;background:var(--bg-primary);padding:0;margin:0;counter-reset:line}.code-line{display:flex;min-height:1.6em;padding:0 8px;white-space:pre}.code-line.editable{cursor:text}.code-line.added,.code-line.removed{background:#ef444426;color:#ef4444}.code-line.empty{background:var(--bg-secondary);opacity:.6}.code-line.unchanged{background:transparent}.code-line-number{min-width:40px;padding-right:8px;color:var(--text-muted);user-select:none;text-align:right;border-right:1px solid var(--border);margin-right:8px;flex-shrink:0}.code-line-content{flex:1;outline:none;white-space:pre}.code-line-content:empty:before{content:"​"}.code-editor-panel .panel-header{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border);font-weight:600}.file-input-wrapper{display:flex;gap:.5rem}.file-input-wrapper input[type=file]{display:none}.diff-view-container{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--border);border-radius:4px;overflow:hidden}.diff-panel{display:flex;flex-direction:column;overflow:hidden}.diff-panel:first-child{border-right:1px solid var(--border)}.diff-panel-header{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border);font-weight:600}.diff-panel-content{flex:1;overflow:auto;font-family:monospace;font-size:13px;line-height:1.6;background:var(--bg-primary)}.diff-panel-content.sync-scroll{overflow-y:scroll}.diff-line{display:flex;min-height:1.6em;padding:0 8px;white-space:pre}.diff-line.added{background:#22c55e26;color:#22c55e}.diff-line.removed{background:#ef444426;color:#ef4444}.diff-line.unchanged{background:transparent}.diff-line-number{min-width:40px;padding-right:8px;color:var(--text-muted);user-select:none;text-align:right;border-right:1px solid var(--border);margin-right:8px;flex-shrink:0}.diff-line-content{flex:1;white-space:pre}.diff-stats-bar{display:flex;gap:1rem;padding:.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-top:none;border-radius:0 0 4px 4px;font-size:.9em}.stat-added{color:#22c55e}.stat-removed{color:#ef4444}.stat-unchanged{color:var(--text-muted)}.drop-zone{border:2px dashed var(--border);border-radius:4px;padding:2rem;text-align:center;color:var(--text-muted);transition:all .2s;cursor:pointer;margin-bottom:1rem}.drop-zone:hover,.drop-zone.dragover{border-color:var(--primary);background:var(--bg-hover);color:var(--primary)}.drop-zone-icon{font-size:2rem;margin-bottom:.5rem}.folder-tree{flex:1;overflow:auto;padding:.5rem;min-height:200px}.tree-item{display:flex;align-items:center;padding:2px 4px;cursor:pointer;user-select:none}.tree-item:hover{background:var(--bg-hover)}.tree-item.selected{background:var(--primary-light);color:var(--primary)}.tree-toggle{width:20px;text-align:center;font-size:.8em;color:var(--text-muted)}.tree-icon{margin-right:6px}.tree-children{padding-left:20px}.tree-children.collapsed{display:none}.folder-diff-output{margin-top:1rem;border:1px solid var(--border);border-radius:4px;overflow:hidden}.folder-compare-result{max-height:400px;overflow:auto;padding:.5rem}.folder-item{padding:4px 8px;border-bottom:1px solid var(--border)}.folder-item:last-child{border-bottom:none}.folder-item.added{color:#22c55e}.folder-item.removed{color:#ef4444}.folder-item.modified{color:#eab308}.tree-toggle:hover{background:var(--bg-hover);border-radius:2px}.folder-item.clickable{cursor:pointer}.folder-item.clickable:hover{background:var(--bg-hover)}.file-compare-modal{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.file-compare-modal.hidden{display:none}.file-compare-modal-content{background:var(--bg-primary);border-radius:8px;width:90%;max-width:1200px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.file-compare-modal-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid var(--border)}.file-compare-modal-header h3{margin:0;font-size:1rem}.file-compare-modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-secondary);padding:.25rem .5rem;border-radius:4px}.file-compare-modal-close:hover{background:var(--bg-hover)}.file-compare-modal-body{flex:1;overflow:auto;padding:1rem}