.app{min-height:100vh;padding:2rem 1rem}.container{max-width:900px;margin:0 auto}h1{color:#fff;font-size:2.5rem;margin-bottom:.5rem;text-align:center}.subtitle{color:#ffffffe6;text-align:center;margin-bottom:2rem;font-size:1.1rem}.controls{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 10px 30px #0003;margin-bottom:2rem}.input-group{margin-bottom:1.5rem}.input-group:last-child{margin-bottom:0}.input-group label{display:block;font-weight:600;margin-bottom:.5rem;color:#333;font-size:.95rem}.input-group input{width:100%;padding:.75rem;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color .3s ease}.input-group input:focus{outline:none;border-color:#667eea}.input-group small{display:block;margin-top:.5rem;color:#666;font-size:.85rem;line-height:1.4}.drop-zone{background:#fff;border:3px dashed #d0d0d0;border-radius:12px;padding:3rem 2rem;text-align:center;transition:all .3s ease;cursor:pointer;box-shadow:0 10px 30px #0003}.drop-zone:hover{border-color:#667eea;background:#667eea0d}.drop-zone.dragging{border-color:#667eea;background:#667eea1a;transform:scale(1.02)}.drop-zone-content{pointer-events:none}.upload-icon{width:64px;height:64px;margin:0 auto 1rem;color:#667eea}.drop-text{font-size:1.2rem;color:#333;margin-bottom:.5rem;font-weight:500}.drop-or{color:#999;margin:1rem 0}.file-input-label{display:inline-block;padding:.75rem 2rem;background:#667eea;color:#fff;border-radius:8px;font-weight:600;cursor:pointer;transition:background .3s ease;pointer-events:auto}.file-input-label:hover{background:#5568d3}.output-section{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 10px 30px #0003;margin-top:2rem}.output-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.output-header h2{color:#333;font-size:1.5rem;margin:0 0 .25rem}.row-count{color:#666;font-size:.9rem;margin:0}.output-actions{display:flex;gap:.75rem}.copy-confirmation{background:#4caf50;color:#fff;padding:.75rem 1rem;border-radius:6px;margin-bottom:1rem;font-weight:500;animation:fadeInOut 3s ease-in-out;display:flex;align-items:center;gap:.5rem}@keyframes fadeInOut{0%{opacity:0;transform:translateY(-10px)}10%{opacity:1;transform:translateY(0)}90%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}.btn{padding:.625rem 1.25rem;border:none;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-primary{background:#667eea;color:#fff}.btn-primary:hover{background:#5568d3;transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.btn-secondary{background:#e0e0e0;color:#333}.btn-secondary:hover{background:#d0d0d0}.file-name{color:#666;font-size:.9rem;margin-bottom:1rem;font-style:italic}.column-controls{margin-bottom:1.5rem;padding:1.5rem;background:#f8f8f8;border-radius:8px;border:1px solid #e0e0e0}.column-controls h3{margin:0 0 1rem;font-size:1.1rem;color:#333}.column-list{display:flex;flex-wrap:wrap;gap:.75rem}.column-item{display:flex;align-items:center;gap:.5rem;background:#fff;padding:.5rem .75rem;border-radius:6px;border:2px solid #667eea;transition:all .2s ease}.column-item.hidden{opacity:.4;border-color:#ccc}.column-label{font-weight:600;color:#333;font-size:.9rem}.column-buttons{display:flex;gap:.25rem}.btn-icon{width:28px;height:28px;padding:0;border:1px solid #d0d0d0;background:#fff;border-radius:4px;cursor:pointer;font-size:.9rem;display:flex;align-items:center;justify-content:center;transition:all .2s ease;color:#666}.btn-icon:hover:not(:disabled){background:#667eea;color:#fff;border-color:#667eea}.btn-icon:disabled{opacity:.3;cursor:not-allowed}.btn-icon.btn-delete{color:#e74c3c}.btn-icon.btn-delete:hover:not(:disabled){background:#e74c3c;border-color:#e74c3c;color:#fff}.output-preview{background:#f8f8f8;border:1px solid #e0e0e0;border-radius:8px;padding:1.5rem;max-height:500px;overflow:auto}.output-table{width:100%;border-collapse:collapse;font-size:.85rem;background:#fff;box-shadow:0 1px 3px #0000001a}.output-table th,.output-table td{border:1px solid #d0d0d0;padding:.75rem;text-align:left}.output-table th{background:#667eea;color:#fff;font-weight:600;position:sticky;top:0;z-index:10}.output-table tbody tr:hover{background:#667eea0d}.output-table td{color:#333;white-space:nowrap}.output-note{margin-top:1rem;padding:.75rem;background:#667eea1a;border-left:3px solid #667eea;border-radius:4px;color:#555;font-size:.9rem}@media(max-width:640px){h1{font-size:2rem}.controls{padding:1.5rem}.drop-zone{padding:2rem 1rem}.output-header{flex-direction:column;align-items:flex-start}.output-actions{width:100%;flex-wrap:wrap}.btn{flex:1;min-width:fit-content}.column-controls{padding:1rem}.column-list{gap:.5rem}.column-item{font-size:.85rem}.output-preview{padding:.75rem}.output-table{font-size:.75rem}.output-table th,.output-table td{padding:.5rem}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh}code{font-family:Monaco,Courier New,monospace;background:#0000000d;padding:2px 6px;border-radius:3px;font-size:.9em}