.translation-area{flex:1;display:flex;flex-direction:column;min-height:200px;overflow:hidden}.area-label{font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-bottom:var(--spacing-1)}.area-textarea{flex:1;width:100%;padding:var(--spacing-4);border:none;background:var(--color-bg);color:var(--color-text);font-size:var(--font-size-base);line-height:1.6;resize:none}.area-textarea::placeholder{color:var(--color-text-placeholder)}.area-textarea:disabled{background:var(--color-bg-secondary);cursor:not-allowed}.area-textarea:focus{outline:none}.language-selector{position:relative;display:flex;align-items:center;gap:var(--spacing-2)}.selector-label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.selector-trigger{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-size:var(--font-size-sm);font-weight:500;transition:all var(--transition-fast);min-width:120px}.selector-trigger:hover{border-color:var(--color-primary)}.selector-trigger:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px #0f30e01a}.selector-value{flex:1;text-align:left}.selector-arrow{flex-shrink:0;color:var(--color-text-secondary);transition:transform var(--transition-fast)}.selector-arrow.open{transform:rotate(180deg)}.selector-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:var(--spacing-1);max-height:300px;overflow-y:auto;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:var(--z-dropdown);list-style:none}.dropdown-item{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-sm);color:var(--color-text);cursor:pointer;transition:background var(--transition-fast)}.dropdown-item:hover{background:var(--color-bg-secondary)}.dropdown-item.selected{color:var(--color-primary);font-weight:500}.style-settings{border-top:1px solid var(--color-border);flex-shrink:0}.style-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-sm);color:var(--color-text-secondary);transition:all var(--transition-fast)}.style-toggle:hover{background:var(--color-bg-secondary)}.style-label strong{color:var(--color-text)}.style-arrow{transition:transform var(--transition-fast)}.style-arrow.open{transform:rotate(180deg)}.style-content{padding:var(--spacing-3) var(--spacing-4);background:var(--color-bg-secondary)}.style-presets{display:flex;flex-wrap:wrap;gap:var(--spacing-2)}.style-preset-btn{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm);color:var(--color-text-secondary);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-full);transition:all var(--transition-fast)}.style-preset-btn:hover:not(:disabled){border-color:var(--color-primary);color:var(--color-primary)}.style-preset-btn.active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.custom-style-input{width:100%;margin-top:var(--spacing-3);padding:var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);resize:none}.custom-style-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px #0f30e01a}.model-switcher{display:flex;align-items:center}.model-select{padding:var(--spacing-2) var(--spacing-3);padding-right:var(--spacing-6);font-size:var(--font-size-sm);color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center}.model-select:hover{border-color:var(--color-primary)}.model-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px #0f30e01a}.history-panel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;justify-content:flex-end;z-index:var(--z-modal);animation:fadeIn .2s ease-out}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.history-panel{width:100%;max-width:500px;height:100%;background:var(--color-bg);display:flex;flex-direction:column;box-shadow:var(--shadow-lg);animation:slideInRight .3s ease-out}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4) var(--spacing-6);border-bottom:1px solid var(--color-border)}.panel-title{font-size:var(--font-size-lg);font-weight:600}.panel-tabs{display:flex;border-bottom:1px solid var(--color-border)}.tab-btn{flex:1;padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary);border-bottom:2px solid transparent;transition:all var(--transition-fast)}.tab-btn:hover{color:var(--color-text);background:var(--color-bg-secondary)}.tab-btn.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.panel-actions{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid var(--color-border)}.search-input{flex:1;padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm)}.search-input:focus{border-color:var(--color-primary)}.action-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-secondary);transition:all var(--transition-fast)}.action-btn:hover{background:var(--color-bg-secondary);color:var(--color-text)}.action-btn.danger:hover{background:#ef44441a;color:var(--color-error)}.panel-content{flex:1;overflow-y:auto}.empty-state{display:flex;align-items:center;justify-content:center;height:200px;color:var(--color-text-secondary)}.history-list{list-style:none}.history-item{padding:var(--spacing-4);border-bottom:1px solid var(--color-border);transition:background var(--transition-fast)}.history-item:hover{background:var(--color-bg-secondary)}.item-header{display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-2)}.item-langs{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.item-mode{font-size:var(--font-size-xs);padding:2px 6px;background:var(--color-bg-tertiary);border-radius:var(--radius-sm);color:var(--color-text-secondary)}.item-text{font-size:var(--font-size-sm);line-height:1.5;margin-bottom:var(--spacing-2);cursor:pointer}.item-text.source{color:var(--color-text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.item-text.source:hover{color:var(--color-primary)}.item-text.target{color:var(--color-text-secondary);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.item-footer{display:flex;align-items:center;justify-content:space-between}.item-time{font-size:var(--font-size-xs);color:var(--color-text-placeholder)}.item-actions{display:flex;gap:var(--spacing-1)}.item-action-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);color:var(--color-text-secondary);transition:all var(--transition-fast)}.item-action-btn:hover{background:var(--color-bg-tertiary);color:var(--color-text)}.item-action-btn.active{color:var(--color-warning)}.item-action-btn.danger:hover{background:#ef44441a;color:var(--color-error)}.thinking-chain{margin:var(--spacing-3) var(--spacing-4);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-secondary);overflow:hidden}.thinking-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--spacing-3);font-size:var(--font-size-sm);color:var(--color-text-secondary);transition:all var(--transition-fast)}.thinking-header:hover{background:var(--color-bg-tertiary)}.thinking-title{display:flex;align-items:center;gap:var(--spacing-2)}.thinking-icon{font-size:var(--font-size-base)}.thinking-arrow{transition:transform var(--transition-fast)}.thinking-arrow.collapsed{transform:rotate(-90deg)}.thinking-content{padding:var(--spacing-3);padding-top:0;max-height:200px;overflow-y:auto}.thinking-content pre{font-family:var(--font-family);font-size:var(--font-size-sm);color:var(--color-text-secondary);white-space:pre-wrap;word-break:break-word;margin:0}.settings-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--spacing-4);animation:fadeIn .2s ease-out}.settings-panel{width:100%;max-width:500px;max-height:90vh;background:var(--color-bg);border-radius:var(--radius-lg);display:flex;flex-direction:column;overflow:hidden;animation:slideUp .3s ease-out}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4) var(--spacing-6);border-bottom:1px solid var(--color-border)}.settings-title{font-size:var(--font-size-lg);font-weight:600}.close-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-secondary);transition:all var(--transition-fast)}.settings-content{flex:1;overflow-y:auto;padding:var(--spacing-4) var(--spacing-6)}.settings-section{margin-bottom:var(--spacing-6)}.settings-section:last-child{margin-bottom:0}.section-title{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--spacing-4)}.section-desc{font-size:var(--font-size-xs);color:var(--color-text-placeholder);margin-bottom:var(--spacing-3);margin-top:calc(var(--spacing-2) * -1)}.checkbox-label{display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-sm);color:var(--color-text);cursor:pointer}.checkbox-label input[type=checkbox]{width:16px;height:16px;accent-color:var(--color-primary)}.form-group{margin-bottom:var(--spacing-4)}.form-group:last-child{margin-bottom:0}.form-label{display:block;font-size:var(--font-size-sm);font-weight:500;color:var(--color-text);margin-bottom:var(--spacing-2)}.form-input,.form-select{width:100%;padding:var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:var(--color-text);background:var(--color-bg)}.form-input:focus,.form-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px #0f30e01a}.form-input::placeholder{color:var(--color-text-placeholder)}.custom-langs-list{display:flex;flex-wrap:wrap;gap:var(--spacing-2);margin-bottom:var(--spacing-4)}.custom-lang-item{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);background:var(--color-bg-secondary);border-radius:var(--radius-md)}.custom-lang-name{font-size:var(--font-size-sm)}.remove-btn{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--radius-sm);color:var(--color-text-secondary);transition:all var(--transition-fast)}.remove-btn:hover{background:#ef44441a;color:var(--color-error)}.add-custom-lang{display:flex;flex-direction:column;gap:var(--spacing-2)}.add-btn{padding:var(--spacing-2) var(--spacing-4);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;align-self:flex-start;transition:background var(--transition-fast)}.add-btn:hover{background:var(--color-primary-hover)}.settings-footer{display:flex;justify-content:flex-end;gap:var(--spacing-3);padding:var(--spacing-4) var(--spacing-6);border-top:1px solid var(--color-border)}.cancel-btn,.save-btn{padding:var(--spacing-2) var(--spacing-4);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;transition:all var(--transition-fast)}.cancel-btn{color:var(--color-text-secondary);background:var(--color-bg-secondary)}.cancel-btn:hover{background:var(--color-bg-tertiary)}.save-btn{background:var(--color-primary);color:#fff}.save-btn:hover{background:var(--color-primary-hover)}.markdown-renderer{padding:var(--spacing-4);font-size:var(--font-size-sm);line-height:1.6;color:var(--color-text)}.markdown-renderer h1{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-2);border-bottom:1px solid var(--color-border)}.markdown-renderer h2{font-size:var(--font-size-xl);margin-top:var(--spacing-4);margin-bottom:var(--spacing-3)}.markdown-renderer h3{font-size:var(--font-size-lg);margin-top:var(--spacing-3);margin-bottom:var(--spacing-2)}.markdown-renderer p{margin-bottom:var(--spacing-3)}.markdown-renderer ul,.markdown-renderer ol{margin-bottom:var(--spacing-3);padding-left:var(--spacing-6)}.markdown-renderer li{margin-bottom:var(--spacing-1)}.markdown-renderer code{font-family:Fira Code,Consolas,monospace;font-size:.9em;padding:2px 6px;background:var(--color-bg-tertiary);border-radius:var(--radius-sm)}.markdown-renderer pre{margin-bottom:var(--spacing-3);padding:var(--spacing-3);background:var(--color-bg-tertiary);border-radius:var(--radius-md);overflow-x:auto}.markdown-renderer pre code{padding:0;background:none}.markdown-renderer blockquote{margin-bottom:var(--spacing-3);padding-left:var(--spacing-4);border-left:4px solid var(--color-primary);color:var(--color-text-secondary)}.markdown-renderer a{color:var(--color-primary);text-decoration:none}.markdown-renderer a:hover{text-decoration:underline}.markdown-renderer table{width:100%;margin-bottom:var(--spacing-3);border-collapse:collapse}.markdown-renderer th,.markdown-renderer td{padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-border);text-align:left}.markdown-renderer th{background:var(--color-bg-secondary);font-weight:600}.markdown-renderer hr{margin:var(--spacing-4) 0;border:none;border-top:1px solid var(--color-border)}.markdown-renderer img{max-width:100%;height:auto}.markdown-renderer strong{font-weight:600}.markdown-renderer em{font-style:italic}.doc-translation{flex:1;display:flex;flex-direction:column;padding:var(--spacing-4);gap:var(--spacing-4);overflow-y:auto}.doc-header{display:flex;align-items:center;justify-content:space-between}.doc-title{font-size:var(--font-size-xl);font-weight:600}.doc-input-section{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-4);display:flex;flex-direction:column;gap:var(--spacing-3)}.url-input-row{display:flex;gap:var(--spacing-2)}.url-input{flex:1;padding:var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm)}.url-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px #0f30e01a}.fetch-btn{padding:var(--spacing-3) var(--spacing-4);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);font-weight:500;transition:background var(--transition-fast)}.fetch-btn:hover:not(:disabled){background:var(--color-primary-hover)}.fetch-btn:disabled{opacity:.5;cursor:not-allowed}.divider{display:flex;align-items:center;gap:var(--spacing-3);color:var(--color-text-secondary);font-size:var(--font-size-sm)}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--color-border)}.file-upload-row{display:flex;align-items:center;gap:var(--spacing-4)}.file-upload-label{cursor:pointer}.file-input{display:none}.file-upload-btn{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;transition:all var(--transition-fast)}.file-upload-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.file-info{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.error-message{padding:var(--spacing-3);background:#ef44441a;color:var(--color-error);border-radius:var(--radius-md);font-size:var(--font-size-sm)}.warning-message{padding:var(--spacing-3);background:#f59e0b1a;color:var(--color-warning);border-radius:var(--radius-md);font-size:var(--font-size-sm)}.doc-language-row{display:flex;gap:var(--spacing-4)}.lang-select-group{display:flex;align-items:center;gap:var(--spacing-2)}.lang-select-group label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.lang-select{padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);background:var(--color-bg)}.doc-preview{background:var(--color-bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-4);animation:slideUp .3s ease-out}.preview-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary);margin-bottom:var(--spacing-2)}.preview-content{font-size:var(--font-size-sm);color:var(--color-text);white-space:pre-wrap;word-break:break-word;max-height:200px;overflow-y:auto;background:var(--color-bg);padding:var(--spacing-3);border-radius:var(--radius-md)}.translate-doc-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);font-weight:500;transition:background var(--transition-fast)}.translate-doc-btn:hover:not(:disabled){background:var(--color-primary-hover)}.translate-doc-btn:disabled{opacity:.5;cursor:not-allowed}.progress-message{text-align:center;padding:var(--spacing-3);background:var(--color-bg-secondary);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.doc-result{flex:1;display:flex;flex-direction:column;background:var(--color-bg-secondary);border-radius:var(--radius-lg);overflow:hidden;animation:slideUp .3s ease-out}.result-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-3) var(--spacing-4);background:var(--color-bg-tertiary);border-bottom:1px solid var(--color-border)}.result-label{font-size:var(--font-size-sm);font-weight:500}.result-actions{display:flex;align-items:center;gap:var(--spacing-2)}.icon-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-md);color:var(--color-text-secondary);background:transparent;transition:all var(--transition-fast)}.icon-btn:hover{background:var(--color-bg-secondary);color:var(--color-text)}.download-btn{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;transition:background var(--transition-fast)}.download-btn:hover{background:var(--color-primary-hover)}.result-content{flex:1;overflow-y:auto}.result-content .markdown-renderer{height:100%}.plain-text-result{padding:var(--spacing-4);white-space:pre-wrap;word-break:break-word;font-size:var(--font-size-sm);line-height:1.6;margin:0}.style-customization-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;padding:var(--spacing-4);animation:fadeIn .2s ease-out}.style-customization{background:var(--color-bg);border-radius:var(--radius-lg);width:100%;max-width:700px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease-out}.sc-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4);border-bottom:1px solid var(--color-border)}.sc-header h2{font-size:var(--font-size-lg);font-weight:600;margin:0}.close-btn{background:none;border:none;cursor:pointer;padding:var(--spacing-2);color:var(--color-text-secondary);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.sc-tabs{display:flex;border-bottom:1px solid var(--color-border);padding:0 var(--spacing-4)}.sc-tab{padding:var(--spacing-3) var(--spacing-4);background:none;border:none;font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary);cursor:pointer;position:relative;transition:color var(--transition-fast)}.sc-tab:hover{color:var(--color-text)}.sc-tab.active{color:var(--color-primary)}.sc-tab.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--color-primary)}.sc-content{flex:1;overflow-y:auto;padding:var(--spacing-4)}.basic-panel{display:flex;flex-direction:column;gap:var(--spacing-4)}.presets-row{display:flex;align-items:center;gap:var(--spacing-2);flex-wrap:wrap}.presets-label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.preset-btn{padding:var(--spacing-2) var(--spacing-3);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast)}.preset-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.variables-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--spacing-3)}.var-row{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-2)}.var-row label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.var-input-group{display:flex;gap:var(--spacing-1)}.color-input{width:36px;height:32px;padding:2px;border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer}.text-input{width:100px;padding:var(--spacing-1) var(--spacing-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-family:monospace}.preview-box{margin-top:var(--spacing-4)}.preview-label{display:block;font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-2)}.preview-card{padding:var(--spacing-4);border:1px solid;border-radius:var(--radius-md);display:flex;flex-direction:column;gap:var(--spacing-3)}.preview-primary-btn{padding:var(--spacing-2) var(--spacing-4);border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;width:fit-content}.preview-secondary{font-size:var(--font-size-sm)}.advanced-panel{display:flex;flex-direction:column;gap:var(--spacing-3)}.advanced-desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.css-textarea{width:100%;min-height:300px;padding:var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-family:Fira Code,Consolas,monospace;font-size:var(--font-size-sm);line-height:1.6;resize:vertical;background:var(--color-bg-secondary);color:var(--color-text)}.css-textarea:focus{outline:none;border-color:var(--color-primary)}.advanced-hints{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.advanced-hints p{margin:0 0 var(--spacing-2) 0}.advanced-hints pre{background:var(--color-bg-secondary);padding:var(--spacing-3);border-radius:var(--radius-md);overflow-x:auto;margin:0}.docs-panel{display:flex;flex-direction:column;gap:var(--spacing-4)}.docs-panel h3{font-size:var(--font-size-base);font-weight:600;margin:0}.docs-intro{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.vars-table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}.vars-table th,.vars-table td{padding:var(--spacing-2) var(--spacing-3);text-align:left;border-bottom:1px solid var(--color-border)}.vars-table th{font-weight:600;background:var(--color-bg-secondary)}.vars-table code{background:var(--color-bg-secondary);padding:2px 6px;border-radius:var(--radius-sm);font-size:.9em}.usage-code{background:var(--color-bg-secondary);padding:var(--spacing-3);border-radius:var(--radius-md);overflow-x:auto;font-size:var(--font-size-sm);margin:0}.sc-footer{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4);border-top:1px solid var(--color-border);gap:var(--spacing-3)}.footer-right{display:flex;gap:var(--spacing-2)}.reset-btn,.cancel-btn,.save-btn{padding:var(--spacing-2) var(--spacing-4);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.reset-btn{background:none;border:1px solid var(--color-border);color:var(--color-text-secondary)}.reset-btn:hover{border-color:var(--color-error);color:var(--color-error)}.cancel-btn{background:none;border:1px solid var(--color-border);color:var(--color-text-secondary)}.custom-instructions-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;padding:var(--spacing-4);animation:fadeIn .2s ease-out}.custom-instructions-panel{background:var(--color-bg);border-radius:var(--radius-lg);width:100%;max-width:600px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease-out}.ci-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4);border-bottom:1px solid var(--color-border)}.ci-header h2{font-size:var(--font-size-lg);font-weight:600;margin:0}.close-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-secondary);background:transparent;transition:all .2s ease}.close-btn:hover{background:var(--color-bg-secondary);color:var(--color-text)}.ci-tabs{display:flex;border-bottom:1px solid var(--color-border);padding:0 var(--spacing-4)}.ci-tab{padding:var(--spacing-3) var(--spacing-4);background:none;border:none;font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary);cursor:pointer;position:relative;transition:color .2s ease}.ci-tab:hover{color:var(--color-text)}.ci-tab.active{color:var(--color-primary)}.ci-tab.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--color-primary)}.ci-content{flex:1;overflow-y:auto;padding:var(--spacing-4)}.ci-section{display:flex;flex-direction:column;gap:var(--spacing-3)}.ci-description{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin:0}.ci-textarea{width:100%;min-height:250px;padding:var(--spacing-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);line-height:1.6;resize:vertical;background:var(--color-bg-secondary);color:var(--color-text);font-family:inherit}.ci-textarea:focus{outline:none;border-color:var(--color-primary)}.ci-footer{display:flex;justify-content:flex-end;gap:var(--spacing-2);padding:var(--spacing-4);border-top:1px solid var(--color-border)}.cancel-btn,.save-btn{padding:var(--spacing-2) var(--spacing-4);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;transition:all .2s ease}.cancel-btn{background:transparent;border:1px solid var(--color-border);color:var(--color-text-secondary)}.cancel-btn:hover{background:var(--color-bg-secondary)}.save-btn{background:var(--color-primary);border:none;color:#fff}.save-btn:hover:not(:disabled){background:var(--color-primary-hover)}.save-btn:disabled{opacity:.5;cursor:not-allowed}:root{--color-primary: #0f30e0;--color-primary-hover: #0a25b8;--color-bg: #ffffff;--color-bg-secondary: #f7f9fc;--color-bg-tertiary: #eef1f8;--color-border: #dfe3ef;--color-border-focus: #0f30e0;--color-text: #1a1a2e;--color-text-secondary: #6b7280;--color-text-placeholder: #9ca3af;--color-success: #10b981;--color-error: #ef4444;--color-warning: #f59e0b;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--spacing-1: .25rem;--spacing-2: .5rem;--spacing-3: .75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-8: 2rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1);--transition-fast: .15s ease;--transition-normal: .2s ease;--transition-slow: .3s ease;--z-dropdown: 100;--z-modal: 200;--z-toast: 300}[data-theme=dark]{--color-primary: #5b8af0;--color-primary-hover: #7aa3f5;--color-bg: #1a1a2e;--color-bg-secondary: #252540;--color-bg-tertiary: #2d2d4a;--color-border: #3d3d5c;--color-border-focus: #5b8af0;--color-text: #f3f4f6;--color-text-secondary: #9ca3af;--color-text-placeholder: #6b7280}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;background:none;outline:none}button:disabled{cursor:not-allowed;opacity:.5}input,textarea,select{font-family:inherit;font-size:inherit;outline:none;background:var(--color-bg-secondary);color:var(--color-text);border:1px solid var(--color-border)}textarea{resize:none}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}.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}.app{display:flex;flex-direction:column;min-height:100vh;height:100%;animation:fadeIn .4s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.app-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4) var(--spacing-6);background:var(--color-bg);border-bottom:1px solid var(--color-border);flex-shrink:0;animation:slideDown .4s ease-out}.app-title{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text)}.header-actions{display:flex;align-items:center;gap:var(--spacing-2)}.header-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);color:var(--color-text-secondary);transition:all .2s ease}.header-btn:hover{background:var(--color-bg-secondary);color:var(--color-text);transform:scale(1.05)}.header-btn:active{transform:scale(.95)}.app-main{flex:1;display:flex;padding:var(--spacing-4);overflow:hidden;animation:fadeIn .5s ease-out .1s both}.app-main.mobile{flex-direction:column}.app-main.desktop{flex-direction:row;align-items:stretch}.translation-container{flex:1;display:flex;gap:var(--spacing-4);max-width:100%;overflow:hidden}.mobile .translation-container{flex-direction:column}.desktop .translation-container{flex-direction:row}.translation-panel{flex:1;display:flex;flex-direction:column;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;min-width:0;min-height:0;position:relative}.translation-panel>.translation-area,.translation-panel>.markdown-result{flex:1;min-height:0;overflow-y:auto}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid var(--color-border);background:var(--color-bg-secondary)}.icon-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-secondary);transition:all var(--transition-fast)}.icon-btn:hover:not(:disabled){background:var(--color-bg-tertiary);color:var(--color-text)}.swap-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-full);background:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text-secondary);align-self:center;flex-shrink:0;transition:all var(--transition-fast)}.swap-btn:hover:not(:disabled){background:var(--color-primary);border-color:var(--color-primary);color:#fff}.translate-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);margin:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);font-weight:500;transition:background .2s ease,transform .15s ease,box-shadow .2s ease}.translate-btn:hover:not(:disabled){background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #0f30e04d}.translate-btn:active:not(:disabled){transform:translateY(0);box-shadow:none}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.tab-nav{display:flex;position:relative;background:var(--color-bg-secondary);border-bottom:1px solid var(--color-border);flex-shrink:0;animation:slideDown .4s ease-out .15s both}.tab-indicator{position:absolute;bottom:0;left:0;width:33.333%;height:2px;background:var(--color-primary);transition:transform .3s cubic-bezier(.4,0,.2,1)}.tab-btn{flex:1;padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary);background:transparent;border:none;cursor:pointer;transition:color .2s ease,background .2s ease;position:relative;z-index:1}.tab-btn:hover{color:var(--color-text);background:var(--color-bg-tertiary)}.tab-btn.active{color:var(--color-primary)}.api-key-warning{position:fixed;bottom:var(--spacing-4);left:50%;transform:translate(-50%);display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);background:var(--color-warning);color:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:var(--z-toast)}.api-key-warning button{padding:var(--spacing-2) var(--spacing-3);background:#fff3;color:#fff;border-radius:var(--radius-sm);font-weight:500}.markdown-result{flex:1;overflow-y:auto;background:var(--color-bg);animation:fadeIn .3s ease-out}.markdown-result .markdown-renderer{height:100%;overflow-y:auto}.placeholder-text{padding:var(--spacing-4);color:var(--color-text-placeholder);font-size:var(--font-size-sm);animation:fadeIn .3s ease-out}@media (max-width: 767px){.app-header{padding:var(--spacing-3) var(--spacing-4)}.app-title{font-size:var(--font-size-lg)}.app-main{padding:var(--spacing-3);overflow-y:auto}.swap-btn{margin:var(--spacing-2) 0;transform:rotate(90deg)}.desktop .translation-container{flex-direction:column}.translation-panel{min-height:200px}.translate-btn{flex-shrink:0;margin:var(--spacing-3)}.header-btn{width:36px;height:36px}}.fullscreen-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-secondary);transition:all var(--transition-fast)}.fullscreen-btn:hover:not(:disabled){background:var(--color-bg-tertiary);color:var(--color-text)}.fullscreen-result-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-bg);z-index:1000;display:flex;flex-direction:column;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fullscreen-result-header{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-4);padding:var(--spacing-3) var(--spacing-4);border-bottom:1px solid var(--color-border);background:var(--color-bg-secondary);flex-shrink:0}.fullscreen-result-header h3{font-size:var(--font-size-base);font-weight:600;margin:0;color:var(--color-text)}.fullscreen-result-close{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-secondary);background:transparent;transition:all .2s ease;flex-shrink:0}.fullscreen-result-close:hover{background:var(--color-bg-tertiary);color:var(--color-text);transform:scale(1.1)}.fullscreen-result-close:active{transform:scale(.95)}.fullscreen-result-content{flex:1;overflow-y:auto;padding:var(--spacing-4);animation:fadeIn .3s ease-out .1s both}.fullscreen-result-content .markdown-renderer{height:100%}.fullscreen-result-content .plain-text-result{white-space:pre-wrap;word-break:break-word;line-height:1.8;font-size:var(--font-size-base);margin:0}.stats-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:var(--color-text-secondary);transition:all .2s ease}.stats-btn:hover:not(:disabled){background:var(--color-bg-tertiary);color:var(--color-text);transform:scale(1.1)}.stats-btn:active:not(:disabled){transform:scale(.95)}.stats-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-4);animation:fadeIn .2s ease-out}.stats-modal{background:var(--color-bg);border-radius:var(--radius-lg);width:100%;animation:slideUp .3s ease-out;max-width:400px;overflow:hidden;box-shadow:0 20px 60px #0000004d}.stats-modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4);border-bottom:1px solid var(--color-border);background:var(--color-bg-secondary)}.stats-modal-header h3{font-size:var(--font-size-lg);font-weight:600;margin:0}.stats-modal-content{padding:var(--spacing-4);display:flex;flex-direction:column;gap:var(--spacing-3)}.stats-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3);background:var(--color-bg-secondary);border-radius:var(--radius-md)}.stats-label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.stats-value{font-size:var(--font-size-base);font-weight:600;color:var(--color-text)}.token-usage-badge{position:absolute;bottom:var(--spacing-3);right:var(--spacing-3);font-size:var(--font-size-xs);color:var(--color-text-secondary);background:var(--color-bg-secondary);padding:var(--spacing-1) var(--spacing-2);border-radius:var(--radius-sm)}