*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,#dbeafe,#e0e7ff);min-height:100vh;color:#1f2937}.container{width:100%;max-width:1600px;margin:0 auto;padding:.75rem}.main-content{background:#fff;border-radius:.75rem;box-shadow:0 25px 50px -12px #00000040;padding:1rem}.upload-section{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}.file-upload{position:relative}.file-upload label{display:block;font-weight:500;color:#374151;margin-bottom:.5rem}.file-upload-area{border:2px dashed #d1d5db;border-radius:.5rem;padding:2rem;text-align:center;cursor:pointer;transition:all .2s ease;background:#f9fafb}.file-upload-area:hover{border-color:#3b82f6;background:#eff6ff}.file-upload-area.has-file{border-color:#10b981;background:#ecfdf5}.file-upload-area.drag-over{border-color:#3b82f6;background:#dbeafe}.file-upload input[type=file]{display:none}.upload-icon{width:48px;height:48px;color:#9ca3af;margin:0 auto 1rem}.upload-text{color:#6b7280;font-size:.875rem}.upload-text .highlight{color:#3b82f6;font-weight:500}.file-info{display:flex;align-items:center;justify-content:center;gap:.5rem}.file-info svg{width:24px;height:24px;color:#10b981}.file-name{color:#059669;font-weight:500;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.remove-file{background:none;border:none;color:#10b981;cursor:pointer;padding:.25rem;border-radius:50%;transition:background-color .2s}.remove-file:hover{background:#d1fae5}.controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.compare-btn{display:flex;align-items:center;gap:.5rem;background:#2563eb;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-weight:500;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 6px -1px #0000001a}.compare-btn:hover:not(:disabled){background:#1d4ed8;transform:translateY(-1px);box-shadow:0 10px 15px -3px #0000001a}.compare-btn:disabled{background:#d1d5db;color:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none}.view-mode-toggle{display:flex;align-items:center;gap:.5rem}.view-mode-toggle label{font-weight:500;color:#374151}.toggle-buttons{display:flex;background:#f3f4f6;border-radius:.5rem;padding:.25rem}.toggle-btn{padding:.5rem 1rem;border:none;background:none;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.5rem}.toggle-btn.active{background:#fff;color:#2563eb;box-shadow:0 1px 2px #0000000d}.toggle-btn:not(.active){color:#6b7280}.toggle-btn:hover:not(.active){color:#374151}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;gap:1rem}.spinner{width:32px;height:32px;border:3px solid #e5e7eb;border-top:3px solid #3b82f6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-message{background:#fef2f2;border:1px solid #fecaca;color:#dc2626;padding:1rem;border-radius:.5rem;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.error-close{background:none;border:none;color:#dc2626;cursor:pointer;padding:.25rem;border-radius:.25rem;margin-left:auto}.error-close:hover{background:#fee2e2}.comparison-results{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 280px;gap:.5rem;height:calc(100vh - 12rem);min-height:520px}.comparison-results.format-view{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 280px}.document-viewer{display:flex;flex-direction:column;background:#f9fafb;border-radius:.5rem;overflow:hidden;border:1px solid #e5e7eb}.document-header{background:#fff;border-bottom:1px solid #e5e7eb;padding:.75rem;text-align:center;position:sticky;top:0;z-index:10}.document-header h3{font-size:1.125rem;font-weight:600;color:#1f2937}.document-content{flex:1;padding:.75rem;overflow-y:auto;background:#fff;font-family:Times New Roman,Times,serif;line-height:1.6;font-size:14px}.document-content::-webkit-scrollbar{width:8px}.document-content::-webkit-scrollbar-track{background:#f1f5f9;border-radius:4px}.document-content::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.document-content::-webkit-scrollbar-thumb:hover{background:#94a3b8}.changes-panel{background:#f9fafb;display:flex;flex-direction:column;border-radius:.5rem;overflow:hidden;border:1px solid #e5e7eb}.changes-header{background:#fff;border-bottom:1px solid #e5e7eb;padding:1rem;text-align:center;position:sticky;top:0;z-index:10}.changes-list{flex:1;overflow-y:auto}.changes-list::-webkit-scrollbar{width:8px}.changes-list::-webkit-scrollbar-track{background:#f1f5f9;border-radius:4px}.changes-list::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.changes-list::-webkit-scrollbar-thumb:hover{background:#94a3b8}.change-item{padding:.75rem;border-bottom:1px solid #e5e7eb;cursor:pointer;transition:all .3s ease;display:flex;align-items:flex-start;gap:.75rem;position:relative}.change-item:hover{background:#f3f4f6;transform:translate(4px);box-shadow:0 2px 8px #0000001a}.change-item:last-child{border-bottom:none}.change-icon{width:16px;height:16px;margin-top:2px;flex-shrink:0}.change-icon.delete{color:#ef4444}.change-icon.insert{color:#10b981}.change-icon.modify{color:#f59e0b}.change-content{flex:1;min-width:0}.change-meta{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.change-type{font-size:.75rem;font-weight:500;padding:.125rem .5rem;border-radius:9999px}.change-type.delete{background:#fee2e2;color:#dc2626}.change-type.insert{background:#dcfce7;color:#16a34a}.change-type.modify{background:#fef3c7;color:#d97706}.change-doc{font-size:.75rem;color:#6b7280}.change-text{font-size:.875rem;color:#374151;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.change-arrow{width:16px;height:16px;color:#9ca3af;margin-top:2px;flex-shrink:0;transition:all .3s ease}.change-item:hover .change-arrow{color:#2563eb;transform:translate(4px)}.empty-state{text-align:center;padding:4rem 2rem}.empty-icon{width:64px;height:64px;background:#f3f4f6;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-bottom:1rem}.empty-icon svg{width:32px;height:32px;color:#9ca3af}.empty-state h3{font-size:1.125rem;font-weight:500;color:#6b7280;margin-bottom:.5rem}.empty-state p{color:#9ca3af}.document-content h1,.document-content h2,.document-content h3{margin-top:1.5em;margin-bottom:.75em;font-weight:700}.document-content h1{font-size:1.5em}.document-content h2{font-size:1.25em}.document-content h3{font-size:1.125em}.document-content p{margin-bottom:1em}.document-content ul,.document-content ol{margin-left:2em;margin-bottom:1em}.document-content table{border-collapse:collapse;width:100%;margin-bottom:1em}.document-content th,.document-content td{border:1px solid #d1d5db;padding:.5em;text-align:left}.document-content del{text-decoration:line-through;background-color:#fee2e2;color:#dc2626;padding:2px 4px;border-radius:3px}.document-content ins{text-decoration:none;background-color:#dcfce7;color:#16a34a;padding:2px 4px;border-radius:3px}.diff-anchor{display:inline-block;position:relative;width:0;height:1em;vertical-align:text-bottom}.diff-anchor-highlight:after{content:"";position:absolute;top:-.2em;left:-2px;width:4px;height:1.4em;border-radius:999px;background:#2563eb;box-shadow:0 0 0 4px #2563eb2e,0 0 14px #2563eb73;z-index:20}.document-content .modify{background-color:#fef3c7;color:#d97706;padding:2px 4px;border-radius:3px;text-decoration:none;border:1px solid #f59e0b}.highlight-diff{background:linear-gradient(45deg,#fef3c7,#fde68a)!important;border:2px solid #f59e0b!important;border-radius:6px!important;padding:4px 8px!important;margin:2px!important;position:relative!important;animation:highlightPulse 2s ease-in-out infinite;box-shadow:0 0 20px #f59e0b80!important;transform:scale(1.05)!important;z-index:100!important}@keyframes highlightPulse{0%,to{box-shadow:0 0 20px #f59e0b80;transform:scale(1.05)}50%{box-shadow:0 0 30px #f59e0bcc;transform:scale(1.08)}}.highlight-diff:before{content:"";position:absolute;inset:-4px;background:linear-gradient(45deg,#f59e0b,#fbbf24,#f59e0b,#fbbf24);border-radius:8px;z-index:-1;animation:borderGlow 1.5s linear infinite}@keyframes borderGlow{0%,to{opacity:.8}50%{opacity:1}}.highlight-diff:after{content:"👈";position:absolute;right:-30px;top:50%;transform:translateY(-50%);font-size:16px;animation:pointArrow 1s ease-in-out infinite}@keyframes pointArrow{0%,to{transform:translateY(-50%) translate(0)}50%{transform:translateY(-50%) translate(-5px)}}.change-item.active{background:linear-gradient(135deg,#dbeafe,#bfdbfe)!important;border-left:4px solid #2563eb!important;transform:translate(8px)!important;box-shadow:0 4px 12px #2563eb33!important}.change-item.active .change-arrow{color:#2563eb!important;transform:translate(8px) scale(1.2)!important}@media(max-width:1024px){.comparison-results{grid-template-columns:1fr;height:auto;gap:1rem}.document-viewer{height:400px}.changes-panel{order:-1;height:300px}}@media(max-width:768px){.upload-section{grid-template-columns:1fr}.controls{flex-direction:column;align-items:stretch}.main-content{padding:1rem}}.hidden{display:none!important}.changes-panel{background:#f8fafc;border:1px solid #dbe3ef;box-shadow:0 8px 20px #1e293b0f}.changes-header{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem;text-align:left}.changes-header h3{color:#0f172a;font-size:.95rem;font-weight:700}.changes-count,#changesCount{min-width:1.6rem;padding:.15rem .45rem;border-radius:999px;background:#e0e7ff;color:#3730a3;font-size:.72rem;font-weight:700;text-align:center}.changes-list{padding:.55rem;scrollbar-color:#cbd5e1 transparent;scrollbar-width:thin}.change-item{width:100%;padding:.7rem .65rem;border:1px solid transparent;border-bottom:1px solid #e2e8f0;border-radius:.55rem;background:transparent;text-align:left;transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease}.change-item:hover{background:#fff;border-color:#cbd5e1;transform:none;box-shadow:0 3px 10px #1e293b14}.change-item:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.change-item:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;border-radius:3px 0 0 3px;background:#94a3b8}.change-item.change-delete:before{background:#ef4444}.change-item.change-insert:before{background:#10b981}.change-item.change-modify:before{background:#f59e0b}.change-index{width:1.55rem;flex:0 0 1.55rem;padding-top:.1rem;color:#64748b;font-size:.7rem;font-variant-numeric:tabular-nums;font-weight:700}.change-type{font-size:.68rem;font-weight:700;letter-spacing:.02em}.change-text{color:#334155;font-size:.82rem}.change-item.active{background:#eff6ff!important;border:1px solid #93c5fd!important;box-shadow:0 4px 12px #2563eb24!important;transform:none!important}.change-item.active .change-arrow{color:#2563eb!important;transform:none!important}.changes-empty{padding:2rem 1rem;color:#64748b;font-size:.85rem;text-align:center}.format-highlight{border-radius:.3rem;outline:3px solid rgba(59,130,246,.38);outline-offset:3px;background:#dbeafe!important;scroll-margin-block:2rem}@media(max-width:1024px){#comparisonResults.comparison-results.format-view{grid-template-columns:1fr}}.reselect-btn{border:1px solid #cbd5e1;border-radius:.5rem;background:#fff;color:#1d4ed8;padding:.65rem 1rem;font-weight:600;cursor:pointer}.changes-tools{position:sticky;top:3.05rem;z-index:9;display:grid;gap:.5rem;padding:.6rem;border-bottom:1px solid #e2e8f0;background:#f8fafcfa}.change-search input{width:100%;height:2rem;border:1px solid #cbd5e1;border-radius:.45rem;padding:0 .65rem;color:#334155;background:#fff}.change-filter-row,.change-filters,.change-navigation{display:flex;align-items:center;gap:.3rem}.change-filter-row{justify-content:space-between}.change-filters{flex-wrap:wrap}.change-filter,.change-navigation button{min-height:1.75rem;border:1px solid #dbe3ef;border-radius:999px;background:#fff;color:#64748b;padding:.2rem .5rem;font-size:.7rem;cursor:pointer}.change-filter.active{border-color:#93c5fd;background:#eff6ff;color:#1d4ed8}.change-filter:focus-visible,.change-navigation button:focus-visible,.change-search input:focus-visible,.reselect-btn:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.change-navigation{flex:0 0 auto}.change-navigation button{border-radius:.4rem}.change-navigation button:disabled{cursor:not-allowed;opacity:.4}#changeProgress{min-width:3.4rem;text-align:center;font-size:.72rem;font-variant-numeric:tabular-nums}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:1200px){.change-filter-row{align-items:flex-start;flex-direction:column}.change-navigation{align-self:stretch;justify-content:space-between}}