:root{--bg-primary:#fff;--bg-secondary:#f4f6f9;--bg-tertiary:#1f2937;--text-primary:#1f2937;--text-secondary:#fff;--text-muted:#9ca3af;--accent-blue:#3b81f6;--accent-blue-hover:#0056b3;--accent-blue-light:#b4d7fe;--border-color:#d2dbc8;--border-hover:#4a5d5e;--highlight-add:#bbf7d0;--highlight-remove:#fca5a5;--highlight-add-border:#86efac;--highlight-remove-border:#f87171;--shadow:#4a5d5e1a;--shadow-lg:#4a5d5e26}[data-theme=dark]{--bg-primary:#0f172a;--bg-secondary:#1e293b;--bg-tertiary:#334155;--text-primary:#f1f5f9;--text-secondary:#cbd5e1;--text-muted:#94a3b8;--accent-blue:#60a5fa;--accent-blue-hover:#3b82f6;--accent-blue-light:#1e293b;--border-color:#475569;--border-hover:#64748b;--highlight-add:#064e3b;--highlight-remove:#7f1d1d;--highlight-add-border:#065f46;--highlight-remove-border:#991b1b;--shadow:#0000004d;--shadow-lg:#0006}*{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fff;background-color:var(--bg-primary);color:#1f2937;color:var(--text-primary);margin:0}code{font-family:Poppins,sans-serif}.textarea-container{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;box-shadow:0 2px 8px var(--shadow);display:flex;flex-direction:column;overflow:hidden;position:relative;transition:all .2s ease;width:100%}.error-toast{animation:slideInError .4s cubic-bezier(.23,1,.32,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#ef4444,#dc2626);border:1px solid #ffffff1a;border-radius:12px;box-shadow:0 8px 25px #dc262666;color:#fff;font-size:.85rem;font-weight:500;gap:8px;line-height:1.4;max-width:280px;padding:14px 16px;position:absolute;right:12px;top:12px;z-index:1000}.error-content,.error-toast{align-items:flex-start;display:flex}.error-content{flex:1 1;gap:10px}.error-icon{flex-shrink:0;font-size:16px;line-height:1;margin-top:1px}.error-text{flex:1 1;line-height:1.4}.error-close-btn{background:none;border:none;border-radius:4px;color:#fffc;cursor:pointer;flex-shrink:0;font-size:18px;line-height:1;margin-top:-2px;padding:2px 4px;transition:all .2s ease}.error-close-btn:hover{background:#ffffff26;color:#fff;transform:scale(1.1)}@keyframes slideInError{0%{opacity:0;transform:translateX(100%) scale(.8)}60%{opacity:1;transform:translateX(-5%) scale(1.02)}to{opacity:1;transform:translateX(0) scale(1)}}.textarea-header{align-items:center;background:var(--bg-tertiary);border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;padding:12px 16px}.textarea-title{color:#fff;font-size:1rem;font-weight:600;margin:0;text-align:left}.textarea-action-btn{align-items:center;background-color:var(--bg-tertiary);border:1px solid #fff;border-radius:4px;color:#fff;cursor:pointer;display:flex;font-size:.85rem;justify-content:center;padding:.5rem 1rem;transition:all .2s ease}.textarea-action-btn:hover{background-color:#fff;color:var(--bg-tertiary)}.upload-icon{margin-right:.5rem}.textarea-content{display:flex;height:245px;position:relative}.textarea-container:focus-within{border-color:var(--accent-blue);box-shadow:0 1px 12px var(--shadow-lg)}.line-numbers{background:var(--bg-tertiary);border:none;border-radius:0;bottom:0;color:var(--text-secondary);left:0;overflow:hidden;padding:12px 3px;pointer-events:none;position:absolute;text-align:center;top:0;width:30px}.line-numbers,.textarea{font-family:Poppins,sans-serif;font-size:.9rem;line-height:1.6;resize:none}.textarea{background:#0000;border:none;color:var(--text-primary);flex:1 1;margin-left:30px;overflow:auto;padding:12px 15px;white-space:pre}.textarea:focus{outline:none}.unified-comparison{font-family:Poppins,sans-serif;margin:2rem auto;max-width:1920px;padding:0 20px}.comparison-header{margin-bottom:1.5rem;text-align:center}.comparison-title{color:var(--text-primary);font-size:1.75rem;font-weight:600;margin-bottom:1rem}.comparison-stats-row{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:1rem;position:relative}.comparison-mode-toggle{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:12px;display:flex;left:0;padding:4px;position:absolute;width:-webkit-fit-content;width:fit-content}.mode-toggle-track{background:linear-gradient(135deg,var(--accent-blue),var(--accent-blue-hover));border-radius:8px;box-shadow:0 2px 8px #3b82f64d;height:calc(100% - 8px);left:4px;position:absolute;top:4px;z-index:1}.mode-button,.mode-toggle-track{transition:all .3s cubic-bezier(.4,0,.2,1)}.mode-button{background:#0000;border:none;border-radius:8px;color:var(--text-secondary);cursor:pointer;font-family:Poppins,sans-serif;font-size:.9rem;font-weight:500;min-width:100px;padding:.75rem 1.5rem;position:relative;text-align:center;white-space:nowrap;z-index:2}.mode-button:hover:not(.active){color:#6b7280}.mode-button.active{color:#fff}.comparison-mode-toggle[data-active=chars] .mode-toggle-track{transform:translateX(0);width:100px}.comparison-mode-toggle[data-active=words] .mode-toggle-track{transform:translateX(100px);width:100px}.comparison-mode-toggle[data-active=lines] .mode-toggle-track{transform:translateX(200px);width:100px}.comparison-stats{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:1rem}.stat{border:1px solid;border-radius:1rem;font-size:.85rem;font-weight:500;padding:.25rem .75rem}.stat-added{background:var(--highlight-add);border-color:var(--highlight-add-border);color:#16a34a}.stat-deleted{background:var(--highlight-remove);border-color:var(--highlight-remove-border);color:#dc2626}[data-theme=dark] .stat-deleted{color:#f87171}.stat-modified{background:#fef3c7;border-color:#f59e0b;color:#92400e}.stat-match{background:var(--bg-tertiary);border-color:var(--border-color);color:var(--text-secondary)}[data-theme=dark] .stat-modified{background:#451a03;border-color:#d97706;color:#fbbf24}.comparison-table{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;box-shadow:0 4px 6px var(--shadow);overflow:hidden}.table-header{background:var(--bg-tertiary);border-bottom:2px solid var(--border-color);display:flex;font-size:.9rem;font-weight:600}.header-section{align-items:center;color:var(--text-secondary);display:flex;flex:1 1;padding:1rem 0}.left-header{border-right:1px solid var(--border-color)}.header-divider{background:var(--border-color);flex-shrink:0;width:2px}.line-num-header{flex-shrink:0;font-size:.8rem;opacity:.8;text-align:center;width:50px}.content-header{flex:1 1;padding-left:1rem}.comparison-row{border-bottom:1px solid var(--border-color);display:flex;min-height:2.5rem}.comparison-row:last-child{border-bottom:none}.row-section{align-items:stretch;display:flex;flex:1 1}.left-section{border-right:1px solid var(--border-color)}.row-divider{background:var(--bg-secondary);flex-shrink:0;width:2px}.line-number{background:var(--bg-tertiary);border-right:1px solid var(--border-color);color:var(--text-secondary);flex-shrink:0;font-size:.8rem;font-weight:500;justify-content:center;width:50px}.line-content,.line-number{align-items:center;display:flex}.line-content{flex:1 1;padding:.75rem 1rem;position:relative}.line-text{color:var(--text-primary);flex:1 1;font-family:Poppins,sans-serif;font-size:.9rem;line-height:1.4;white-space:pre-wrap;word-break:break-word}.change-indicator{font-size:.75rem;font-weight:600;opacity:.8;position:absolute;right:12px;top:50%;transform:translateY(-50%)}.modify-arrow{color:#3b82f6}.add-arrow{color:#22c55e}.delete-arrow{color:#ef4444}.char-added,.line-added,.word-added{background-color:var(--highlight-add);color:var(--text-primary);font-weight:500;padding:0}.char-deleted,.line-deleted,.word-deleted{background-color:var(--highlight-remove);color:var(--text-primary);font-weight:500;padding:0}.char-added,.char-deleted{padding:0}.line-added,.line-deleted{display:inline-block;padding:0}.row-added,.row-deleted,.row-match,.row-modified{background:#0000}.add-arrow,.delete-arrow,.modify-arrow{color:var(--text-secondary);font-size:.8rem;font-weight:700}.modify-arrow{color:#d97706}.add-arrow{color:#059669}.delete-arrow{color:#dc2626}.empty-comparison{color:var(--text-secondary);padding:4rem 2rem;text-align:center}.empty-icon{font-size:3rem;margin-bottom:1rem}.empty-message{color:var(--text-primary);font-size:1.25rem;font-weight:600;margin-bottom:.5rem}.empty-subtitle{font-size:.95rem;opacity:.8}@media (max-width:768px){.unified-comparison{margin:1rem auto;padding:0 10px}.comparison-title{font-size:1.5rem}.comparison-stats-row{align-items:stretch;flex-direction:column;gap:.75rem}.comparison-mode-toggle{align-self:center;left:auto;padding:3px;position:relative}.mode-button{font-size:.8rem;min-width:85px;padding:.6rem 1rem}.comparison-mode-toggle[data-active=chars] .mode-toggle-track{transform:translateX(0);width:85px}.comparison-mode-toggle[data-active=words] .mode-toggle-track{transform:translateX(85px);width:85px}.comparison-mode-toggle[data-active=lines] .mode-toggle-track{transform:translateX(170px);width:85px}.comparison-stats{gap:.5rem}.stat{font-size:.75rem;padding:.2rem .6rem}.comparison-table{border-radius:6px}.table-header{font-size:.8rem;padding:.75rem 0}.line-num-header{font-size:.7rem;width:40px}.content-header{font-size:.8rem;padding-left:.75rem}.line-number{font-size:.7rem;width:40px}.line-content{padding:.6rem .75rem}.line-text{font-size:.85rem;line-height:1.3}.change-indicator{font-size:.65rem;padding:.15rem .4rem;right:.4rem}.comparison-row{min-height:2.25rem}}@media (max-width:480px){.comparison-stats{align-items:center;flex-direction:column;gap:.4rem}.line-text{font-size:.8rem}}.tip-notification{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:var(--bg-primary);border:1px solid var(--border-color);border-radius:12px;box-shadow:0 12px 40px #00000040;max-width:calc(100vw - 40px);opacity:0;overflow:hidden;pointer-events:none;position:fixed;right:20px;top:80px;transform:translateX(100%) scale(.95);transition:all .4s cubic-bezier(.34,1.56,.64,1);width:350px;z-index:999}.tip-notification.visible{opacity:1;pointer-events:all;transform:translateX(0) scale(1)}.tip-notification.hidden{opacity:0;pointer-events:none;transform:translateX(100%) scale(.95)}.tip-notification-header{align-items:center;background:var(--bg-tertiary);display:flex;justify-content:space-between;padding:16px 20px 12px;position:relative}.tip-notification-logo{align-items:center;display:flex;gap:8px}.tip-logo-icon{animation:sparkle 2s ease-in-out infinite;color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}.tip-notification-title{color:#fff;font-size:.9rem;font-weight:600;margin:0}.tip-notification-content{padding:16px 20px}.tip-notification-message{color:var(--text-primary);font-size:.8rem;line-height:1.4;opacity:.9}[data-theme=dark] .tip-notification-message{color:var(--text-secondary);opacity:.95}.tip-notification-message strong{color:var(--accent-blue);font-weight:600}.tip-notification-close{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:8px;color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;transition:all .2s ease;width:32px}.tip-notification-close:hover{background:#fff3;transform:scale(1.05)}.tip-notification-close .close-icon{font-size:20px;font-weight:300;line-height:1}@keyframes sparkle{0%,to{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2)) brightness(1);transform:scale(1) rotate(0deg)}50%{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2)) brightness(1.2);transform:scale(1.1) rotate(5deg)}}@media (max-width:768px){.tip-notification{left:15px;max-width:none;right:15px;top:70px;width:auto}.tip-notification-header{padding:14px 16px 10px}.tip-notification-content{padding:14px 16px}.tip-notification-title{font-size:.85rem}.tip-notification-message{font-size:.75rem}.tip-logo-icon{height:18px;width:18px}.tip-notification-close{height:28px;width:28px}.tip-notification-close .close-icon{font-size:18px}}@font-face{font-display:swap;font-family:Poppins;font-style:normal;font-weight:300;src:url(/static/media/poppins-300.39576fe9df8a22cc1bcc.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:Poppins;font-style:normal;font-weight:400;src:url(/static/media/poppins-400.405055dd680fa1dcdfa2.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:Poppins;font-style:normal;font-weight:500;src:url(/static/media/poppins-500.08491d3f7fe7ae88ef44.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:Poppins;font-style:normal;font-weight:600;src:url(/static/media/poppins-600.91145014c0350c248ed2.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}.container{background:var(--bg-primary);max-width:100%;min-height:calc(100vh - 64px);padding-top:10px}.title{color:var(--text-primary);font-size:2rem;font-weight:600;margin-bottom:2rem;text-align:center}.main-heading{height:1px;left:-9999px;overflow:hidden;position:absolute;width:1px}.text-box-container{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr;margin:0 auto;max-width:1920px;padding:0 20px}.text-box-wrapper{width:100%}.comparison-result-container{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr;margin:20px auto;max-width:1920px;padding:0 20px}.comparison-column{background:#f8f9fa;border:1px solid var(--border-color);border-radius:8px;box-shadow:0 2px 8px var(--shadow);padding:10px 20px}.subtitle{color:var(--text-primary);font-size:1.5rem;font-weight:500;margin-bottom:15px;text-align:center}.comparison-result{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);font-family:Poppins,sans-serif;line-height:1.6;min-height:120px;overflow-wrap:break-word;padding:15px;white-space:pre-wrap}.button-container{display:flex;gap:15px;justify-content:center;margin-top:20px;padding:0 20px}.button{border:1px solid #0000;border-radius:6px;cursor:pointer;font-family:Poppins,sans-serif;font-size:1rem;font-weight:500;padding:12px 24px;transition:all .2s ease}.button-primary{background:linear-gradient(135deg,var(--accent-blue),var(--accent-blue-hover));border-color:var(--accent-blue);box-shadow:0 2px 8px #3b82f64d;color:#fff}.button-primary:hover{background:linear-gradient(135deg,var(--accent-blue-hover),var(--accent-blue));box-shadow:0 4px 12px #3b82f666;transform:translateY(-1px)}.button-secondary{background:linear-gradient(135deg,#10b981,#059669);border-color:#10b981;box-shadow:0 2px 8px #10b9814d;color:#fff}.button-secondary:hover{background:linear-gradient(135deg,#059669,#10b981);box-shadow:0 4px 12px #10b98166;transform:translateY(-1px)}.keyboard-shortcut{font-size:.8rem;font-weight:400;margin-left:8px;opacity:.8}.diff-highlight{background-color:var(--accent-blue-light);border:1px solid var(--accent-blue);border-radius:3px;color:var(--text-primary);font-weight:500;padding:2px 4px}@media (max-width:768px){.comparison-result-container,.text-box-container{grid-template-columns:1fr}.container{padding:70px 10px 10px}}.about-modal-overlay{align-items:flex-start;animation:fadeIn .3s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#0009;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:2rem;position:fixed;right:0;top:0;z-index:2000}.about-modal{animation:slideIn .3s ease-out;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:16px;box-shadow:0 25px 50px var(--shadow-lg);max-height:90vh;max-width:900px;overflow:hidden;position:relative;width:100%}.about-modal-header{background:var(--bg-tertiary);color:#fff;padding:2rem 2.5rem 1.5rem;position:relative}.about-header-content{max-width:calc(100% - 60px)}.about-logo{align-items:center;display:flex;gap:.75rem;margin-bottom:.5rem}.about-logo-icon{color:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));height:32px;width:32px}.about-logo h1{color:#fff;font-size:2rem;font-weight:700;letter-spacing:-.025em;margin:0}.about-tagline{color:#ffffffe6;font-size:1.1rem;font-weight:400;margin:0;opacity:.9}.about-close-btn{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:8px;color:#fff;cursor:pointer;display:flex;height:40px;justify-content:center;position:absolute;right:1.5rem;top:1.5rem;transition:all .2s ease;width:40px}.about-close-btn:hover{background:#fff3;transform:scale(1.05)}.about-modal-content{max-height:calc(90vh - 180px);overflow-y:auto;padding:0;scrollbar-color:var(--accent-blue) var(--bg-secondary);scrollbar-width:thin}.about-modal-content::-webkit-scrollbar{width:8px}.about-modal-content::-webkit-scrollbar-track{background:var(--bg-secondary)}.about-modal-content::-webkit-scrollbar-thumb{background:var(--accent-blue);border-radius:4px}.about-modal-content::-webkit-scrollbar-thumb:hover{background:var(--accent-blue-hover)}.about-section{border-bottom:1px solid var(--border-color);padding:2rem 2.5rem}.about-section:last-child{border-bottom:none}.about-section-title{align-items:center;color:var(--text-primary);display:flex;font-size:1.5rem;font-weight:600;gap:.75rem;margin-bottom:1.5rem}.section-icon{color:var(--accent-blue);height:24px;width:24px}.faq-icon{font-size:24px}.about-features-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:1rem}.about-feature{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;overflow:hidden;padding:1.5rem;position:relative;transition:all .3s ease}.about-feature:hover{border-color:var(--accent-blue);box-shadow:0 8px 25px var(--shadow);transform:translateY(-2px)}.feature-icon-wrapper{align-items:center;border-radius:12px;display:flex;height:48px;justify-content:center;margin-bottom:1rem;position:relative;width:48px}.feature-icon-wrapper.instant{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.feature-icon-wrapper.smart{background:linear-gradient(135deg,#10b981,#059669)}.feature-icon-wrapper.visual{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.feature-icon-wrapper.theme{background:linear-gradient(135deg,#6366f1,#4338ca)}.feature-icon-wrapper.mobile{background:linear-gradient(135deg,#06b6d4,#0891b2)}.feature-icon-wrapper.realtime{background:linear-gradient(135deg,#ef4444,#dc2626)}.feature-icon{color:#fff;height:24px;width:24px}.theme-toggle-mini{height:24px;overflow:hidden;position:relative;width:24px}.mini-moon,.mini-sun{border-radius:50%;height:12px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all 1s ease;width:12px}.mini-sun{animation:rotateSun 3s linear infinite;background:#fbbf24}.mini-moon{animation:rotateMoon 3s linear infinite reverse;background:#64748b}@keyframes rotateSun{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}@keyframes rotateMoon{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(-1turn)}}.about-feature h3{color:var(--text-primary);font-size:1.1rem;font-weight:600;margin-bottom:.5rem}.about-feature p{color:var(--text-muted);line-height:1.5;margin:0}.about-benefits{display:flex;flex-direction:column;gap:1rem}.benefit-item{align-items:flex-start;background:var(--bg-secondary);border-left:4px solid var(--accent-blue);border-radius:8px;display:flex;gap:1rem;padding:1rem;transition:all .2s ease}.benefit-item:hover{background:var(--accent-blue-light);transform:translateX(4px)}.benefit-icon{color:var(--accent-blue);flex-shrink:0;height:20px;margin-top:2px;width:20px}.benefit-item div{color:var(--text-primary);line-height:1.5}.benefit-item strong{color:var(--accent-blue)}.about-use-cases{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.use-case{align-items:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:10px;display:flex;gap:1rem;padding:1.25rem;transition:all .3s ease}.use-case:hover{border-color:var(--accent-blue);box-shadow:0 4px 15px var(--shadow);transform:translateY(-2px)}.use-case-icon{color:var(--accent-blue);flex-shrink:0;height:24px;width:24px}.use-case div{display:flex;flex-direction:column;gap:.25rem}.use-case strong{color:var(--text-primary);font-weight:600}.use-case span{color:var(--text-muted);font-size:.9rem}.about-steps{flex-wrap:wrap;gap:1.5rem;justify-content:center}.about-steps,.step{align-items:center;display:flex}.step{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:12px;flex-direction:column;min-width:160px;padding:1.5rem;text-align:center;transition:all .3s ease}.step:hover{border-color:var(--accent-blue);box-shadow:0 8px 20px var(--shadow);transform:scale(1.05)}.step-number{align-items:center;background:linear-gradient(135deg,var(--accent-blue),var(--accent-blue-hover));border-radius:50%;color:#fff;display:flex;font-size:1.2rem;font-weight:700;height:40px;justify-content:center;margin-bottom:1rem;width:40px}.step-content h3{color:var(--text-primary);font-size:1.1rem;font-weight:600;margin-bottom:.5rem}.step-content p{color:var(--text-muted);line-height:1.4;margin:0}.step-arrow{color:var(--accent-blue);font-size:1.5rem;font-weight:700}.faq-section{background:var(--bg-secondary)}.faq-items{display:flex;flex-direction:column;gap:.75rem}.faq-item{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;overflow:hidden;transition:all .2s ease}.faq-item:hover{border-color:var(--accent-blue)}.faq-item summary{background:var(--bg-primary);border:none;color:var(--text-primary);cursor:pointer;font-weight:600;list-style:none;padding:1.25rem;position:relative;transition:all .2s ease}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{color:var(--accent-blue);content:"+";font-size:1.5rem;position:absolute;right:1.25rem;top:50%;transform:translateY(-50%);transition:transform .3s ease}.faq-item[open] summary:after{transform:translateY(-50%) rotate(45deg)}.faq-item p,.faq-item summary:hover{background:var(--bg-secondary)}.faq-item p{border-top:1px solid var(--border-color);color:var(--text-muted);line-height:1.6;margin:0;padding:0 1.25rem 1.25rem}.footer-section{background:var(--bg-secondary);text-align:center}.footer-content-inline{align-items:center;display:flex;flex-direction:column;gap:1rem}.footer-content-inline p{align-items:center;color:var(--text-muted);display:flex;font-size:.9rem;gap:.5rem;margin:0}.footer-heart{animation:heartbeat 2s ease-in-out infinite;color:#ef4444}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.pro-tip{background:#3b82f614;border:1px solid #3b82f626;border-radius:8px;font-size:.85rem;line-height:1.5;padding:.5rem 1rem}.pro-tip,.pro-tip kbd{color:var(--text-primary)}.pro-tip kbd{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:4px;box-shadow:0 1px 2px #0000001a;font-family:Poppins,monospace;font-size:.8rem;margin:0 .1rem;padding:.2rem .4rem}.comparison-modes{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:1.5rem}.mode-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;transition:all .3s ease}.mode-card:hover{box-shadow:0 8px 25px var(--shadow);transform:translateY(-2px)}.mode-header{align-items:center;display:flex;gap:.75rem;margin-bottom:1rem}.mode-icon{background:var(--accent-blue);border-radius:8px;color:#fff;height:24px;padding:8px;width:24px}.mode-icon.chars{background:linear-gradient(135deg,#8b5cf6,#a78bfa)}.mode-icon.words{background:linear-gradient(135deg,#10b981,#34d399)}.mode-icon.lines{background:linear-gradient(135deg,#f59e0b,#fbbf24)}.mode-card h3{color:var(--text-primary);font-size:1.1rem;font-weight:600;margin:0}.mode-card p{color:var(--text-muted);line-height:1.5;margin-bottom:1rem}.mode-example{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;font-family:Poppins,monospace;font-size:.85rem;padding:.75rem}.example-text{color:var(--text-primary)}.char-highlight{background:#ddd6fe;border-radius:2px;color:#6b21a8;padding:0 2px}[data-theme=light] .char-highlight{background:#f3e8ff;color:#6b21a8}.word-highlight{background:#d1fae5;border-radius:4px;color:#047857;padding:2px 4px}[data-theme=light] .word-highlight{background:#ecfdf5;color:#047857}.line-highlight{background:#fef3c7;border-radius:4px;color:#b45309;display:inline-block;padding:4px 6px}[data-theme=light] .line-highlight{background:#fffbeb;color:#b45309}[data-theme=dark] .char-highlight{background:#8b5cf633;color:#c4b5fd}[data-theme=dark] .word-highlight{background:#10b98133;color:#6ee7b7}[data-theme=dark] .line-highlight{background:#f59e0b33;color:#fcd34d}.settings-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));margin-top:1.5rem}.setting-card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;display:flex;gap:1rem;padding:1.5rem;transition:all .3s ease}.setting-card:hover{box-shadow:0 8px 25px var(--shadow);transform:translateY(-2px)}.setting-icon-wrapper{align-items:center;border-radius:10px;display:flex;flex-shrink:0;height:48px;justify-content:center;width:48px}.setting-icon-wrapper.case-sensitive{background:linear-gradient(135deg,#3b82f6,#60a5fa)}.setting-icon-wrapper.empty-lines{background:linear-gradient(135deg,#ef4444,#f87171)}.setting-icon{color:#fff;height:24px;width:24px}.setting-content h3{color:var(--text-primary);font-size:1.1rem;font-weight:600;margin:0 0 .5rem}.setting-content p{color:var(--text-muted);line-height:1.5;margin:0 0 .75rem}.setting-example{display:flex;flex-direction:column;gap:.25rem}.setting-example span{color:var(--text-primary);font-family:Poppins,monospace;font-size:.8rem}.setting-example code{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:3px;padding:.15rem .3rem}.shortcuts-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:1.5rem}.shortcut-item{align-items:center;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:10px;display:flex;gap:1rem;padding:1rem 1.25rem;transition:all .3s ease}.shortcut-item:hover{box-shadow:0 4px 15px var(--shadow);transform:translateY(-1px)}.shortcut-keys{display:flex;flex-shrink:0;gap:.25rem}.shortcut-keys kbd{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;box-shadow:0 2px 4px #0000001a;color:var(--text-primary);font-family:Poppins,monospace;font-size:.75rem;min-width:28px;padding:.3rem .5rem;text-align:center}.shortcut-description{display:flex;flex-direction:column;gap:.25rem}.shortcut-description strong{color:var(--text-primary);font-size:.9rem;font-weight:600}.shortcut-description span{color:var(--text-muted);font-size:.8rem}.shortcut-note{background:#3b82f614;border:1px solid #3b82f626;border-radius:8px;margin-top:1rem;padding:.75rem 1rem;text-align:center}.shortcut-note span{color:var(--text-primary);font-size:.85rem}.shortcut-note kbd{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:3px;color:var(--text-primary);font-size:.75rem;margin:0 .15rem;padding:.15rem .3rem}@media (max-width:768px){.about-modal-overlay{align-items:center;padding:1rem}.about-modal{border-radius:12px;max-height:95vh}.about-modal-header{padding:1.5rem 1.5rem 1rem}.about-logo h1{font-size:1.5rem}.about-tagline{font-size:1rem}.about-close-btn{right:1rem;top:1rem}.about-section{padding:1.5rem}.about-section-title{font-size:1.3rem}.about-features-grid{gap:1rem}.about-features-grid,.about-use-cases{grid-template-columns:1fr}.about-steps{flex-direction:column;gap:1rem}.step-arrow{transform:rotate(90deg)}.footer-content-inline{gap:.75rem}.comparison-modes,.settings-grid{gap:1rem;grid-template-columns:1fr}.setting-card{flex-direction:column;gap:1rem;padding:1.25rem;text-align:center}.shortcuts-grid{gap:.75rem;grid-template-columns:1fr}.shortcut-item{gap:.75rem;padding:.75rem 1rem}.shortcut-keys{gap:.2rem}.shortcut-keys kbd{font-size:.7rem;min-width:24px;padding:.25rem .4rem}}@media (max-width:480px){.about-modal-overlay{padding:.5rem}.about-modal-header{padding:1.25rem 1.25rem .75rem}.about-section{padding:1.25rem}.about-close-btn{padding:.4rem}.about-logo{gap:.5rem}.about-logo h1{font-size:1.3rem}.feature-icon-wrapper{height:40px;width:40px}.feature-icon{height:20px;width:20px}}[data-theme=dark] .about-modal-overlay{background-color:#000c}[data-theme=dark] .about-feature:hover{box-shadow:0 8px 25px #0006}[data-theme=dark] .step:hover{box-shadow:0 8px 20px #0006}[data-theme=dark] .use-case:hover{box-shadow:0 4px 15px #0006}.contact-modal-overlay{align-items:center;animation:fadeIn .2s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.contact-modal{animation:slideIn .3s ease-out;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:16px;box-shadow:0 20px 60px #0000004d;max-height:90vh;max-width:500px;overflow-y:auto;position:relative;width:90%}.contact-modal-header{align-items:center;background:var(--bg-tertiary);border-bottom:1px solid var(--border-color);border-radius:16px 16px 0 0;display:flex;justify-content:space-between;padding:24px 32px}.contact-modal-header h2{color:#fff;font-size:1.5rem;font-weight:600;margin:0}.contact-close-button{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:8px;color:#fff;cursor:pointer;display:flex;height:40px;justify-content:center;transition:all .2s ease;width:40px}.contact-close-button:hover:not(:disabled){background:#fff3;transform:scale(1.05)}.contact-close-button:disabled{cursor:not-allowed;opacity:.5}.contact-modal-content{padding:32px}.contact-form{gap:20px}.contact-form,.form-group{display:flex;flex-direction:column}.form-group{gap:8px}.form-group label{color:var(--text-primary);font-size:.9rem;font-weight:500}.form-group input,.form-group select,.form-group textarea{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-family:Poppins,sans-serif;font-size:.9rem;padding:12px 16px;transition:all .2s ease}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent-blue);box-shadow:0 0 0 3px var(--accent-blue-light);outline:none}.form-group input.error,.form-group textarea.error{border-color:#ef4444;box-shadow:0 0 0 3px #ef44441a}.form-group input:disabled,.form-group select:disabled,.form-group textarea:disabled{cursor:not-allowed;opacity:.6}.form-group textarea{line-height:1.5;min-height:100px;resize:vertical}.error-message{color:#ef4444;font-size:.8rem;font-weight:500}.submit-error{margin-top:8px;text-align:center}.submit-button{background:#64748b;border:none;border-radius:8px;color:#fff;cursor:pointer;font-family:Poppins,sans-serif;font-size:1rem;font-weight:500;margin-top:8px;padding:14px 24px;transition:all .2s ease}.submit-button:hover:not(:disabled){background:#475569;transform:translateY(-1px)}.submit-button:disabled{cursor:not-allowed;opacity:.6;transform:none}.success-message{color:var(--text-primary);padding:40px 20px;text-align:center}.success-icon{align-items:center;animation:successPulse .6s ease-out;background:#10b981;border-radius:50%;color:#fff;display:flex;font-size:32px;font-weight:700;height:60px;justify-content:center;margin:0 auto 20px;width:60px}.success-message h3{color:#10b981;font-size:1.3rem;margin:0 0 12px}.success-message p{line-height:1.5;margin:0;opacity:.8}@keyframes successPulse{0%{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@media (max-width:600px){.contact-modal{margin:20px;width:95%}.contact-modal-header{padding:20px 24px}.contact-modal-content{padding:24px}.contact-modal-header h2{font-size:1.3rem}}.settings-modal-overlay{align-items:center;animation:fadeIn .2s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.settings-modal{animation:slideIn .3s ease-out;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:16px;box-shadow:0 20px 60px #0000004d;max-height:90vh;max-width:500px;overflow-y:auto;position:relative;width:90%}.settings-modal-header{align-items:center;background:var(--bg-tertiary);border-bottom:1px solid var(--border-color);border-radius:16px 16px 0 0;display:flex;justify-content:space-between;padding:24px 32px}.settings-modal-header h2{color:#fff;font-size:1.5rem;font-weight:600;margin:0}.settings-close-button{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:8px;color:#fff;cursor:pointer;display:flex;height:40px;justify-content:center;transition:all .2s ease;width:40px}.settings-close-button:hover:not(:disabled){background:#fff3;transform:scale(1.05)}.close-icon{font-size:24px;font-weight:300;line-height:1}.settings-modal-content{display:flex;flex-direction:column;gap:32px;padding:32px}.settings-group{display:flex;flex-direction:column;gap:12px}.settings-row{align-items:center;display:flex;justify-content:space-between}.settings-label{color:var(--text-primary);font-size:1rem;font-weight:600;margin:0}.settings-description{color:var(--text-primary);font-size:.875rem;line-height:1.4;margin:0;opacity:.7}[data-theme=dark] .settings-description{color:var(--text-secondary);opacity:.8}.comparison-mode-toggle-settings{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:12px;display:flex;padding:4px;position:relative;width:-webkit-fit-content;width:fit-content}.mode-toggle-track-settings{background:linear-gradient(135deg,var(--accent-blue),var(--accent-blue-hover));border-radius:8px;box-shadow:0 2px 8px #3b82f64d;height:calc(100% - 8px);left:4px;position:absolute;top:4px;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:1}.mode-button-settings{background:#0000;border:none;border-radius:8px;color:var(--text-secondary);cursor:pointer;font-family:Poppins,sans-serif;font-size:.9rem;font-weight:500;min-width:100px;padding:.75rem 1.5rem;position:relative;text-align:center;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:nowrap;z-index:2}.mode-button-settings:hover:not(.active){color:#6b7280}.mode-button-settings.active{color:#fff}.comparison-mode-toggle-settings[data-active=chars] .mode-toggle-track-settings{transform:translateX(0);width:100px}.comparison-mode-toggle-settings[data-active=words] .mode-toggle-track-settings{transform:translateX(100px);width:100px}.comparison-mode-toggle-settings[data-active=lines] .mode-toggle-track-settings{transform:translateX(200px);width:100px}.settings-toggle{background:none;border:none;cursor:pointer;padding:0}.settings-toggle-track{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;height:24px;position:relative;transition:all .3s ease;width:48px}.settings-toggle.active .settings-toggle-track{background-color:var(--accent-blue);border-color:var(--accent-blue)}.settings-toggle-slider{background:#fff;border-radius:50%;box-shadow:0 2px 4px #0003;height:18px;left:2px;position:absolute;top:2px;transition:all .3s ease;width:18px}.settings-toggle-slider.active{transform:translateX(24px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width:600px){.settings-modal{margin:20px;width:95%}.settings-modal-header{padding:20px 24px}.settings-modal-content{gap:24px;padding:24px}.settings-modal-header h2{font-size:1.3rem}.mode-button-settings{font-size:.8rem;min-width:85px;padding:.6rem 1rem}.comparison-mode-toggle-settings[data-active=chars] .mode-toggle-track-settings{transform:translateX(0);width:85px}.comparison-mode-toggle-settings[data-active=words] .mode-toggle-track-settings{transform:translateX(85px);width:85px}.comparison-mode-toggle-settings[data-active=lines] .mode-toggle-track-settings{transform:translateX(170px);width:85px}}body{background-color:var(--bg-secondary);font-family:Poppins,sans-serif}.navbar{background-color:var(--bg-tertiary);box-shadow:0 2px 4px var(--shadow);left:0;position:fixed;top:0;width:100%;z-index:1000}.navbar-container{margin:0 auto;max-width:1536px;padding:0 1.5rem}.navbar-content{height:4.8rem;justify-content:space-between}.logo,.logo-content,.navbar-content{align-items:center;display:flex}.logo-content{background:none;border:none;cursor:pointer;gap:.5rem;padding:0}.logo-content span{color:#fff;font-size:1.8rem;font-weight:700;letter-spacing:.5px}.nav-links{align-items:center;display:flex;gap:1.2rem}.nav-button{background-color:var(--bg-tertiary);border:1px solid #fff;border-radius:5px;color:#fff;cursor:pointer;font-size:1.026rem;padding:.54rem 1.08rem;transition:all .2s ease}.nav-button:hover{background-color:#fff;color:var(--bg-tertiary)}.nav-icon-button{align-items:center;background-color:var(--bg-tertiary);border:1px solid #fff;border-radius:5px;color:#fff;cursor:pointer;display:flex;justify-content:center;padding:.54rem;transition:all .2s ease}.nav-icon-button:hover{background-color:#fff;color:var(--bg-tertiary)}.theme-toggle{background:none;border:none;cursor:pointer;margin-left:.5rem;padding:.25rem}.theme-toggle-track{background-color:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:15px;height:29px;position:relative;transition:all .3s ease;width:60px}[data-theme=dark] .theme-toggle-track{border:1px solid #fff}.theme-toggle-slider{align-items:center;background:linear-gradient(135deg,var(--accent-blue),var(--accent-blue-hover));border-radius:50%;box-shadow:0 2px 4px var(--shadow);color:#fff;display:flex;height:22px;justify-content:center;position:absolute;top:2.5px;transition:all .3s ease;width:22px}.theme-toggle-slider.light{background:linear-gradient(135deg,#fbbf24,#f59e0b);left:2.5px;transform:rotate(0deg)}.theme-toggle-slider.dark{background:linear-gradient(135deg,#6366f1,#4338ca);left:33.5px;transform:rotate(180deg)}.theme-toggle:hover .theme-toggle-track{border-color:var(--accent-blue);box-shadow:0 0 0 2px var(--accent-blue-light)}.mobile-menu-button{background:none;border:none;cursor:pointer;display:none;padding:.5rem}.menu-icon{background-color:#fff;height:2px;position:relative;transition:background-color .2s ease;width:24px}.menu-icon:after,.menu-icon:before{background-color:#fff;content:"";height:2px;position:absolute;transition:transform .2s ease;width:24px}.menu-icon:before{top:-6px}.menu-icon:after{bottom:-6px}@media (max-width:768px){.mobile-menu-button{display:block}.nav-links{align-items:center;background-color:var(--bg-tertiary);display:none;flex-direction:column;gap:.6rem;left:0;padding:1.2rem;position:absolute;right:0;top:4.8rem}.nav-links.active{display:flex}.nav-button{font-size:1.14rem;padding:.9rem;text-align:center;width:100%}}.App{background-color:var(--bg-primary);color:var(--text-primary);display:flex;flex-direction:column;min-height:100vh;transition:all .3s ease}.main-content{flex:1 1;margin:0 auto;padding-top:4.8rem;width:100%}.app-footer{background:var(--bg-secondary);border-top:1px solid var(--border-color);margin-top:auto}.copyright{color:var(--text-muted);font-size:.875rem;padding:20px;text-align:center}
/*# sourceMappingURL=main.9f0112fe.css.map*/