.app{position:relative;background:#fff;height:100vh;overflow:hidden}.form-container{position:absolute;left:0;top:0;display:flex;gap:16px;height:100%;z-index:1000}.form-container .toggle-btn{display:flex;justify-content:center;align-items:center;flex-shrink:0;height:37.5px;width:37.5px;background:#fff;border-radius:50%;border:none;box-shadow:0 2px 6px #0000004d;font-size:20px;margin-top:24px;cursor:pointer;transition:transform .3s ease-in-out}.form-container .toggle-btn:active{transform:scale(.95)}.form-container .toggle-btn:hover{background:#f5f5f5}.form-container .form{display:flex;flex-direction:column;justify-content:space-between;gap:32px;width:400px;overflow:hidden;background:#fff;box-shadow:0 2px 8px #0003;padding:24px;transition:transform .3s ease-in-out}.form-container.close{pointer-events:none}.form-container.open{pointer-events:auto}.form-container.close .form{transform:translate(-100%);pointer-events:none}.form-container.close .toggle-btn{transform:translate(-400px);pointer-events:auto}.waypoints-group{display:flex;flex-direction:column;gap:10px;overflow:auto}.input-wrapper{display:flex;flex-direction:column;gap:4px;flex:1}input{width:100%;padding:10px;border:1px solid black;border-radius:8px;font-size:14px}input.upload{display:none}input.error-state{border-color:#f44336}.input-wrapper .input-error{color:#c62828;font-size:12px}.via-point-item{display:flex;gap:8px}.error{background:#ffebee;font-size:14px;color:#c62828;margin-top:16px;padding:16px;height:fit-content}.separator{display:flex;align-items:center;margin:16px 0;font-size:12px;font-weight:500}.separator:before,.separator:after{flex:1;border-bottom:1px solid black;content:""}.separator:before{margin-right:10px}.separator:after{margin-left:10px}.form-actions{display:flex;flex-direction:column}.btn-primary{padding:14px 20px;background:#2196f3;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer}.btn-primary:hover:not(:disabled){background:#1976d2}.btn-primary:disabled{background:#f0f0f0;color:#999;border-color:#999;cursor:not-allowed;opacity:.7}.btn-secondary{padding:10px 16px;background:#fff;color:#2196f3;border:1px solid #2196f3;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;margin-top:10px}.btn-secondary:hover:not(:disabled){background:#e3f2fd;border-color:#1976d2;color:#1976d2}.btn-secondary:disabled{background:#f0f0f0;color:#999;border-color:#999;cursor:not-allowed;opacity:.7}.btn-secondary.upload{display:inline-block;text-align:center;margin-top:0}.btn-destructive{padding:8px 12px;background:#f44336;color:#fff;border:none;border-radius:8px;transition:background-color .2s ease;cursor:pointer}.btn-destructive:hover:not(:disabled){background:#d32f2f}.btn-destructive:disabled{background:#f0f0f0;color:#999;border-color:#999;cursor:not-allowed;opacity:.7}.variations-container{position:absolute;top:10px;right:60px;background:#fff;padding:20px 24px;box-shadow:0 2px 6px #0000004d;width:300px;max-height:calc(100vh - 34px);overflow-y:auto;z-index:1000;border-radius:4px}.variations-container .title{font-size:18px;font-weight:700;margin-bottom:15px;padding-bottom:10px;border-bottom:2px solid #333}.categories{display:flex;flex-direction:column;gap:12px}.category-section{display:flex;flex-direction:column;gap:8px}.category-section .header{font-size:14px;font-weight:700;padding:10px;background:#f0f0f0;border-radius:3px;cursor:pointer;display:flex;align-items:center;gap:8px}.category-section .header:hover{background:#e0e0e0}.category-section .color{width:16px;height:16px;display:inline-block;border-radius:2px}.variation-list{display:flex;flex-direction:column;gap:8px}.variation-list .item{display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid #ddd;border-radius:4px;cursor:pointer;background:#fff;transition:all .2s}.variation-list .item.active{background:color-mix(in srgb,var(--category-color, #2196f3) 15%,white);border-color:var(--category-color, #999)}.variation-list .id{font-weight:700;font-size:12px}.variation-list .stats{font-size:11px;color:#666;line-height:1.4}.variation-list .stats strong{color:#333}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;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}
