*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;max-width:960px;margin:0 auto;padding:2rem 1rem;color:#333;line-height:1.5}h1{margin-bottom:1.5rem}h2{margin:1.5rem 0 .75rem}section{margin-bottom:2rem}button{padding:.5rem 1rem;cursor:pointer;border:1px solid #ccc;background:#fff;border-radius:4px}button:hover{background:#f5f5f5}button:disabled{opacity:.5;cursor:not-allowed}#drop-zone{border:2px dashed #ccc;padding:2rem;text-align:center;cursor:pointer}#drop-zone.dragover{border-color:#666;background:#f9f9f9}#preview-list{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1rem}.preview-item{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem;border:1px solid #eee;border-radius:4px;background:#fafafa}.preview-item img{border-radius:4px;object-fit:cover}.preview-filename{font-size:.75rem;color:#555;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-delete-btn{background:#e74c3c;color:#fff;border:none;border-radius:4px;padding:.15rem .5rem;cursor:pointer;font-size:.75rem}.preview-delete-btn:hover{background:#c0392b}#clear-all-btn{margin-top:.75rem;background:#e74c3c;color:#fff;border:none;padding:.5rem 1.25rem;border-radius:4px;font-size:.9rem}#clear-all-btn:hover{background:#c0392b}table{border-collapse:collapse;width:100%;margin:.5rem 0}th,td{border:1px solid #ddd;padding:.5rem;text-align:center}th{background:#f5f5f5}#progress-bar-container{background:#eee;border-radius:4px;height:24px;margin:.5rem 0;position:relative}#progress-bar{background:#4caf50;height:100%;border-radius:4px;width:0%;transition:width .3s}#progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.85rem}#json-section{margin-top:1rem}#json-actions{display:flex;gap:.5rem;margin:.5rem 0}#json-actions button{padding:.4rem 1rem;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer;font-size:.85rem}#json-actions button:hover{background:#f0f0f0}#json-output{background:#f8f9fa;border:1px solid #ddd;border-radius:4px;padding:1rem;overflow-x:auto;font-size:.8rem;line-height:1.4;max-height:400px;overflow-y:auto}.viz-section{margin-bottom:1.5rem}.viz-section h3{margin-bottom:.5rem}.viz-legend{font-size:.85rem;color:#555;margin-bottom:.5rem}.dot{display:inline-block;width:10px;height:10px;border-radius:50%;vertical-align:middle;margin-right:2px}.dot-green{background:#00c800b3}.dot-red{background:#ff0000b3}.dot-rect{display:inline-block;width:12px;height:10px;border:2px solid rgba(0,100,255,.8);vertical-align:middle;margin-right:2px}.viz-grid{display:flex;flex-wrap:wrap;gap:1rem}.viz-card{display:flex;flex-direction:column;align-items:center;gap:.25rem}.viz-card-title{font-size:.8rem;font-weight:600;color:#333;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viz-canvas{width:300px;height:auto;border:1px solid #ddd;border-radius:4px}.viz-pair{margin-bottom:1rem}.viz-pair-title{font-size:.85rem;font-weight:600;margin-bottom:.25rem}.viz-pair-canvases{display:flex;flex-wrap:wrap;gap:1rem}