*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #f2f2f2;--surface: #fff;--surface-hover: #fafafa;--border: #ccc;--text: #333;--text-dim: #777;--accent: #333;--accent-hover: #555;--success: #5a9e68;--success-dim: rgba(90, 158, 104, .08)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;font-size:13px}#app{max-width:1100px;margin:0 auto;padding:2rem 1.5rem 4rem}header{margin-bottom:2rem}header h1{font-size:1.1rem;font-weight:600;color:var(--text)}.subtitle{color:var(--text-dim);margin-top:.25rem;font-size:12px;line-height:1.5}.subtitle a{color:var(--text)}.subtitle a:hover{text-decoration:none}main.loading{opacity:.35;pointer-events:none}.drop-zone{border:1px dashed var(--border);padding:2.5rem 1.5rem;text-align:center;cursor:pointer;background:var(--surface)}.drop-zone:hover{border-color:#aaa}.drop-zone.drag-over{border-color:var(--text);background:#e8e8e8}.drop-zone-label{margin-bottom:.4rem;font-weight:500}.drop-zone-sublabel{color:var(--text-dim);margin-bottom:.5rem;font-size:12px}.drop-zone-examples{margin-top:.75rem;font-size:12px}.drop-zone-examples a{color:var(--text-dim)}.drop-zone-examples a:hover{color:var(--text)}.btn{background:var(--surface);color:var(--text);border:1px solid var(--border);padding:.35rem .9rem;cursor:pointer;font-family:inherit;font-size:12px}.btn:hover{background:var(--surface-hover);border-color:#aaa}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-sm{padding:.25rem .6rem;font-size:11px}.settings-panel{margin-top:1rem;background:var(--surface);padding:1rem 1.25rem;border:1px solid var(--border)}.settings-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.settings-header-actions{display:flex;gap:.4rem}.settings-panel h2{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim)}.settings-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(4,auto);grid-auto-flow:column;gap:.5rem 2rem}.settings-grid label{display:flex;align-items:center;gap:.4rem;font-size:12px}.settings-grid label span:not(.info-icon){min-width:140px;color:var(--text)}.settings-grid input[type=range]{flex:1;accent-color:var(--accent)}.settings-grid input[type=number]{width:50px;background:var(--bg);color:var(--text);border:1px solid var(--border);padding:.15rem .3rem;font-family:inherit;font-size:12px}.settings-grid input[type=checkbox]{accent-color:var(--accent)}.settings-grid select{background:var(--bg);color:var(--text);border:1px solid var(--border);padding:.15rem .3rem;font-family:inherit;font-size:12px;cursor:pointer}.info-icon{display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;border-radius:50%;border:1px solid var(--border);font-size:9px;font-style:italic;font-weight:600;color:var(--text-dim);cursor:help;position:relative;vertical-align:middle;margin-left:.2rem;flex-shrink:0;line-height:1}.info-icon:hover{border-color:var(--text);color:var(--text)}.info-icon:hover:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 5px);left:50%;transform:translate(-50%);background:#333;color:#eee;padding:.4rem .5rem;font-size:11px;font-style:normal;font-weight:400;line-height:1.4;white-space:normal;width:210px;z-index:50;pointer-events:none}.clip-control.dimmed{opacity:.3;pointer-events:none}.image-list{margin-top:1.5rem}.image-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.image-list-header h2{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim)}#image-count{color:var(--text-dim)}.image-list-actions{display:flex;gap:.4rem}.image-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));align-items:flex-start;gap:.75rem;transition:opacity .2s}.image-items.stale{opacity:.35;pointer-events:none}.image-card{background:var(--surface);border:1px solid var(--border);overflow:hidden}.image-card:hover{border-color:#aaa}.image-card.done{border-color:var(--border)}.image-card .card-preview{position:relative;width:100%;min-height:150px;background:#e0e0e0;overflow:hidden;display:flex;align-items:center;justify-content:center}.image-card .card-preview canvas{max-width:100%;max-height:320px;display:block}.image-card.done .card-preview{cursor:zoom-in}.image-card .card-preview .preview-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:#bbb;font-size:11px}.image-card .card-badge{position:absolute;top:.4rem;right:.4rem;padding:.15rem .4rem;font-size:10px;font-weight:600}.image-card .card-badge.pending{background:#ffffffd9;color:var(--text-dim)}.image-card .card-badge.analyzing,.image-card .card-badge.processing{background:#ffffffd9;color:var(--text)}.image-card .card-badge.done{background:var(--success-dim);color:var(--success)}.image-card .card-badge.error{background:#c8505026;color:#b44}.image-card .card-badge.analyzing:before,.image-card .card-badge.processing:before{content:"";display:inline-block;width:7px;height:7px;border:1.5px solid currentColor;border-top-color:transparent;border-radius:50%;margin-right:.3rem;vertical-align:middle;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.image-card .card-footer{padding:.5rem .65rem;display:flex;align-items:center;justify-content:space-between;gap:.4rem;min-height:2.25rem}.image-card .card-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text);flex:1;min-width:0}.image-card .card-actions{flex-shrink:0}.status-bar[hidden]{display:none!important}.status-bar{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--border);padding:.5rem 1.25rem;display:flex;align-items:center;gap:.75rem;z-index:100}.status-bar progress{flex:1;height:3px;accent-color:var(--accent)}#status-text{font-size:12px;white-space:nowrap;color:var(--text-dim)}.lightbox[hidden]{display:none!important}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;align-items:center;justify-content:center}.lightbox-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000d9;cursor:pointer}.lightbox-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:.5rem}.lightbox-content canvas{max-width:90vw;max-height:85vh;object-fit:contain;cursor:zoom-out}.lightbox-filename{font-size:12px;color:#aaa}.process-stats{margin-top:3rem;font-size:12px;color:var(--text-dim)}.site-footer{text-align:center;padding:2rem 0 1rem;font-size:12px;color:var(--text-dim)}.site-footer a{color:var(--text-dim)}.site-footer a:hover{color:var(--text)}@media(max-width:640px){#app{padding:1.25rem .75rem 4rem}.settings-grid{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row}.image-items{grid-template-columns:1fr}}