:root{--primary-color:#3b82f6;--primary-hover:#2563eb;--bg-gradient:linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);--surface-color:#ffffffd9;--surface-border:#fff9;--text-main:#1e293b;--text-muted:#64748b;--danger-color:#ef4444;--danger-hover:#dc2626;--radius:12px;--shadow:0 4px 24px #0000000a;--backdrop-blur:blur(16px)}@media (prefers-color-scheme:dark){:root{--primary-color:#60a5fa;--primary-hover:#3b82f6;--bg-gradient:linear-gradient(135deg, #0f172a 0%, #1e1b4b 100%);--surface-color:#1e293bb3;--surface-border:#ffffff1a;--text-main:#f8fafc;--text-muted:#94a3b8;--shadow:0 8px 32px #0000004d}}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-main);background:var(--bg-gradient);min-height:100vh;margin:0;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;overflow:hidden}.app-layout{flex-direction:column;gap:1.5rem;max-width:1600px;height:100vh;margin:0 auto;padding:1.5rem;display:flex}.header{flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.header-title{align-items:center;gap:12px;display:flex}.header h1{background:-webkit-linear-gradient(45deg, var(--primary-color), #8b5cf6);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.5rem;font-weight:800}.header-version{color:var(--text-muted);background:#64748b1a;border-radius:12px;padding:2px 8px;font-size:.85rem}.main-container{flex:1;gap:1.5rem;min-height:0;display:flex}.left-panel{flex-direction:column;flex:6.5;gap:1rem;min-width:0;display:flex}.upload-strip{background:var(--surface-color);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);border:2px dashed var(--primary-color);border-radius:var(--radius);cursor:pointer;color:var(--primary-color);flex-direction:column;justify-content:center;align-items:center;gap:1rem;min-height:160px;padding:3rem 2rem;font-weight:500;transition:all .2s;display:flex}.upload-strip:hover,.upload-strip.dragging{background:#3b82f61a}.table-container{background:var(--surface-color);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);border:1px solid var(--surface-border);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;flex:1;display:flex;overflow:auto}.table-container::-webkit-scrollbar{width:8px;height:8px}.table-container::-webkit-scrollbar-track{background:0 0}.table-container::-webkit-scrollbar-thumb{background:#00000026;border-radius:4px}.table-container::-webkit-scrollbar-thumb:hover{background:#00000040}@media (prefers-color-scheme:dark){.table-container::-webkit-scrollbar-thumb{background:#ffffff26}.table-container::-webkit-scrollbar-thumb:hover{background:#ffffff40}}.data-table{border-collapse:collapse;white-space:nowrap;table-layout:fixed;width:100%;min-width:800px}.data-table th,.data-table td{text-align:left;border-bottom:1px solid var(--surface-border);text-overflow:ellipsis;padding:12px 16px;overflow:hidden}.data-table th{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:var(--text-muted);z-index:10;background:#ffffffd9;font-size:.85rem;font-weight:600;position:sticky;top:0}@media (prefers-color-scheme:dark){.data-table th{background:#1e293bd9}}.data-table th .resizer{cursor:col-resize;-webkit-user-select:none;user-select:none;background-color:var(--surface-border);opacity:0;border-radius:4px;width:3px;transition:all .2s;position:absolute;top:25%;bottom:25%;right:0}.data-table th:hover .resizer{opacity:1}.data-table th .resizer:hover,.data-table th .resizer.resizing{background-color:var(--primary-color);opacity:1;width:4px}.data-table th:first-child,.data-table td:first-child,.data-table th:last-child,.data-table td:last-child{text-align:center;padding:0 16px;overflow:visible}.data-table td{white-space:nowrap;font-size:.9rem}.data-table tr{cursor:grab;transition:background .1s}.data-table tr:active{cursor:grabbing}.data-table tr:hover{background:#3b82f60d}.data-table tr.selected{background:#3b82f61a}.toolbar{background:var(--surface-color);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);border:1px solid var(--surface-border);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:.5rem;padding:.75rem 1rem;display:flex}.btn{cursor:pointer;color:var(--text-main);background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;font-size:.85rem;font-weight:500;transition:all .2s;display:inline-flex}.btn:hover{background:#0000000d}@media (prefers-color-scheme:dark){.btn:hover{background:#ffffff1a}}.btn-outline{border-color:var(--surface-border);background:#ffffff4d}.btn-primary{background:var(--primary-color);color:#fff}.btn-primary:hover{background:var(--primary-hover);color:#fff}.btn-danger{color:var(--danger-color)}.btn-danger:hover{background:#ef44441a}.divider{background:var(--surface-border);width:1px;height:24px;margin:0 4px}.right-panel{flex-direction:column;flex:3.5;gap:1rem;min-width:350px;display:flex}.settings-card{background:var(--surface-color);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);border:1px solid var(--surface-border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.25rem}.preview-card{background:var(--surface-color);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);border:1px solid var(--surface-border);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;flex:1;display:flex;overflow:hidden}.preview-header{border-bottom:1px solid var(--surface-border);justify-content:space-between;align-items:center;padding:12px 16px;font-size:.9rem;font-weight:600;display:flex}.preview-content{background:#0000000d;flex:1;position:relative}@media (prefers-color-scheme:dark){.preview-content{background:#0000004d}}.preview-iframe{border:none;width:100%;height:100%}.preview-empty{color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}.form-group{margin-bottom:1rem}.form-group:last-child{margin-bottom:0}.form-group>label{color:var(--text-muted);margin-bottom:6px;font-size:.85rem;display:block}.form-row{gap:12px;display:flex}.form-row>div{flex:1}select,input[type=text]{width:100%;height:38px;color:var(--text-main);cursor:pointer;background-color:#fffc;border:1px solid #0000001a;border-radius:8px;outline:none;padding:0 32px 0 12px;font-family:inherit;font-size:.95rem;transition:all .2s;box-shadow:0 2px 6px #00000008}select{appearance:none;background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%2364748b%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E);background-position:right 12px center;background-repeat:no-repeat;background-size:10px}select:hover,input[type=text]:hover{border-color:#0003}select:focus,input[type=text]:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #3b82f626}@media (prefers-color-scheme:dark){select,input[type=text]{background-color:#0006;border-color:#ffffff1a}}.checkbox-label{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;height:38px;color:var(--text-main)!important;margin-bottom:0!important;font-size:.95rem!important;display:flex!important}.checkbox-label input{appearance:none;font:inherit;color:currentColor;border:2px solid var(--text-muted);background-color:#fff;border-radius:4px;place-content:center;width:1.25em;height:1.25em;margin:0;transition:all .2s ease-in-out;display:grid}.checkbox-label input:before{content:"";transform-origin:50%;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);width:.7em;height:.7em;transition:transform .12s ease-in-out;transform:scale(0);box-shadow:inset 1em 1em #fff}.checkbox-label input:checked{background-color:var(--primary-color);border-color:var(--primary-color)}.checkbox-label input:checked:before{transform:scale(1)}@media (prefers-color-scheme:dark){.checkbox-label input{background-color:#0000}}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-gradient);border:1px solid var(--surface-border);border-radius:16px;width:400px;max-width:90vw;padding:24px;box-shadow:0 20px 40px #0003}.modal-title{margin-bottom:16px;font-size:1.25rem;font-weight:600}.modal-actions{justify-content:flex-end;gap:12px;margin-top:24px;display:flex}