#ocr-tool-app,#ocr-tool-app *{box-sizing:border-box}#ocr-tool-app{margin:0 auto;transition:max-width .3s;background:#fff;color:#1a1a1a;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.05);padding:32px}#ocr-tool-app.ocr-tool-narrow{max-width:800px;width:100%}#ocr-tool-app.ocr-tool-wide{max-width:1200px;width:100%}@media (min-width:1600px){#ocr-tool-app.ocr-tool-narrow{max-width:50vw}}@media (max-width:768px){#ocr-tool-app.ocr-tool-narrow,#ocr-tool-app.ocr-tool-wide{width:95%;padding:16px;margin:80px auto 20px}}.ocr-tool-header{text-align:center;margin-bottom:32px}.ocr-tool-title{font-size:28px;font-weight:700;margin:0 0 8px;color:#111827}.ocr-tool-desc{font-size:15px;color:#6b7280;margin:0}.ocr-tool-view{display:none;animation:.4s forwards ocr-tool-fade-in}.ocr-tool-view.ocr-tool-active{display:block}@keyframes ocr-tool-fade-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.ocr-tool-dropzone{border:2px dashed #d1d5db;border-radius:12px;padding:64px 32px;text-align:center;cursor:pointer;background:#f9fafb;transition:.2s}.ocr-tool-dropzone.ocr-tool-dragover,.ocr-tool-dropzone:hover{border-color:#3b82f6;background:#eff6ff}.ocr-tool-dropzone-icon{width:48px;height:48px;margin:0 auto 16px;color:#9ca3af}.ocr-tool-card-add:hover svg,.ocr-tool-dropzone:hover .ocr-tool-dropzone-icon{color:#3b82f6}.ocr-tool-dropzone-text{font-size:16px;font-weight:500;color:#374151;margin-bottom:8px}.ocr-tool-dropzone-subtext{font-size:13px;color:#6b7280}.ocr-tool-file-input{display:none}.ocr-tool-workspace{display:flex;gap:24px;align-items:flex-start}.ocr-tool-main{flex:1;width:100%}.ocr-tool-sidebar{width:320px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:12px;padding:24px;flex-shrink:0}@media (max-width:900px){.ocr-tool-workspace{flex-direction:column}.ocr-tool-sidebar{width:100%}}.ocr-tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.ocr-tool-card{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden;position:relative;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.05)}.ocr-tool-card-preview{width:100%;aspect-ratio:1/1.4;background:#f3f4f6;display:flex;align-items:center;justify-content:center;overflow:hidden}.ocr-tool-card-preview canvas{max-width:100%;max-height:100%;display:block}.ocr-tool-card-info{padding:12px;font-size:13px;color:#374151;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-top:1px solid #e5e7eb}.ocr-tool-btn-remove{position:absolute;top:8px;right:8px;background:#ef4444;color:#fff;border:none;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:transform .1s}.ocr-tool-btn-remove:hover{transform:scale(1.1);background:#dc2626}.ocr-tool-btn-remove svg{width:14px;height:14px}.ocr-tool-card-add{border:2px dashed #d1d5db;background:0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;min-height:200px;transition:.2s}.ocr-tool-card-add:hover{border-color:#3b82f6;background:#eff6ff;color:#3b82f6}.ocr-tool-card-add svg{width:32px;height:32px;margin-bottom:8px;color:#9ca3af}.ocr-tool-control-group{margin-bottom:20px}.ocr-tool-label{display:block;font-size:14px;font-weight:600;color:#374151;margin-bottom:8px}.ocr-tool-select{width:100%;padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;color:#111827;background-color:#fff;outline:0;transition:border-color .2s}.ocr-tool-select:focus{border-color:#3b82f6}.ocr-tool-btn{width:100%;padding:12px 16px;border:none;border-radius:6px;font-size:15px;font-weight:600;cursor:pointer;transition:background-color .2s,transform .1s;display:flex;align-items:center;justify-content:center;gap:8px}.ocr-tool-processing-container,.ocr-tool-success-container{text-align:center;padding:40px 20px}.ocr-tool-btn:active{transform:scale(.98)}.ocr-tool-btn-primary{background-color:#2563eb;color:#fff}.ocr-tool-btn-primary:hover{background-color:#1d4ed8}.ocr-tool-btn-secondary{background-color:#f3f4f6;color:#374151;border:1px solid #d1d5db}.ocr-tool-btn-secondary:hover{background-color:#e5e7eb}.ocr-tool-processing-container{max-width:500px;margin:0 auto}.ocr-tool-progress-wrapper{background:#f3f4f6;border-radius:999px;height:12px;width:100%;overflow:hidden;margin:24px 0 12px}.ocr-tool-progress-bar{height:100%;background:#2563eb;width:0%;transition:width .3s}.ocr-tool-status-text{font-size:15px;font-weight:500;color:#111827}.ocr-tool-substatus-text{font-size:13px;color:#6b7280;margin-top:4px}.ocr-tool-success-icon{width:64px;height:64px;color:#10b981;margin:0 auto 24px}.ocr-tool-actions{display:flex;flex-direction:column;gap:12px;max-width:300px;margin:32px auto 0}.ocr-tool-alert{padding:12px 16px;border-radius:6px;margin-bottom:24px;font-size:14px;display:none;align-items:center;gap:8px}.ocr-tool-alert.ocr-tool-alert-error{background-color:#fef2f2;border:1px solid #f87171;color:#991b1b;display:flex}.ocr-tool-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.9);z-index:9999;display:none;flex-direction:column;align-items:center;justify-content:center}.ocr-tool-overlay.ocr-tool-active{display:flex}.ocr-tool-spinner{border:4px solid #f3f4f6;border-top:4px solid #3b82f6;border-radius:50%;width:40px;height:40px;animation:1s linear infinite ocr-tool-spin;margin-bottom:16px}@keyframes ocr-tool-spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}