diff --git a/static/base.css b/static/base.css
deleted file mode 100644
index a71e006..0000000
--- a/static/base.css
+++ /dev/null
@@ -1,146 +0,0 @@
-/* CSS Variables */
-:root {
-    --primary-color: #007bff;
-    --primary-color-rgb: 0, 123, 255;
-    --bg-primary: #ffffff;
-    --bg-secondary: #f8f9fa;
-    --bg-tertiary: #ffffff;
-    --bg-input: #ffffff;
-    --bg-button-secondary: #e9ecef;
-    --bg-toast: #333333;
-    --bg-toast-error: #dc3545;
-    --text-primary: #212529;
-    --text-secondary: #6c757d;
-    --text-toast: #ffffff;
-    --border-color: #dee2e6;
-    --status-idle: #6c757d;
-    --status-thinking: #ffc107;
-    --status-done: #28a745;
-    --error-color: #dc3545;
-    --highlight-color: rgba(0, 123, 255, 0.1);
-    --tooltip-bg: rgba(0, 0, 0, 0.8);
-    --tooltip-text: #ffffff;
-}
-
-/* Dark Theme */
-[data-theme="dark"] {
-    --bg-primary: #212529;
-    --bg-secondary: #343a40;
-    --bg-tertiary: #2b3035;
-    --bg-input: #1a1d20;
-    --bg-button-secondary: #495057;
-    --text-primary: #f8f9fa;
-    --text-secondary: #adb5bd;
-    --border-color: #495057;
-    --tooltip-bg: rgba(255, 255, 255, 0.9);
-    --tooltip-text: #000000;
-}
-
-/* App Container */
-.app-container {
-    display: flex;
-    flex-direction: column;
-    height: 100vh;
-    margin: 0;
-    background-color: var(--bg-primary);
-    color: var(--text-primary);
-}
-
-/* Header Styles */
-.app-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 1rem;
-    background-color: var(--bg-secondary);
-    border-bottom: 1px solid var(--border-color);
-}
-
-.header-left {
-    display: flex;
-    align-items: center;
-    gap: 1rem;
-}
-
-.header-right {
-    display: flex;
-    gap: 0.5rem;
-}
-
-/* Main Content */
-.app-main {
-    flex: 1;
-    display: flex;
-    position: relative;
-    overflow: hidden;
-}
-
-.content-panel {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    overflow: hidden;
-}
-
-/* Utility Classes */
-.hidden {
-    display: none !important;
-}
-
-/* Animations */
-@keyframes slideIn {
-    from {
-        transform: translateX(100%);
-        opacity: 0;
-    }
-    to {
-        transform: translateX(0);
-        opacity: 1;
-    }
-}
-
-@keyframes highlight {
-    0% { background-color: var(--highlight-color); }
-    100% { background-color: transparent; }
-}
-
-/* Touch Interactions */
-@media (hover: none) {
-    .btn-icon:active {
-        background-color: var(--bg-button-secondary);
-    }
-    
-    .section-header:active {
-        background-color: var(--bg-tertiary);
-    }
-}
-
-/* Responsive Design */
-@media (max-width: 768px) {
-    html {
-        font-size: 16px;
-        height: 100%;
-        overflow: hidden;
-    }
-
-    body {
-        height: 100%;
-        overflow: hidden;
-    }
-
-    .app-header {
-        padding: 0.5rem;
-    }
-
-    .app-header h1 {
-        font-size: 1.25rem;
-    }
-
-    .header-right {
-        gap: 0.25rem;
-    }
-
-    .btn-icon {
-        padding: 0.75rem;
-    }
-}
diff --git a/static/components.css b/static/components.css
deleted file mode 100644
index 0543c05..0000000
--- a/static/components.css
+++ /dev/null
@@ -1,717 +0,0 @@
-/* Capture Section */
-.capture-section {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    padding: 1rem;
-    gap: 1rem;
-}
-
-.toolbar {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    gap: 1rem;
-}
-
-.toolbar-buttons {
-    display: flex;
-    gap: 1rem;
-}
-
-/* Image Preview */
-.image-preview {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    gap: 1rem;
-    overflow: hidden;
-}
-
-.image-container {
-    flex: 1;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    overflow: hidden;
-    background-color: var(--bg-secondary);
-    border-radius: 8px;
-    position: relative;
-    min-height: 200px;
-    max-height: 60vh;
-}
-
-.image-container img {
-    max-width: 100%;
-    max-height: 100%;
-    object-fit: contain;
-    touch-action: pinch-zoom;
-    -webkit-user-select: none;
-    user-select: none;
-}
-
-/* Analysis Section */
-.analysis-button {
-    display: flex;
-    flex-direction: column;
-    gap: 1rem;
-}
-
-.text-editor {
-    display: flex;
-    flex-direction: column;
-    gap: 0.5rem;
-}
-
-.text-editor textarea {
-    width: 100%;
-    resize: vertical;
-    padding: 0.5rem;
-    border: 1px solid var(--border-color);
-    border-radius: 4px;
-    background-color: var(--bg-secondary);
-    color: var(--text-primary);
-}
-
-.text-actions {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-}
-
-/* Claude Panel */
-.claude-panel {
-    position: absolute;
-    top: 0;
-    right: 0;
-    width: 50%;
-    height: 100%;
-    background-color: var(--bg-secondary);
-    border-left: 1px solid var(--border-color);
-    display: flex;
-    flex-direction: column;
-    transition: transform 0.3s ease;
-}
-
-.panel-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 1rem;
-    border-bottom: 1px solid var(--border-color);
-}
-
-.header-title {
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-}
-
-.analysis-status {
-    display: flex;
-    align-items: center;
-}
-
-.status-light {
-    width: 8px;
-    height: 8px;
-    border-radius: 50%;
-    background-color: var(--status-idle);
-}
-
-.status-light.thinking {
-    background-color: var(--status-thinking);
-}
-
-.status-light.done {
-    background-color: var(--status-done);
-}
-
-.response-content {
-    flex: 1;
-    padding: 1rem;
-    overflow-y: auto;
-}
-
-/* Settings Panel */
-.settings-panel {
-    position: absolute;
-    top: 0;
-    right: 0;
-    width: 400px;
-    height: 100%;
-    background-color: var(--bg-secondary);
-    border-left: 1px solid var(--border-color);
-    display: flex;
-    flex-direction: column;
-    transition: transform 0.3s ease;
-}
-
-.settings-content {
-    flex: 1;
-    padding: 1rem;
-    overflow-y: auto;
-}
-
-.settings-section {
-    margin-bottom: 1.5rem;
-    padding: 1rem;
-    border-radius: 8px;
-    background: var(--bg-tertiary);
-}
-
-.section-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 1rem;
-    margin: -0.75rem -0.75rem 0 -0.75rem;
-    background: var(--bg-secondary);
-    border-bottom: 1px solid var(--border-color);
-    cursor: pointer;
-    user-select: none;
-    -webkit-tap-highlight-color: transparent;
-    position: relative;
-    z-index: 1;
-}
-
-.section-header i {
-    font-size: 0.8em;
-    transition: transform 0.3s ease;
-    margin-left: 0.5rem;
-}
-
-.settings-section:not(.expanded) .section-header i {
-    transform: rotate(-90deg);
-}
-
-.section-content {
-    transition: all 0.3s ease;
-    overflow: hidden;
-    padding: 0 1rem;
-}
-
-.settings-section:not(.expanded) .section-content {
-    max-height: 0;
-    padding-top: 0;
-    padding-bottom: 0;
-    opacity: 0;
-}
-
-.settings-section.expanded .section-content {
-    max-height: 2000px;
-    padding-top: 1rem;
-    padding-bottom: 1rem;
-    opacity: 1;
-}
-
-/* Form Elements */
-.setting-group {
-    margin-bottom: 1rem;
-}
-
-.setting-group label {
-    display: block;
-    margin-bottom: 0.5rem;
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-}
-
-.setting-group label i {
-    color: var(--text-secondary);
-    cursor: help;
-}
-
-.setting-group input[type="text"],
-.setting-group input[type="password"],
-.setting-group input[type="number"],
-.setting-group select,
-.setting-group textarea {
-    width: 100%;
-    padding: 0.5rem;
-    border: 1px solid var(--border-color);
-    border-radius: 4px;
-    background-color: var(--bg-input);
-    color: var(--text-primary);
-}
-
-.setting-group textarea {
-    resize: vertical;
-    min-height: 100px;
-}
-
-.input-group {
-    position: relative;
-    display: flex;
-    align-items: center;
-}
-
-.input-group.highlight {
-    animation: highlight 0.2s ease-in-out;
-}
-
-.input-group input {
-    flex: 1;
-    padding-right: 2.5rem;
-}
-
-.input-group .btn-icon {
-    position: absolute;
-    right: 0.5rem;
-}
-
-/* History Panel */
-.history-panel {
-    position: absolute;
-    top: 0;
-    right: 0;
-    width: 300px;
-    height: 100%;
-    background-color: var(--bg-secondary);
-    border-left: 1px solid var(--border-color);
-    display: flex;
-    flex-direction: column;
-    transition: transform 0.3s ease;
-}
-
-.history-content {
-    flex: 1;
-    padding: 1rem;
-    overflow-y: auto;
-}
-
-.history-item {
-    margin-bottom: 1rem;
-    background: var(--bg-tertiary);
-    border-radius: 8px;
-    overflow: hidden;
-    transition: all 0.3s ease;
-    border: 1px solid var(--border-color);
-}
-
-.history-item-header {
-    padding: 1rem;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    cursor: pointer;
-    user-select: none;
-    -webkit-tap-highlight-color: transparent;
-    position: relative;
-    background: var(--bg-secondary);
-}
-
-.history-image {
-    padding: 1rem;
-    border-bottom: 1px solid var(--border-color);
-}
-
-.history-image img {
-    max-width: 100%;
-    height: auto;
-    border-radius: 4px;
-}
-
-.history-empty {
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    gap: 1rem;
-    color: var(--text-secondary);
-    padding: 2rem;
-}
-
-.history-empty i {
-    font-size: 3rem;
-    opacity: 0.5;
-}
-
-/* Crop Container */
-.crop-container {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: var(--bg-primary);
-    display: flex;
-    flex-direction: column;
-    z-index: 1100;
-}
-
-.crop-wrapper {
-    flex: 1;
-    position: relative;
-    overflow: hidden;
-    background-color: var(--bg-secondary);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.crop-area {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background-color: var(--bg-secondary);
-}
-
-.crop-area img {
-    max-width: 100%;
-    max-height: 100%;
-    object-fit: contain;
-}
-
-/* Cropper.js Customization */
-.cropper-container {
-    direction: ltr;
-    font-size: 0;
-    line-height: 0;
-    position: relative;
-    touch-action: none;
-    user-select: none;
-}
-
-.cropper-wrap-box,
-.cropper-canvas,
-.cropper-drag-box,
-.cropper-crop-box,
-.cropper-modal {
-    bottom: 0;
-    left: 0;
-    position: absolute;
-    right: 0;
-    top: 0;
-}
-
-.cropper-wrap-box {
-    overflow: hidden;
-}
-
-.cropper-drag-box {
-    background-color: #fff;
-    opacity: 0;
-}
-
-.cropper-modal {
-    background-color: var(--bg-primary);
-    opacity: 0.5;
-}
-
-.cropper-view-box {
-    display: block;
-    height: 100%;
-    outline: 1px solid var(--primary-color);
-    outline-color: var(--primary-color);
-    overflow: hidden;
-    width: 100%;
-}
-
-.cropper-dashed {
-    border: 0 dashed #eee;
-    display: block;
-    opacity: 0.5;
-    position: absolute;
-}
-
-.cropper-center {
-    display: block;
-    height: 0;
-    left: 50%;
-    opacity: 0.75;
-    position: absolute;
-    top: 50%;
-    width: 0;
-}
-
-.cropper-center::before,
-.cropper-center::after {
-    background-color: #eee;
-    content: " ";
-    display: block;
-    position: absolute;
-}
-
-.cropper-face {
-    background-color: #fff;
-    left: 0;
-    opacity: 0.1;
-    position: absolute;
-    top: 0;
-}
-
-.cropper-line {
-    background-color: var(--primary-color);
-    display: block;
-    height: 100%;
-    opacity: 0.1;
-    position: absolute;
-    width: 100%;
-}
-
-.cropper-point {
-    background-color: var(--primary-color);
-    height: 5px;
-    opacity: 0.75;
-    position: absolute;
-    width: 5px;
-}
-
-.crop-actions {
-    height: 80px;
-    padding: 1rem;
-    display: flex;
-    justify-content: center;
-    gap: 1rem;
-    background-color: var(--bg-secondary);
-    border-top: 1px solid var(--border-color);
-}
-
-.crop-actions button {
-    flex: 1;
-    max-width: 160px;
-    padding: 0.75rem;
-    font-size: 1rem;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: 0.5rem;
-}
-
-/* Toast Container */
-.toast-container {
-    position: fixed;
-    bottom: 1rem;
-    right: 1rem;
-    display: flex;
-    flex-direction: column;
-    gap: 0.5rem;
-    z-index: 2000;
-}
-
-.toast {
-    padding: 0.75rem 1rem;
-    border-radius: 4px;
-    background-color: var(--bg-toast);
-    color: var(--text-toast);
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-    animation: slideIn 0.3s ease;
-}
-
-.toast.error {
-    background-color: var(--bg-toast-error);
-}
-
-/* Button Styles */
-.btn-primary,
-.btn-secondary {
-    display: inline-flex;
-    align-items: center;
-    gap: 0.5rem;
-    padding: 0.5rem 1rem;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    transition: background-color 0.2s;
-}
-
-.btn-primary {
-    background-color: var(--primary-color);
-    color: white;
-}
-
-.btn-secondary {
-    background-color: var(--bg-button-secondary);
-    color: var(--text-primary);
-    border: 1px solid var(--border-color);
-}
-
-.btn-icon {
-    padding: 0.5rem;
-    background: none;
-    border: none;
-    color: var(--text-primary);
-    cursor: pointer;
-    transition: color 0.2s;
-}
-
-.btn-icon:hover {
-    color: var(--primary-color);
-}
-
-.button-group {
-    display: flex;
-    gap: 0.5rem;
-}
-
-/* Tooltip styles */
-[title] {
-    position: relative;
-}
-
-[title]:hover::after {
-    content: attr(title);
-    position: absolute;
-    bottom: 100%;
-    left: 50%;
-    transform: translateX(-50%);
-    padding: 0.5rem;
-    background: var(--tooltip-bg);
-    color: var(--tooltip-text);
-    border-radius: 4px;
-    font-size: 0.8em;
-    white-space: nowrap;
-    z-index: 1000;
-}
-
-/* Responsive Design for Components */
-@media (max-width: 768px) {
-    .settings-content,
-    .history-content,
-    .response-content {
-        -webkit-overflow-scrolling: touch;
-    }
-
-    .capture-section {
-        padding: 0.5rem;
-    }
-
-    .toolbar {
-        flex-wrap: wrap;
-    }
-
-    .button-group {
-        width: 100%;
-    }
-
-    .button-group button {
-        flex: 1;
-        padding: 0.75rem;
-        font-size: 0.9rem;
-    }
-
-    .image-container {
-        margin: 0 -0.5rem;
-        border-radius: 0;
-        background-color: var(--bg-primary);
-    }
-
-    .image-container img {
-        width: 100%;
-        height: auto;
-        object-fit: contain;
-    }
-
-    .settings-panel,
-    .history-panel,
-    .claude-panel {
-        width: 100%;
-        position: fixed;
-        bottom: 0;
-        right: 0;
-        height: 90vh;
-        transform: translateY(100%);
-        border-top-left-radius: 16px;
-        border-top-right-radius: 16px;
-        border-left: none;
-        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
-    }
-
-    .settings-panel:not(.hidden),
-    .history-panel:not(.hidden),
-    .claude-panel:not(.hidden) {
-        transform: translateY(0);
-    }
-
-    .settings-content,
-    .history-content {
-        padding: 0.75rem;
-    }
-
-    .settings-section {
-        margin-bottom: 1rem;
-        padding: 0.75rem;
-    }
-
-    .setting-group {
-        margin-bottom: 0.75rem;
-    }
-
-    .setting-group input[type="text"],
-    .setting-group input[type="password"],
-    .setting-group input[type="number"],
-    .setting-group select,
-    .setting-group textarea {
-        padding: 0.75rem;
-        font-size: 1rem;
-    }
-
-    .crop-container {
-        position: fixed;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background-color: var(--bg-primary);
-        z-index: 1100;
-    }
-
-    .crop-wrapper {
-        height: calc(100% - 80px);
-        overflow: hidden;
-        background-color: var(--bg-secondary);
-    }
-
-    .crop-area {
-        max-width: 100%;
-        max-height: 100%;
-    }
-
-    .crop-actions {
-        height: 80px;
-        padding: 1rem;
-        background-color: var(--bg-secondary);
-        border-top: 1px solid var(--border-color);
-    }
-
-    .crop-actions button {
-        padding: 0.75rem 1.5rem;
-        font-size: 1rem;
-    }
-
-    .text-editor textarea {
-        padding: 0.75rem;
-        font-size: 1rem;
-        min-height: 120px;
-    }
-
-    .text-actions {
-        flex-direction: column;
-        gap: 0.75rem;
-        align-items: stretch;
-    }
-
-    .text-actions button {
-        width: 100%;
-        padding: 0.75rem;
-    }
-
-    .toast-container {
-        left: 1rem;
-        right: 1rem;
-        bottom: 1rem;
-    }
-
-    .toast {
-        width: 100%;
-        padding: 1rem;
-        font-size: 0.9rem;
-        text-align: center;
-    }
-}
diff --git a/static/js/history.js b/static/js/history.js
index 11d52c3..5e92ddb 100644
--- a/static/js/history.js
+++ b/static/js/history.js
@@ -73,14 +73,10 @@ window.renderHistory = function() {
                 // Reset confidence display
                 document.getElementById('confidenceDisplay').textContent = '';
                 
-                // Only show text editor if there was extracted text
-                if (historyItem.extractedText) {
-                    window.app.textEditor.classList.remove('hidden');
-                    window.app.extractedText.value = historyItem.extractedText;
-                } else {
-                    window.app.textEditor.classList.add('hidden');
-                    window.app.extractedText.value = '';
-                }
+                // Always hide text editor and extracted text in history view
+                window.app.textEditor.classList.add('hidden');
+                window.app.extractedText.value = '';
+                window.app.sendExtractedTextBtn.classList.add('hidden');
                 
                 // Show response if it exists
                 if (historyItem.response) {
diff --git a/static/js/main.js b/static/js/main.js
index bbc7e34..739c1c9 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -144,12 +144,15 @@ class SnapSolver {
                     this.extractedText.value = '';
                     this.extractedText.disabled = false;
                 }
+                this.sendExtractedTextBtn.disabled = false;  // Re-enable send button on server error
             } else if (data.content) {
                 if (this.extractedText) {
                     this.extractedText.value = data.content;
                     this.extractedText.disabled = false;
                     // Scroll to make text editor visible
                     this.extractedText.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+                    // Enable the Send Text to AI button
+                    this.sendExtractedTextBtn.disabled = false;
                 }
                 window.showToast('Text extracted successfully');
             }
@@ -413,6 +416,7 @@ class SnapSolver {
             }
 
             this.extractTextBtn.disabled = true;
+            this.sendExtractedTextBtn.disabled = true;  // Disable the send button while extracting
             this.extractTextBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i><span>Extracting...</span>';
 
             const settings = window.settingsManager.getSettings();
@@ -444,6 +448,7 @@ class SnapSolver {
             } catch (error) {
                 window.showToast('Failed to extract text: ' + error.message, 'error');
                 this.extractTextBtn.disabled = false;
+                this.sendExtractedTextBtn.disabled = false;  // Re-enable send button on error
                 this.extractTextBtn.innerHTML = '<i class="fas fa-font"></i><span>Extract Text</span>';
             }
         });
diff --git a/templates/index.html b/templates/index.html
index f3f68ad..f706974 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -170,7 +170,7 @@
                     </div>
                     <div class="setting-group">
                         <label for="systemPrompt">System Prompt</label>
-                        <textarea id="systemPrompt" rows="3">You are an expert problem solver. Analyze the image, identify any questions or problems, and provide detailed solutions. Always respond in the user's preferred language.</textarea>
+                        <textarea id="systemPrompt" rows="3">You are an expert problem solver. Analyze the problem step by step, identify any questions or problems, and provide detailed solutions. Always respond in the user's preferred language.</textarea>
                     </div>
                 </div>