:root{--color-primary: #007BFF;--color-primary-hover: #0056b3;--color-secondary: #6C757D;--color-danger: #DC3545;--color-success: #28A745;--color-warning: #FFC107;--color-bg: #FFFFFF;--color-bg-secondary: #F8F9FA;--color-text: #212529;--color-text-secondary: #6C757D;--color-border: #DEE2E6;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 18px;--font-size-xl: 24px;--border-radius: 8px;--border-radius-sm: 4px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1);--z-navbar: 100;--z-fab: 90;--z-modal: 1000}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:1.5;color:var(--color-text);background-color:var(--color-bg);overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2;margin-bottom:var(--spacing-md)}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}p{margin-bottom:var(--spacing-sm)}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;background:none}input,select,textarea{font-family:inherit;font-size:inherit}img{max-width:100%;height:auto;display:block}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--border-radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--color-secondary)}#app{min-height:100vh;display:flex;flex-direction:column;padding-bottom:80px}.navbar{position:sticky;top:0;z-index:var(--z-navbar);display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md);background:var(--color-bg);border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-sm)}.navbar-brand{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-lg);font-weight:600;color:var(--color-text)}.navbar-brand svg{color:var(--color-primary)}.search-bar{padding:var(--spacing-md);background:var(--color-bg-secondary);border-bottom:1px solid var(--color-border)}.search-input-wrapper{position:relative;margin-bottom:var(--spacing-md)}.search-icon{position:absolute;left:var(--spacing-md);top:50%;transform:translateY(-50%);color:var(--color-text-secondary);pointer-events:none}.search-input{width:100%;padding:var(--spacing-md);padding-left:calc(var(--spacing-md) * 3);border:1px solid var(--color-border);border-radius:var(--border-radius);background:var(--color-bg);font-size:var(--font-size-base)}.search-input:focus{outline:none;border-color:var(--color-primary)}.filters{display:flex;gap:var(--spacing-sm);overflow-x:auto;-webkit-overflow-scrolling:touch;align-items:center}.view-toggle{display:flex;gap:0;border:1px solid var(--color-border);border-radius:var(--border-radius);overflow:hidden;flex-shrink:0}.view-toggle .btn-icon{border-radius:0;border:none;border-right:1px solid var(--color-border)}.view-toggle .btn-icon:last-child{border-right:none}.view-toggle .btn-icon.active{background:var(--color-primary);color:#fff}.filter-select{flex-shrink:0;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--border-radius);background:var(--color-bg);font-size:var(--font-size-sm)}.filter-select:focus{outline:none;border-color:var(--color-primary)}#book-list{flex:1;padding:var(--spacing-md)}.book-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-md)}.book-list-view{overflow-x:auto}.book-table{width:100%;border-collapse:collapse;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--border-radius)}.book-table thead{background:var(--color-bg-secondary);border-bottom:2px solid var(--color-border)}.book-table th{padding:var(--spacing-md);text-align:left;font-weight:600;color:var(--color-text);white-space:nowrap}.book-table td{padding:var(--spacing-md);border-top:1px solid var(--color-border);vertical-align:middle}.book-table .col-checkbox{width:40px;text-align:center}.book-table .col-cover{width:60px}.book-table .col-cover img{width:50px;height:70px;object-fit:cover;border-radius:var(--border-radius-sm)}.book-table .col-cover .no-cover{width:50px;height:70px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-secondary);border-radius:var(--border-radius-sm);font-size:24px}.book-table .col-title{min-width:200px;max-width:400px}.book-table .title-cell strong{display:block;margin-bottom:var(--spacing-xs);color:var(--color-text)}.book-table .notes-preview{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:1.4}.book-table .col-author{min-width:150px}.book-table .col-isbn{min-width:120px}.book-table .col-isbn code{font-family:monospace;font-size:var(--font-size-sm);background:var(--color-bg-secondary);padding:var(--spacing-xs);border-radius:var(--border-radius-sm)}.book-table .col-status{min-width:120px}.book-table .col-categories{min-width:150px}.book-table .col-categories .badge{margin-right:var(--spacing-xs);margin-bottom:var(--spacing-xs);display:inline-block}.book-table .col-actions{min-width:150px;white-space:nowrap}.book-table .col-actions .btn-small{margin-right:var(--spacing-xs)}.book-row:hover{background:var(--color-bg-secondary)}@media(min-width:768px){.book-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.book-grid{grid-template-columns:repeat(3,1fr)}}.empty-state{text-align:center;padding:var(--spacing-xl);color:var(--color-text-secondary)}.empty-state svg{margin:0 auto var(--spacing-lg);opacity:.5}.fab{position:fixed;bottom:var(--spacing-lg);right:var(--spacing-lg);z-index:var(--z-fab);width:56px;height:56px;border-radius:50%;background:var(--color-primary);color:#fff;box-shadow:var(--shadow-lg);display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s}.fab:hover{transform:scale(1.1);box-shadow:0 12px 20px #00000026}.fab:active{transform:scale(.95)}@media(min-width:768px){.search-bar{display:flex;gap:var(--spacing-md);align-items:flex-start}.search-input-wrapper{flex:1;margin-bottom:0}.filters{flex-shrink:0}}.btn-primary,.btn-secondary,.btn-danger,.btn-small,.btn-icon,.btn-full{padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius);font-weight:500;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-xs)}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover)}.btn-secondary{background:var(--color-secondary);color:#fff}.btn-secondary:hover{background:#5a6268}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover{background:#c82333}.btn-small{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm);background:var(--color-bg-secondary);border:1px solid var(--color-border)}.btn-small:hover{background:var(--color-border)}.btn-primary.btn-small{background:var(--color-primary);color:#fff;border:none}.btn-primary.btn-small:hover{background:var(--color-primary-hover)}.btn-secondary.btn-small{background:var(--color-secondary);color:#fff;border:none}.btn-secondary.btn-small:hover{background:#5a6268}.btn-icon{padding:var(--spacing-sm);color:var(--color-text)}.btn-icon:hover{background:var(--color-bg-secondary);border-radius:var(--border-radius)}.btn-full{width:100%;padding:var(--spacing-md);background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);text-align:left;margin-bottom:var(--spacing-sm)}.btn-full:hover{background:var(--color-bg-secondary)}.btn-full.btn-danger{background:var(--color-danger);color:#fff}.btn-full.btn-danger:hover{background:#c82333}.btn-close{font-size:2rem;line-height:1;color:var(--color-text-secondary);padding:0;width:32px;height:32px}.btn-close:hover{color:var(--color-text)}.input-full,.textarea-full{width:100%;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--border-radius);font-size:var(--font-size-base);background:var(--color-bg)}.input-full:focus,.textarea-full:focus{outline:none;border-color:var(--color-primary)}.textarea-full{resize:vertical;min-height:100px}.form-group{margin-bottom:var(--spacing-lg)}.form-group label{display:block;margin-bottom:var(--spacing-sm);font-weight:500;color:var(--color-text)}.form-group label small{font-weight:400;color:var(--color-text-secondary)}.form-section{border:1px solid var(--color-border);border-radius:var(--border-radius);margin-bottom:var(--spacing-lg);overflow:hidden}.form-section summary{padding:var(--spacing-md);background:var(--color-bg-secondary);cursor:pointer;font-weight:500;list-style:none;-webkit-user-select:none;user-select:none}.form-section summary::-webkit-details-marker{display:none}.form-section summary:before{content:"▶";display:inline-block;margin-right:var(--spacing-sm);transition:transform .2s}.form-section[open] summary:before{transform:rotate(90deg)}.form-section summary:hover{background:var(--color-border)}.form-section-content{padding:var(--spacing-md)}.scanner-actions{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.scanner-actions button{flex:1;min-width:150px}.ocr-upload-area{border:2px dashed var(--color-border);border-radius:var(--border-radius);padding:var(--spacing-xl);text-align:center;cursor:pointer;transition:all .2s}.ocr-upload-area:hover,.ocr-upload-area.drag-over{border-color:var(--color-primary);background:var(--color-bg-secondary)}.ocr-upload-area .upload-icon{font-size:48px;margin-bottom:var(--spacing-md)}.ocr-upload-area .upload-hint{color:var(--color-text-secondary);font-size:var(--font-size-sm)}.ocr-preview{margin:var(--spacing-lg) 0;text-align:center}.ocr-preview img{max-width:100%;max-height:400px;border-radius:var(--border-radius);border:1px solid var(--color-border)}.ocr-progress{margin:var(--spacing-lg) 0;text-align:center}.progress-label{margin-bottom:var(--spacing-md);font-weight:500}.progress-bar{height:24px;background:var(--color-bg-secondary);border-radius:var(--border-radius);overflow:hidden;margin-bottom:var(--spacing-sm)}.progress-fill{height:100%;background:var(--color-primary);transition:width .3s;width:0%}.progress-percent{color:var(--color-text-secondary);font-size:var(--font-size-sm)}.ocr-result{margin:var(--spacing-lg) 0}.checkbox-group{display:flex;flex-wrap:wrap;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.checkbox-label{display:flex;align-items:center;gap:var(--spacing-xs);cursor:pointer}.checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.book-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--border-radius);overflow:hidden;transition:box-shadow .2s;position:relative}.book-card:hover{box-shadow:var(--shadow-md)}.book-checkbox{position:absolute;top:var(--spacing-sm);left:var(--spacing-sm);z-index:10;background:var(--color-bg);padding:var(--spacing-xs);border-radius:var(--border-radius-sm);box-shadow:var(--shadow-sm)}.book-checkbox input[type=checkbox]{width:20px;height:20px;cursor:pointer}.book-cover{width:100%;height:200px;background:var(--color-bg-secondary);display:flex;align-items:center;justify-content:center;overflow:hidden}.book-cover img{width:100%;height:100%;object-fit:cover}.book-info{padding:var(--spacing-md)}.book-title{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--spacing-xs);color:var(--color-text)}.book-author{color:var(--color-text-secondary);margin-bottom:var(--spacing-sm)}.book-meta{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.book-isbn{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-family:monospace;margin-bottom:var(--spacing-md)}.book-badges{display:flex;flex-wrap:wrap;gap:var(--spacing-xs);margin-bottom:var(--spacing-sm)}.badge{padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-sm);font-size:var(--font-size-sm);font-weight:500}.badge-category{background:var(--color-bg-secondary);color:var(--color-text-secondary);border:1px solid var(--color-border)}.book-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-xs);margin-bottom:var(--spacing-sm)}.tag{font-size:var(--font-size-sm);color:var(--color-primary)}.book-notes{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-md);line-height:1.4}.book-actions{display:flex;gap:var(--spacing-sm)}.btn-edit{flex:1;background:var(--color-primary);color:#fff;border:none}.btn-edit:hover{background:var(--color-primary-hover)}.btn-delete{background:var(--color-danger);color:#fff;border:none}.btn-delete:hover{background:#c82333}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:var(--z-modal);align-items:center;justify-content:center;padding:var(--spacing-md);overflow-y:auto}.modal.active{display:flex}.modal-content{background:var(--color-bg);border-radius:var(--border-radius);width:100%;max-width:600px;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-lg)}.modal-large{max-width:800px}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.modal-header h2{margin:0}.modal-body{padding:var(--spacing-lg)}.modal-actions{display:flex;gap:var(--spacing-sm);justify-content:flex-end;margin-top:var(--spacing-lg)}.info-box{padding:var(--spacing-md);background:#e7f3ff;border:1px solid #b3d9ff;border-radius:var(--border-radius);margin-bottom:var(--spacing-lg);color:#004085}.warning-box{background:#fff3cd;border-color:#ffc107;color:#856404}.warning-box button{margin-top:var(--spacing-sm)}.help-text,.hint-text{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-md)}.help-text a,.hint-text a{color:var(--color-primary);text-decoration:none}.help-text a:hover,.hint-text a:hover{text-decoration:underline}.api-key-section{margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-border)}.api-key-section:last-of-type{border-bottom:none}.api-key-section h3{margin-top:0;margin-bottom:var(--spacing-sm);font-size:var(--font-size-md)}.help-box{background:var(--color-bg-secondary);padding:var(--spacing-md);border-radius:var(--border-radius);margin-top:var(--spacing-md);margin-bottom:var(--spacing-md)}.help-box strong{display:block;margin-bottom:var(--spacing-xs)}.help-box ul{margin:var(--spacing-xs) 0 0 0;padding-left:var(--spacing-lg)}.help-box li{margin-bottom:var(--spacing-xs);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.data-sources{margin-top:var(--spacing-sm);display:flex;flex-wrap:wrap;gap:var(--spacing-xs);align-items:center}.data-sources small{color:var(--color-text-secondary);margin-right:var(--spacing-xs)}.btn-source{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--border-radius-sm)}.btn-source:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.external-links{margin-top:var(--spacing-lg);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border)}.external-links h3{font-size:var(--font-size-base);margin-bottom:var(--spacing-md)}.external-links-list{display:flex;flex-wrap:wrap;gap:var(--spacing-sm)}.external-links-list a{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--border-radius);font-size:var(--font-size-sm);transition:all .2s}.external-links-list a:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary);text-decoration:none}.smart-paste-section{margin-bottom:var(--spacing-lg);padding:var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--border-radius)}.smart-paste-section h3{font-size:var(--font-size-base);margin-bottom:var(--spacing-md)}.smart-paste-section .button-group{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-top:var(--spacing-sm)}.smart-paste-section .button-group button{flex:1;min-width:150px}.divider{text-align:center;margin:var(--spacing-lg) 0;color:var(--color-text-secondary);position:relative}.divider:before,.divider:after{content:"";position:absolute;top:50%;width:45%;height:1px;background:var(--color-border)}.divider:before{left:0}.divider:after{right:0}.upload-section{text-align:center;padding:var(--spacing-lg)}.btn-large{padding:var(--spacing-md) var(--spacing-xl);font-size:var(--font-size-lg)}.book-preview-item{display:flex;justify-content:space-between;align-items:flex-start;padding:var(--spacing-md);margin-bottom:var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--border-radius);border:2px solid var(--color-border)}.book-preview-content h4{margin:0 0 var(--spacing-sm) 0;color:var(--color-primary)}.book-preview-content p{margin:var(--spacing-xs) 0;font-size:var(--font-size-sm)}.book-preview-actions{flex-shrink:0;margin-left:var(--spacing-md)}.loading-spinner{border:3px solid var(--color-border);border-top:3px solid var(--color-primary);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto var(--spacing-md)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#parsing-status{text-align:center;padding:var(--spacing-lg)}#parsing-status p{color:var(--color-text-secondary);margin-top:var(--spacing-sm)}.manual-llm-modal{max-width:700px}.manual-llm-steps{margin:var(--spacing-lg) 0}.step-item{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-xl);align-items:flex-start}.step-number{flex-shrink:0;width:32px;height:32px;background:var(--color-primary);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px}.step-content{flex:1}.step-content h4{margin:0 0 var(--spacing-sm) 0;color:var(--color-text)}.step-content p{margin:var(--spacing-xs) 0;color:var(--color-text-secondary)}.prompt-box{position:relative;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--border-radius);padding:var(--spacing-md);margin-top:var(--spacing-sm)}.prompt-box pre{margin:0 0 var(--spacing-sm) 0;white-space:pre-wrap;word-wrap:break-word;font-size:var(--font-size-sm);color:var(--color-text);max-height:200px;overflow-y:auto}.prompt-box button{margin-top:var(--spacing-sm)}.image-preview-small{margin-top:var(--spacing-sm);padding:var(--spacing-sm);background:var(--color-bg-secondary);border-radius:var(--border-radius);display:inline-block}.camera-selector{margin-bottom:var(--spacing-md);padding:var(--spacing-sm);background:var(--color-bg-secondary);border-radius:var(--border-radius)}.camera-selector label{display:block;margin-bottom:var(--spacing-xs);font-size:var(--font-size-sm);font-weight:500}.camera-selector select{width:100%}.scanner-tips{margin-top:var(--spacing-lg);text-align:center}.scanner-tips p{color:var(--color-text-secondary);margin-bottom:var(--spacing-sm)}.scanner-tips input{margin:var(--spacing-md) 0}.menu-section{margin-bottom:var(--spacing-xl)}.menu-section h3{font-size:var(--font-size-base);margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:1px solid var(--color-border)}.selector-results{max-height:60vh;overflow-y:auto}.selector-item{display:flex;gap:var(--spacing-md);padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--border-radius);margin-bottom:var(--spacing-md);transition:box-shadow .2s}.selector-item:hover{box-shadow:var(--shadow-md)}.selector-item-cover{flex-shrink:0;width:80px;height:120px}.selector-item-cover img{width:100%;height:100%;object-fit:cover;border-radius:var(--border-radius)}.selector-item-cover .no-cover{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--color-bg-secondary);border-radius:var(--border-radius);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.selector-item-info{flex-grow:1}.selector-item-info h3{margin:0 0 var(--spacing-sm) 0;font-size:var(--font-size-lg)}.selector-item-info p{margin:0 0 var(--spacing-xs) 0;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.selector-item-info .author{font-weight:500;color:var(--color-text)}.selector-item-info .source{font-style:italic;color:var(--color-primary)}.selector-item-action{flex-shrink:0;display:flex;align-items:center}.loading-message,.empty-message{text-align:center;padding:var(--spacing-xl);color:var(--color-text-secondary)}@media(max-width:767px){.modal-content{max-height:95vh}.filters{padding-bottom:var(--spacing-sm)}}