.upload-area{border:2px dashed var(--gray-400);border-radius:var(--border-radius);padding:var(--spacing-xl);text-align:center;background-color:var(--gray-100);transition:var(--transition);width:100%;cursor:pointer;margin-bottom:var(--spacing-md)}.upload-area.dragover{border-color:var(--primary);background-color:var(--gray-200)}.upload-area p{color:var(--text-muted);margin-bottom:var(--spacing-sm)}#file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.upload-area label.btn-primary{display:inline-block;cursor:pointer}.file-info{margin-top:var(--spacing-sm);font-size:.9rem;color:var(--text-muted)}.controls{margin-bottom:var(--spacing-md);display:flex;flex-direction:column;gap:var(--spacing-md);align-items:center}.options{display:flex;align-items:center;gap:var(--spacing-sm);justify-content:center;flex-wrap:wrap}.options label{font-weight:500;display:inline;margin-bottom:0}.output-section{margin-top:var(--spacing-md)}.output-section h2{margin-bottom:var(--spacing-sm);font-size:1.2rem}.search-controls{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) 0;margin-bottom:var(--spacing-sm);border-bottom:1px solid var(--border-color);flex-wrap:wrap}#search-input{flex-grow:1;min-width:150px}.search-nav-button,.clear-button{padding:var(--spacing-xs) var(--spacing-sm);font-size:.9rem}.search-count{font-size:.9rem;color:var(--text-muted);white-space:nowrap;margin:0 var(--spacing-xs)}.progress-container{margin-bottom:var(--spacing-sm);display:flex;align-items:center;gap:var(--spacing-sm)}.progress-container label{font-size:.9rem;color:var(--text-muted);display:inline;margin-bottom:0}#processing-progress{flex-grow:1;height:10px;appearance:none;border:1px solid var(--border-color);border-radius:5px;overflow:hidden}#processing-progress::-webkit-progress-bar{background-color:var(--gray-200);border-radius:5px}#processing-progress::-webkit-progress-value{background-color:var(--primary);border-radius:5px;transition:width .1s linear}#processing-progress::-moz-progress-bar{background-color:var(--primary);border-radius:5px;transition:width .1s linear}#processing-progress{color:var(--primary);background-color:var(--gray-200)}#progress-percentage{font-size:.9rem;font-weight:700;min-width:35px;text-align:right}.loading-indicator{color:var(--primary);font-style:italic;margin-bottom:var(--spacing-sm)}.error-message{color:var(--danger);background-color:#f8d7da;border:1px solid #f5c6cb;padding:var(--spacing-sm);border-radius:var(--border-radius-sm);margin-bottom:var(--spacing-sm)}.output-display{width:100%;min-height:250px;height:40vh;border:1px solid var(--border-color);border-radius:var(--border-radius-sm);padding:var(--spacing-sm);font-family:Courier New,Courier,monospace;font-size:.9rem;resize:vertical;overflow:auto;background-color:var(--input-bg-color);color:var(--text-color);white-space:pre-wrap;word-wrap:break-word;line-height:1.5;appearance:none;margin-bottom:var(--spacing-sm)}.output-display .placeholder{color:var(--text-muted);font-style:italic}.highlight{background-color:#ff0;color:#000;border-radius:2px;padding:0 1px;margin:0 -1px;display:inline;white-space:pre-wrap}.highlight.active{background-color:orange;box-shadow:0 0 0 1px orange}#save-button{float:right}body.dark-theme .upload-area{background-color:var(--gray-100);border-color:var(--gray-400)}body.dark-theme .upload-area.dragover{background-color:var(--gray-200);border-color:var(--primary)}body.dark-theme .output-display{background-color:var(--input-bg-color);color:var(--text-color);border-color:var(--input-border-color)}body.dark-theme .error-message{background-color:#3a1a1e;color:#ff8a95;border-color:#5a2a30}body.dark-theme .highlight{background-color:#b8860b;color:#fff}body.dark-theme .highlight.active{background-color:#ff8c00;box-shadow:0 0 0 1px #ff8c00}@media (max-width: 768px){.options{flex-direction:column;gap:var(--spacing-sm);align-items:stretch}#encoding-select,#parse-button{width:100%}.search-controls{gap:var(--spacing-xs)}#search-input{min-width:100px}}@media (max-width: 480px){.search-controls{flex-direction:column;align-items:stretch}#search-input{margin-bottom:var(--spacing-xs)}.search-nav-button,.clear-button{width:100%;margin-bottom:var(--spacing-xs)}.search-count{text-align:center;width:100%;margin-bottom:var(--spacing-xs)}#save-button{width:100%;float:none;margin-top:var(--spacing-md)}}
