:root{--gap:8px;--panel-bg:#f5f5f5;--border:#ddd }html,body,#root{height:100%;margin:0;font-family:Arial,Helvetica,sans-serif}.app{display:flex;flex-direction:column;height:100%}.topbar{padding:8px;background:var(--panel-bg);border-bottom:1px solid var(--border)}.main{display:flex;flex:1;gap:var(--gap);padding:8px}.left{width:300px;background:#fff;border:1px solid var(--border);padding:8px;overflow:auto}.center{flex:1;border:1px solid var(--border);padding:8px;display:flex;flex-direction:column}.bottom{height:150px;border-top:1px solid var(--border);padding:8px;overflow:auto;background:#fff}.button{padding:6px 10px;border:1px solid var(--border);background:#eee;cursor:pointer}.input-row{display:flex;flex-direction:column;margin-bottom:8px}.label{font-size:12px;color:#333;margin-bottom:4px}.progress{height:16px;background:#eee;border-radius:4px;overflow:hidden}.progress>i{display:block;height:100%;background:#3b82f6}.preview{flex:1;display:flex;align-items:center;justify-content:center;background:#fafafa;border:1px dashed #ddd}.preview img.fixed-preview{width:5cm;height:5cm;object-fit:contain}.log{font-family:monospace;font-size:12px;white-space:pre-wrap}.small{font-size:12px}select,input[type=number]{padding:6px;border:1px solid var(--border)}.table-small{font-size:12px}.processed-table-wrap{max-height:220px;overflow:auto;border:1px solid #eee;background:#fff}.processed-table{border-collapse:collapse;width:100%}.processed-table thead{position:sticky;top:0;background:#fafafa;z-index:1}.processed-table th,.processed-table td{padding:4px 6px;border-bottom:1px solid #eee}.processed-table th{font-weight:600}.processed-table tbody tr:hover{background:#fafafa}