@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Inter:wght@400;500;600;700&display=swap";:root{--bg-app:#080c14;--bg-panel:#0d121f;--bg-editor:#060910;--bg-hover:#ffffff0d;--border-subtle:#1e2638;--border-bright:#323d54;--color-cyan:#00f0ff;--color-green:#3fb950;--color-green-bg:#2ea04326;--color-green-char:#2ea04373;--color-red:#f85149;--color-red-bg:#f8514926;--color-red-char:#f8514973;--color-yellow:#e3b341;--text-primary:#e6edf3;--text-muted:#8b949e;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:"JetBrains Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-app);color:var(--text-primary);font-family:var(--font-sans);min-height:100vh;overflow-x:hidden}.difflens-app{flex-direction:column;height:100vh;display:flex;overflow:hidden}.app-header{background:var(--bg-panel);border-bottom:1px solid var(--border-subtle);flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:16px;padding:10px 20px;display:flex}.header-left{flex-wrap:wrap;align-items:center;gap:20px;display:flex}.logo-group{align-items:center;gap:10px;display:flex}.logo-icon-box{color:var(--color-cyan);background:#00f0ff1a;border:1px solid #00f0ff40;border-radius:6px;justify-content:center;align-items:center;padding:6px;display:flex}.logo-text{letter-spacing:1px;font-size:16px;font-weight:700;font-family:var(--font-mono)}.logo-subtext{color:var(--text-muted);font-size:10px}.status-indicator-wrapper{align-items:center;display:flex}.status-badge{font-size:11px;font-family:var(--font-mono);border-radius:6px;align-items:center;gap:8px;padding:4px 12px;font-weight:600;display:flex}.exact-match-badge{border:1px solid var(--color-green);color:var(--color-green);background:#3fb95026;box-shadow:0 0 12px #3fb95040}.diff-mismatch-badge{color:var(--color-yellow);background:#e3b3411a;border:1px solid #e3b3414d}.diff-pill{border-radius:3px;padding:1px 6px;font-size:10px}.diff-pill.added{background:var(--color-green-bg);color:var(--color-green);border:1px solid var(--color-green)}.diff-pill.removed{background:var(--color-red-bg);color:var(--color-red);border:1px solid var(--color-red)}.diff-meta{color:var(--text-muted);font-size:10px;font-weight:400}.header-right{align-items:center;gap:10px;display:flex}.header-btn{border:1px solid var(--border-subtle);color:var(--text-primary);cursor:pointer;background:#ffffff0d;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:500;transition:all .15s;display:flex}.header-btn:hover{border-color:var(--border-bright);background:#ffffff1a}.header-btn.danger:hover{border-color:var(--color-red);color:var(--color-red);background:#f8514926}.toolbar-container{border-bottom:1px solid var(--border-subtle);background:#090e18;flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;padding:6px 16px;font-size:12px;display:flex}.toolbar-side-actions{align-items:center;gap:6px;display:flex}.toolbar-side-actions.right-side{justify-content:flex-end}.pane-label{font-size:10px;font-family:var(--font-mono);color:var(--text-muted);letter-spacing:.5px;margin:0 4px;font-weight:700}.tool-btn{color:var(--text-primary);font-size:11px;font-family:var(--font-mono);cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:4px;align-items:center;gap:5px;padding:4px 8px;transition:all .15s;display:flex}.tool-btn:hover{border-color:var(--border-bright);background:#ffffff14}.tool-btn.active-feature{border-color:var(--color-yellow);background:#e3b3411a}.tool-btn.danger:hover{background:var(--color-red-bg);color:var(--color-red);border-color:var(--color-red)}.toolbar-center-controls{align-items:center;gap:12px;display:flex}.swap-btn{background:#00f0ff14;border-color:#00f0ff4d;font-weight:600}.swap-btn:hover{background:#00f0ff2e;box-shadow:0 0 10px #00f0ff33}.divider-vertical{background:var(--border-subtle);width:1px;height:18px}.toggle-group{border:1px solid var(--border-subtle);background:#0006;border-radius:5px;padding:2px;display:flex}.toggle-btn{color:var(--text-muted);font-size:11px;font-family:var(--font-mono);cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;gap:5px;padding:4px 10px;transition:all .15s;display:flex}.toggle-btn.active{background:var(--border-bright);color:#fff}.options-group{align-items:center;gap:12px;display:flex}.checkbox-label{color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:5px;font-size:11px;display:flex}.checkbox-label input{accent-color:var(--color-cyan)}.main-diff-area{flex-direction:column;flex:1;display:flex;overflow:hidden}.diff-view-container{flex-direction:column;height:100%;display:flex;overflow:hidden}.view-mode-bar{border-bottom:1px solid var(--border-subtle);background:#0b101c;flex-shrink:0;justify-content:space-between;align-items:center;padding:6px 16px;display:flex}.view-mode-tabs{gap:6px;display:flex}.mode-tab{color:var(--text-muted);font-size:11px;font-family:var(--font-mono);cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;gap:6px;padding:4px 10px;display:flex}.mode-tab.active{color:var(--color-cyan);background:#00f0ff14}.pane-copy-buttons{gap:8px;display:flex}.copy-action-btn{border:1px solid var(--border-subtle);color:var(--text-muted);cursor:pointer;background:#ffffff08;border-radius:4px;align-items:center;gap:5px;padding:3px 8px;font-size:11px;display:flex}.copy-action-btn:hover{color:var(--text-primary);border-color:var(--border-bright)}.editor-grid{flex:1;grid-template-columns:1fr 1fr;height:100%;display:grid;overflow:hidden}.editor-pane{border-right:1px solid var(--border-subtle);flex-direction:column;height:100%;display:flex;overflow:hidden}.editor-pane:last-child{border-right:none}.pane-bar{font-size:10px;font-family:var(--font-mono);background:#080d16;border-bottom:1px solid #ffffff0a;justify-content:space-between;align-items:center;padding:4px 12px;display:flex}.pane-indicator.left-ind{color:var(--color-cyan)}.pane-indicator.right-ind{color:var(--color-yellow)}.char-count{color:var(--text-muted)}.code-textarea{background:var(--bg-editor);width:100%;height:100%;color:var(--text-primary);font-family:var(--font-mono);resize:none;border:none;outline:none;flex:1;padding:12px 16px;font-size:13px;line-height:1.5}.code-textarea.wrap{white-space:pre-wrap;word-break:break-all}.code-textarea.nowrap{white-space:pre;overflow-x:auto}.diff-table-wrapper{background:var(--bg-editor);font-family:var(--font-mono);flex:1;font-size:13px;line-height:1.5;overflow:auto}.diff-table{flex-direction:column;min-width:100%;display:flex}.diff-row{border-bottom:1px solid #ffffff05;grid-template-columns:1fr 1fr;display:grid}.diff-row:hover{background:#ffffff05}.diff-side{align-items:flex-start;min-height:22px;padding:1px 0;display:flex;overflow:hidden}.diff-side.left-side{border-right:1px solid var(--border-subtle)}.line-num{text-align:right;color:#484f58;-webkit-user-select:none;user-select:none;flex-shrink:0;width:44px;padding-right:10px;font-size:11px}.line-text{white-space:pre;flex:1;padding-left:8px;padding-right:8px;overflow-x:hidden}.wrap-lines .line-text{white-space:pre-wrap;word-break:break-all}.row-added .right-side{background:var(--color-green-bg)}.row-added .right-side .line-text{color:var(--color-green)}.row-removed .left-side{background:var(--color-red-bg)}.row-removed .left-side .line-text{color:var(--color-red)}.row-modified .left-side{background:#f8514914}.row-modified .right-side{background:#2ea04314}.char-part.char-added{background:var(--color-green-char);color:#fff;border-radius:2px;padding:0 1px}.char-part.char-removed{background:var(--color-red-char);color:#fff;border-radius:2px;padding:0 1px;text-decoration:line-through}.unified-table-wrapper{background:var(--bg-editor);font-family:var(--font-mono);flex:1;font-size:13px;line-height:1.5;overflow:auto}.unified-table{flex-direction:column;min-width:100%;display:flex}.unified-row{border-bottom:1px solid #ffffff05;align-items:flex-start;min-height:22px;display:flex}.unified-gutter{-webkit-user-select:none;user-select:none;flex-shrink:0;width:90px;display:flex}.unified-gutter .line-num{width:36px}.line-prefix{text-align:center;width:18px;font-weight:700}.unified-content{white-space:pre;flex:1;padding-left:8px}.wrap-lines .unified-content{white-space:pre-wrap;word-break:break-all}.unified-row.row-added{background:var(--color-green-bg)}.unified-row.row-added .unified-content,.unified-row.row-added .line-prefix{color:var(--color-green)}.unified-row.row-removed{background:var(--color-red-bg)}.unified-row.row-removed .unified-content,.unified-row.row-removed .line-prefix{color:var(--color-red)}.modal-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:100;background:#000000bf;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.sample-modal-content{border:1px solid var(--border-bright);background:#0f1626;border-radius:10px;flex-direction:column;width:100%;max-width:580px;display:flex;overflow:hidden;box-shadow:0 16px 40px #0009}.modal-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.close-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none}.close-btn:hover{color:#fff}.samples-list{flex-direction:column;gap:10px;max-height:70vh;padding:16px;display:flex;overflow-y:auto}.sample-card{border:1px solid var(--border-subtle);cursor:pointer;background:#ffffff05;border-radius:8px;align-items:flex-start;gap:14px;padding:12px;transition:all .15s;display:flex}.sample-card:hover{border-color:var(--color-cyan);background:#ffffff0f}.sample-icon-box{background:#00f0ff14;border-radius:6px;padding:8px}.sample-info{flex-direction:column;gap:3px;display:flex}.sample-title{font-size:13px;font-weight:600}.sample-desc{color:var(--text-muted);font-size:11px;line-height:1.4}.text-cyan{color:var(--color-cyan)}.text-green{color:var(--color-green)}.text-yellow{color:var(--color-yellow)}.text-red{color:var(--color-red)}@keyframes pop{0%{opacity:.8;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.animate-pop{animation:.2s ease-out pop}
